@gotcos/glasses-server 7.0.7 → 7.0.27

package/server/web-control/app.js

@@ -266,7 +266,10 @@
       if (timer && o.responseType !== 'blob') clearTimeout(timer);
       sxNoteClock(res, sentAt);
       noteServer(true);
-      if (res.status === 401 && path.indexOf('/api/web-session/') !== 0) { showAuth(); var gone = new Error('Signed out. Connect this browser again.'); gone.status = 401; throw gone; }
+      // A request that renewed this browser's sign-in says so (lib/api-auth.ts): `<new expiry> <30-day cap>`.
+      var renewedTo = res.headers && typeof res.headers.get === 'function' ? res.headers.get('X-COS-Web-Session') : null;
+      if (renewedTo && typeof signinRemember === 'function') { var rt = String(renewedTo).split(' '); signinRemember({ expiresAt: rt[0], renewUntil: rt[1] }); }
+      if (res.status === 401 && path.indexOf('/api/web-session/') !== 0) { showAuth(typeof signinLapsedCopy === 'function' && signedInOnce() ? signinLapsedCopy() : undefined); var gone = new Error('Signed out. Connect this browser again.'); gone.status = 401; throw gone; }
       if (o.responseType === 'blob' && res.ok) return res.blob();
       return res.text().then(function (text) {
         var data = {};
@@ -357,6 +360,103 @@
     sessions: [], sessionsMode: 'words', workTasks: [], workOpenStages: { complete: false },
     stream: null, lastLoad: {}, livePoll: null
   };
+  // ── Mac reachability and sign-in lifetime (W1, 7.0.x): audit 02 F2, F3, F23 ──
+  // F3: with no offline shell (that needs a service worker, so HTTPS), an open page says plainly when the Mac stops answering,
+  // when it last heard from it, and offers Retry, instead of spinners. Retry asks GET /api/health (public, no state) and then
+  // reloads the pane on screen. While the Mac is down it asks again every 30 s, only while the page is visible.
+  // F2: a sign-in lasts 7 days and, since 7.0.x, renews while in use up to 30 days (lib/web-session-auth.ts). Status and the
+  // login answer carry this browser's own expiresAt; within a day of it the page says when it ends and how to sign in again.
+  // Sign-in (7.0.x, Miles 2026-11-09 "Renew while in use, 30-day cap"): `ends` is this cookie's expiry, `cap` the latest a
+  // renewal can reach (30 days from the first sign-in). A server without renewal sends no cap: then the cookie's end is the end.
+  var CONN = { timer: null, retrying: false, signin: null, hideFor: 0, lapsed: false };
+  var CONN_RETRY_MS = 30000, SIGNIN_WARN_MS = 24 * 3600000, SIGNIN_STORE = 'cos.web.signinEnds';
+  // Names the row, never the Settings page: that page was renamed in COS Control 0.5.387, and a phone may pair with either build.
+  var SIGNIN_HOW = 'On your Mac, open COS Control Settings and choose Open COS on your phone. Or get a code from another signed-in browser, or from the COS Glasses app.';
+  function connWhen(ms) {
+    if (!ms) return '';
+    var d = new Date(ms), same = new Date().toDateString() === d.toDateString();
+    return same ? clock(d) : d.toLocaleDateString(undefined, { weekday: 'short' }) + ' ' + clock(d);
+  }
+  function signinRemember(info) {
+    var ends = info && info.expiresAt ? Date.parse(info.expiresAt) : NaN, cap = info && info.renewUntil ? Date.parse(info.renewUntil) : NaN;
+    // Q1: a signed-in answer with no expiry (the token, or an older server) leaves nothing to warn about.
+    if (info && info.authenticated === true && !info.expiresAt) {
+      CONN.signin = null;
+      try { localStorage.removeItem(SIGNIN_STORE); } catch (e) { /* nothing kept */ }
+      return;
+    }
+    if (!isFinite(ends) || ends <= 0) return;
+    CONN.signin = { ends: ends, cap: isFinite(cap) && cap >= ends ? cap : 0 };
+    try { localStorage.setItem(SIGNIN_STORE, JSON.stringify(CONN.signin)); } catch (e) { /* the notice still works for this page */ }
+    if (typeof connPaint === 'function') connPaint();
+  }
+  function signinKnown() {
+    if (CONN.signin) return CONN.signin;
+    try {
+      var raw = localStorage.getItem(SIGNIN_STORE), v = raw ? JSON.parse(raw) : null;
+      if (typeof v === 'number' && v > 0) return { ends: v, cap: 0 };   // the earlier page kept the expiry alone
+      if (v && typeof v.ends === 'number' && v.ends > 0) return { ends: v.ends, cap: typeof v.cap === 'number' ? v.cap : 0 };
+    } catch (e) { /* nothing known */ }
+    return null;
+  }
+  // When this sign-in really ends while it is in use: the 30-day cap where the server renews, else the cookie's own end.
+  function signinEndsAt() { var k = signinKnown(); return k ? (k.cap || k.ends) : 0; }
+  // Why the sign-in gate opened after this page had been signed in: the 30 days, no use in the cookie's last 2 days (its
+  // only renewal window, so a browser used on day 4 still ends on day 7), or a sign-out. Q1 R-3.
+  function signinLapsedCopy() {
+    var k = signinKnown(), soon = Date.now() + 60000;
+    if (k && k.cap && k.cap <= soon) return 'Your sign-in on this browser reached its 30 days. ' + SIGNIN_HOW;
+    if (k && k.cap && k.ends <= soon) return 'Your sign-in on this browser ended because COS was not used here in its last 2 days. ' + SIGNIN_HOW;
+    if (k && !k.cap && k.ends <= soon) return 'Your sign-in on this browser ended. Sign-ins last 7 days. ' + SIGNIN_HOW;
+    return 'This browser is signed out. ' + SIGNIN_HOW;
+  }
+  // Q1 M1: a request that never got an answer cannot tell a sleeping Mac from this device being offline or off
+  // Tailscale, so the line names both. Only the browser's own "offline" is certain enough to say alone.
+  function connOffline() { return typeof navigator !== 'undefined' && navigator && navigator.onLine === false; }
+  function connTitle() { return connOffline() ? 'This device is offline.' : 'COS on your Mac is not answering.'; }
+  function connWhy() {
+    return connOffline() ? 'Connect to the internet and Tailscale, then try again.'
+      : 'Your Mac may be asleep, or this device may be offline or off Tailscale.';
+  }
+  function connHtml() {
+    var html = '';
+    if (SERVER.up === false) {
+      html += '<div class="conn-line" role="status"><strong>' + esc(connTitle()) + '</strong><span class="conn-sub">' +
+        esc((SERVER.lastUpAt ? 'Last updated ' + connWhen(SERVER.lastUpAt) + '. ' : '') + 'What is on screen may be out of date. ' + connWhy()) + '</span>' +
+        '<button type="button" class="btn small" data-action="conn-retry"' + (CONN.retrying ? ' disabled' : '') + '>' + (CONN.retrying ? 'Checking' : 'Retry') + '</button></div>';
+    }
+    var ends = signinEndsAt(), left = ends - Date.now();
+    if (ends && left > 0 && left <= SIGNIN_WARN_MS && CONN.hideFor !== ends) {
+      html += '<div class="conn-line" role="status"><strong>Sign-in here ends ' + esc(connWhen(ends)) + '.</strong><span class="conn-sub">' +
+        esc('Sign in again before then from COS Control Settings on your Mac: Open COS on your phone.') + '</span>' +
+        '<button type="button" class="btn small" data-action="conn-hide-signin">Hide</button></div>';
+    }
+    return html;
+  }
+  function connPaint() {
+    var box = $('conn-notice'); if (!box) return;
+    var html = connHtml();
+    if (box.innerHTML !== html) box.innerHTML = html;
+    box.hidden = !html;
+  }
+  function connSchedule() {
+    if (CONN.timer) { clearTimeout(CONN.timer); CONN.timer = null; }
+    if (SERVER.up !== false) return;
+    CONN.timer = setTimeout(function () { CONN.timer = null; if (!document.hidden) connRetry(false); else connSchedule(); }, CONN_RETRY_MS);
+  }
+  function connRetry(byHand) {
+    if (CONN.retrying) return Promise.resolve(false);
+    CONN.retrying = true; connPaint();
+    return api('/api/health', { timeoutMs: 10000 }).then(function () { return true; }, function () { return false; }).then(function (up) {
+      CONN.retrying = false;
+      if (up) { connPaint(); if (typeof route === 'function') route(); }
+      else { if (byHand) noteServer(false); connPaint(); connSchedule(); }
+      return up;
+    });
+  }
+  SERVER.hooks.push(function () { connPaint(); connSchedule(); });
+  // ── end Mac reachability and sign-in lifetime
+
   // Control's order (ActivitySection.visibleSections): Today, then Messages to Dictation. Usage is a
   // view inside Sessions on the Mac; its route stays so old links work, and the rail marks Sessions.
   var ROOT_PANES = ['today', 'messages', 'speakers', 'meetings', 'memories', 'threads', 'sessions', 'work', 'dictation', 'usage', 'settings'];
@@ -455,6 +555,7 @@
     if (r.pane !== 'meetings' && state.livePoll) { clearInterval(state.livePoll); state.livePoll = null; }
 
     var reading = r.args.length > 0 && !isTabRoute(r.args);
+    if (typeof sxFrameSync === 'function') sxFrameSync();
     var paneEl = $('pane-' + r.pane);
     if (paneEl) paneEl.classList.toggle('reading', reading);
     var split = paneEl && paneEl.querySelector('.split');
@@ -527,25 +628,57 @@
   function closeMenu() { $('section-menu').classList.add('hidden'); }
 
   // ── auth ────────────────────────────────────────────────
+  // 7.0.19: the first paint (index.html #first-paint) ends the moment the sign-in card or the app shows, whichever
+  // comes first, once. One layout report says how long it took, in the phone's own numbers: ms from navigation start to
+  // the browser's first contentful paint (-1 when none was recorded before this point) and to this moment.
+  var FIRST_PAINT = { done: false };
+  function firstPaintDone(via) {
+    if (FIRST_PAINT.done) return false;
+    FIRST_PAINT.done = true;
+    document.documentElement.classList.remove('fp-wait');
+    try {
+      var perf = window.performance, fcp = perf && perf.getEntriesByName ? perf.getEntriesByName('first-contentful-paint')[0] : null;
+      var shown = perf && perf.now ? Math.round(perf.now()) : -1;
+      // dcl: the browser's DOMContentLoaded; boot: when every script had run and boot started; rtt: the sign-in check's
+      // round trip (-1 for a sign-in link, which checks with a login instead).
+      var nav = perf && perf.getEntriesByType ? perf.getEntriesByType('navigation')[0] : null;
+      var dcl = nav && typeof nav.domContentLoadedEventStart === 'number' ? Math.round(nav.domContentLoadedEventStart) : -1;
+      if (typeof layoutCrumb === 'function') layoutCrumb('open-time', { fcp: fcp ? Math.round(fcp.startTime) : -1, shown: shown, via: via,
+        dcl: dcl, boot: FIRST_PAINT.boot == null ? -1 : FIRST_PAINT.boot, rtt: FIRST_PAINT.rtt == null ? -1 : FIRST_PAINT.rtt });
+    } catch (_e) { /* timing is a report only */ }
+    return true;
+  }
   function showAuth(message) {
+    if (typeof firstPaintDone === 'function') firstPaintDone('auth');   // harnesses that run this alone have none
     readerImagesStop($('session-turns')); readerImagesStop($('ta-last'));
     if (typeof liveHide === 'function') { liveHide(); liveStopWatch(); LIVE.mode = 'idle'; }
     var alreadyOpen = !$('auth-gate').classList.contains('hidden');
+    if (typeof CONN === 'object' && !$('app-shell').classList.contains('hidden')) CONN.lapsed = true;
+    if (typeof authOffline === 'function') authOffline(false);
     $('app-shell').classList.add('hidden');
     $('auth-gate').classList.remove('hidden');
+    // 7.0.23 regression (lapse_check, 08:2x): a frame class left on keeps html and body at one screen with overflow
+    // hidden, so the gate could not scroll and Connect sat below a keyboard-height screen. The gate is a normal page;
+    // showShell's route() puts the frame back (sxFrameSync) when the shell returns.
+    document.documentElement.classList.remove('sx-frame', 'mx-frame');
     // A later 401 from a pane still polling (W.api passes no message) must not blank what the gate already says:
     // the reason it opened, or "That code did not match" while the person retypes.
     if (!message && alreadyOpen) return;
     setStatus($('auth-error'), message || '', true);
     $('auth-error').classList.toggle('hidden', !message);
   }
+  function signedInOnce() { var shell = typeof $ === 'function' ? $('app-shell') : null; return !!(shell && !shell.classList.contains('hidden')) || CONN.lapsed; }
   function showShell(info) {
+    if (typeof firstPaintDone === 'function') firstPaintDone('shell');   // harnesses that run this alone have none
+    if (typeof signinRemember === 'function') signinRemember(info);
+    if (typeof authOffline === 'function') authOffline(false);
     $('auth-gate').classList.add('hidden');
     $('app-shell').classList.remove('hidden');
     state.serverName = (info && info.serverName) || 'Your Mac';
     $('host-name').textContent = state.serverName.replace(/-/g, ' ');
     loadTailnetUrl();
     runHooks(shellHooks, info);
+    if (typeof connPaint === 'function') connPaint();
     route();
     if (typeof liveStart === 'function') liveStart();   // 7.0.1: the one live stream for this page (a no-op if it is already open)
     // Reloaded with Today's overlay open: its history entry is still current. The overlay opens the same thing again
@@ -575,7 +708,9 @@
   function sessionList(maxAgeMs) {
     if (SL.data && Date.now() - SL.at < (maxAgeMs || 0)) return Promise.resolve(SL.data);
     if (SL.inflight) return SL.inflight;
-    SL.inflight = api('/api/agent-sessions?limit=80&sort=updated').then(function (d) {
+    // kept=1 (server 7.0.25, lead 10:29): only a client that asks gets the kept rows (COS pins, folders, COS-started
+    // sessions past the cap); the Mac app and the lens, which do not ask, get 7.0.18's list unchanged.
+    SL.inflight = api('/api/agent-sessions?limit=80&sort=updated&kept=1').then(function (d) {
       // 7.0.5: a sessions read (Sessions pane or Today) that follows a failed one is a reconnect: Today's next summary
       // ask says so (requestBrief), once.
       if (SL.failed) { SL.failed = false; if (typeof BRIEF === 'object' && BRIEF) BRIEF.reconnect = true; }
@@ -1282,7 +1417,8 @@
       sessionList(force === true ? 0 : 15000).catch(function () { return null; }),
       api('/api/work-board/your-move').catch(function () { return null; }),
       api('/api/welcome-context').catch(function () { return null; }),
-      api('/api/meetings/live-chunks').catch(function () { return null; })
+      api('/api/meetings/live-chunks').catch(function () { return null; }),
+      loadRunJobs()
     ]).then(function (res) {
       if (gen !== TODAY.gen) return;
       var sessions = (res[0] && res[0].sessions) || [];
@@ -1305,6 +1441,7 @@
       TODAY.recording = false;
 
       renderRunning(working, open);
+      runJobsSchedule();
       if (!offline) renderPet(sessions);
       paintNeeds();
       renderWeather(welcome);
@@ -1342,7 +1479,7 @@
     var box = $('today-rec');
     if (!rec) { box.innerHTML = ''; return; }
     box.innerHTML = '<button type="button" class="rec-banner" data-goto="meetings"><span class="rec-dot"></span>' +
-      '<span class="rec-copy"><strong>Recording now</strong><span>' + esc(rec.source + (rec.startTime ? ', ' + span(rec.startTime) + ' so far' : '')) + '</span></span>' +
+      '<span class="rec-copy"><strong>Recording now</strong><span>' + esc(rec.source + (rec.startTime ? ', ' + span(rec.startTime) + ' so far' : '') + (rec.source === SOURCES.mac ? '. Stop it in COS Control on your Mac.' : '')) + '</span></span>' +
       '<span class="btn small">Live view</span></button>';
   }
   // ── The Today summary (6.99.26 candidate) ───────────────
@@ -1350,8 +1487,10 @@
   // the server (lib/today-brief.ts). Today sends what it already read: session titles, states, how long, each session's
   // latest line and what needs you. The server decides whether a new one is written (off unless switched on, only when
   // the inputs changed, 10 minutes apart, the Summaries per day cap, a breaker). Today never waits for it: the counts line paints at once
-  // and the summary replaces it when one arrives. Never shown over a session list that was not read.
-  var BRIEF = { view: null, inflight: false, sentKey: '', sentAt: 0, reconnect: false };
+  // and the summary replaces it when one arrives. T1 spec (lead 23:04, same rule as Control 0.5.388): today's summary
+  // stays through a pending or failed session read (its age line already says what could not be read), the block keeps
+  // its tallest height so nothing under it moves while Miles reads, and unchanged text is never written again.
+  var BRIEF = { view: null, inflight: false, sentKey: '', sentAt: 0, reconnect: false, heldPx: 0, heldDay: '', heldWidth: -1, shownKind: '', shownText: '', shownEl: null };
   // 6.99.26 QA: the same rows are asked about again only after five minutes (a Today that sits open still learns what
   // the server reads itself: sub-agents and Work cards); changed rows are asked about at once, one ask at a time.
   var BRIEF_RESEND_MS = 5 * 60000, BRIEF_OFF_RECHECK_MS = 5 * 60000, BRIEF_TICK_MS = 60000, BRIEF_LIVE_GAP_MS = 60000;
@@ -1412,14 +1551,43 @@
       if (TODAY.model && state.pane === 'today') renderStory(TODAY.model);
     });
   }
-  /** The summary to show, or null: only with text, only over a session list that was read. */
+  /** The summary to show, or null: only with text, fresh or stale, and written today. T1 spec 0: a session read that is
+   *  pending or failed no longer swaps it for the counts line (an offline Today still hides it, in renderStory). */
   function briefShown() {
     var v = BRIEF.view;
-    if (!v || !v.text || (v.state !== 'fresh' && v.state !== 'stale') || TODAY.sessionsState !== 'answered') return null;
+    if (!v || !v.text || (v.state !== 'fresh' && v.state !== 'stale')) return null;
+    var at = toDate(v.at);
+    if (!at || at.toDateString() !== new Date().toDateString()) return null;
     return v;
   }
-  // Forget the summary (Settings turned it on or off): the next Today paint asks at once.
-  function resetBrief() { BRIEF.view = null; BRIEF.sentKey = ''; BRIEF.sentAt = 0; }
+  // Forget the summary (Settings turned it on or off): the next Today paint asks at once, and the block may shrink.
+  function resetBrief() { BRIEF.view = null; BRIEF.sentKey = ''; BRIEF.sentAt = 0; BRIEF.heldPx = 0; }
+  // T1 spec 1 and 2: #today-story keeps the tallest height it has had, so a shorter rewrite, or the fall back to the
+  // counts line, never pulls the page up under Miles. It may shrink on a new local day, when its width changes (resize,
+  // Duo fold or unfold, rotation reflow the text anyway), after Refresh lands and after resetBrief; never on a rewrite.
+  function storyHold(el) {
+    if (!el || !el.style || typeof el.getBoundingClientRect !== 'function') return;
+    var day = new Date().toDateString(), w = el.clientWidth || 0;
+    if (BRIEF.heldDay !== day || Math.abs(w - BRIEF.heldWidth) >= 1) { BRIEF.heldPx = 0; BRIEF.heldDay = day; BRIEF.heldWidth = w; }
+    el.style.minHeight = '';
+    var h = Math.ceil(el.getBoundingClientRect().height || 0);
+    if (h > BRIEF.heldPx) BRIEF.heldPx = h;
+    el.style.minHeight = BRIEF.heldPx ? BRIEF.heldPx + 'px' : '';
+  }
+  // T1 spec 3: Today repaints on every session move; the same words are not written again (no reflow, no aria-live
+  // re-announcement). Only the age line under a summary moves on.
+  function storyWrite(el, kind, text, when) {
+    if (BRIEF.shownEl !== el || BRIEF.shownKind !== kind || BRIEF.shownText !== text) {
+      if (kind === 'brief') el.innerHTML = esc(text) + '<span class="story-when">' + esc(when) + '</span>';
+      else el.textContent = text;
+      BRIEF.shownEl = el; BRIEF.shownKind = kind; BRIEF.shownText = text;
+    } else if (kind === 'brief') {
+      var w = typeof document !== 'undefined' && document.querySelector ? document.querySelector('#today-story .story-when') : null;
+      if (w) { if (w.textContent !== when) w.textContent = when; }
+      else el.innerHTML = esc(text) + '<span class="story-when">' + esc(when) + '</span>';
+    }
+    storyHold(el);
+  }
   // Every minute while Today is on screen: "Updated N min ago" moves on, and an unchanged Today asks again once its
   // five minutes are up (requestBrief's own throttle). Hidden or another pane: nothing.
   setInterval(function () {
@@ -1441,13 +1609,22 @@
   function renderStory(m) {
     var el = $('today-story');
     el.className = 'story';
-    if (TODAY.offline) { el.textContent = 'COS on ' + state.serverName + ' is not answering right now. Today fills in when it does.'; return; }
+    // Today round 2: "Ask about this" shows under a model summary only (paintTodayAsk, below the Today block). The test
+    // harnesses that run this block alone do not have it, so it is looked up, never assumed.
+    var askBox = typeof paintTodayAsk === 'function' ? paintTodayAsk : function () {};
+    // The harnesses that run this block alone have no storyWrite either: a plain write there.
+    var write = typeof storyWrite === 'function' ? storyWrite : function (e, kind, text, when) {
+      if (kind === 'brief') e.innerHTML = esc(text) + '<span class="story-when">' + esc(when) + '</span>'; else e.textContent = text;
+    };
+    if (TODAY.offline) { askBox(null); write(el, 'offline', 'COS on ' + state.serverName + ' is not answering right now. Today fills in when it does.'); return; }
     // The model's summary when there is one (it never blocks: the counts line below shows until it lands). The test
     // harnesses that run this block alone have no requestBrief, so it is looked up, never assumed.
+    askBox(null);
     if (typeof requestBrief === 'function') {
       requestBrief(m);
       var brief = briefShown();
-      if (brief) { el.innerHTML = esc(brief.text) + '<span class="story-when">' + esc(briefWhen(brief, m)) + '</span>'; return; }
+      askBox(brief);
+      if (brief) { write(el, 'brief', brief.text, briefWhen(brief, m)); return; }
     }
     var first = '';
     if (m.sessionsWaiting > 0) first = countWord(m.sessionsWaiting) + ' ' + plural(m.sessionsWaiting, 'session is', 'sessions are') + ' waiting on you';
@@ -1471,7 +1648,7 @@
     var others = m.failed.filter(function (n) { return n !== 'sessions'; });
     if (!m.settled && !m.now.length && !m.later.length) out += (unread ? others : m.failed).length ? ' Couldn\u2019t read ' + listWords(unread ? others : m.failed) + ', so this may not be everything.' : unread ? ' This may not be everything that needs you.' : ' Still reading what needs you.';
     else if (unread) out += ' This may not be everything that needs you.';
-    el.textContent = out;
+    write(el, 'counts', out);
   }
   function listWords(names) { return names.length < 2 ? names.join('') : names.slice(0, -1).join(', ') + ' and ' + names[names.length - 1]; }
   function runRow(s, activeNow) {
@@ -1493,14 +1670,16 @@
       '<span class="run-meta">' + metaHtml + '</span></button>';
   }
   function renderRunning(working, open) {
-    $('run-count').textContent = working.length ? String(working.length) : '';
+    // W1: COS's own jobs (questions it is answering, routines, Work runs) count as running too, as on the Mac.
+    var jobs = typeof runJobsHtml === 'function' ? runJobsHtml() : { html: '', n: 0 };
+    $('run-count').textContent = working.length + jobs.n ? String(working.length + jobs.n) : '';
     var list = $('run-list');
     // Never "Nothing running" about a list that was not read.
-    if (TODAY.sessionsState === 'failed') { list.innerHTML = '<button type="button" class="run-more run-failed" data-today-needs="retry">Couldn\u2019t read sessions. Try again</button>'; return; }
+    if (TODAY.sessionsState === 'failed') { list.innerHTML = jobs.html + '<button type="button" class="run-more run-failed" data-today-needs="retry">Couldn\u2019t read sessions. Try again</button>'; return; }
     var shown = working.slice(0, 3);
-    var html = shown.map(function (s) { return runRow(s, true); }).join('');
+    var html = jobs.html + shown.map(function (s) { return runRow(s, true); }).join('');
     if (!shown.length) {
-      html = open.slice(0, 2).map(function (s) { return runRow(s, false); }).join('');
+      html = jobs.html + open.slice(0, 2).map(function (s) { return runRow(s, false); }).join('');
       if (!html) html = '<div class="run-empty">Nothing running. Start a session on your Mac and it shows here.</div>';
     }
     var more = (working.length - shown.length) + (shown.length ? open.length : Math.max(0, open.length - 2));
@@ -1508,6 +1687,57 @@
     list.innerHTML = html;
     if (typeof liveTickStart === 'function' && list.querySelector && list.querySelector('[data-live-since]')) liveTickStart();
   }
+  // ── Running beyond sessions (W1, 7.0.x): audit 02 F10, Q1 M6. The same job rows COS Control 0.5.386 draws
+  // (Models.swift TodayHome running rows, b02d1ad 14185-14207), from the same server list, GET /api/query-jobs/active
+  // (titles only, never a prompt or an answer):
+  //   person   "A question to COS" row, "COS is answering, N min", Open in Messages
+  //   routine  "Routine" row, "running since 7:30 PM", Open in Messages
+  //   task     "A captured task" row, "a captured task, on the server, N min", In Sessions
+  //   other    never a row: it is a Control Work session or a meeting review, already shown as the row it is
+  // No Stop on any of them, as on the Mac: Control's only Stop is on a Work run it started itself, which lives in the Mac's
+  // own handoff store and is not visible to this page.
+  var RUN_JOB_ROW = {
+    person: { word: 'Question', title: 'A question to COS', open: 'messages', label: 'Open in Messages' },
+    routine: { word: 'Routine', title: 'Routine', open: 'messages', label: 'Open in Messages' },
+    task: { word: 'Work', title: 'A captured task', open: 'sessions', label: 'In Sessions' },
+  };
+  var RUN_JOBS = { items: null, timer: null };
+  var RUN_JOBS_POLL_MS = 15000;
+  function runJobValid(j) { return j && typeof j.jobId === 'string' && /^[A-Za-z0-9_-]{1,80}$/.test(j.jobId) && RUN_JOB_ROW[j.origin]; }
+  function loadRunJobs() {
+    return api('/api/query-jobs/active').then(function (d) {
+      // An older server answers 400 or no protocol: no jobs row, never an error line (Control keys off the field, not the status).
+      RUN_JOBS.items = d && d.protocolVersion === 1 && d.enabled !== false && Array.isArray(d.items) ? d.items.filter(runJobValid).slice(0, 8) : [];
+    }, function () { RUN_JOBS.items = null; });
+  }
+  function runJobsSchedule() {
+    if (RUN_JOBS.timer) { clearTimeout(RUN_JOBS.timer); RUN_JOBS.timer = null; }
+    if (!RUN_JOBS.items || !RUN_JOBS.items.length) return;
+    RUN_JOBS.timer = setTimeout(function () {
+      RUN_JOBS.timer = null;
+      // Only while Today is in front: a hidden page reads nothing (it reads again when Today comes back).
+      if (state.pane !== 'today' || document.hidden) return;
+      loadRunJobs().then(function () { renderRunning(TODAY.working || [], TODAY.open || []); runJobsSchedule(); });
+    }, RUN_JOBS_POLL_MS);
+  }
+  function runJobMinutes(j) { return Math.max(0, Math.round((Number(j.elapsedMs) || 0) / 60000)); }
+  function runJobRow(j) {
+    var kind = RUN_JOB_ROW[j.origin], mins = runJobMinutes(j);
+    var started = new Date(Date.now() - (Number(j.elapsedMs) || 0));
+    var meta = j.origin === 'routine' ? 'running since ' + clock(started)
+      : j.origin === 'person' ? 'COS is answering, ' + mins + ' min'
+      : 'a captured task, on the server, ' + mins + ' min';
+    return '<div class="run-row run-job"><span class="run-who"><span class="badge work">' + esc(kind.word) + '</span></span>' +
+      '<span class="run-title">' + esc(plain(j.title || '').trim() || kind.title) + '</span>' +
+      '<span class="run-meta">' + esc(meta) + '</span>' +
+      '<span class="row-actions"><button type="button" class="link-btn" data-goto="' + kind.open + '">' + esc(kind.label) + '</button></span></div>';
+  }
+  function runJobsHtml() {
+    var items = RUN_JOBS.items || [];
+    return { html: items.map(runJobRow).join(''), n: items.length };
+  }
+  // ── end running beyond sessions
+
   // ── live state on screen (7.0.1): Today's counts and rows, the pet, the Sessions rows, the header line ──
   // The live model (above) calls this, batched, after a frame or a list read moved something.
   function liveRepaint(rows, structural) {
@@ -1531,14 +1761,17 @@
     if (!list) return;
     if (sxQueryActive()) { paintSessionsHero(); return; }
     if (structural) { renderSessionGroups(); return; }
-    var amb = sxAmbiguous(sxVisible());
+    var amb = sxAmbiguous(sxVisible()), moved = false;
     (rows || []).forEach(function (s) {
       if (!s || sxKeepWarm(s)) return;
+      // Checked before the row is looked for: a row in a folded group is not drawn, and its move still counts.
+      var live = sxLiveRow(s, amb);
+      if (live.moved) moved = true;
       var k = splitSessionId(s.provider, s.session_id || s.id), want = k.provider + '|' + k.id;
       var els = list.querySelectorAll('[data-session]');
       for (var i = 0; i < els.length; i++) {
         if (els[i].getAttribute('data-session') !== want) continue;
-        var html = sxRow(s, null, amb);
+        var html = live.html;
         if (els[i].__liveHtml !== html) {
           var tmp = document.createElement('div'); tmp.innerHTML = html;
           var next = tmp.firstElementChild || tmp.firstChild;
@@ -1547,6 +1780,7 @@
         break;
       }
     });
+    if (moved) sxRegroupLater();
     paintSessionsHero();
   }
   // ── Today's header line and Refresh ──
@@ -1599,6 +1833,8 @@
         BRIEF.inflight = false;
         if (v && typeof v === 'object') { BRIEF.view = v; BRIEF.sentAt = Date.now(); }
         if (v && v.reason === 'refresh_throttled') TR.retryAt = Date.now() + Math.max(1000, Number(v.retryAfterMs) || 30000);
+        // T1 spec 2: Refresh re-fits the block to what it now holds.
+        BRIEF.heldPx = 0;
         if (TODAY.model && state.pane === 'today') renderStory(TODAY.model);
         return done(refreshWords(v));
       }, function (err) {
@@ -1670,8 +1906,29 @@
   // Control's askedTitle and askedWhy for a session waiting on you.
   // Control's TodayHome: guarded(title) ?? "A session". Never the workspace path or the session id: this line is shown
   // on Today and goes into the Today summary sent to the model, which carries no ids.
+  // ── A turn that ended asking you (7.0.18, X1 contract v1; Miles 2026-11-10 07:14) ──
+  // A Claude session ended its turn with the app's next-step box: a question and reply buttons. The server marks the row
+  // (waiting_source 'turn_end', waiting_choices: 0 to 2 labels) only while COS_TURN_END_ASKS is on. Unlike a question at
+  // the Mac's prompt, a reply IS the answer here, so Today and the reader offer the choices and the reply box. What is
+  // sent is the contract's exact text: it never reads as typed at the desk, and the session may ask him to confirm.
+  var TURN_END_PREFIX = 'Answer sent from COS Control Web through COS, not typed in this session: ';
+  var TURN_END_LINE = 'A choice or a reply here reaches the session as a message from COS, not typed in the session, and the session may ask you to confirm.';
+  /** The turn-end ask on a session row, or null: any other row, an older server, or the switch off. */
+  function turnEndOf(s) {
+    if (!s || s.waiting_source !== 'turn_end' || s.agent_state !== 'waiting') return null;
+    var clean = function (v, n) { return String(v == null ? '' : v).replace(/[\u0000-\u001f\u007f-\u009f\u200b-\u200f\u202a-\u202e\u2066-\u2069]/g, ' ').replace(/\s+/g, ' ').trim().slice(0, n); };
+    var choices = Array.isArray(s.waiting_choices) ? s.waiting_choices.filter(function (c) { return typeof c === 'string' && clean(c, 40); }).map(function (c) { return clean(c, 40); }).slice(0, 2) : [];
+    return { ask: clean(s.waiting_detail, 160), choices: choices };
+  }
+  /** The exact words a choice or a reply sends (contract v1): attributed to COS Control Web, never to the desk. */
+  function turnEndPrompt(text) { return TURN_END_PREFIX + turnEndBare(text); }
+  /** The words as he wrote them: a message that came back to the box already carries the prefix, never twice. */
+  function turnEndBare(text) { var t = String(text || '').trim(); return t.indexOf(TURN_END_PREFIX) === 0 ? t.slice(TURN_END_PREFIX.length).trim() : t; }
   function askedTitle(s) {
     var t = plain(s.display_label || s.custom_title || '').replace(/\s+/g, ' ').trim() || 'A session';
+    // The harnesses that run this block alone have no turnEndOf: looked up, never assumed.
+    var te = typeof turnEndOf === 'function' ? turnEndOf(s) : null;
+    if (te) return te.ask ? t + ' asked: ' + te.ask : t + ' asked you something';
     if (sxProvider(s.provider) !== 'claude') return t + ' is waiting for your reply';
     if (s.waiting_kind === 'plan') return t + ' has a plan for you to approve';
     if (s.waiting_kind === 'permission') return t + ' wants your permission';
@@ -1682,6 +1939,8 @@
   var TOOL_NAMES = ['AskUserQuestion', 'ExitPlanMode', 'Bash', 'BashOutput', 'KillShell', 'Edit', 'Write', 'Read', 'Grep', 'Glob', 'LS', 'Task', 'Agent',
     'WebFetch', 'WebSearch', 'TodoWrite', 'NotebookEdit', 'MultiEdit', 'SlashCommand', 'Skill', 'ToolSearch'];
   function askedWhy(s) {
+    var te = typeof turnEndOf === 'function' ? turnEndOf(s) : null;
+    if (te) return te.choices.length ? 'Tap a choice or reply here' : 'Reply here';
     if (s.waiting_kind === 'plan') return 'Has a plan for you to approve';
     var d = String(s.waiting_detail || '').trim();
     if (TOOL_NAMES.indexOf(d) >= 0) d = '';
@@ -1692,7 +1951,8 @@
       return d.indexOf('[home]') >= 0 ? 'Wants to run (home folder hidden) ' + shown : 'Wants to run ' + shown;
     }
     if (s.waiting_kind === 'question' && d) return d.length > 160 ? d.slice(0, 159) + '…' : d;
-    return 'Waiting for you' + (sxProvider(s.provider) === 'claude' ? '. Paused until you answer.' : '');
+    // W1 A5: a Claude session waits on its own prompt; the card under it says where, once.
+    return sxProvider(s.provider) === 'claude' ? 'Waiting for your answer' : 'Waiting for you';
   }
   // 6.99.26: where a waiting session's question can be answered. 'here': this page holds it (panes/questions.js), as
   // cards in its waiting sheet. 'mac': a Claude session's own prompt (or a held one that went back to the Mac), which
@@ -1707,16 +1967,111 @@
     return q && q.question ? clipWords(q.question, 160) : '';
   }
   function clipWords(text, n) { var t = String(text || '').replace(/\s+/g, ' ').trim(); return t.length > n ? t.slice(0, n - 1) + '…' : t; }
-  function whereFor(provider, id) {
+  function whereFor(provider, id, row) {
     var q = sessionQs();
     var held = q ? q.itemsFor(id) : [], mac = q && q.atMacFor ? q.atMacFor(id) : [];
     if (held.length) return { where: 'here', ask: askedHere(held) };
+    // 7.0.18: a turn that ended asking him is answered by a reply, here or anywhere: never "at the Mac".
+    var te = row && typeof turnEndOf === 'function' ? turnEndOf(row) : null;
+    if (te) return { where: 'turnend', ask: te.ask, choices: te.choices };
     if (q && q.answeredFor && q.answeredFor(id)) return { where: 'answered', ask: '' };
-    var words = mac.length && q.wordsOf ? q.wordsOf(mac[0].id) : null;
+    // X1 contract: a card built from the server's `waiting` list carries its own words; a held one gone back to the Mac
+    // has the words this page saw while it was held.
+    var first = mac[0];
+    var words = first && first.fromWaiting ? { questions: (first.questions || []).map(function (x) { return x.question; }), summary: '' }
+      : first && q.wordsOf ? q.wordsOf(first.id) : null;
     var ask = words ? clipWords(words.questions[0] || (words.summary ? 'Wants to run ' + words.summary : ''), 160) : '';
-    if (mac.length || sxProvider(provider) === 'claude') return { where: 'mac', ask: ask };
+    if (mac.length) return { where: 'mac', ask: ask };
+    // DESIGN.md step 4 #5: the Mac line only for a Claude row that waits on a question or an approval, never for any
+    // waiting Claude session. A row the page has not read says nothing about it, so it keeps the Mac line as before.
+    var kind = row ? String(row.waiting_kind || '') : '';
+    if (sxProvider(provider) === 'claude' && (!row || kind === 'question' || kind === 'permission')) return { where: 'mac', ask: ask };
     return { where: '', ask: '' };
   }
+  // ── At the Mac's prompt, in the session reader (W1 A5) ──
+  // Miles 11/09: "when I actually navigate to the session, there is no ability to answer the question." The reader cannot
+  // answer a question that waits on the Mac's own prompt either, so it says so at the top, with the words when this page
+  // has them (a held question it saw, or the server's waiting line) and plainly when it does not. Nothing here sends.
+  var MAC_Q = { line: "Answer this at your Mac's prompt. A message sent from here does not answer it; it waits until the question is answered at the Mac.", none: "COS cannot read this question's words from here. They show at the Mac's prompt." };
+  /** 7.0.18: the reader's card for a turn that ended asking him: the question, a button per choice, the honest line. */
+  function readerTurnEndHtml(r, row) {
+    var te = turnEndOf(row);
+    if (!te) return '';
+    var title = plain((row && (row.display_label || row.custom_title)) || '').replace(/\s+/g, ' ').trim() || 'This session';
+    var busy = !!(r && r.teSending);
+    return '<p class="sx-mac-q-title"><strong>' + esc(te.ask ? title + ' asked:' : title + ' asked you something') + '</strong></p>' +
+      (te.ask ? '<blockquote class="ta-quote sx-te-ask">' + esc(te.ask) + '</blockquote>' : '') +
+      (te.choices.length ? '<div class="sx-te-choices">' + te.choices.map(function (c, i) {
+        return '<button type="button" class="cx-btn' + (i === 0 ? ' primary' : '') + '" data-sx="turnend" data-i="' + i + '"' + (busy ? ' disabled' : '') + '>' + esc(c) + '</button>';
+      }).join('') + '</div>' : '') +
+      '<p class="sx-note sx-te-line">' + esc(TURN_END_LINE) + '</p>';
+  }
+  function readerMacHtml(provider, id, row) {
+    var w = whereFor(provider, id, row);
+    if (w.where !== 'mac') return '';
+    // X1 contract: when the server listed this question (`waiting`), the shared card list mounted above draws it, with
+    // its options. This block is only for a question it did not list (an older server, or asked before a restart).
+    var qs0 = sessionQs();
+    if (qs0 && qs0.atMacFor && qs0.atMacFor(id).length) return '';
+    var q = sessionQs();
+    var why = row ? askedWhy(row) : '';
+    var words = w.ask || (why && !/^Waiting for (you|your answer)/.test(why) ? why : '');
+    return '<p class="sx-mac-q-title"><strong>Waiting for your answer at the Mac</strong></p>' +
+      (words ? '<blockquote class="ta-quote sx-mac-q-words">' + esc(words) + '</blockquote>' : '<p class="sx-note sx-mac-q-none">' + esc((q && q.macNoWords) || MAC_Q.none) + '</p>') +
+      '<p class="sx-note sx-mac-q-line">' + esc((q && q.macLine) || MAC_Q.line) + '</p>';
+  }
+  function readerRowOf(r) {
+    return (state.sessions || []).filter(function (s) { var k = splitSessionId(s.provider, s.session_id || s.id); return k.provider === r.provider && String(k.id).toLowerCase() === String(r.id).toLowerCase(); })[0] || null;
+  }
+  // 7.0.18: a tap on a choice sends the contract's exact text through the reader's own Continue (continueSession), so the
+  // queue, the held reply and the turn watch behave as for any message. The outcome is said in the status line.
+  var TURN_END_SENT = function (label) { return 'Sent \u201c' + label + '\u201d. It reaches the session as a message from COS; it may ask you to confirm.'; };
+  var TURN_END_GONE = 'Already answered on another screen, or the session moved on. Nothing was sent.';
+  function sendTurnEndChoice(r, i) {
+    if (!r || r.sending) return;
+    var te = turnEndOf(readerRowOf(r));
+    if (!te) { sessionStatus(TURN_END_GONE); readerMacPaint(r, r.waitingNow); return; }
+    var label = te.choices[i];
+    if (!label) return;
+    r.sending = true; r.teSending = true; readerMacPaint(r, r.waitingNow);
+    var done = function () { r.sending = false; r.teSending = false; if (state.reading === r) readerMacPaint(r, r.waitingNow); };
+    return continueSession(r, turnEndPrompt(label), {}).then(function (how) {
+      done();
+      if (state.reading !== r) return how;
+      if (how === 'sent') sessionStatus(TURN_END_SENT(label));
+      else if (how === 'changed') {
+        // The box under it would offer Continue anyway for the composer's words, not this choice: a choice says it plainly.
+        r.refusal = null; r.sendAnyway = null; renderVerdict(r);
+        sessionStatus('The session moved on before this reached it. \u201c' + label + '\u201d was not sent.', 'error');
+      } else if (how === 'refused') sessionStatus('The session did not take \u201c' + label + '\u201d. Try again, or answer it on your Mac.', 'error');
+      return how;
+    }, function (err) {
+      done();
+      if (state.reading !== r) return;
+      var why = err && err.name === 'AbortError' ? 'No answer from your Mac yet. It may still land; tapping again is safe, it will not post twice.' : (err && err.message) || 'Could not reach your Mac.';
+      sessionStatus('Not sent: ' + why, 'error');
+    });
+  }
+  function readerMacPaint(r, waiting) {
+    var el = $('session-mac-q');
+    if (!el || !r) return;
+    r.waitingNow = !!waiting;
+    var row = readerRowOf(r);
+    // 7.0.18: a turn that ended asking him gets its card whether or not the reader thinks it waits (the row is the truth).
+    var te = typeof turnEndOf === 'function' ? turnEndOf(row) : null;
+    r.turnEnd = te;
+    var html = te ? readerTurnEndHtml(r, row) : waiting ? readerMacHtml(r.provider, r.id, row) : '';
+    if (el.innerHTML !== html) el.innerHTML = html;
+    el.hidden = !html;
+    // Q1 M3: the Send box under it says plainly that a message is not the answer, whichever block shows the question
+    // (this one, a Mac card or a held card above).
+    var qs1 = sessionQs(), open = (!!html && !te) || !!(qs1 && ((qs1.itemsFor && qs1.itemsFor(r.id).length) || (qs1.atMacFor && qs1.atMacFor(r.id).length)));
+    var box = $('session-input');
+    // 7.0.18: here a reply IS the answer (sent with the contract's attribution), so the box says so.
+    if (box && box.setAttribute) box.setAttribute('placeholder', te ? 'Or write your own answer' : open ? 'Message this session (not an answer)' : 'Continue this session…');
+  }
+  // ── end at the Mac's prompt
+
   function needsModel() {
     var states = { sessions: TODAY.sessionsState, work: TODAY.workState, voices: TODAY.voices.state, memories: TODAY.memories.state };
     var rows = [], seen = {};
@@ -1724,8 +2079,8 @@
       if (sxKeepWarm(s) || sxState(s) !== 'waiting') return;
       var k = splitSessionId(s.provider, s.session_id || s.id);
       seen[k.provider + '|' + String(k.id).toLowerCase()] = 1;
-      var w = whereFor(k.provider, k.id);
-      rows.push({ kind: 'session', tier: 1, title: askedTitle(s), why: askedWhy(s), since: s.state_since || s.last_activity_at, key: k.provider + '|' + k.id, where: w.where, ask: w.ask });
+      var w = whereFor(k.provider, k.id, s);
+      rows.push({ kind: 'session', tier: 1, title: askedTitle(s), why: askedWhy(s), since: s.state_since || s.last_activity_at, key: k.provider + '|' + k.id, where: w.where, ask: w.ask, choices: w.choices || [] });
     });
     // A question this page holds for a session the list has not shown waiting yet: its own row, so every held
     // question is in front of you (two at once each get one).
@@ -1801,7 +2156,8 @@
       // The session's question shows in the overlay's peek, with its cards to answer. Under it, where it can be answered.
       var q = sessionQs(), whereLine = r.where === 'here' ? 'Answer it here.' : r.where === 'mac' ? (q && q.macLine) || '' : r.where === 'answered' ? (q && q.answeredLine) || '' : '';
       return '<div class="need-row">' +
-        '<button type="button" class="need-open" data-today="wait" data-key="' + esc(r.key) + '">' + top(r.title) + '<span class="need-foot">' + esc(r.ask || r.why) + '</span>' +
+        // 7.0.18: a turn-end row's title already says the question, so its foot says how to answer.
+        '<button type="button" class="need-open" data-today="wait" data-key="' + esc(r.key) + '">' + top(r.title) + '<span class="need-foot">' + esc(r.where === 'turnend' ? r.why : (r.ask || r.why)) + '</span>' +
         (whereLine ? '<span class="need-foot need-where" data-where="' + esc(r.where) + '">' + esc(whereLine) + '</span>' : '') + '</button>' +
         '<div class="need-actions"><button type="button" class="btn small' + (i === 0 ? ' primary' : '') + '" data-session="' + esc(r.key) + '">Open session</button></div></div>';
     }
@@ -1847,30 +2203,183 @@
     // Control's Next up (todayPrepButtons): Prep me opens the Prep composer in the COS chat (panes/cos-chat.js prepFor),
     // Open meeting opens Meetings. Without a server to answer, Prep me is not offered.
     var prep = !TODAY.offline && window.COSWeb && window.COSWeb.cosChat && window.COSWeb.cosChat.prepFor;
+    // Prep on every row (Miles 11/09): "Add context" opens the same inline panel the later rows' Prep opens, for this
+    // meeting. Not on a hold (the server's nextEvent.hold), and not while neither Prep nor Ask is on the Mac.
+    var key = nextPrepKey(n.title, d), ctx = !n.hold && nextPrepMode();
+    if (ctx) NEXT_PREP.rows[key] = { title: n.title, start: d.toISOString() };
     $('next-actions').innerHTML = (prep ? '<button type="button" class="btn small primary" data-today-next="prep">Prep me</button>' : '') +
+      (ctx ? '<button type="button" class="link-btn next-prep-open" data-next-prep="' + esc(key) + '" aria-expanded="' + (NEXT_PREP.open === key) + '">Add context</button>' : '') +
       '<button type="button" class="link-btn" data-goto="meetings">Open meeting</button>';
+    NEXT_PREP.firstKey = ctx ? key : '';
+    paintNextPrepSlot($('next-first-prep'), ctx && NEXT_PREP.open === key ? key : '');
     card.classList.remove('hidden');
   }
-  // PH plan P1: the rest of today from GET /api/calendar/today (selected calendars, next 3), under Next up.
+  // PH plan P1: the rest of today from GET /api/calendar/today (selected calendars), under Next up.
   // An aging snapshot says when it was read. Not connected or nothing more: the block stays hidden.
+  // Today round 2 (Miles 11/09): Next up is 5 rows in all, the event above plus up to 4 more, then "+N more today"
+  // (opens Meetings) when the calendar has more meetings left today than are shown. Desktop Control 0.5.384 matches.
   function loadCalendarLater(n, d) {
+    var LATER_ROWS = 4;
     var box = $('next-later'); if (!box) return;
-    if (!n || !n.title || !d) { box.classList.add('hidden'); box.innerHTML = ''; return; }
+    if (!n || !n.title || !d) { NEXT_PREP.later = null; clearLater(box); return; }
     var gen = TODAY.gen;
     api('/api/calendar/today').then(function (c) {
       if (gen !== TODAY.gen) return;
-      if (!c || !c.connected) { box.classList.add('hidden'); box.innerHTML = ''; return; }
+      if (!c || !c.connected) { NEXT_PREP.later = null; clearLater(box); return; }
       var same = function (r) { var rd = toDate(r.start); return r.title === n.title && rd && d && Math.abs(rd.getTime() - d.getTime()) < 60000; };
-      var rows = (c.next || []).filter(function (r) { return !r.allDay && !same(r); }).slice(0, 2);
-      var asOf = c.stale && c.asOf ? toDate(c.asOf) : null;
-      var html = rows.map(function (r) {
-        var rd = toDate(r.start);
-        return '<div class="later-row"><span class="later-when">' + esc(rd ? clock(rd) : '') + '</span><span class="later-what">' + esc(r.title) + '</span></div>';
-      }).join('');
-      if (asOf) html += '<div class="later-asof">' + esc('Calendar as of ' + clock(asOf)) + '</div>';
-      box.innerHTML = html;
-      box.classList.toggle('hidden', !html);
-    }, function () { box.classList.add('hidden'); box.innerHTML = ''; });
+      var list = c.next || [];
+      var rows = list.filter(function (r) { return !r.allDay && !same(r); }).slice(0, LATER_ROWS);
+      // What is left today past the rows on screen (the event above counts when it is one of today's).
+      var shown = rows.length + (list.some(same) ? 1 : 0), more = (Number(c.remainingCount) || 0) - shown;
+      NEXT_PREP.later = { rows: rows, more: more, asOf: c.stale && c.asOf ? toDate(c.asOf) : null };
+      paintCalendarLater();
+    }, function () { NEXT_PREP.later = null; clearLater(box); });
+  }
+  // Emptied, and its last write forgotten, so the next read that has rows writes them again (writeKeepingPrep skips a
+  // write that matches the last one).
+  function clearLater(box) { box.classList.add('hidden'); box.innerHTML = ''; box.cosPrepHtml = ''; }
+  // The later rows from the last calendar read. Each meeting that is not a hold (the server's `hold`) gets a quiet
+  // Prep, and the open row's panel sits under it. Written only when the markup changed, so a poll never takes the words
+  // or the caret from the panel; when it is written, the words, the focus and the caret are put back.
+  function paintCalendarLater() {
+    var box = $('next-later'), L = NEXT_PREP.later; if (!box || !L) return;
+    var mode = nextPrepMode(), openKey = '';
+    var html = L.rows.map(function (r) {
+      var rd = toDate(r.start), key = rd ? nextPrepKey(r.title, rd) : '', can = !!(mode && key && r.hold !== true);
+      if (can) { NEXT_PREP.rows[key] = { title: r.title, start: rd.toISOString() }; if (NEXT_PREP.open === key) openKey = key; }
+      return '<div class="later-row"><span class="later-when">' + esc(rd ? clock(rd) : '') + '</span><span class="later-what">' + esc(r.title) + '</span>' +
+        (can ? '<button type="button" class="link-btn later-prep" data-next-prep="' + esc(key) + '" aria-expanded="' + (NEXT_PREP.open === key) + '">Prep</button>' : '') + '</div>' +
+        (can && NEXT_PREP.open === key ? nextPrepPanelHtml(key, mode) : '');
+    }).join('');
+    if (L.more > 0) html += '<button type="button" class="link-btn later-more" data-goto="meetings">' + esc('+' + L.more + ' more today') + '</button>';
+    if (L.asOf) html += '<div class="later-asof">' + esc('Calendar as of ' + clock(L.asOf)) + '</div>';
+    // Shown before it is written: autoGrow measures the box, and a hidden one measures 0.
+    box.classList.toggle('hidden', !html);
+    writeKeepingPrep(box, html, openKey);
+  }
+
+  // ── Prep on every Next up row (Miles typed 2026-11-09 13:00 CST) ─────────
+  // "Inline options to prep for a given meeting which starts the gotCOS ask and gives us the ability to add in more
+  // context for the prep." Prep on a later row (or Add context beside the first row's Prep me) opens a small panel
+  // under that row: the context box, Add files, Start prep and Cancel. One panel at a time; Escape closes it. The words
+  // and files are kept per meeting (title plus start) while the page polls. Start prep goes to Messages, then COS, and
+  // hands them to cos-chat.js prepStart: the Prep composer for that meeting (the context joins its notes, the files go
+  // up through its own path, then Prep me runs), or, with Prep off on the Mac and Ask on, the plain Ask with the context
+  // as its quoted reference. Neither on (or the Mac not answering): no Prep on any row.
+  var NEXT_PREP = { open: '', rows: {}, drafts: {}, later: null, firstKey: '', busy: false, capsAsked: false };
+  function nextPrepKey(title, d) { return String(title || '') + '|' + (d ? d.toISOString() : ''); }
+  function nextPrepChat() { return typeof window !== 'undefined' && window.COSWeb && window.COSWeb.cosChat || null; }
+  /** 'prep' (Prep on the Mac), 'ask' (Ask only), or '' (neither, the Mac not answering, or not known yet). */
+  function nextPrepMode() {
+    var chat = nextPrepChat();
+    if (TODAY.offline || !chat || !chat.prepStart) return '';
+    if (chat.known && !chat.known()) {
+      // The chat reads /api/health once per page; paint the rows again when it lands.
+      if (!NEXT_PREP.capsAsked && chat.ensureCaps) {
+        NEXT_PREP.capsAsked = true;
+        chat.ensureCaps().then(function () { if (TODAY.welcome) renderNext(TODAY.welcome); paintCalendarLater(); }, function () {});
+      }
+      return '';
+    }
+    if (chat.prepCaps && chat.prepCaps()) return 'prep';
+    return chat.askOn && chat.askOn() ? 'ask' : '';
+  }
+  function nextPrepDraft(key) { return NEXT_PREP.drafts[key] || (NEXT_PREP.drafts[key] = { text: '', files: [] }); }
+  function nextPrepMax() { var chat = nextPrepChat(), c = chat && chat.prepCaps && chat.prepCaps(); return c || { maxFiles: 10, steerChars: 4000 }; }
+  function nextPrepPanelHtml(key, mode) {
+    var row = NEXT_PREP.rows[key] || { title: '' }, dr = nextPrepDraft(key), chat = nextPrepChat();
+    var label = 'Add context for this prep (goals, people, what you want out of it)';
+    var files = mode === 'prep' && dr.files.length ? '<ul class="next-prep-files">' + dr.files.map(function (f, i) {
+      return '<li><span class="next-prep-file">' + esc(f.name || 'File') + '</span><button type="button" class="link-btn" data-next-prep-remove="' + i + '" aria-label="' + esc('Remove ' + (f.name || 'file')) + '">Remove</button></li>';
+    }).join('') + '</ul>' : '';
+    var add = mode === 'prep' ? '<label class="cx-btn quiet next-prep-add" title="Add files to this prep"><svg class="icon" aria-hidden="true"><use href="#i-clip"/></svg><span>Add files</span>' +
+      '<input type="file" class="cc-file" multiple accept="' + esc((chat && chat.prepAccept) || '') + '" data-next-prep-file aria-label="' + esc('Add files to the prep for ' + row.title) + '"></label>' : '';
+    return '<form class="next-prep" data-next-prep-form data-key="' + esc(key) + '" autocomplete="off" aria-label="' + esc('Prep for ' + row.title) + '">' +
+      '<textarea class="field next-prep-input" rows="2" maxlength="' + (mode === 'prep' ? nextPrepMax().steerChars : 2000) + '" data-next-prep-steer placeholder="' + esc(label) + '" aria-label="' + esc(label) + '"></textarea>' +
+      files +
+      '<div class="next-prep-acts">' + add + '<span class="next-prep-gap"></span>' +
+        '<button type="button" class="link-btn next-prep-cancel" data-next-prep-cancel>Cancel</button>' +
+        '<button type="submit" class="cx-btn primary next-prep-start"' + (NEXT_PREP.busy ? ' disabled' : '') + '>Start prep</button></div>' +
+      '</form>';
+  }
+  // The first row's panel, in its own slot under Prep me and Open meeting.
+  function paintNextPrepSlot(slot, key) {
+    if (!slot) return;
+    var mode = key ? nextPrepMode() : '';
+    // Shown before it is written: autoGrow measures the box, and a hidden one measures 0.
+    slot.classList.toggle('hidden', !(key && mode));
+    writeKeepingPrep(slot, key && mode ? nextPrepPanelHtml(key, mode) : '', key);
+  }
+  /** Writes `html` into `el` unless it is already there, then puts the open panel's words back (and the focus and caret). */
+  function writeKeepingPrep(el, html, key) {
+    if (el.cosPrepHtml === html) return;
+    var doc = typeof document !== 'undefined' ? document : null, active = doc && doc.activeElement;
+    var had = !!(active && el.contains && el.contains(active) && active.hasAttribute && active.hasAttribute('data-next-prep-steer'));
+    var a = had ? active.selectionStart : 0, b = had ? active.selectionEnd : 0;
+    el.innerHTML = html;
+    el.cosPrepHtml = html;
+    var box = key && el.querySelector ? el.querySelector('[data-next-prep-steer]') : null;
+    if (!box) return;
+    box.value = nextPrepDraft(key).text;
+    autoGrow(box);
+    if (had) { box.focus(); try { box.setSelectionRange(a, b); } catch (_e) {} }
+  }
+  function repaintNextPrep() {
+    if (TODAY.welcome && TODAY.welcome.nextEvent) renderNext(TODAY.welcome);
+    paintCalendarLater();
+  }
+  function toggleNextPrep(key) {
+    NEXT_PREP.open = NEXT_PREP.open === key ? '' : key;
+    repaintNextPrep();
+    if (!NEXT_PREP.open || typeof document === 'undefined') return;
+    var box = document.querySelector('[data-next-prep-form] [data-next-prep-steer]');
+    if (box) { box.focus(); if (box.scrollIntoView) box.scrollIntoView({ block: 'nearest' }); }
+  }
+  // Escape closes the panel and keeps the words (they come back when it opens again); Cancel closes it and drops them.
+  function closeNextPrep(drop) {
+    var key = NEXT_PREP.open; if (!key) return false;
+    if (drop) delete NEXT_PREP.drafts[key];
+    NEXT_PREP.open = '';
+    repaintNextPrep();
+    var opener = typeof document !== 'undefined' && typeof CSS !== 'undefined' && CSS.escape ? document.querySelector('[data-next-prep="' + CSS.escape(key) + '"]') : null;
+    if (opener && opener.focus) opener.focus();
+    return true;
+  }
+  function nextPrepInput(box) { var key = NEXT_PREP.open; if (key) nextPrepDraft(key).text = box.value; }
+  function addNextPrepFiles(list) {
+    var key = NEXT_PREP.open; if (!key) return;
+    var dr = nextPrepDraft(key), max = nextPrepMax().maxFiles, chat = nextPrepChat(), refused = [];
+    Array.prototype.slice.call(list || []).forEach(function (f) {
+      if (dr.files.length >= max) { refused.push('A prep holds ' + max + ' files. ' + (f.name || 'A file') + ' was not added.'); return; }
+      var c = chat && chat.classify ? chat.classify(f) : {};
+      if (c && c.refuse) { refused.push(c.refuse); return; }
+      if (c && c.kind === 'video') { refused.push((f.name || 'That video') + ' is a video. Prep reads documents and the text in images.'); return; }
+      dr.files.push(f);
+    });
+    if (refused.length) toast(refused.join(' '));
+    repaintNextPrep();
+  }
+  function removeNextPrepFile(i) {
+    var key = NEXT_PREP.open; if (!key) return;
+    nextPrepDraft(key).files.splice(Number(i), 1);
+    repaintNextPrep();
+  }
+  function startNextPrep() {
+    var key = NEXT_PREP.open, row = key && NEXT_PREP.rows[key], chat = nextPrepChat();
+    if (!row || NEXT_PREP.busy || !chat || !chat.prepStart) return;
+    var mode = nextPrepMode(); if (!mode) return;
+    var dr = nextPrepDraft(key);
+    var extra = { steer: dr.text.trim(), files: mode === 'prep' ? dr.files.slice() : [] };
+    NEXT_PREP.busy = true; NEXT_PREP.open = '';
+    repaintNextPrep();
+    go('messages', ['cos']);
+    // The words and files stay with the meeting until the prep (or the Ask) is on its way; a failure keeps them.
+    chat.prepStart(row.title, row.start, extra).then(function (how) {
+      if (how) delete NEXT_PREP.drafts[key];
+      else toast('Prep is not on for this Mac.');
+    }, function (err) {
+      toast((err && err.message) || 'Prep did not start. Your context is still under the meeting on Today.');
+    }).then(function () { NEXT_PREP.busy = false; });
   }
   function prepNext() {
     var n = TODAY.welcome && TODAY.welcome.nextEvent, d = n && toDate(n.time), chat = window.COSWeb && window.COSWeb.cosChat;
@@ -1878,6 +2387,53 @@
     go('messages', ['cos']);
     chat.prepFor(n.title, d ? d.toISOString() : null).catch(function (err) { toast((err && err.message) || 'Prep me did not start.'); });
   }
+  // ── Ask about this (Today round 2, Miles 11/09) ─────────
+  // "Ask COS from this page about the summary and take action coming off of that summary": one box under the model's
+  // summary. Send goes to Messages, then COS, and submits an Ask (panes/cos-chat.js askAbout) that carries the summary,
+  // when it was written and the sessions it read, as the Ask's quoted reference (data, never instructions; no transcript
+  // text, only the last message into each session). COS can then answer, or pass an instruction to a session by its
+  // title through the Ask's own relay ("Sent to <title>" on the answer card). Hidden without a model summary, without
+  // Ask on the Mac (capabilities: durable query jobs) or while the Mac does not answer.
+  function paintTodayAsk(brief) {
+    var form = $('today-ask'); if (!form) return;
+    var chat = window.COSWeb && window.COSWeb.cosChat;
+    // Ask's capability is read once per page (the chat's /api/health read); paint again when it lands.
+    if (brief && chat && chat.known && !chat.known() && chat.ensureCaps && !TODAY.askCaps) {
+      TODAY.askCaps = true;
+      chat.ensureCaps().then(function () { if (TODAY.model && state.pane === 'today') renderStory(TODAY.model); }, function () {});
+    }
+    // T1 spec 0: the box stays while a session read is pending or failed; briefShown decides whether there is a summary.
+    var on = !!(brief && !TODAY.offline && chat && chat.askAbout && chat.askOn && chat.askOn());
+    form.classList.toggle('hidden', !on);
+  }
+  // The sessions the summary read: the server's own list with the summary (7.0.10+ round 2 `sessions`: title, provider,
+  // state, when it last moved, the last message into it), else what this page holds for the same rows.
+  function todayAskContext(b) {
+    var rows = [];
+    if (Array.isArray(b.sessions) && b.sessions.length) {
+      b.sessions.forEach(function (r) { if (r && r.title) rows.push({ title: String(r.title), provider: String(r.provider || 'claude'), state: String(r.state || ''), movedAt: r.movedAt || null, lastAsk: r.lastAsk ? String(r.lastAsk) : '' }); });
+    } else {
+      (state.sessions || []).forEach(function (s) {
+        if (sxKeepWarm(s)) return;
+        var kind = sxState(s) === 'waiting' ? 'waiting' : s.running_active ? 'working' : s.running ? 'open' : '';
+        if (!kind) return;
+        var k = splitSessionId(s.provider, s.session_id || s.id);
+        rows.push({ title: sessionTitle(s), provider: k.provider, state: kind, movedAt: kind === 'open' ? (s.last_activity_at || s.state_since) : (s.state_since || s.last_activity_at), lastAsk: '' });
+      });
+    }
+    return { summary: String(b.text || ''), at: b.at || null, sessions: rows };
+  }
+  function sendTodayAsk() {
+    var input = $('today-ask-input'), text = input ? input.value.trim() : '';
+    var chat = window.COSWeb && window.COSWeb.cosChat, b = briefShown();
+    if (!text || TODAY.askBusy || !b || !chat || !chat.askAbout) return;
+    TODAY.askBusy = true;
+    var ctx = todayAskContext(b);
+    go('messages', ['cos']);
+    chat.askAbout(text, ctx).then(function () { input.value = ''; autoGrow(input); }, function (err) {
+      toast((err && err.message) || 'Ask did not send. Your words are still in the box on Today.');
+    }).then(function () { TODAY.askBusy = false; });
+  }
   // From today's meetings: Work's suggestions from meetings held today. They stay here until
   // midnight, then join Sort in Work; Review opens them in Work's Sort.
   function localDay(d) { return d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0'); }
@@ -1953,7 +2509,8 @@
   }
   var SX = {
     rows: null, dropped: null, enabled: true, loading: false, error: '', loadedAt: 0,
-    clock: sxPref('clock', 'updated', ['updated', 'opened', 'pinned']),
+    // 7.0.23 step 2b: Pinned is a group now, not a clock; a saved 'pinned' reads as Updated.
+    clock: sxPref('clock', 'updated', ['updated', 'opened']),
     view: sxPref('view', 'sessions', ['sessions', 'usage', 'cost']),
     recency: sxPref('recency', 'newest', ['newest', 'oldest', 'match']),
     q: '', instant: [], remote: [], searching: false, searchError: '', ranFor: '', semantic: null, semanticReason: '', searchSeq: 0, searchTimer: null,
@@ -1983,7 +2540,9 @@
 
   // ClaudeSession.title: the job label, else the name, else the workspace, else the id.
   function sxTitle(s) {
-    var t = plain(s.display_label || s.custom_title || '').replace(/\s+/g, ' ').trim();
+    // 7.0.23 step 2b-2: a title renamed in COS (S1's title_override) is the title everywhere; the agent's own stays
+    // in display_label, shown under it in the list and still searchable.
+    var t = plain(s.title_override || s.display_label || s.custom_title || '').replace(/\s+/g, ' ').trim();
     return t || String(s.project || '').trim() || String(s.session_id || s.id || 'Session');
   }
   function sxWarmWords(t) { t = String(t || '').trim().toLowerCase(); return t === 'ready' || t.indexOf('this is an automated local readiness check') === 0; }
@@ -2096,7 +2655,8 @@
       '<div class="cx-hero-text"><h1 class="cx-title">Sessions</h1><p class="cx-detail-line">' + esc(detail) + liveHeroNote(view) + '</p></div>' +
       '<div class="cx-actions"><button type="button" class="cx-btn quiet" data-sx="refresh"' + (busy ? ' disabled' : '') + '><svg class="icon"><use href="#i-refresh"/></svg>Refresh</button></div>' +
       (stats.length ? '<div class="cx-stats">' + stats.map(function (s) { return '<span class="cx-stat"><b>' + esc(typeof s[0] === 'number' ? s[0].toLocaleString() : s[0]) + '</b><span>' + s[1] + '</span></span>'; }).join('') + '</div>' : '');
-    var clockOn = view === 'sessions' && !sxQueryActive();
+    // 7.0.23 step 2b: Updated and Opened are the sort menu now, and Pinned a group; no clock switches here.
+    var clockOn = false;
     views.innerHTML = '<div class="cx-switch" role="group" aria-label="Sessions view">' +
         Object.keys(SX_VIEWS).map(function (v) { return '<button type="button" data-sx="view" data-view="' + v + '" aria-pressed="' + (v === view) + '">' + SX_VIEWS[v] + '</button>'; }).join('') +
       '</div>' +
@@ -2106,6 +2666,115 @@
     var split = $('sessions-split'), usage = $('sessions-usage');
     if (split) split.classList.toggle('hidden', view !== 'sessions');
     if (usage) usage.classList.toggle('hidden', view === 'sessions');
+    // 7.0.23 step 2b: in Sessions the list's own head (the Sessions menu, Search, the quiet line, the sort menu) takes
+    // the place of this header and the switches; Usage and COS cost keep them, so there is a way back.
+    hero.classList.toggle('hidden', view === 'sessions');
+    // Under 600 px the list's own Sessions button steps aside for the top bar's (sessions.css), and this switch stays
+    // the way to Usage and COS cost there; from 600 px the Sessions menu is that way.
+    views.classList.toggle('sx-wide-hide', view === 'sessions');
+    sxFrameSync();
+  }
+  // 7.0.23 (step 1 of the chat-style Sessions, DESIGN_PLAN v2 "The frame"): while Sessions shows its list and reader,
+  // html.sx-frame makes the page one screen, never taller: the app shell is the visible box (--vv-top, --vv-h from
+  // viewportFit, the same kit kb-chat uses), and the rail, the list and the reader's body each scroll by themselves, with
+  // the reply area fixed at the bottom of the reader (panes/sessions.css). Usage and COS cost keep the page's own scroll.
+  // Layout, not a proven fix for the 20:16 report: the frame reports where the rail, the list and the reply box sit
+  // against the visible area (sxFrameCrumb).
+  function sxFrameSync() {
+    // Never while the sign-in gate shows (the shell is hidden): the gate must scroll like a page.
+    var de = document.documentElement, shell = $('app-shell'), on = state.pane === 'sessions' && SX.view === 'sessions' && !(shell && shell.classList.contains('hidden'));
+    if (de && de.classList) de.classList.toggle('sx-frame', on);
+    if (on) sxFrameHook();
+    return on;
+  }
+  // Where the frame's parts sit against the VISIBLE area (step 1's position report, lead 23:00): on a reader's open, and
+  // KB_AFTER_MS after an on-screen keyboard closes while the frame is on. The visible area is viewportFit's box (a
+  // visible height under 80 px is no reading, so it is innerHeight from 0, and fb says so) and, across, visualViewport's
+  // offsetLeft and width. For the rail, the list, the reader and the reply box: their top, bottom, left and right in
+  // the same coordinates, and whether each lies inside the visible area (railIn, listIn, replyIn: within 1 px on every
+  // side; a part that is not shown reads -1 and false). Numbers and fixed labels only, at most SX_FRAME_MAX a page load.
+  var SX_FRAME_MAX = 8, SX_FRAME = { n: 0, hooked: false };
+  function sxFrameCrumb(why) {
+    if (SX_FRAME.n >= SX_FRAME_MAX || !document.documentElement.classList.contains('sx-frame') || typeof layoutCrumb !== 'function') return false;
+    try {
+      var v = viewportFit(), vv = window.visualViewport, iw = window.innerWidth || 0;
+      var left = vv && !v.bad && typeof vv.offsetLeft === 'number' ? vv.offsetLeft : 0;
+      var width = vv && !v.bad && vv.width > 0 ? vv.width : iw;
+      var box = { t: v.top, b: v.top + v.height, l: left, r: left + width };
+      var out = { why: String(why || '').slice(0, 24), fb: !!v.bad, boxT: box.t, boxB: box.b, boxL: box.l, boxR: box.r };
+      var part = function (name, el) {
+        var r = el && el.getBoundingClientRect && el.offsetParent !== null ? el.getBoundingClientRect() : null;
+        var shown = !!(r && r.width > 0 && r.height > 0);
+        out[name + 'T'] = shown ? r.top : -1; out[name + 'B'] = shown ? r.bottom : -1; out[name + 'L'] = shown ? r.left : -1; out[name + 'R'] = shown ? r.right : -1;
+        out[name + 'In'] = shown && r.top >= box.t - 1 && r.bottom <= box.b + 1 && r.left >= box.l - 1 && r.right <= box.r + 1;
+      };
+      part('rail', document.querySelector('.rail'));
+      part('list', $('sessions-list-col'));
+      part('rd', $('session-reader'));
+      part('reply', $('session-form'));
+      if (layoutCrumb('sx-frame', out)) { SX_FRAME.n++; return true; }
+    } catch (_e) { /* a report never stops the page */ }
+    return false;
+  }
+  // The keyboard's after-close moment (app.js lrAfter, KB_AFTER_MS), heard once, reported while the frame is on.
+  function sxFrameHook() {
+    if (SX_FRAME.hooked || !window.COSWeb || typeof window.COSWeb.onKeyboard !== 'function') return;
+    SX_FRAME.hooked = true;
+    window.COSWeb.onKeyboard(function (what) { if (what === 'after') sxFrameCrumb('kb-after'); });
+  }
+  // "Go to the question" (Q1 23:40): shown in the dock while the session's question cards have something and the end of
+  // the conversation, where they are, is out of view (the person scrolled up). Read on the body's scroll, its size
+  // changes and the cards' redraws.
+  function sxGoQuestionPaint() {
+    var line = $('session-goq'), body = $('session-body'), q = $('session-questions');
+    if (!line) return false;
+    var has = !!(q && q.children && q.children.length && String(q.textContent || '').trim());
+    var hidden = false;
+    if (has && body && body.getBoundingClientRect && q.getBoundingClientRect) hidden = q.getBoundingClientRect().top >= body.getBoundingClientRect().bottom - 8;
+    var show = has && hidden && document.documentElement.classList.contains('sx-frame');
+    // Its place: just above the dock, whatever the dock's height is now (the reader holds it in --sx-dock-h).
+    var dock = $('session-dock'), rd = line.parentElement;
+    if (show && dock && rd && rd.style && dock.getBoundingClientRect) rd.style.setProperty('--sx-dock-h', Math.round(dock.getBoundingClientRect().height) + 'px');
+    line.hidden = !show;
+    return show;
+  }
+  // The reader's own scroll (#session-body); the window's only where the frame is off.
+  // What mounts after the first paint (the session's question cards, the queue, the activity, image previews) changes
+  // the body's height and would leave it short of the end. So the body stays at the newest turn while its size or its
+  // content changes, until the person scrolls it themself: a wheel, touch, pointer or key on the body within the last
+  // SX_PIN_USER_MS, then a scroll that leaves the end by more than 4 px. A scroll the browser makes on its own (scroll
+  // anchoring while turns and previews land) never counts. Two more passes (250 and 900 ms) cover a browser without
+  // ResizeObserver.
+  var SX_NEWEST_AGAIN_MS = [250, 900], SX_PIN_USER_MS = 1000;
+  var SX_PIN = { body: null, ro: null, put: -1, userAt: 0 };
+  function sxUnpin() { if (SX_PIN.ro) { try { SX_PIN.ro.disconnect(); } catch (_e) {} } SX_PIN.ro = null; SX_PIN.body = null; }
+  function sxToNewest() {
+    var body = $('session-body');
+    if (!(body && document.documentElement.classList.contains('sx-frame'))) { window.scrollTo(0, document.documentElement.scrollHeight); return; }
+    var bottom = function () { body.scrollTop = body.scrollHeight; SX_PIN.put = body.scrollTop; };
+    bottom();
+    if (SX_PIN.body !== body) {
+      sxUnpin();
+      SX_PIN.body = body;
+      var touched = function () { SX_PIN.userAt = Date.now(); };
+      ['wheel', 'touchstart', 'pointerdown', 'keydown'].forEach(function (t) { body.addEventListener(t, touched, { passive: true }); });
+      body.addEventListener('scroll', sxGoQuestionPaint, { passive: true });
+      body.addEventListener('scroll', function () {
+        if (SX_PIN.body !== body || Date.now() - SX_PIN.userAt > SX_PIN_USER_MS) return;
+        if (Math.abs(body.scrollTop - SX_PIN.put) > 4 && body.scrollTop < body.scrollHeight - body.clientHeight - 4) sxUnpin();
+      }, { passive: true });
+      if (typeof ResizeObserver === 'function') {
+        // The body and everything in it (the note, the turns, Copy session, its note): any of them can grow.
+        SX_PIN.ro = new ResizeObserver(function () { if (SX_PIN.body === body && body.isConnected) bottom(); sxGoQuestionPaint(); });
+        SX_PIN.ro.observe(body);
+        [].forEach.call(body.children, function (c) { SX_PIN.ro.observe(c); });
+        // The dock too: files added to the reply box change its height, and Go to the question sits just above it.
+        if ($('session-dock')) SX_PIN.ro.observe($('session-dock'));
+      }
+    }
+    SX_NEWEST_AGAIN_MS.forEach(function (ms) {
+      setTimeout(function () { if (body.isConnected && SX_PIN.body === body) bottom(); }, ms);
+    });
   }
 
   // 7.0.1: the hero's counts say when they are not live ("Reconnecting", "as of 2 min ago"); nothing without a stream.
@@ -2145,6 +2814,8 @@
       state.sessions = SX.rows;
       if (sxQueryActive()) SX.instant = sxInstant(SX.q);
       renderSessionGroups();
+      sxLoadOlder(force === true);
+      if (typeof sxLoadFolders === 'function') sxLoadFolders(force === true);
     }).catch(function (err) {
       SX.loading = false;
       SX.error = (err && err.message) || 'Sessions did not load';
@@ -2170,36 +2841,409 @@
   }
   // Control's row: glyph, title, a snippet on search hits, then badge · PINNED · state · Updated ·
   // Opened (twins only, amber) · workspace; a match chip and a chevron on the right.
-  function sxRow(s, hit, ambiguous) {
+  // ── the grouped list (7.0.23, step 2b-1 of the chat-style Sessions; DESIGN_PLAN v2 "The list", the 23:33 mock) ──
+  // A row, full or compact. sxRow stays the one renderer: live updates (liveSessionRows) replace a row's root, the
+  // element with data-session, with this; search draws its hits with it (a snippet and the Keyword or Meaning tag).
+  // Line two is the product's own state words, then the project, in plain words with commas: Running; Waiting and its
+  // kind; Stale; Failed and its reason; "2 queued"; Not sent; "Pinned in Claude" for an agent's own pin; "Opened
+  // Nov 9" when two rows on screen share a title. The left edge is green running, accent waiting, red failed, and the
+  // state is always in the words too. A compact row (days 8 to 30, the short form from /older) is the title and date.
+  function sxRowWords(s, st, key) {
+    var w = [];
+    if (st === 'running') w.push('Running');
+    else if (st === 'waiting') { var k = sxWaitingKind(s.waiting_kind, s.waiting_detail); w.push(k ? 'Waiting, ' + k.charAt(0).toLowerCase() + k.slice(1) : 'Waiting'); }
+    else if (st === 'stale') w.push('Stale');
+    else if (st === 'error') w.push(s.failure ? 'Failed, ' + String(s.failure).replace(/_/g, ' ') : 'Failed');
+    var queued = Number(s.queued_turns) || 0;
+    if (queued > 0) w.push(queued + ' queued');
+    var ns = notSentFor(key.provider, key.id);
+    if (ns) w.push(ns.label || 'Not sent');
+    if (s.pinned) w.push('Pinned in ' + sxProviderLabel(key.provider));
+    return w;
+  }
+  function sxRow(s, hit, ambiguous, compact) {
     var key = splitSessionId(s.provider, s.session_id || s.id);
     var r = parseRoute();
     var selected = r.pane === 'sessions' && r.args[0] === key.provider && r.args[1] === key.id;
-    var st = sxState(s), label = sxStateLabel(s, st), title = sxTitle(s);
-    var upd = toDate(s.modified), opened = toDate(s.created);
-    var meta = sxBadge(key.provider) +
-      (s.pinned ? '<span class="sx-pinned">PINNED</span>' : '') +
-      (label ? '<span class="sx-chip ' + st + '">' + esc(label) + '</span>' : '') +
-      (notSentFor(key.provider, key.id) ? '<span class="sx-chip refused" title="' + esc(notSentFor(key.provider, key.id).line) + '">' + esc(notSentFor(key.provider, key.id).label || 'Not sent') + '</span>' : '') +
-      (upd ? '<span class="sx-when">Updated ' + esc(sxShortDate(upd)) + '</span>' : '') +
-      (ambiguous[title] && opened ? '<span class="sx-opened" title="Another session on screen has the same name. This one was opened ' + esc(sxShortDate(opened)) + '.">Opened ' + esc(sxShortDate(opened)) + '</span>' : '') +
-      (s.project && String(s.project) !== title ? '<span class="sx-ws">' + esc(s.project) + '</span>' : '');
-    var match = hit ? (hit.match === 'both' ? 'Keyword + meaning' : hit.match === 'semantic' ? 'Meaning' : 'Keyword') : '';
+    var short = s.form === 'short', st = short ? '' : sxState(s), title = sxTitle(s);
+    var when = toDate(SX.clock === 'opened' ? (s.created || s.modified) : s.modified);
+    var edge = st === 'running' ? ' running' : st === 'waiting' ? ' waiting' : st === 'error' ? ' failed' : '';
+    var id = esc(key.provider) + '|' + esc(key.id), rowKey = key.provider + '|' + key.id;
+    var org = typeof SXF === 'object' && SXF.ok === true;
+    if (org && SXF.renaming && SXF.renaming.toLowerCase() === rowKey.toLowerCase()) {
+      // data-edit, not data-session, while the form is open: a form's Save (or Enter, which the browser turns into a
+      // click on Save) must not reach the page's row handler and open the session.
+      return '<div class="sx-r editing" data-edit="' + id + '">' + sxInlineHtml('rename', rowKey, 'Rename this session', s.title_override || title,
+        s.title_override ? 'The agent\u2019s own title stays underneath and in search.' : '') + '</div>';
+    }
+    var agent = s.title_override && s.display_label && String(s.display_label).trim() !== title ? plain(String(s.display_label)).replace(/\s+/g, ' ').trim() : '';
+    var head = '<span class="sx-r-title">' + esc(title) + '</span>' + (when ? '<span class="sx-r-time">' + esc(sxShortDate(when)) + '</span>' : '') +
+      (agent ? '<span class="sx-r-orig">' + esc(agent) + '</span>' : '');
+    var more = org && !short && !compact ? '<button type="button" class="sx-r-more" data-sx="row-menu" data-key="' + id + '" aria-haspopup="menu" aria-expanded="false" aria-label="' + esc('More for ' + title) + '"><span aria-hidden="true">\u2026</span></button>' : '';
+    if (compact || short) {
+      return '<div class="sx-r compact' + edge + '" data-session="' + id + '"' + (selected ? ' aria-selected="true"' : '') + '>' +
+        '<button type="button" class="sx-r-open" data-session="' + id + '"' + (selected ? ' aria-selected="true"' : '') + '>' + head + '</button></div>';
+    }
+    var words = sxRowWords(s, st, key);
+    var opened = toDate(s.created);
+    if (ambiguous && ambiguous[title] && opened) words.push('Opened ' + sxShortDate(opened));
+    var proj = s.project && String(s.project) !== title ? String(s.project) : '';
+    var line = words.concat(proj ? [proj] : []).join(', ');
+    var failedWord = st === 'error' ? words[0] : '';
+    var lineHtml = failedWord ? '<b class="failed">' + esc(failedWord) + '</b>' + esc(line.slice(failedWord.length)) : esc(line);
+    var match = hit ? (hit.match === 'both' ? 'Keyword and meaning' : hit.match === 'semantic' ? 'Meaning' : 'Keyword') : '';
     // An instant title hit's snippet is the title itself; it says nothing twice.
     var snippet = hit && hit.snippet ? plain(hit.snippet).replace(/\s+/g, ' ').trim() : '';
-    return '<button type="button" class="cx-row sx-row" data-session="' + esc(key.provider) + '|' + esc(key.id) + '"' + (selected ? ' aria-selected="true"' : '') + '>' +
-      sxGlyph(key.provider) +
-      '<span class="cx-row-body"><span class="sx-title">' + esc(title) + '</span>' +
-      (snippet && snippet !== title ? '<span class="sx-snippet">' + esc(snippet) + '</span>' : '') +
-      '<span class="sx-meta">' + meta + '</span></span>' +
-      '<span class="sx-side">' + (match ? '<span class="sx-match">' + match + '</span>' : '') + '<span class="chev"></span></span></button>';
+    return '<div class="sx-r full' + edge + '" data-session="' + id + '"' + (selected ? ' aria-selected="true"' : '') + '><span class="sx-r-edge" aria-hidden="true"></span>' +
+      '<button type="button" class="sx-r-open" data-session="' + id + '"' + (selected ? ' aria-selected="true"' : '') + '>' + head +
+        '<span class="sx-r-sub">' + sxGlyph(key.provider) + (line ? '<span class="t">' + lineHtml + '</span>' : '') + (match ? '<span class="sx-tag">' + match + '</span>' : '') + '</span>' +
+        (snippet && snippet !== title ? '<span class="sx-r-snip">' + esc(snippet) + '</span>' : '') +
+      '</button>' + more + '</div>';
+  }
+
+  // Groups, top to bottom; a session shows once. Needs you is what Today's needsModel counts for a session: waiting, or
+  // a question this page holds for it; plus failed (DESIGN_PLAN v2). Working now is running. Pinned is an agent's own
+  // pin or a COS pin. Then by day of the sort's time: Today, Yesterday, Earlier this week as full rows; Last week and
+  // Earlier this month as compact rows, folded shut with a count. Days are counted back from today (2 to 6 days ago is
+  // Earlier this week, 7 to 13 Last week, 14 to 30 Earlier this month), so no group is empty only because of the
+  // calendar.
+  var SX_GROUPS = [['needs', 'Needs you', 'state'], ['working', 'Working now', 'state'], ['pinned', 'Pinned', ''], ['today', 'Today', ''],
+    ['yesterday', 'Yesterday', ''], ['week', 'Earlier this week', ''], ['lastweek', 'Last week', 'compact'], ['month', 'Earlier this month', 'compact']];
+  var SX_DAY_MS = 86400000, SX_REST_MS = 2000, SX_EMPTY_HOLD_MS = 5000;
+  // place: each row's group as last drawn at rest; seen: when Needs you and Working now last had rows; open: unfolded
+  // compact groups; older: /older's short rows (olderOk false: an older server, 404).
+  var SXL = { place: null, down: false, touchAt: 0, scrollAt: 0, timer: 0, seen: {}, open: {}, older: [], olderN: null, olderOk: null, olderNext: null, olderAt: 0, olderBusy: false };
+  function sxRowKey(s) { var k = splitSessionId(s.provider, s.session_id || s.id); return k.provider + '|' + String(k.id).toLowerCase(); }
+  function sxDayStart(t) { var d = new Date(t); d.setHours(0, 0, 0, 0); return d.getTime(); }
+  function sxSortTime(s) { return SX.clock === 'opened' ? (sxTime(s.created) || sxTime(s.modified)) : sxTime(s.modified); }
+  function sxHeldKeys() {
+    var qs = typeof sessionQs === 'function' ? sessionQs() : null, out = {};
+    (qs && qs.itemsFor ? qs.itemsFor('') : []).forEach(function (it) { var k = splitSessionId(it.provider, it.sessionId); if (k.id) out[k.provider + '|' + String(k.id).toLowerCase()] = 1; });
+    return out;
+  }
+  function sxGroupFor(s, now, held) {
+    if (s.form !== 'short') {
+      var st = sxState(s);
+      if (st === 'waiting' || st === 'error' || held[sxRowKey(s)]) return 'needs';
+      if (st === 'running') return 'working';
+    }
+    if (s.pinned || s.cos_pinned) return 'pinned';
+    if (s.folder_id && typeof SXF === 'object' && SXF.byId[s.folder_id]) return 'f:' + s.folder_id;
+    var t = sxSortTime(s), today = sxDayStart(now);
+    if (t >= today) return 'today';
+    if (t >= today - SX_DAY_MS) return 'yesterday';
+    if (t >= today - 6 * SX_DAY_MS) return 'week';
+    if (t >= today - 13 * SX_DAY_MS) return 'lastweek';
+    return 'month';
+  }
+  // The main list's rows, then /older's short rows it does not have (the main row wins on a repeat).
+  function sxAllRows() {
+    var main = sxReal(), have = {};
+    main.forEach(function (s) { have[sxRowKey(s)] = 1; });
+    return main.concat((SXL.older || []).filter(function (s) { return !sxKeepWarm(s) && !have[sxRowKey(s)]; }));
+  }
+  // At rest: nothing pressed, no touch or scroll in the last SX_REST_MS, and no row holding keyboard focus.
+  function sxListAtRest() {
+    if (SXL.down) return false;
+    var now = Date.now();
+    if (now - SXL.touchAt < SX_REST_MS || now - SXL.scrollAt < SX_REST_MS) return false;
+    var a = document.activeElement;
+    return !(a && a.closest && a.closest('#sessions-list [data-session]'));
+  }
+  function sxRegroupLater(ms) {
+    if (SXL.timer) return;
+    SXL.timer = setTimeout(function () {
+      SXL.timer = 0;
+      if (state.pane !== 'sessions' || SX.view !== 'sessions' || sxQueryActive()) return;
+      if (sxListAtRest()) renderSessionGroups(); else sxRegroupLater();
+    }, ms || SX_REST_MS + 50);
+  }
+  // A group's row form: compact in Last week and Earlier this month, full under Needs you and Working now, and elsewhere
+  // short when the row is one of /older's short rows (the same rule sxListHtml draws with).
+  function sxGroupCompact(g, s) {
+    for (var i = 0; i < SX_GROUPS.length; i++) if (SX_GROUPS[i][0] === g) return SX_GROUPS[i][2] === 'compact' ? true : SX_GROUPS[i][2] === 'state' ? false : s.form === 'short';
+    return s.form === 'short';
+  }
+  // A live state change (liveSessionRows' paint without a structural change, Q1 07:22 FIX 1): the row is redrawn where
+  // it was placed, in that group's form, and when its group would now differ (Working now to Needs you, say) the list
+  // asks for a regroup, which the rest rule applies (at once at rest, held while the list is pressed, scrolled or focused).
+  function sxLiveRow(s, amb) {
+    var k = sxRowKey(s), placed = SXL.place ? SXL.place[k] : null, want = sxGroupFor(s, Date.now(), sxHeldKeys());
+    return { html: sxRow(s, null, amb, sxGroupCompact(placed || want, s)), moved: !!placed && placed !== want };
   }
   function sxListHtml() {
     if (!SX.rows) return SX.error ? sxEmpty(SX.error) : skeletonRows(6);
     if (!SX.enabled && !SX.rows.length) return sxEmpty('AI sessions are off. Turn on Show AI sessions in Settings, Work and agents.');
-    var vis = sxVisible();
-    if (!vis.length) return sxEmpty(SX.error || sxEmptyCopy());
-    var amb = sxAmbiguous(vis);
-    return '<div class="cx-list sx-list">' + vis.map(function (s) { return sxRow(s, null, amb); }).join('') + '</div>';
+    var all = sxAllRows();
+    if (!all.length) return sxEmpty(SX.error || sxEmptyCopy());
+    var now = Date.now(), held = sxHeldKeys(), want = {}, by = {}, moves = 0;
+    all.forEach(function (s) { want[sxRowKey(s)] = sxGroupFor(s, now, held); });
+    // A row changes group only at rest; held moves apply together on the next rest (sxRegroupLater).
+    if (!SXL.place || sxListAtRest()) SXL.place = want;
+    else Object.keys(want).forEach(function (k) { if (!(k in SXL.place)) SXL.place[k] = want[k]; else if (SXL.place[k] !== want[k]) moves++; });
+    if (moves) sxRegroupLater();
+    all.forEach(function (s) { var k = sxRowKey(s), g = SXL.place[k] || want[k]; (by[g] = by[g] || []).push(s); });
+    var amb = sxAmbiguous(all.filter(function (s) { return s.form !== 'short'; }));
+    var html = '', holdUntil = 0;
+    // Folders sit after Pinned, each a heading that folds (open by default), with its own menu; New folder's field
+    // opens at the top of this area.
+    var groups = [];
+    SX_GROUPS.forEach(function (g) {
+      groups.push(g);
+      if (g[0] === 'pinned' && typeof SXF === 'object' && SXF.ok) {
+        if (SXF.newOpen) groups.push(['newfolder', '', 'form']);
+        SXF.folders.forEach(function (f) { groups.push(['f:' + f.id, f.name, 'folder']); });
+      }
+    });
+    groups.forEach(function (g) {
+      if (g[2] === 'form') { html += '<section class="sx-g sx-g-form">' + sxInlineHtml('new-folder', '', 'New folder', '', '') + '</section>'; return; }
+      if (g[2] === 'folder') {
+        var fid = g[0].slice(2), frows = (by[g[0]] || []).sort(function (a, b) { return sxSortTime(b) - sxSortTime(a); }), fopen = SXL.open[g[0]] !== false;
+        if (SXF.folderRenaming === fid) { html += '<section class="sx-g" data-g="' + esc(g[0]) + '">' + sxInlineHtml('folder-rename', fid, 'Rename folder', g[1], '') + '</section>'; return; }
+        html += '<section class="sx-g sx-folder" data-g="' + esc(g[0]) + '"><div class="sx-gh-row"><button type="button" class="sx-gh" data-sx="fold" data-g="' + esc(g[0]) + '" aria-expanded="' + fopen + '">' +
+          '<span class="fold"><span class="chev" aria-hidden="true"></span><span class="nm">' + esc(g[1]) + '</span></span><span class="n">' + frows.length + '</span></button>' +
+          '<button type="button" class="sx-r-more" data-sx="folder-menu" data-id="' + esc(fid) + '" aria-haspopup="menu" aria-expanded="false" aria-label="' + esc('Folder menu for ' + g[1]) + '"><span aria-hidden="true">\u2026</span></button></div>' +
+          (fopen ? (frows.length ? '<div class="sx-rows">' + frows.map(function (s) { return sxRow(s, null, amb, s.form === 'short'); }).join('') + '</div>'
+            : '<p class="sx-empty-folder">Nothing here yet. Move a session in from its menu.</p>') : '') + '</section>';
+        return;
+      }
+      var id = g[0], rows = (by[id] || []).sort(function (a, b) { return sxSortTime(b) - sxSortTime(a); }), n = rows.length;
+      if (g[2] === 'state') {
+        if (n) SXL.seen[id] = now;
+        else if (SXL.seen[id] && now - SXL.seen[id] < SX_EMPTY_HOLD_MS) holdUntil = Math.max(holdUntil, SXL.seen[id] + SX_EMPTY_HOLD_MS);
+        else return;
+        html += '<section class="sx-g" data-g="' + id + '"><h3 class="sx-gh state ' + id + '"><span>' + g[1] + '</span><span class="n">' + n + '</span></h3>' +
+          '<div class="sx-rows">' + rows.map(function (s) { return sxRow(s, null, amb); }).join('') + '</div></section>';
+        return;
+      }
+      if (!n) return;
+      if (g[2] === 'compact') {
+        var open = !!SXL.open[id];
+        html += '<section class="sx-g" data-g="' + id + '"><button type="button" class="sx-gh" data-sx="fold" data-g="' + id + '" aria-expanded="' + open + '">' +
+          '<span class="fold"><span class="chev" aria-hidden="true"></span>' + g[1] + '</span><span class="n">' + n + '</span></button>' +
+          (open ? '<div class="sx-rows">' + rows.map(function (s) { return sxRow(s, null, amb, true); }).join('') + '</div>' +
+            (id === 'month' && SXL.olderNext ? '<p class="sx-more-older"><button type="button" class="cx-btn quiet" data-sx="older-more">Show older</button></p>' : '') : '') + '</section>';
+        return;
+      }
+      html += '<section class="sx-g" data-g="' + id + '"><h3 class="sx-gh"><span>' + g[1] + '</span><span class="n">' + n + '</span></h3>' +
+        '<div class="sx-rows">' + rows.map(function (s) { return sxRow(s, null, amb, s.form === 'short'); }).join('') + '</div></section>';
+    });
+    // A Needs you or Working now heading at 0 stays for SX_EMPTY_HOLD_MS, then the list draws again without it.
+    if (holdUntil) sxRegroupLater(holdUntil - now + 20);
+    return '<div class="sx-list sx-groups">' + html + '</div>';
+  }
+  // The list keeps its place across a redraw: the top visible row stays where it was in the list's own scroll.
+  function sxAnchor(col) {
+    if (!col || !col.getBoundingClientRect) return null;
+    var top = col.getBoundingClientRect().top, rows = col.querySelectorAll('.sx-r[data-session]');
+    for (var i = 0; i < rows.length; i++) { var b = rows[i].getBoundingClientRect(); if (b.bottom > top) return { key: rows[i].getAttribute('data-session'), top: b.top }; }
+    return null;
+  }
+  function sxRestoreAnchor(col, a) {
+    if (!col || !a) return;
+    var rows = col.querySelectorAll('.sx-r[data-session]');
+    for (var i = 0; i < rows.length; i++) if (rows[i].getAttribute('data-session') === a.key) { col.scrollTop += rows[i].getBoundingClientRect().top - a.top; return; }
+  }
+  // GET /api/agent-sessions/older (server step 2a): the short rows for days 8 to 30 and the kept ones, newest first,
+  // paged; read when the list loads (at most once a minute) and for Show older, never on the poll. An older server
+  // answers 404: the list stays at 7 days and says so.
+  var SX_OLDER_MS = 60000;
+  function sxLoadOlder(force, more) {
+    if (SXL.olderBusy || SXL.olderOk === false) return Promise.resolve();
+    if (!more && !force && SXL.olderAt && Date.now() - SXL.olderAt < SX_OLDER_MS) return Promise.resolve();
+    SXL.olderBusy = true;
+    var q = '?days=30&limit=200' + (more && SXL.olderNext ? '&before=' + encodeURIComponent(SXL.olderNext) : '');
+    return api('/api/agent-sessions/older' + q).then(function (d) {
+      var rows = (d && Array.isArray(d.sessions) ? d.sessions : []).map(function (x) { return Object.assign({}, x, { form: 'short' }); });
+      SXL.older = more ? (SXL.older || []).concat(rows) : rows;
+      if (!more && typeof d.older_than_window === 'number') SXL.olderN = d.older_than_window;
+      SXL.olderNext = d && d.next_before ? d.next_before : null;
+      SXL.olderOk = true; SXL.olderAt = Date.now();
+    }, function (err) {
+      if (err && (err.status === 404 || err.code === 'not_found')) SXL.olderOk = false;
+    }).then(function () { SXL.olderBusy = false; if (state.pane === 'sessions' && SX.view === 'sessions' && !sxQueryActive()) renderSessionGroups(); });
+  }
+  // The one quiet line at the top of the list: how far back it reaches and how many more are found by search.
+  function sxQuietLine() {
+    if (SXL.olderOk) return 'Last 30 days. ' + (SXL.olderN ? SXL.olderN + ' older through search.' : 'Older ones through search.');
+    var age = sxDropped().age;
+    return 'Last 7 days. ' + (age ? age + ' older through search.' : 'Older ones through search.');
+  }
+  // The sort menu: Updated or Opened; while searching, Best match or Updated.
+  function sxPaintSort() {
+    var sel = $('sessions-sort'); if (!sel) return;
+    var searching = sxQueryActive();
+    var opts = searching ? [['match', 'Best match'], ['newest', 'Updated']] : [['updated', 'Updated'], ['opened', 'Opened']];
+    var cur = searching ? (SX.recency === 'match' ? 'match' : 'newest') : (SX.clock === 'opened' ? 'opened' : 'updated');
+    var html = opts.map(function (o) { return '<option value="' + o[0] + '">' + o[1] + '</option>'; }).join('');
+    if (sel.__html !== html) { sel.innerHTML = html; sel.__html = html; }
+    sel.value = cur;
+  }
+  function sxPaintListHead() {
+    var nf = $('sessions-new-folder'); if (nf) nf.classList.toggle('hidden', !(typeof SXF === 'object' && SXF.ok === true));
+    var on = $('sessions-org-note'); if (on) { var nt = typeof SXF === 'object' ? SXF.note : ''; on.textContent = nt; on.classList.toggle('hidden', !nt); }
+    var line = $('sessions-quiet');
+    if (line) { var t = sxQueryActive() ? '' : sxQuietLine(); line.textContent = t; line.classList.toggle('hidden', !t); }
+    sxPaintSort();
+  }
+  // The Sessions menu: Sessions, Usage, COS cost, and Refresh.
+  function sxViewMenu(open) {
+    var btn = $('sessions-view-btn'), menu = $('sessions-view-menu');
+    if (!btn || !menu) return;
+    if (open == null) open = menu.classList.contains('hidden');
+    menu.classList.toggle('hidden', !open);
+    btn.setAttribute('aria-expanded', String(open));
+    if (open) { var first = menu.querySelector('[role="menuitem"]'); if (first && first.focus) first.focus(); }
+  }
+  function sxListWatch() {
+    var col = $('sessions-list-col');
+    if (!col || col.__sxWatch) return;
+    col.__sxWatch = true;
+    var down = function () { SXL.down = true; SXL.touchAt = Date.now(); };
+    var up = function () { SXL.down = false; SXL.touchAt = Date.now(); sxRegroupLater(); };
+    var moved = function () { SXL.scrollAt = Date.now(); };
+    col.addEventListener('pointerdown', down, { passive: true });
+    col.addEventListener('touchstart', down, { passive: true });
+    ['pointerup', 'pointercancel', 'touchend', 'touchcancel'].forEach(function (t) { col.addEventListener(t, up, { passive: true }); });
+    col.addEventListener('scroll', moved, { passive: true });
+    col.addEventListener('wheel', moved, { passive: true });
+    document.addEventListener('click', function (e) {
+      var menu = $('sessions-view-menu');
+      if (menu && !menu.classList.contains('hidden') && !e.target.closest('#sessions-view-menu') && !e.target.closest('#sessions-view-btn')) sxViewMenu(false);
+    });
+    // The row and folder menu lives on <body> (outside this pane): its items are handled here; a tap outside closes it.
+    document.addEventListener('click', function (e) {
+      var item = e.target.closest && e.target.closest('#sessions-pop [data-sx]');
+      if (item) { e.stopPropagation(); return sxOrgClick(item.getAttribute('data-sx'), item); }
+      if (SXF.pop && !(e.target.closest && (e.target.closest('#sessions-pop') || e.target.closest('[data-sx="row-menu"],[data-sx="folder-menu"]')))) sxPopClose();
+    }, true);
+    document.addEventListener('keydown', function (e) { if (e.key === 'Escape' && SXF.pop) { var b = SXF.pop; sxPopClose(); if (b && b.focus) b.focus(); } });
+    document.addEventListener('keydown', function (e) { if (e.key === 'Escape') { var menu = $('sessions-view-menu'); if (menu && !menu.classList.contains('hidden')) { sxViewMenu(false); var b = $('sessions-view-btn'); if (b) b.focus(); } } });
+  }
+  // ── folders, COS pins and rename (7.0.23, step 2b-2; S1's organizer, contract at 469a334) ──
+  // One store on the Mac (GET/POST/PATCH/DELETE /api/session-folders, PATCH /api/agent-sessions/:p/:id/organizer),
+  // shared by the phone and the Mac app. Every change is one small request; after it the folders and the list are
+  // read again. Folder names and renamed titles are untrusted text: drawn with esc() only, never as markup, never in a
+  // URL (S1 rule 6). An older server answers 404 to GET /api/session-folders: no More button and no New folder, and
+  // the list is as before.
+  var SXF = { ok: null, folders: [], byId: {}, at: 0, busy: false, note: '', newOpen: false, renaming: '', folderRenaming: '', armDelete: '', pop: null };
+  var SXF_REASONS = {
+    folder_name_taken: 'A folder already has that name.', invalid_name: 'A folder name is 1 to 60 characters.', too_many_folders: 'That is the most folders this Mac keeps (200).',
+    invalid_title: 'A title is 1 to 120 characters.', alias_conflict: 'Claude is still settling which session this is. Try again in a moment.',
+    session_not_found: 'This session is no longer on the Mac.', folder_not_found: 'That folder is gone. The list has been read again.',
+    too_many_entries: 'This Mac keeps folders, pins and titles for 5,000 sessions at most.', organizer_unavailable: 'Folders, pins and titles are not available on the Mac right now.'
+  };
+  function sxOrgWords(err) { var c = err && (err.code || ''); return SXF_REASONS[c] || 'That did not save. Check that the Mac is awake, then try again.'; }
+  function sxLoadFolders(force) {
+    if (SXF.ok === false || SXF.busy) return Promise.resolve();
+    if (!force && SXF.at && Date.now() - SXF.at < SX_OLDER_MS) return Promise.resolve();
+    SXF.busy = true;
+    return api('/api/session-folders').then(function (d) {
+      SXF.folders = (d && Array.isArray(d.folders) ? d.folders : []).filter(function (f) { return f && typeof f.id === 'string'; });
+      SXF.byId = {}; SXF.folders.forEach(function (f) { SXF.byId[f.id] = f; });
+      SXF.ok = true; SXF.at = Date.now();
+    }, function (err) { if (err && err.status === 404) SXF.ok = false; }).then(function () {
+      SXF.busy = false;
+      if (state.pane === 'sessions' && SX.view === 'sessions' && !sxQueryActive()) renderSessionGroups();
+    });
+  }
+  // A move the person asked for (pin, folder, rename, a deleted folder) applies at once, like a sort change: the rest
+  // rule holds only moves the person did not make.
+  function sxOrgDone(note) {
+    SXF.note = note || ''; SXF.at = 0; SXL.place = null;
+    // A list read already in flight started before this change: wait for it, then read again, so the list shows it.
+    var settled = function () { return SL.inflight ? SL.inflight.then(function () {}, function () {}) : Promise.resolve(); };
+    // The placement is reset once the new list is in (a redraw in between, with the old rows, would use it up).
+    return sxLoadFolders(true).then(settled).then(function () { return loadSessions(true); }).then(function () { SXL.place = null; renderSessionGroups(); });
+  }
+  function sxOrgFail(err) { SXF.note = sxOrgWords(err); sxPaintListHead(); }
+  // A text field inside the list keeps the list from redrawing over what is being typed.
+  function sxEditing() { var a = document.activeElement; return !!(a && a.closest && a.closest('#sessions-list form.sx-inline')); }
+  function sxRowByKey(key) { return sxAllRows().filter(function (s) { return sxRowKey(s) === String(key).toLowerCase(); })[0] || null; }
+  function sxOrgPatch(key, body) {
+    var s = sxRowByKey(key); if (!s) return Promise.resolve();
+    var k = splitSessionId(s.provider, s.session_id || s.id);
+    return api('/api/agent-sessions/' + encodeURIComponent(k.provider) + '/' + encodeURIComponent(k.id) + '/organizer', { method: 'PATCH', body: body });
+  }
+  function sxInlineHtml(kind, id, label, value, hint) {
+    return '<form class="sx-inline" data-sx-form="' + kind + '" data-id="' + esc(id) + '"><label class="sx-inline-label" for="sx-inline-' + kind + '">' + esc(label) + '</label>' +
+      '<input class="field" id="sx-inline-' + kind + '" maxlength="' + (kind === 'rename' ? 120 : 60) + '" autocomplete="off" enterkeyhint="done" value="' + esc(value || '') + '">' +
+      (hint ? '<p class="sx-inline-hint">' + esc(hint) + '</p>' : '') +
+      '<div class="sx-inline-acts"><button type="submit" class="cx-btn primary">' + (kind === 'new-folder' ? 'Create' : 'Save') + '</button>' +
+      (kind === 'rename' && value ? '<button type="button" class="cx-btn quiet" data-sx="rename-clear" data-id="' + esc(id) + '">Use the agent’s title</button>' : '') +
+      '<button type="button" class="cx-btn quiet" data-sx="inline-cancel">Cancel</button></div></form>';
+  }
+  // The row's menu: Pin or Unpin (a COS pin); an agent's own pin is said and has no Unpin; Move to folder; Rename.
+  function sxRowMenuHtml(s, key, moving) {
+    var k = splitSessionId(s.provider, s.session_id || s.id);
+    if (moving) {
+      var cur = s.folder_id || '';
+      return (SXF.folders.length ? SXF.folders.map(function (f) {
+        return '<button type="button" role="menuitemradio" aria-checked="' + (cur === f.id) + '" data-sx="org-move" data-key="' + esc(key) + '" data-folder="' + esc(f.id) + '">' + esc(f.name) + '</button>';
+      }).join('') : '<p class="sx-pop-note">No folders yet. Make one with New folder at the top of the list.</p>') +
+        '<button type="button" role="menuitemradio" aria-checked="' + (!cur) + '" data-sx="org-move" data-key="' + esc(key) + '" data-folder="">No folder</button>';
+    }
+    // An agent's own pin is not COS's to undo; a COS pin under it still is (Q1 07:22 a).
+    return (s.pinned ? '<p class="sx-pop-note">Pinned in ' + sxProviderLabel(k.provider) + '</p>' +
+        (s.cos_pinned ? '<button type="button" role="menuitem" data-sx="org-pin" data-key="' + esc(key) + '">Unpin in COS</button>' : '')
+        : '<button type="button" role="menuitem" data-sx="org-pin" data-key="' + esc(key) + '">' + (s.cos_pinned ? 'Unpin' : 'Pin') + '</button>') +
+      '<button type="button" role="menuitem" data-sx="org-move-menu" data-key="' + esc(key) + '">Move to folder</button>' +
+      '<button type="button" role="menuitem" data-sx="org-rename" data-key="' + esc(key) + '">Rename</button>';
+  }
+  function sxFolderMenuHtml(id) {
+    return '<button type="button" role="menuitem" data-sx="folder-rename" data-id="' + esc(id) + '">Rename</button>' +
+      '<button type="button" role="menuitem" data-sx="folder-delete" data-id="' + esc(id) + '">' + (SXF.armDelete === id ? 'Tap again to delete the folder. Its sessions go back to their day group.' : 'Delete folder') + '</button>';
+  }
+  // One small menu at a time, under its button, inside the visible frame; Escape or a tap outside closes it.
+  function sxPopClose() {
+    var pop = $('sessions-pop'); if (pop) { pop.classList.add('hidden'); pop.innerHTML = ''; }
+    if (SXF.pop && SXF.pop.setAttribute) SXF.pop.setAttribute('aria-expanded', 'false');
+    SXF.pop = null;
+  }
+  function sxPopOpen(btn, html, label) {
+    var pop = $('sessions-pop');
+    if (!pop) { pop = document.createElement('div'); pop.id = 'sessions-pop'; pop.className = 'sx-menu sx-pop hidden'; pop.setAttribute('role', 'menu'); document.body.appendChild(pop); }
+    if (SXF.pop && SXF.pop !== btn && SXF.pop.setAttribute) SXF.pop.setAttribute('aria-expanded', 'false');
+    pop.setAttribute('aria-label', label || 'Menu');
+    pop.innerHTML = html; pop.classList.remove('hidden');
+    SXF.pop = btn; btn.setAttribute('aria-expanded', 'true');
+    var r = btn.getBoundingClientRect(), w = pop.offsetWidth || 220, h = pop.offsetHeight || 160, vw = window.innerWidth || 0, vh = window.innerHeight || 0;
+    pop.style.left = Math.max(8, Math.min(r.right - w, vw - w - 8)) + 'px';
+    pop.style.top = (r.bottom + 4 + h > vh - 8 ? Math.max(8, r.top - 4 - h) : r.bottom + 4) + 'px';
+    var first = pop.querySelector('[role^="menuitem"]'); if (first && first.focus) first.focus();
+  }
+  function sxOrgClick(act, t) {
+    var key = t.getAttribute('data-key') || '', id = t.getAttribute('data-id') || '', s = key ? sxRowByKey(key) : null;
+    if (act === 'row-menu') { if (SXF.pop === t) return sxPopClose(); return s ? sxPopOpen(t, sxRowMenuHtml(s, key, false), 'Session menu') : null; }
+    if (act === 'org-move-menu') { var b = SXF.pop; return s && b ? sxPopOpen(b, sxRowMenuHtml(s, key, true), 'Move to folder') : null; }
+    if (act === 'folder-menu') { SXF.armDelete = ''; if (SXF.pop === t) return sxPopClose(); return sxPopOpen(t, sxFolderMenuHtml(id), 'Folder menu'); }
+    if (act === 'org-pin' && s) { sxPopClose(); return sxOrgPatch(key, { cos_pinned: !s.cos_pinned }).then(function () { return sxOrgDone(); }, sxOrgFail); }
+    if (act === 'org-move' && s) { sxPopClose(); var f = t.getAttribute('data-folder') || null; return sxOrgPatch(key, { folder_id: f }).then(function () { return sxOrgDone(); }, sxOrgFail); }
+    if (act === 'org-rename') { sxPopClose(); SXF.renaming = key; SXF.note = ''; renderSessionGroups(); var i = $('sx-inline-rename'); if (i) { i.focus(); i.select && i.select(); } return; }
+    if (act === 'rename-clear') { SXF.renaming = ''; return sxOrgPatch(id, { title: null }).then(function () { return sxOrgDone(); }, sxOrgFail); }
+    if (act === 'new-folder') { SXF.newOpen = true; SXF.note = ''; renderSessionGroups(); var n = $('sx-inline-new-folder'); if (n) n.focus(); return; }
+    if (act === 'folder-rename') { sxPopClose(); SXF.folderRenaming = id; SXF.note = ''; renderSessionGroups(); var fr = $('sx-inline-folder-rename'); if (fr) { fr.focus(); fr.select && fr.select(); } return; }
+    if (act === 'folder-delete') {
+      if (SXF.armDelete !== id) { SXF.armDelete = id; if (SXF.pop) sxPopOpen(SXF.pop, sxFolderMenuHtml(id), 'Folder menu'); return; }
+      SXF.armDelete = ''; sxPopClose();
+      return api('/api/session-folders/' + encodeURIComponent(id), { method: 'DELETE' }).then(function () { return sxOrgDone(); }, sxOrgFail);
+    }
+    if (act === 'inline-cancel') { SXF.newOpen = false; SXF.renaming = ''; SXF.folderRenaming = ''; var a = document.activeElement; if (a && a.blur) a.blur(); return renderSessionGroups(); }
+  }
+  function sxOrgSubmit(form) {
+    var kind = form.getAttribute('data-sx-form'), id = form.getAttribute('data-id') || '', input = form.querySelector('input');
+    var v = input ? String(input.value || '').trim() : '';
+    if (kind === 'new-folder') {
+      if (!v) { SXF.note = SXF_REASONS.invalid_name; return sxPaintListHead(); }
+      return api('/api/session-folders', { method: 'POST', body: { name: v } }).then(function () { SXF.newOpen = false; if (input) input.blur(); return sxOrgDone(); }, sxOrgFail);
+    }
+    if (kind === 'folder-rename') {
+      if (!v) { SXF.note = SXF_REASONS.invalid_name; return sxPaintListHead(); }
+      return api('/api/session-folders/' + encodeURIComponent(id), { method: 'PATCH', body: { name: v } }).then(function () { SXF.folderRenaming = ''; if (input) input.blur(); return sxOrgDone(); }, sxOrgFail);
+    }
+    if (kind === 'rename') {
+      return sxOrgPatch(id, { title: v || null }).then(function () { SXF.renaming = ''; if (input) input.blur(); return sxOrgDone(); }, sxOrgFail);
+    }
   }
   // The list, under the hero. The name stays: the shared input handler calls it when the search clears.
   function renderSessionGroups() {
@@ -2214,8 +3258,14 @@
       var note = sxQueryActive() && SX.ranFor === SX.q && SX.semantic === false ? sxSemanticHint(SX.semanticReason) : '';
       hint.textContent = note; hint.classList.toggle('hidden', !note);
     }
+    sxListWatch();
+    sxPaintListHead();
     var list = $('sessions-list'); if (!list) return;
+    // A field in the list being typed in (New folder, a rename) is never drawn over; the list waits for it.
+    if (!sxQueryActive() && typeof sxEditing === 'function' && sxEditing()) { sxRegroupLater(); return; }
+    var col = $('sessions-list-col'), at = sxQueryActive() ? null : sxAnchor(col);
     list.innerHTML = sxQueryActive() ? sxSearchHtml() : sxListHtml();
+    sxRestoreAnchor(col, at);
   }
 
   // Search (ActivityWindow.swift sessionsSearchBar 2652-2712, ControllerModel scheduleSessionSearch):
@@ -2322,20 +3372,84 @@
       renderSessionGroups();
     });
   }
-  // The meaning finder the Ask sheet offers ("Find a session about this").
-  function findByMeaning(q) {
-    return api('/api/agent-sessions/find', { method: 'POST', body: { query: q } }).then(function (d) {
-      if (d && d.available === false) return emptyBox('Meaning search is off', d.message || 'Turn on a decision provider in Settings.');
-      var results = (d && d.results) || [];
-      if (!results.length) return emptyBox('Nothing matched that meaning', 'Try different words, or search by Words.');
-      return '<h2 class="group-title"><span>About “' + esc(q) + '”</span><span>' + results.length + '</span></h2><div class="list">' + results.map(function (r) {
-        var s = r.session || r;
-        if (!s.provider && r.provider) s.provider = r.provider;
-        if (!s.session_id) s.session_id = r.sessionId || r.id;
-        return sessionRow(s, r.reason || s.project);
-      }).join('') + '</div>';
-    }).catch(function (err) { return emptyBox('Meaning search did not run', err.message); });
+  // ── Meaning search (W1, 7.0.x): "Find a session about this", as COS Control's command panel does it
+  // (SetupAssistant.swift 1476-1900). POST /api/agent-sessions/find takes exactly { query, consentedProvider, stage }
+  // (routes/session-find.ts:45-51). Nothing is sent before the person says yes for the decision model that decides search
+  // now. A yes for Jev is no yes for SubQ. The yes is kept in this browser only (the Mac keeps its own).
+  var MEANING_STORE = 'cos.web.meaningConsent';
+  var MEANING_NAME = { jev: 'Jev', subq: 'SubQ' };
+  var MEANING_TITLE = { consent_required: 'Meaning search needs your okay', provider_changed: 'The decision model changed',
+    decision_not_configured: 'Meaning search needs a key', jev_not_configured: 'Meaning search needs a key', sessions_off: 'Sessions are off',
+    find_off: 'Meaning search is off', cap_reached: 'Meaning search is used up for today', breaker_open: 'Meaning search is paused',
+    query_too_short: 'Type a few more words', failed: 'Meaning search did not answer' };
+  var MEANING_STRENGTH = { strong: 'Strong match', likely: 'Likely match', possible: 'Possible match' };
+  var MEANING = { view: null, at: 0 };
+  function meaningChoices() {
+    try { var v = JSON.parse(localStorage.getItem(MEANING_STORE) || '{}'); return v && typeof v === 'object' && !Array.isArray(v) ? v : {}; } catch (e) { return {}; }
+  }
+  function meaningChoose(provider, choice) {
+    if (!MEANING_NAME[provider]) return;
+    var c = meaningChoices();
+    if (choice === 'on' || choice === 'never') c[provider] = choice; else delete c[provider];
+    try { localStorage.setItem(MEANING_STORE, JSON.stringify(c)); } catch (e) { /* private mode: the question comes back next time */ }
+  }
+  // GET /api/decision-provider: the model that decides search now, whether its key is saved, and whether this server can
+  // find sessions by meaning at all (capabilities.sessionFind). Read again after a minute, or after a refusal.
+  function meaningSettings(force) {
+    if (!force && MEANING.view && Date.now() - MEANING.at < 60000) return Promise.resolve(MEANING.view);
+    return api('/api/decision-provider').then(function (d) {
+      var p = d && d.effective ? d.effective.search : null;
+      p = MEANING_NAME[p] ? p : null;
+      MEANING.view = { provider: p, keyed: !!(p && d.configured && d.configured[p] === true), capable: !!(d && d.capabilities && d.capabilities.sessionFind === true) };
+      MEANING.at = Date.now();
+      return MEANING.view;
+    });
   }
+  function meaningConsentText(provider) {
+    return 'Each search sends the words you type here, plus the title and first 150 characters of the first prompt from up to 508 recent sessions, to ' +
+      MEANING_NAME[provider] + '. Emails, links, home-folder paths and key-shaped text are removed first. Names and other details are not.' +
+      (provider === 'subq' ? ' SubQ keeps what it is sent.' : '');
+  }
+  function meaningConsentHtml(provider) {
+    // Lead decision (11/09): the choice is kept in this browser only, and the card says so.
+    return '<div class="list meaning-consent"><p class="empty"><strong>Find sessions by meaning with ' + esc(MEANING_NAME[provider]) + '?</strong>' + esc(meaningConsentText(provider)) +
+      ' ' + esc('Your choice applies to this browser only.') + '</p>' +
+      '<div class="row-actions"><button type="button" class="btn small primary" data-action="meaning-consent" data-provider="' + esc(provider) + '" data-choice="on">Turn on</button>' +
+      '<button type="button" class="btn small" data-action="meaning-consent" data-provider="' + esc(provider) + '" data-choice="never">Never</button></div></div>';
+  }
+  function meaningRows(q, d) {
+    var rows = (d && Array.isArray(d.rows)) ? d.rows : [];
+    return '<h2 class="group-title"><span>About \u201c' + esc(q) + '\u201d</span><span>' + rows.length + '</span></h2><div class="list">' + rows.map(function (r) {
+      var s = { provider: r.provider, session_id: r.session_id, display_label: r.display_label, custom_title: r.custom_title, first_prompt: r.first_prompt, project: r.project,
+        modified: r.modified, last_activity_at: r.last_activity_at, alive: r.alive, pinned: r.pinned, slug: r.slug };
+      return sessionRow(s, MEANING_STRENGTH[r.strength] || MEANING_STRENGTH.possible);
+    }).join('') + '</div>';
+  }
+  function meaningRun(q, provider, stage) {
+    return api('/api/agent-sessions/find', { method: 'POST', body: { query: q, consentedProvider: provider, stage: stage }, timeoutMs: 90000 }).then(function (d) {
+      if (d && d.available === false) {
+        if (d.reason === 'provider_changed') MEANING.view = null;
+        return emptyBox(MEANING_TITLE[d.reason] || 'Meaning search did not run', d.message || '');
+      }
+      var rows = (d && Array.isArray(d.rows)) ? d.rows : [];
+      // The first stage reads the newest 254 sessions; with nothing there, look once further back (Control's "Looking further back").
+      if (!rows.length && stage === 'first') return meaningRun(q, provider, 'full');
+      if (!rows.length) return emptyBox('Nothing close by meaning', 'Checked ' + (Number(d && d.asked) || 0) + ' sessions. Try other words, or search by words.');
+      return meaningRows(q, d);
+    });
+  }
+  function findByMeaning(q) {
+    return meaningSettings(false).then(function (m) {
+      if (!m.capable) return emptyBox('Meaning search is not on here', 'This COS server cannot find sessions by meaning. Search by words instead.');
+      if (!m.provider || !m.keyed) return emptyBox('Meaning search needs a decision model', 'Choose Jev or SubQ in Settings, then save its key in COS Control on your Mac: search Settings there for Jev key or SubQ key.');
+      var choice = meaningChoices()[m.provider];
+      if (choice === 'never') return emptyBox('Meaning search is off in this browser', 'You chose Never for ' + MEANING_NAME[m.provider] + '.') +
+        '<div class="row-actions"><button type="button" class="btn small" data-action="meaning-consent" data-provider="' + esc(m.provider) + '" data-choice="ask">Ask me again</button></div>';
+      if (choice !== 'on') return meaningConsentHtml(m.provider);
+      return meaningRun(q, m.provider, 'first');
+    }).catch(function (err) { return emptyBox('Meaning search did not run', (err && err.message) || ''); });
+  }
+  // ── end meaning search
 
   // The hooks banner (ActivityWindow.swift 2867-2905). Installing hooks writes to the Mac's Claude
   // settings, which stays a Mac action, so the web names where to do it.
@@ -2369,15 +3483,22 @@
   // keep their data-action names, which the shared listener handles.
   var sxPane = $('pane-sessions');
   if (sxPane) {
-    if ($('sessions-recency')) $('sessions-recency').value = SX.recency;
+    sxPaintSort();
     sxPane.addEventListener('click', function (e) {
       var t = e.target.closest('[data-sx]');
       if (!t || !sxPane.contains(t)) return;
       var act = t.getAttribute('data-sx'), rd = state.reading;
-      if (act === 'view') return setSessionsView(t.getAttribute('data-view'));
+      if (act === 'view') { sxViewMenu(false); return setSessionsView(t.getAttribute('data-view')); }
+      if (act === 'view-menu') return sxViewMenu();
+      if (act === 'goto-question') { sxToNewest(); sxGoQuestionPaint(); var gq = $('session-questions'), first = gq && gq.querySelector('button, input, [tabindex]'); if (first && first.focus) first.focus({ preventScroll: true }); return; }
+      if (act === 'fold') { var g = t.getAttribute('data-g'), isF = g.indexOf('f:') === 0; SXL.open[g] = isF ? SXL.open[g] === false : !SXL.open[g]; return renderSessionGroups(); }
+      if (/^(row-menu|org-|folder-|new-folder|rename-clear|inline-cancel)/.test(act)) { e.stopPropagation(); return sxOrgClick(act, t); }
+      if (act === 'older-more') return sxLoadOlder(false, true);
       if (act === 'clock') { SX.clock = t.getAttribute('data-clock'); sxSave(); return renderSessionGroups(); }
       if (act === 'refresh') {
+        sxViewMenu(false);
         if (SX.view !== 'sessions') return renderUsageView(true);
+        sxLoadOlder(true);
         SX.hooksAt = 0;
         loadSessions(true);
         if (sxQueryActive()) searchSessions();
@@ -2390,6 +3511,7 @@
       if (act === 'retry' && rd) { rd.refusal = null; renderVerdict(rd); return sendSessionTurn(!!rd.retryFork); }
       if (act === 'caution-send' && rd) { rd.cautionAck = true; rd.cautionAsk = false; renderVerdict(rd); return sendSessionTurn(false); }
       if (act === 'caution-cancel' && rd) { rd.cautionAsk = false; renderVerdict(rd); return; }
+      if (act === 'turnend' && rd) return sendTurnEndChoice(rd, Number(t.getAttribute('data-i')));
       if (act === 'usage-clear') { SX.uTool = 'All tools'; SX.uModel = 'All models'; SX.uToolBefore = null; uSliceChanged(); return paintUsage(); }
       if (act === 'usage-range') return uOpenRange(t, true);
     });
@@ -2404,9 +3526,23 @@
       renderSessionGroups();
       SX.searchTimer = setTimeout(searchSessions, 350);
     });
+    // 7.0.23 step 2b-2: New folder and the renames are inline forms in the list.
+    sxPane.addEventListener('submit', function (e) {
+      var f = e.target;
+      if (!f || !f.matches || !f.matches('form.sx-inline')) return;
+      e.preventDefault();
+      sxOrgSubmit(f);
+    });
     sxPane.addEventListener('change', function (e) {
       var id = e.target.id;
-      if (id === 'sessions-recency') { SX.recency = e.target.value; sxSave(); return renderSessionGroups(); }
+      // 7.0.23 step 2b: one sort menu. Updated or Opened orders the groups (the rows move together: the list redraws
+      // at once, not on rest, because the person chose it); while searching it is Best match or Updated.
+      if (id === 'sessions-sort') {
+        var v = e.target.value;
+        if (sxQueryActive()) SX.recency = v === 'match' ? 'match' : 'newest';
+        else { SX.clock = v === 'opened' ? 'opened' : 'updated'; SXL.place = null; }
+        sxSave(); return renderSessionGroups();
+      }
       // Custom dates opens the date sheet; the menu goes back to the range in force if it is cancelled.
       if (id === 'usage-period') { if (e.target.value === U_CUSTOM) return uOpenRange(e.target, true); SX.uPeriod = e.target.value; uPeriodChanged(); return paintUsage(); }
       if (id === 'usage-tool') { SX.uTool = e.target.value; SX.uModel = 'All models'; SX.uToolBefore = null; uSliceChanged(); return paintUsage(); }
@@ -2425,6 +3561,12 @@
   // window) only means the choice lasts this visit. Below a pane's own breakpoint the divider is hidden by CSS and the
   // kit does nothing (o.media), so a phone's layout never changes.
   var SX_SPLIT_KEY = 'cos_web_sessions_split', SX_LIST_MIN = 240, SX_READER_MIN = 380, SX_HANDLE_W = 18, SX_KEY_STEP = 16, SX_DOUBLE_MS = 350;
+  // 11/10 (lead 20:39): Miles squeezes the reader on his Duo's Home Screen web app and the page breaks; WebKit at scale 1
+  // does not (cw = scw, reader floor 380). One layout report when a drag ends, so his phone says what the page did:
+  // the split, list and reader widths, the share, clientWidth and scrollWidth, visualViewport.pageTop, pageLeft and
+  // offsetLeft, scrollX, and the top, left and right of the rail, the list and the other column (layoutCrumb adds the
+  // scale and offsetTop itself). Numbers only, at most SPLIT_DRAG_MAX a page load.
+  var SPLIT_DRAG = { n: 0 }, SPLIT_DRAG_MAX = 6;
   // o: key (storage), prefix (class names: <prefix>-sized, -full and -dragging), cssVar (the share, default
   // --<prefix>-list-share), label (what the divider sizes, for screen readers), sized (the column the share sizes,
   // default the list), side ('end' when that column is on the right: a side panel grows as the line moves left),
@@ -2460,7 +3602,7 @@
       split.classList.toggle(PRE + '-sized', share != null);
       if (share != null) split.style.setProperty(VAR, share.toFixed(2) + '%'); else split.style.removeProperty(VAR);
       split.classList.toggle(PRE + '-full', full);
-      document.querySelectorAll(FULL_SEL).forEach(function (b) { b.setAttribute('aria-pressed', String(full)); b.textContent = full ? 'Show list' : 'Full width'; });
+      document.querySelectorAll(FULL_SEL).forEach(function (b) { b.setAttribute('aria-pressed', String(full)); b.textContent = full ? 'Show list' : (o.hideText || 'Full width'); });
       aria();
     }
     // px: the sized column's width asked for; kept inside both columns' minimums for the split's width now.
@@ -2473,6 +3615,26 @@
       if (persist) save();
     }
     function reset() { share = null; paint(); save(); }
+    function dragReport() {
+      if (SPLIT_DRAG.n >= SPLIT_DRAG_MAX || typeof layoutCrumb !== 'function') return;
+      try {
+        var de = document.documentElement, vv = window.visualViewport, t = total(), lw = listWidth(),
+          hw = handle.getBoundingClientRect ? handle.getBoundingClientRect().width : HANDLE_W,
+          rail = document.querySelector('.rail'), list = split.querySelector(LIST_SEL), other = null;
+        // The other column: the split's child that is neither the sized column nor the divider.
+        for (var c = split.firstElementChild; c; c = c.nextElementSibling) if (c !== list && c !== handle) other = c;
+        var vn = function (k) { return vv && typeof vv[k] === 'number' ? vv[k] : -1; };
+        var rr = rail ? rail.getBoundingClientRect() : null, lr = list ? list.getBoundingClientRect() : null, or = other ? other.getBoundingClientRect() : null;
+        // Up and down (pt, the tops) and sideways (pl, ol, sx, the left and right edges): a rail or list that left the
+        // screen to the side shows here too (Q1 20:44).
+        if (layoutCrumb('split-drag', { key: String(KEY).slice(0, 24), t: t, sz: lw, rw: t - lw - hw, share: share == null ? -1 : share,
+          cw: de.clientWidth, scw: de.scrollWidth, pt: vn('pageTop'), pl: vn('pageLeft'), ol: vn('offsetLeft'),
+          sx: typeof window.scrollX === 'number' ? window.scrollX : -1,
+          railTop: rr ? rr.top : -1, railL: rr ? rr.left : -1, railR: rr ? rr.right : -1,
+          listTop: lr ? lr.top : -1, listL: lr ? lr.left : -1, listR: lr ? lr.right : -1,
+          rdL: or ? or.left : -1, rdR: or ? or.right : -1 })) SPLIT_DRAG.n++;
+      } catch (_e) { /* a report never stops a drag */ }
+    }
     handle.addEventListener('pointerdown', function (e) {
       if (e.pointerType === 'mouse' && e.button !== 0) return;
       if (narrow()) return;
@@ -2493,7 +3655,7 @@
         handle.removeEventListener('pointermove', move); handle.removeEventListener('pointerup', end); handle.removeEventListener('pointercancel', end);
         split.classList.remove(PRE + '-dragging');
         // The lift's own position counts: a browser may fold the last moves into it.
-        if (moved) { if (ev.type === 'pointerup') setWidth(start + dx(ev), false); save(); lastTap = 0; return; }
+        if (moved) { if (ev.type === 'pointerup') setWidth(start + dx(ev), false); save(); lastTap = 0; dragReport(); return; }
         if (ev.type !== 'pointerup') return;
         var now = Date.now();
         if (now - lastTap < SX_DOUBLE_MS) { lastTap = 0; reset(); } else lastTap = now;
@@ -2519,7 +3681,8 @@
     };
   }
   // Sessions: the first pane with the divider, unchanged (its markup is in index.html, its CSS in panes/sessions.css).
-  var SX_SPLIT_OPTS = { key: SX_SPLIT_KEY, prefix: 'sx', label: 'Session list', fullSel: '[data-sx="full"]', media: '(min-width: 760px)',
+  // 7.0.23: in Sessions the button says what it does, Hide list (DESIGN_PLAN v2); Memories and Messages keep Full width.
+  var SX_SPLIT_OPTS = { key: SX_SPLIT_KEY, prefix: 'sx', label: 'Session list', fullSel: '[data-sx="full"]', media: '(min-width: 760px)', hideText: 'Hide list',
     listMin: SX_LIST_MIN, readerMin: SX_READER_MIN, handleW: SX_HANDLE_W };
   function sxSplitKit(split, handle, storage) { return splitKit(split, handle, storage, SX_SPLIT_OPTS); }
   // The other panes (W.splitKit): the divider's markup, a Full width button, and mount, which binds the kit to a split
@@ -2702,7 +3865,7 @@
   // Wide layouts: give the reader the whole width, or bring the list back (sxSplitKit). Hidden under 760 px by CSS.
   function sxFullButton() {
     var full = !!(SX_SPLIT && SX_SPLIT.state().full);
-    return '<button type="button" class="cx-btn quiet sx-full-btn" data-sx="full" aria-controls="sessions-list-col" aria-pressed="' + full + '">' + (full ? 'Show list' : 'Full width') + '</button>';
+    return '<button type="button" class="cx-btn quiet sx-full-btn" data-sx="full" aria-controls="sessions-list-col" aria-pressed="' + full + '">' + (full ? 'Show list' : 'Hide list') + '</button>';
   }
   function openSession(provider, id) {
     var reader = $('session-reader');
@@ -2729,12 +3892,24 @@
       reader.innerHTML =
         '<div class="sx-reader-head"><div class="sx-head-line">' + sxBadge(provider) + '<h2 class="sx-reader-title">' + esc(title) + '</h2>' + sxFullButton() + '</div>' +
           '<p class="sx-subtitle">' + esc(sxSubtitle(d, provider, turns, r.more)) + '</p></div>' +
+        // 7.0.23 frame: the conversation scrolls by itself between the header and the dock.
+        '<div class="sx-body" id="session-body">' +
+          (trunc ? '<p class="sx-note">' + esc(trunc) + '</p>' : '') +
+          '<div class="turns sx-turns" id="session-turns">' + renderTurns(turns, d) + '</div>' +
+          '<div class="sx-foot"><button type="button" class="cx-btn quiet" data-sx="copy-session" title="A kickstart brief for another agent, built from the turns COS serves. Not a Claude Code resume: it does not reopen this session.">Copy session</button>' +
+            '<span class="sx-foot-note">Kickstart brief for another agent. Not a Claude Code resume.</span></div>' +
+          '<p class="sx-copy-note hidden" id="session-copy-note" role="status"></p>' +
+          // DESIGN.md step 4 #3: this session's question cards (held and answerable, or at the Mac with its words), the
+          // same component Today's sheet mounts. 7.0.23: at the end of the conversation, the newest thing in it, right
+          // above the reply box: a card is too tall for the dock on the Duo (it hid the choices or the reply box), and
+          // here it opens in view with the reader and scrolls with it.
+          '<div class="sx-questions" id="session-questions"></div>' +
+        '</div>' +
+        // The dock, fixed at the bottom of the reader: what it is doing now (with Stop), the Mac's question, then the
+        // verdict, the reply box, its status and the queue, all as before.
+        '<div class="sx-dock" id="session-dock">' +
         '<div class="sx-activity" id="session-live" aria-live="polite"></div>' +
-        (trunc ? '<p class="sx-note">' + esc(trunc) + '</p>' : '') +
-        '<div class="turns sx-turns" id="session-turns">' + renderTurns(turns, d) + '</div>' +
-        '<div class="sx-foot"><button type="button" class="cx-btn quiet" data-sx="copy-session" title="A kickstart brief for another agent, built from the turns COS serves. Not a Claude Code resume: it does not reopen this session.">Copy session</button>' +
-          '<span class="sx-foot-note">Kickstart brief for another agent. Not a Claude Code resume.</span></div>' +
-        '<p class="sx-copy-note hidden" id="session-copy-note" role="status"></p>' +
+        '<div class="sx-mac-q" id="session-mac-q" role="status" hidden></div>' +
         '<div class="sx-chat">' +
           '<div id="session-verdict"></div>' +
           '<form class="composer att-composer" id="session-form" data-provider="' + esc(provider) + '" data-id="' + esc(id) + '">' +
@@ -2745,13 +3920,20 @@
           '</form><div class="status-line" id="session-status"></div>' +
           '<p class="sx-caution hidden" id="session-caution"></p>' +
           '<div id="session-queue"></div>' +
-        '</div>';
+        '</div></div>' +
+        // Q1 (23:40): the question cards end the conversation; scrolled up away from them, a button over the dock's top
+        // edge says one waits. It sits in the reader, not the dock, because the dock scrolls by itself as a last resort.
+        '<p class="sx-goq" id="session-goq" hidden><span>A question is waiting at the end.</span><button type="button" class="cx-btn quiet" data-sx="goto-question">Go to the question</button></p>';
       readerImagesMount($('session-turns'), r);
       sxNoteList(r, d);
       setLive({});
+      if (typeof readerMacPaint === 'function') readerMacPaint(r, sxState(d) === 'waiting');
+      var qk = window.COSWeb.sessionQuestions, qhost = $('session-questions');
+      if (qk && qk.mount && qhost) r.qMount = qk.mount(qhost, id, function () { if (state.reading === r && typeof readerMacPaint === 'function') readerMacPaint(r, r.waitingNow); if (typeof sxGoQuestionPaint === 'function') sxGoQuestionPaint(); });
       paintReaderFiles();
+      paintWebKeyOffer(r);
       // The Mac's answer about files may not be in yet: ask once, then draw the clip.
-      var kitR = readerKit(); if (kitR && !kitR.turnFiles()) kitR.ensureCaps().then(paintReaderFiles, function () {});
+      var kitR = readerKit(); if (kitR && !kitR.turnFiles()) kitR.ensureCaps().then(function () { paintReaderFiles(); paintWebKeyOffer(r); }, function () {});
       renderHeld(state.reading);
       loadQueue(provider, id);
       sxProbeAttach(r);
@@ -2759,7 +3941,8 @@
         sessionStatus('Waiting for the current reply. ' + (state.reading.held.length > 1 ? state.reading.held.length + ' messages send' : 'Yours sends') + ' as soon as it finishes. ', null, '<button type="button" class="link-btn" data-action="drop-after">Don’t send</button>');
         startHeldTimer(state.reading);
       }
-      if (turns.length) requestAnimationFrame(function () { window.scrollTo(0, document.documentElement.scrollHeight); });
+      if (turns.length) requestAnimationFrame(function () { if (typeof sxToNewest === 'function') sxToNewest(); else window.scrollTo(0, document.documentElement.scrollHeight); });
+      requestAnimationFrame(function () { if (typeof sxFrameCrumb === 'function') sxFrameCrumb('open'); });
       watchSession(provider, id);
     }).catch(function (err) {
       if (state.reading !== r) return;
@@ -3023,6 +4206,7 @@
         var waiting = !working && (e.state === 'waiting' || e.state === 'needs_input' || e.agent_state === 'waiting');
         var el = $('session-state');
         if (el) el.textContent = working ? 'Working now' : waiting ? 'Waiting for you' : 'Open';
+        if (typeof readerMacPaint === 'function') readerMacPaint(r, waiting);
         if (wasWorking && !working) { refreshTurns(provider, id); replyEnded(r); }
         wasWorking = working;
         // Gone to waiting: its question may be parked for this page now (6.99.27).
@@ -3069,6 +4253,22 @@
     if (p === 2) return '3rd in line';
     return (p + 1) + 'th in line';
   }
+  // Why a waiting follow-up is held (server 7.0.25, S1: waiting_reason on the row, a short code the drain decided).
+  // Plain words for the codes we know; any other well-formed code reads as a plain wait; a malformed value is not shown.
+  var SX_HOLD_WORDS = {
+    files_wait_for_turn_end: 'It has files, so it waits for the current turn to end.',
+    turn_open: 'Waiting for the current turn to end.', turn_not_ended: 'Waiting for the current turn to end.',
+    native_thread_working: 'Waiting for the current turn to end.',
+    live_desktop_process: 'Waiting while another app has this session open.',
+    native_target_busy: 'Waiting: another COS turn holds this session.',
+    native_target_fenced: 'Waiting for this session to be released.',
+    cancel_hold: 'Held for 2 minutes after a stop.'
+  };
+  function sxQueueWhy(t) {
+    var c = t && t.waiting_reason;
+    if (typeof c !== 'string' || !/^[a-z0-9_]{1,48}$/.test(c)) return '';
+    return Object.prototype.hasOwnProperty.call(SX_HOLD_WORDS, c) ? SX_HOLD_WORDS[c] : 'Waiting for this session to be free.';
+  }
   function loadQueue(provider, id) {
     apiAnswer(sessionPath(provider, id, '/queued-turns')).then(function (q) {
       var r = state.reading;
@@ -3084,7 +4284,9 @@
       box.innerHTML = '<div class="sx-queue">' + (waiting.length ? '<p class="sx-queue-head">' + (waiting.length === 1 ? '1 follow-up queued. It sends when this session is available.' : waiting.length + ' follow-ups queued. They send in order when this session is available.') + '</p>' : '') +
         waiting.map(function (t) {
           var mine = t.owner !== 'codex' && parkedByMe(r, t.clientTurnId);
-          return '<div class="sx-queue-row"><span class="sx-queue-state">' + esc(sxQueueLine(t)) + '</span><span class="sx-queue-text">' + esc(t.preview || t.prompt || 'Message') + '</span>' +
+          var why = sxQueueWhy(t);
+          return '<div class="sx-queue-row"><span class="sx-queue-state">' + esc(sxQueueLine(t)) + '</span><span class="sx-queue-text">' + esc(t.preview || t.prompt || 'Message') +
+            (why ? '<span class="sx-queue-reason">' + esc(why) + '</span>' : '') + '</span>' +
             (mine ? '<button type="button" class="cx-btn quiet" data-action="unqueue" data-turn-key="' + esc(t.clientTurnId) + '" title="Cancel this queued message. It will not be sent.">Cancel</button>' : '') + '</div>';
         }).join('') +
         notSent.map(function (t) {
@@ -3200,7 +4402,8 @@
   // The box is cleared only of the very words that were sent; anything typed since stays.
   function clearBoxOf(text) {
     var input = $('session-input');
-    if (input && input.value.trim() === String(text).trim()) { input.value = ''; autoGrow(input); }
+    // 7.0.18: an answer to a turn-end ask was sent with the attribution in front; the box holds his words without it.
+    if (input && (input.value.trim() === String(text).trim() || input.value.trim() === turnEndBare(text))) { input.value = ''; autoGrow(input); }
     if (state.reading && state.reading.draft && state.reading.draft.text === text) state.reading.draft = null;
   }
   // Words go back in the box only if the box is empty; otherwise the status line keeps them. `files` says what became
@@ -3220,7 +4423,7 @@
     if (heldKey) el.setAttribute('data-held-key', heldKey);
     el.innerHTML = '<span class="who">You, ' + esc(note) + '</span>' + md(text);
     box.appendChild(el);
-    requestAnimationFrame(function () { window.scrollTo(0, document.documentElement.scrollHeight); });
+    requestAnimationFrame(function () { if (typeof sxToNewest === 'function') sxToNewest(); else window.scrollTo(0, document.documentElement.scrollHeight); });
   }
   function heldBubble(key) { return document.querySelector('#session-turns .turn.pending[data-held-key="' + key.replace(/[^A-Za-z0-9_-]/g, '') + '"]'); }
   function renderHeld(r) {
@@ -3347,6 +4550,9 @@
     // during the first attach could park the same text in the queue while the first lands.
     if (r.sending) return;
     if (r.refusal || r.cautionAsk) { r.refusal = null; r.cautionAsk = false; renderVerdict(r); }
+    // 7.0.18: while a turn-end ask is open, the box's words are his own answer ('Other' in the contract): sent with the
+    // same attribution as a choice. A fork goes to a copy and is not an answer, so it is sent as written.
+    if (!fork && r.turnEnd && turnEndOf(readerRowOf(r))) text = turnEndPrompt(text);
     r.sending = true;
     var btns = form.querySelectorAll('button'); btns.forEach(function (b) { b.disabled = true; });
     var done = function () { r.sending = false; btns.forEach(function (b) { b.disabled = false; }); paintReaderFiles(); };
@@ -3449,6 +4655,205 @@
     });
   }
 
+  // ── BEGIN web-key handoff (6.99.31, Phase 3, review W2) ──
+  // With the Mac's webKeySigner capability (only with COS_WEB_KEY_AUTHORITY on) and an enrolled phone key, the session
+  // composer offers "Approve on this phone". That is a TOP-LEVEL navigation to the signer page on port 3144 carrying a
+  // one-use handoff id in the fragment. The words stay on the Mac until the signer claims them; they are never in a URL.
+  // Without the capability nothing here runs: no request, no button, the composer exactly as before.
+  var WEB_KEY = { status: null, statusAt: 0, loading: null, generation: 0, views: [], refreshing: null, navigation: null };
+  var WEB_KEY_COPY = {
+    no_phone_key: 'No phone has a key yet. Set one up on the approval page first.',
+    attachments_not_signable: 'Files cannot be approved on the phone yet. Remove them, or use Send.',
+    words_too_long: 'That message is too long to approve on the phone. Shorten it, or use Send.',
+    handoff_cap_reached: 'Too many approvals are waiting. Finish one, or wait two minutes.',
+    origin_unavailable: 'Your Mac does not know its Tailscale name yet, so the approval page cannot open.',
+    web_key_authority_off: 'Phone approval is turned off on the Mac.'
+  };
+  function webKeyCapable() { var k = readerKit(); return !!(k && typeof k.webKeySigner === 'function' && k.webKeySigner() === 1); }
+  function webKeyStatus() {
+    var age = Date.now() - WEB_KEY.statusAt;
+    if (WEB_KEY.status && age >= 0 && age < 30000) return Promise.resolve(WEB_KEY.status);
+    if (!WEB_KEY.loading) {
+      var generation = WEB_KEY.generation;
+      WEB_KEY.loading = apiAnswer('/api/web-key/status', { timeoutMs: 15000 }).then(function (a) {
+        if (generation !== WEB_KEY.generation) return null;
+        WEB_KEY.loading = null;
+        WEB_KEY.status = a.status === 200 && a.body && a.body.ok === true && Number.isSafeInteger(a.body.activeKeys) && a.body.activeKeys >= 0 ? { activeKeys: a.body.activeKeys } : null;
+        WEB_KEY.statusAt = Date.now();
+        return WEB_KEY.status;
+      }, function () { if (generation === WEB_KEY.generation) { WEB_KEY.loading = null; WEB_KEY.status = null; } return null; });
+    }
+    return WEB_KEY.loading;
+  }
+  function webKeySetupUrl() {
+    var host = location.hostname;
+    // The passkey belongs to this Mac's full MagicDNS host, never an IP, local alias or public suffix.
+    if (typeof host !== 'string' || host.length > 253 || !/^(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.){2,}ts\.net$/.test(host)) return null;
+    return 'https://' + host + ':3144/';
+  }
+  function phoneApprovalView(r, opts) {
+    opts = opts || {};
+    var prefix = opts.prefix || 'session';
+    return { prefix: prefix, form: $(prefix + '-form'), send: $(prefix + '-send'), input: $(prefix + '-input'),
+      live: opts.live || function () { return state.reading === r; },
+      status: opts.status || sessionStatus, files: opts.files || function () { return readerFilesState(readerFilesOn() ? readerBox(r) : null); } };
+  }
+  function phoneApprovalViewLive(view) {
+    return view.live() && view.form && view.send && view.form === $(view.prefix + '-form') && view.send === $(view.prefix + '-send');
+  }
+  function clearPhoneOffer(r, view) {
+    var offer = view.form.querySelector('[data-phone-offer]'), packets = view.form.querySelector('[data-phone-packets]');
+    if (offer && offer.parentNode) offer.parentNode.removeChild(offer);
+    if (packets && packets.parentNode) packets.parentNode.removeChild(packets);
+    r.phonePackets = {}; r.phonePacketSha256 = ''; r.phoneDraft = null;
+  }
+  function refreshWebKeyOffers() {
+    if (!webKeyCapable() || WEB_KEY.refreshing) return;
+    WEB_KEY.status = null; WEB_KEY.statusAt = 0; WEB_KEY.loading = null; WEB_KEY.generation += 1;
+    WEB_KEY.views = WEB_KEY.views.filter(function (entry) { return phoneApprovalViewLive(entry.view); });
+    if (!WEB_KEY.views.length) return;
+    var views = WEB_KEY.views.slice();
+    views.forEach(function (entry) { clearPhoneOffer(entry.r, entry.view); });
+    var fresh = webKeyStatus(); WEB_KEY.refreshing = fresh;
+    fresh.then(function () { if (WEB_KEY.refreshing === fresh) WEB_KEY.refreshing = null; });
+    views.forEach(function (entry) { paintWebKeyOffer(entry.r, entry.opts); });
+  }
+  // Safari can restore this exact DOM after enrollment or revocation on the separate signer origin.
+  // Refetch once per persisted return; closed/replaced readers are pruned and no timer is installed.
+  // (Guarded: it runs at load, and a host without window events, the web-control vm harnesses, must still load.)
+  if (window.addEventListener) window.addEventListener('pageshow', function (e) {
+    if (!e || !e.persisted) return;
+    var nav = WEB_KEY.navigation; WEB_KEY.navigation = null;
+    if (nav && nav.token.completed && nav.r.phoneNavigation === nav.token) {
+      if (nav.r.sending === nav.token) nav.r.sending = false;
+      nav.r.phoneNavigation = null;
+    }
+    refreshWebKeyOffers();
+  });
+  function phonePacketDetails(p, sha) {
+    return 'Requested ' + p.action + ': ' + p.artifact + ' ' + p.version + '\nChannel: ' + p.channel + '\nDigest: ' + p.digest +
+      '\nReceiver: ' + p.provider + ' / ' + p.sessionId + '\nExpires: ' + new Date(p.exp).toISOString() + '\nPacket: ' + sha +
+      '\nThis request approves nothing until you review it and confirm on the phone.';
+  }
+  function paintWebKeyOffer(r, opts) {
+    if (!webKeyCapable()) return;
+    var view = phoneApprovalView(r, opts);
+    if (!phoneApprovalViewLive(view)) return;
+    WEB_KEY.views = WEB_KEY.views.filter(function (entry) { return phoneApprovalViewLive(entry.view) && entry.view.form !== view.form; });
+    WEB_KEY.views.push({ r: r, opts: opts, view: view });
+    var generation = WEB_KEY.generation;
+    webKeyStatus().then(function (st) {
+      if (generation !== WEB_KEY.generation || !phoneApprovalViewLive(view)) return;
+      if (!st) { clearPhoneOffer(r, view); return; }
+      var offer = view.form.querySelector('[data-phone-offer]');
+      if (offer && !!view.form.querySelector('[data-phone-setup]') === (st.activeKeys === 0)) return;
+      if (offer || st.activeKeys === 0) clearPhoneOffer(r, view);
+      if (st.activeKeys === 0) {
+        var setupUrl = webKeySetupUrl(); if (!setupUrl) return;
+        var setup = document.createElement('a');
+        setup.className = 'btn small'; setup.setAttribute('data-phone-offer', '1');
+        setup.setAttribute('data-phone-setup', '1'); setup.setAttribute('href', setupUrl); setup.setAttribute('target', '_top');
+        setup.textContent = 'Set up phone approvals';
+        view.send.parentNode.insertBefore(setup, view.send);
+        return;
+      }
+      var b = document.createElement('button');
+      b.type = 'button'; b.className = 'btn small'; b.setAttribute('data-phone-offer', '1');
+      b.setAttribute(view.prefix === 'ta' ? 'data-ta' : 'data-action', view.prefix === 'ta' ? 'approve-phone' : 'approve-on-phone');
+      b.title = 'Review an exact request on the approval page, then confirm with your phone passkey';
+      b.textContent = 'Approve on this phone';
+      view.send.parentNode.insertBefore(b, view.send);
+      return apiAnswer('/api/web-key/packets?provider=' + encodeURIComponent(r.provider) + '&sessionId=' + encodeURIComponent(r.id)).then(function (a) {
+        if (generation !== WEB_KEY.generation || !phoneApprovalViewLive(view) || view.form.querySelector('[data-phone-offer]') !== b) return;
+        var rows = a.status === 200 && a.body && a.body.ok === true && Array.isArray(a.body.packets) ? a.body.packets : [];
+        rows = rows.filter(function (row) { var p = row && row.packet; return p && p.provider === r.provider && p.sessionId === r.id &&
+          (p.action === 'install' || p.action === 'publish') && Number.isSafeInteger(p.exp) && p.exp >= Date.now() && /^[0-9a-f]{64}$/.test(row.packetSha256 || ''); });
+        r.phonePackets = {}; rows.forEach(function (row) { r.phonePackets[row.packetSha256] = row.packet; });
+        if (!rows.length) return;
+        var box = document.createElement('div'), label = document.createElement('label'), select = document.createElement('select'), disclosure = document.createElement('details'), summary = document.createElement('summary'), detail = document.createElement('pre');
+        box.className = 'phone-approval-packet'; box.setAttribute('data-phone-packets', '1'); select.id = view.prefix + '-phone-packet'; detail.id = view.prefix + '-phone-details';
+        label.textContent = 'What to approve'; label.setAttribute('for', select.id);
+        var message = document.createElement('option'); message.value = ''; message.textContent = 'Message only — no release approval'; select.appendChild(message);
+        rows.forEach(function (row) { var option = document.createElement('option'), p = row.packet; option.value = row.packetSha256;
+          option.textContent = p.action + ' ' + p.artifact + ' ' + p.version + ' / ' + p.channel; select.appendChild(option); });
+        select.value = r.phonePacketSha256 || '';
+        var update = function () { r.phonePacketSha256 = select.value; var p = r.phonePackets[select.value];
+          detail.textContent = p ? phonePacketDetails(p, select.value) : 'Message only. This authorizes no install, publish or push.';
+          if (p && view.input && !view.input.value.trim()) view.input.value = 'Approve ' + p.action + ' ' + p.artifact + ' ' + p.version + ' on ' + p.channel + '.';
+        };
+        select.addEventListener('change', update); update();
+        summary.textContent = 'Review release request'; disclosure.appendChild(summary); disclosure.appendChild(detail);
+        box.appendChild(label); box.appendChild(select); box.appendChild(disclosure); view.form.insertBefore(box, view.form.firstChild);
+      }, function () { /* No packet is selected implicitly when this read fails. */ });
+    });
+  }
+  // Only the signer on this same host, port 3144, path /, with nothing but the handoff id in the fragment.
+  function webKeySignerUrlOk(u) {
+    try {
+      var x = new URL(u);
+      return x.protocol === 'https:' && x.hostname === location.hostname && x.port === '3144' && x.pathname === '/' && !x.search && /^#h=[A-Za-z0-9_-]{16,64}$/.test(x.hash);
+    } catch (_e) { return false; }
+  }
+  function approveOnPhone(opts) {
+    opts = opts || {};
+    var r = opts.r || state.reading; if (!r || r.sending) return Promise.resolve('busy');
+    var view = phoneApprovalView(r, opts), say = view.status;
+    if (!view.live()) return Promise.resolve('stale');
+    var input = view.input, text = input ? input.value.trim() : '';
+    if (!text) { say('Write a message first.', 'error'); return Promise.resolve('empty'); }
+    if (view.files() !== 'none') { say(WEB_KEY_COPY.attachments_not_signable, 'error'); return Promise.resolve('files'); }
+    var provider = r.provider, id = r.id, packetSha = r.phonePacketSha256 || '';
+    var packet = packetSha && r.phonePackets && r.phonePackets[packetSha];
+    if (packetSha && (!packet || packet.exp < Date.now() || packet.provider !== provider || packet.sessionId !== id)) { say('That release request expired or changed. Reopen this session to load its current request.', 'error'); return Promise.resolve('packet'); }
+    var draft = r.phoneDraft;
+    if (!draft || draft.text !== text || draft.packetSha256 !== packetSha) draft = r.phoneDraft = { text: text, key: newTurnKey(), packetSha256: packetSha };
+    var bound = bindingFor(provider, id);
+    // Other senders assign boolean true. This unique truthy owner lets late callbacks and a BFCache return
+    // release only this phone operation, never a newer ordinary send or another phone operation.
+    var operation = { completed: false };
+    r.phoneNavigation = operation; r.sending = operation;
+    var ownsSending = function () { return r.sending === operation && r.phoneNavigation === operation; };
+    var releaseSending = function () { if (ownsSending()) { r.sending = false; r.phoneNavigation = null; } };
+    say('Opening the approval page.');
+    var attach = bound ? Promise.resolve(bound) : apiAnswer(sessionPath(provider, id, '/attach'), { method: 'POST', body: { cosSessionId: cosSessionId() }, timeoutMs: 20000 }).then(function (a) {
+      if (a.status >= 200 && a.status < 300 && a.body.attached === true && a.body.bindingId && typeof a.body.epoch === 'number') {
+        var b = { bindingId: a.body.bindingId, epoch: a.body.epoch, at: Date.now() };
+        rememberBinding(provider, id, b);
+        return b;
+      }
+      return null;
+    });
+    return attach.then(function (b) {
+      if (!ownsSending() || !phoneApprovalViewLive(view)) return 'stale';
+      if (!b) { say('COS cannot write to this session right now.', 'error'); return 'refused'; }
+      var request = { bindingId: b.bindingId, epoch: b.epoch, targetKey: targetKey(provider, id), clientTurnId: draft.key, prompt: draft.text };
+      if (packetSha) request.packetSha256 = packetSha;
+      return apiAnswer('/api/web-key/handoff', { method: 'POST', timeoutMs: 15000, body: request }).then(function (h) {
+        if (!ownsSending() || !phoneApprovalViewLive(view)) return 'stale';
+        var body = h.body || {};
+        if (h.status === 201 && body.ok === true && webKeySignerUrlOk(body.signerUrl)) {
+          say('Opening the approval page.');
+          location.assign(body.signerUrl);
+          operation.completed = true;
+          WEB_KEY.navigation = { r: r, token: operation };
+          return 'opened';
+        }
+        if (h.status === 201) { say('Open Control from your Mac’s Tailscale name to approve on this phone.', 'error'); return 'refused'; }
+        if (/^(binding_changed|unknown_binding)$/.test(body.error || '') && !opts.reattached) {
+          rememberBinding(provider, id, null);
+          releaseSending();
+          return approveOnPhone(Object.assign({}, opts, { r: r, reattached: true }));
+        }
+        say(WEB_KEY_COPY[body.error] || 'The Mac did not open an approval for that message.', 'error');
+        return 'refused';
+      });
+    }).then(function (how) { if (how !== 'opened') releaseSending(); return how; }, function () {
+      if (ownsSending()) { releaseSending(); say('Could not reach your Mac.', 'error'); }
+      return 'failed';
+    });
+  }
+  // ── END web-key handoff ──
+
   var HELD_MAX_MS = 5 * 60000, HELD_RETRY_MS = 8000;
   function holdUntilReplyEnds(r, draft) {
     if (!r.held.some(function (h) { return h.key === draft.key; })) {
@@ -3871,15 +5276,23 @@
       box.insertAdjacentHTML('beforeend', fresh.map(sxTurnHtml).join(''));
       return;
     }
+    // In the frame the conversation scrolls inside #session-body: the card kept is the first one showing in it, and the
+    // body (not the window) moves back by what the redraw moved it.
+    var body = document.documentElement.classList.contains('sx-frame') ? $('session-body') : null;
+    var edge = body && body.getBoundingClientRect ? body.getBoundingClientRect().top : 0;
     var anchor = null, top = 0, cards = box.querySelectorAll('.turn[data-sig]');
     for (var i = 0; i < cards.length; i++) {
       var rect = cards[i].getBoundingClientRect();
-      if (rect.bottom > 0) { anchor = cards[i].getAttribute('data-sig'); top = rect.top; break; }
+      if (rect.bottom > edge) { anchor = cards[i].getAttribute('data-sig'); top = rect.top; break; }
     }
     box.innerHTML = renderTurns(next, d);
+    // Still at the newest turn since it opened (sxToNewest's pin): stay there, rather than keep a card in place.
+    if (body && typeof SX_PIN === 'object' && SX_PIN.body === body) { body.scrollTop = body.scrollHeight; SX_PIN.put = body.scrollTop; return; }
     if (!anchor) return;
     var same = [].filter.call(box.querySelectorAll('.turn[data-sig]'), function (el) { return el.getAttribute('data-sig') === anchor; })[0];
-    if (same) window.scrollBy(0, same.getBoundingClientRect().top - top);
+    if (!same) return;
+    if (body) body.scrollTop += same.getBoundingClientRect().top - top;
+    else window.scrollBy(0, same.getBoundingClientRect().top - top);
   }
 
   // ── Ask COS (the Ask sheet's first row) ─────────────────
@@ -5723,11 +7136,12 @@
 
   // ── events (one delegated listener) ─────────────────────
   document.addEventListener('click', function (e) {
-    var t = e.target.closest('[data-today-next],[data-today-needs],[data-today],[data-goto],[data-pane],[data-session],[data-meeting],[data-speakers],[data-action],[data-open-ask],[data-theme-choice],#topbar-back,#section-btn,#sign-out,#copy-link,#ask-close,#auth-switch,#auth-token-show,#device-code-btn');
+    var t = e.target.closest('[data-today-next],[data-next-prep],[data-next-prep-cancel],[data-next-prep-remove],[data-today-needs],[data-today],[data-goto],[data-pane],[data-session],[data-meeting],[data-speakers],[data-action],[data-open-ask],[data-theme-choice],#topbar-back,#section-btn,#sign-out,#copy-link,#ask-close,#auth-switch,#auth-token-show,#auth-retry,#device-code-btn');
     if (!t) { if (e.target.id === 'ask-sheet') closeAsk(); if (e.target.id === 'section-menu') closeMenu(); return; }
     var inSheet = !!t.closest('#ask-sheet');
     if (t.id === 'topbar-back') return goBack();
     if (t.id === 'section-btn') return openMenu();
+    if (t.id === 'auth-retry') { t.disabled = true; t.textContent = 'Checking'; bootStatus().then(function () { t.disabled = false; t.textContent = 'Try again'; }); return; }
     if (t.id === 'auth-switch') {
       var toToken = $('auth-token-block').classList.contains('hidden');
       $('auth-token-block').classList.toggle('hidden', !toToken);
@@ -5756,6 +7170,9 @@
     if (t.hasAttribute('data-open-ask')) return openAsk();
     if (t.hasAttribute('data-today')) return t.getAttribute('data-today') === 'pet' ? petTap(t) : openTodayAction(t);
     if (t.hasAttribute('data-today-next')) return prepNext();
+    if (t.hasAttribute('data-next-prep')) return toggleNextPrep(t.getAttribute('data-next-prep'));
+    if (t.hasAttribute('data-next-prep-cancel')) return closeNextPrep(true);
+    if (t.hasAttribute('data-next-prep-remove')) return removeNextPrepFile(t.getAttribute('data-next-prep-remove'));
     if (t.hasAttribute('data-today-needs')) {
       var which = t.getAttribute('data-today-needs');
       if (which === 'all') TODAY.showAllNeeds = true;
@@ -5775,6 +7192,9 @@
     if (t.hasAttribute('data-speakers')) return go('speakers', [t.getAttribute('data-speakers')]);
     var action = t.getAttribute('data-action');
     if (action === 'fork-session') return sendSessionTurn(true);
+    if (action === 'conn-retry') return connRetry(true);
+    if (action === 'conn-hide-signin') { CONN.hideFor = signinEndsAt(); return connPaint(); }
+    if (action === 'approve-on-phone') return approveOnPhone();
     if (action === 'send-anyway') { var rev = state.reading && state.reading.sendAnyway; if (state.reading) state.reading.sendAnyway = null; return sendSessionTurn(false, { acknowledgedRevision: rev }); }
     if (action === 'stop-session') return stopSession();
     if (action === 'drop-after') return dropHeld();
@@ -5800,6 +7220,7 @@
     if (action === 'ask-cos' && q) return askSheetSend(q);
     if (action === 'ask-file' && q) return fileToInbox(q);
     if (action === 'ask-meaning' && q) { $('ask-hits').innerHTML = skeletonRows(3); findByMeaning(q).then(function (html) { var el = $('ask-hits'); if (el) el.innerHTML = html; }); return; }
+    if (action === 'meaning-consent') { meaningChoose(t.getAttribute('data-provider'), t.getAttribute('data-choice')); if (q) { $('ask-hits').innerHTML = skeletonRows(3); findByMeaning(q).then(function (html) { var el = $('ask-hits'); if (el) el.innerHTML = html; }); } return; }
     if (action === 'ask-work' && q) {
       closeAsk(); go('work');
       // The Work pane (panes/work.js) owns its search box; hand it the query.
@@ -5822,6 +7243,8 @@
           showAuth(err && err.status ? err.message : UNREACHABLE_COPY);
         });
     } else if (f.id === 'session-form') sendSessionTurn(false);
+    else if (f.id === 'today-ask') sendTodayAsk();
+    else if (f.hasAttribute && f.hasAttribute('data-next-prep-form')) startNextPrep();
     else if (f.id === 'sessions-search-form') { $('sessions-q').blur(); searchSessions(); }
     else if (f.id === 'ask-form') {
       var hits = $('ask-hits'); if (hits && $('ask-q').value.trim().length >= 2) renderAsk();
@@ -5832,6 +7255,7 @@
   document.addEventListener('change', function (e) {
     if (e.target && e.target.hasAttribute && e.target.hasAttribute('data-ask-file')) { addAskFiles(e.target.files); e.target.value = ''; }
     if (e.target && e.target.hasAttribute && e.target.hasAttribute('data-sx-file')) { addReaderFiles(e.target.files); e.target.value = ''; }
+    if (e.target && e.target.hasAttribute && e.target.hasAttribute('data-next-prep-file')) { addNextPrepFiles(e.target.files); e.target.value = ''; }
   });
   // The Sessions reader's box: a pasted screenshot, and files dropped on it.
   document.addEventListener('paste', function (e) {
@@ -5861,6 +7285,7 @@
   document.addEventListener('input', function (e) {
     if (e.target.tagName === 'TEXTAREA') autoGrow(e.target);
     if (e.target.id === 'ask-q') renderAsk();
+    if (e.target.hasAttribute && e.target.hasAttribute('data-next-prep-steer')) nextPrepInput(e.target);
     if (e.target.id === 'sessions-q' && !e.target.value.trim()) renderSessionGroups(state.sessions);
   });
   document.addEventListener('keydown', function (e) {
@@ -5868,6 +7293,7 @@
     if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === 'k') { e.preventDefault(); openAsk(); return; }
     if (e.key === 'Escape' && !$('ask-sheet').classList.contains('hidden')) { closeAsk(); return; }
     if (e.key === 'Escape' && !$('section-menu').classList.contains('hidden')) { closeMenu(); $('section-btn').focus(); return; }
+    if (e.key === 'Escape' && NEXT_PREP.open && closeNextPrep(false)) { e.preventDefault(); return; }
     if (returnSends(e)) { e.preventDefault(); var form = e.target.closest('form'); if (form) form.requestSubmit(); }
   });
   document.querySelectorAll('[data-mode]').forEach(function (b) {
@@ -5971,6 +7397,15 @@
   //            fixed composer clears to sit above the keyboard. 0 when the web view itself shrank.
   var VP = { layoutH: 0 };
   VP.maxH = 0; VP.w = -1; VP.free = 0; VP.typing = false; VP.blurAt = 0;
+  // 7.0.23 (lead 23:02, from Miles's phone rows 11/10): on the unfolded Duo, after a keyboard closed, visualViewport
+  // reported a height of 0 (with an offset anywhere from 0 to 787) for minutes at a time, while innerHeight was back at
+  // 787 within 0.3 s. A visible height under VV_MIN_PX is never a real reading, whatever causes it: it is treated as no
+  // reading, the box is innerHeight from offset 0, and it is counted (VP.badN runs of it, VP.badReads reads), which every
+  // layout report carries as vz and vzr. Why 80: the smallest real visible height in his 99 rows that day is 359.98
+  // (folded, keyboard up), a phone on its side with the keyboard up still shows more than 80, and under 80 nothing fits
+  // a reply box and a header anyway. Without a keyboard innerHeight is the visible height, so the fallback costs nothing.
+  var VV_MIN_PX = 80;
+  VP.bad = false; VP.badN = 0; VP.badReads = 0;
   var VP_SLACK_PX = 20, VP_SETTLE_MS = 1000;
   function vpTyping() {
     var a = document.activeElement;
@@ -6006,7 +7441,13 @@
     }
     else if (!VP.layoutH) VP.layoutH = Math.max(inner, (de && de.clientHeight) || 0);
     var H = VP.layoutH;
-    if (!vv || !(vv.height > 0)) return { layoutH: H, top: 0, height: H, inset: 0, below: 0, dock: 0, scale: 1, zoomed: false, vv: false };
+    if (!vv) return { layoutH: H, top: 0, height: H, inset: 0, below: 0, dock: 0, scale: 1, zoomed: false, vv: false };
+    if (!(vv.height >= VV_MIN_PX)) {
+      VP.badReads++;
+      if (!VP.bad) { VP.bad = true; VP.badN++; }
+      return { layoutH: H, top: 0, height: Math.round(inner) || H, inset: 0, below: 0, dock: 0, scale: 1, zoomed: false, vv: false, bad: true };
+    }
+    VP.bad = false;
     var inset = Math.max(0, Math.round(H - vv.height * scale));
     var top, height;
     if (!zoomed) { top = Math.max(0, Math.round(vv.offsetTop || 0)); height = Math.min(Math.round(vv.height), H); }
@@ -6049,7 +7490,8 @@
       var o = (screen && screen.orientation && screen.orientation.type) || (typeof window.orientation === 'number' ? 'deg' + window.orientation : '');
       var data = { what: String(event || ''), ua: ua.brand, os: ua.os, iw: r(window.innerWidth), ih: r(window.innerHeight), ch: r(de && de.clientHeight),
         vvh: vv ? r(vv.height) : null, vvw: vv ? r(vv.width) : null, vvt: vv ? r(vv.offsetTop) : null, vvs: vv ? r(vv.scale) : null,
-        orient: String(o).slice(0, 24), coarse: !!(window.matchMedia && window.matchMedia('(pointer: coarse)').matches) };
+        orient: String(o).slice(0, 24), coarse: !!(window.matchMedia && window.matchMedia('(pointer: coarse)').matches),
+        vz: VP.badN, vzr: VP.badReads };
       var x = extra || {};
       Object.keys(x).forEach(function (k) { var v = x[k]; if (/^[a-z][a-zA-Z0-9]{0,15}$/.test(k) && (typeof v === 'number' || typeof v === 'boolean' || (typeof v === 'string' && v.length <= 24))) data[k] = typeof v === 'number' ? r(v) : v; });
       var key = JSON.stringify(data), now = Date.now();
@@ -6141,6 +7583,7 @@
     questionsChanged: function () { if (TODAY.at) { paintNeeds(); if (state.pane === 'today' && !TODAY.offline) renderPet(state.sessions || []); } }
   };
   window.COSWeb.sessionKit = {
+    phoneOffer: paintWebKeyOffer, approvePhone: approveOnPhone,
     // A session object for continueSession, with the overlay's own view (READER_VIEW's methods).
     session: function (provider, id, view) {
       return { provider: provider, id: id, draft: null, held: [], view: view, verdict: null, refusal: null, cautionAck: false, feed: newFeed(), live: null, queued: 0 };
@@ -6174,7 +7617,7 @@
   // through COSWeb.onKeyboard; COSWeb.keyboardUp says whether it is up now. Which composer the keyboard is for is the
   // pane's to mark (panes/cos-chat.js sets html.kb-chat and .cc-kb).
   var KB_UP_PX = 120, KB_AFTER_MS = 300;
-  var LR = { up: false, frame: 0, after: 0, cycle: 0, focusN: 0, device: false, field: null, hooks: [], box: '' };
+  var LR = { up: false, frame: 0, after: 0, cycle: 0, focusN: 0, device: false, field: null, hooks: [], box: '', zoomed: false, touchAt: 0 };
   function lrPane() { var r = parseRoute(); return String(r.pane + (r.args[0] === 'cos' ? '.cos' : '')).slice(0, 24); }
   function lrKind(a) {
     var tag = String((a && a.tagName) || '').toLowerCase();
@@ -6199,13 +7642,44 @@
     return typeof v === 'number' && isFinite(v) ? v : null;
   }
   function lrMatch(q) { try { return !!window.matchMedia(q).matches; } catch (_e) { return false; } }
+  // The page wider than the screen (the Duo, 11/10: scale 0.85, scroll width 449 for a 382 screen). Two causes look the
+  // same from outside; these numbers narrow it: cw, the layout viewport; dw, the width this device shows at scale 1;
+  // scw, the document's scroll width. cw = scw, both above dw, says only that the layout viewport itself is wider: a
+  // browser or phone setting, or iOS widening the layout to fit content (Q1 15:27); nothing is named or scanned then, so
+  // '' is not proof of a setting. Our page overflowing a layout that stayed at the device width shows as scw above cw
+  // (the Duo's 11/10 rows: scroll width 449 while the width was 382 at scale 1): then `wide` names the
+  // element that sticks out, the first in page order whose right edge passes cw. Page order puts a parent before its
+  // children, so that element's parent ends within cw: it is the one that sticks out of its container, never a
+  // stretched container (those end at cw; Q1 15:20). One scan per layout (cached by cw and scw), at most 4000 elements.
+  var LR_WIDE = { key: '', out: null };
+  function lrWide() {
+    var num = function (v) { return typeof v === 'number' && isFinite(v) ? Math.round(v) : null; };
+    var de = document.documentElement, vv = window.visualViewport, out = { cw: num(de && de.clientWidth), dw: null, scw: null, wide: '' };
+    try {
+      var se = document.scrollingElement || de;
+      out.scw = num(se && se.scrollWidth);
+      out.dw = vv ? num(vv.width * vv.scale) : num(window.innerWidth);
+      if (!(out.cw && out.scw && out.scw > out.cw + 1)) return out;
+      var key = out.cw + 'x' + out.scw;
+      if (LR_WIDE.key === key && LR_WIDE.out) { out.wide = LR_WIDE.out.wide; return out; }
+      var all = document.body ? document.body.getElementsByTagName('*') : [], edge = out.cw + 1, sx = window.scrollX || 0;
+      for (var i = 0; i < all.length && i < 4000; i++) {
+        var el = all[i], r = el.getBoundingClientRect();
+        if (!(r.width > 0 && r.right + sx > edge)) continue;
+        out.wide = (el.tagName.toLowerCase() + (el.id ? '#' + el.id : (typeof el.className === 'string' && el.className.trim() ? '.' + el.className.trim().split(/\s+/)[0] : ''))).slice(0, 24);
+        break;
+      }
+      LR_WIDE.key = key; LR_WIDE.out = { wide: out.wide };
+    } catch (_e) { /* a report only */ }
+    return out;
+  }
   function lrDevice() {
     if (LR.device) return;
     LR.device = true;
-    var sc = window.screen || {};
+    var sc = window.screen || {}, w = lrWide();
     layoutCrumb('device', { sw: sc.width, sh: sc.height, sah: sc.availHeight, oh: window.outerHeight, ow: window.outerWidth, dpr: window.devicePixelRatio,
       sat: lrProbe('padding-top:env(safe-area-inset-top)', 'paddingTop'), sab: lrProbe('padding-bottom:env(safe-area-inset-bottom)', 'paddingBottom'),
-      anyCoarse: lrMatch('(any-pointer: coarse)'), shortTouch: lrMatch(SHORT_TOUCH_MQ), phone: isPhone() });
+      anyCoarse: lrMatch('(any-pointer: coarse)'), shortTouch: lrMatch(SHORT_TOUCH_MQ), phone: isPhone(), cw: w.cw, dw: w.dw, scw: w.scw, wide: w.wide });
   }
   // The focus line is for touch screens only (QA W3): on a Mac it would only spend the budget.
   function lrFocus() {
@@ -6215,7 +7689,9 @@
     if (!lrMatch('(pointer: coarse)')) return;
     try { fs = parseFloat(getComputedStyle(a).fontSize); } catch (_e) { fs = null; }
     var s = lrScroll();
-    layoutCrumb('focus', { pane: lrPane(), field: lrKind(a), fs: fs, sy: s.sy, smax: s.smax, scw: s.sw, kb: LR.up, n: ++LR.focusN });
+    // The width numbers only when this focus line will be sent (its own budget), so a capped page never scans.
+    var w = typeof crumbs === 'object' && crumbs && crumbs.focus >= LAYOUT_FOCUS_MAX ? { cw: null, dw: null, wide: '' } : lrWide();
+    layoutCrumb('focus', { pane: lrPane(), field: lrKind(a), fs: fs, sy: s.sy, smax: s.smax, scw: s.sw, kb: LR.up, n: ++LR.focusN, cw: w.cw, dw: w.dw, wide: w.wide });
   }
   function lrHooks(what, v) { LR.hooks.forEach(function (fn) { try { fn(what, v); } catch (err) { console.error(err); } }); }
   function lrGap(v) {
@@ -6232,9 +7708,21 @@
     layoutCrumb('kb-after', { pane: lrPane(), n: LR.cycle, gap: gap, sy: s.sy, smax: s.smax, over: s.sy > s.smax, gapNow: lrGap(viewportFit()), syNow: s2.sy,
       dvh: lrProbe('height:100dvh', 'h'), svh: lrProbe('height:100svh', 'h'), lvh: lrProbe('height:100lvh', 'h'), lh: v.layoutH });
   }
+  // 7.0.17: when the page's zoom crosses 1.01 either way, one breadcrumb (inside layoutCrumb's caps): the scale, the
+  // pane, the focused element's tag (never its text or value) and how long since the last touch. A double-tap zoom
+  // reads as a few hundred ms after a touch with no field focused; a focus zoom as an INPUT or TEXTAREA. Read only:
+  // nothing here changes the zoom.
+  function zoomCrumb(v) {
+    var zoomed = !!(v && v.zoomed);
+    if (zoomed === LR.zoomed) return false;
+    LR.zoomed = zoomed;
+    var a = document.activeElement, tag = a && a !== document.body && a.tagName ? String(a.tagName).toLowerCase().slice(0, 24) : 'none';
+    return layoutCrumb(zoomed ? 'zoom-in' : 'zoom-out', { pane: lrPane(), scale: v.scale, tag: tag, sinceTouch: LR.touchAt ? Date.now() - LR.touchAt : -1 });
+  }
   function lrApply() {
     LR.frame = 0;
     var v = viewportFit(), de = document.documentElement;
+    zoomCrumb(v);
     // Written only when they change: a pinch or pan fires this every frame, and each write restyles the page.
     var box = v.top + '|' + v.height + '|' + v.dock, moved = box !== LR.box;
     if (moved && de && de.style && de.style.setProperty) {
@@ -6262,23 +7750,45 @@
     if (vv && vv.addEventListener) { vv.addEventListener('resize', lrFit); vv.addEventListener('scroll', lrFit); }
     window.addEventListener('resize', lrFit); window.addEventListener('orientationchange', lrFit); window.addEventListener('pageshow', lrFit);
     document.addEventListener('focusin', function () { lrFocus(); lrFit(); });
+    // 7.0.17: when the last touch landed, for the zoom breadcrumb only. Passive: it never blocks a gesture.
+    document.addEventListener('touchstart', function () { LR.touchAt = Date.now(); }, { capture: true, passive: true });
     document.addEventListener('focusout', function () { setTimeout(lrFit, 0); });
     shellHooks.push(function () { lrDevice(); lrFit(); });
   })();
+  // 7.0.17 (Miles 2026-11-10, the Duo web app zooming in and out around the keyboard): on iOS only, the viewport is
+  // capped at maximum-scale=1, once, as the page loads. Other platforms keep the viewport exactly as it is. Never while
+  // the page is already zoomed (a reload mid-zoom), so the zoom is never changed under the person's fingers; nothing
+  // calls this again after load.
+  function viewportCap(meta, ua, vv) {
+    if (!meta || ua.os !== 'ios') return false;
+    if (vv && vv.scale > 1.01) return false;
+    var content = String(meta.getAttribute('content') || '');
+    if (/maximum-scale\s*=/.test(content)) return false;
+    meta.setAttribute('content', content + (content ? ', ' : '') + 'maximum-scale=1');
+    return true;
+  }
+  try { viewportCap(document.querySelector('meta[name="viewport"]'), uaClass(), window.visualViewport); } catch (_e) { /* the viewport stays as it is */ }
   window.COSWeb.keyboardUp = function () { return LR.up; };
   window.COSWeb.onKeyboard = function (fn) { if (typeof fn === 'function') LR.hooks.push(fn); };
   // ── end layout reports
 
   // Every pane module is a plain script after this one; boot waits for all of them.
   function boot() {
+    // The open-time report's clock (ms since navigation start, -1 where there is none) and the two numbers boot gives it:
+    // when boot started (every script had run) and the sign-in check's round trip. Kept inside boot, and FIRST_PAINT
+    // looked up, never assumed, because the harnesses that run boot alone have neither.
+    var openClock = function () { try { return typeof performance === 'object' && performance && performance.now ? performance.now() : -1; } catch (_e) { return -1; } };
+    var openTimes = typeof FIRST_PAINT === 'object' && FIRST_PAINT ? FIRST_PAINT : null;
+    var openRtt = function (asked) { if (openTimes && asked >= 0 && openTimes.rtt == null) openTimes.rtt = Math.round(openClock() - asked); };
+    if (openTimes && openTimes.boot == null) openTimes.boot = Math.round(openClock());
     var params = new URLSearchParams(location.search);
     var linkCode = params.get('code');
     if (linkCode && !params.get('handoff')) {
       history.replaceState({}, document.title, location.pathname + location.hash);
       api('/api/web-session/login', { method: 'POST', body: { code: linkCode } }).then(showShell)
         .catch(function (err) {
-          showAuth(err && err.status ? err.message : UNREACHABLE_COPY);
-          var box = $('auth-code'); if (box) box.value = linkCode;
+          if (!(err && err.status)) { showAuth(UNREACHABLE_COPY); var box0 = $('auth-code'); if (box0) box0.value = linkCode; return; }
+          return linkFailed(err.message, function () { var box = $('auth-code'); if (box) box.value = linkCode; });
         });
       return;
     }
@@ -6286,10 +7796,72 @@
     if (handoff) {
       history.replaceState({}, document.title, location.pathname + location.hash);
       api('/api/web-session/login', { method: 'POST', body: { handoff: handoff } }).then(showShell)
-        .catch(function (err) { showAuth(err && err.status ? err.message : 'That sign-in link did not work. Get a new one from COS Control on your Mac or the COS Glasses app, or use a code or the token.'); });
+        .catch(function (err) {
+          if (!(err && err.status)) return showAuth('That sign-in link did not work. Get a new one from COS Control on your Mac or the COS Glasses app, or use a code or the token.');
+          return linkFailed(err.message);
+        });
       return;
     }
-    api('/api/web-session/status').then(function (st) { if (st && st.authenticated) showShell(st); else showAuth(); }).catch(function () { showAuth(UNREACHABLE_COPY); });
+    // The status read stays here in boot() itself (routes/web-phone-link.test.ts runs boot alone and pins it).
+    // The open-time report carries its round trip (firstPaintDone).
+    var asked = openClock();
+    api('/api/web-session/status').then(function (st) { openRtt(asked); return bootAnswer(st); }, function (err) { openRtt(asked); return bootFail(err); });
+  }
+  // S1 item 7 (lead go, 20:11): a link or code the server refused may be old while this browser is still signed in (an
+  // old QR, a reopened tab). Ask status first: signed in opens the app and says the link was old; signed out shows the
+  // refusal as before, with nothing else changed. A status read that fails also shows the refusal.
+  var OLD_LINK_COPY = 'That sign-in link was old or already used. This browser is still signed in.';
+  function linkFailed(message, after) {
+    return api('/api/web-session/status').then(function (st) {
+      if (st && st.authenticated) { showShell(st); toast(OLD_LINK_COPY); return; }
+      showAuth(message); if (after) after();
+    }, function () { showAuth(message); if (after) after(); });
+  }
+  // The same read on every retry of the not-answering card.
+  function bootStatus() {
+    return api('/api/web-session/status').then(function (st) { return bootAnswer(st); }, function (err) { return bootFail(err); });
+  }
+  function bootAnswer(st) {
+    if (st && st.authenticated) return showShell(st);
+    // Q1 S2: a browser that was signed in before learns why it is not now (the 30 days, no use in its last 2 days, a sign-out).
+    showAuth(typeof signinKnown === 'function' && signinKnown() ? signinLapsedCopy() : undefined);
+  }
+  function bootFail(err) {
+    // F23: a Mac that did not answer is not a sign-in problem. Say so, offer Try again, keep the form out of the way.
+    if (err && err.status) showAuth(err.message); else { showAuth(); authOffline(true); }
+  }
+  // Q1 M2: the not-answering card checks again every 30 s while the page is in front, and stops while it is hidden.
+  var AUTH_RETRY = { timer: null, ms: 30000 };
+  function authRetrySchedule(on) {
+    if (AUTH_RETRY.timer) { clearTimeout(AUTH_RETRY.timer); AUTH_RETRY.timer = null; }
+    if (!on || document.hidden) return;
+    AUTH_RETRY.timer = setTimeout(function () { AUTH_RETRY.timer = null; if (!document.hidden) bootStatus(); }, AUTH_RETRY.ms);
   }
-  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', boot); else boot();
+  document.addEventListener('visibilitychange', function () {
+    var box = $('auth-offline');
+    var showing = !!(box && !box.classList.contains('hidden'));
+    if (!showing) return;
+    if (document.hidden) authRetrySchedule(false); else bootStatus();
+  });
+  // The sign-in card's "Your Mac is not answering" state (boot only): the form hides until the Mac answers.
+  function authOffline(on) {
+    var box = $('auth-offline'), form = $('auth-form');
+    if (!box || !form) return;
+    box.classList.toggle('hidden', !on); form.classList.toggle('hidden', !!on);
+    var title = $('auth-title'), intro = $('auth-intro');
+    var offline = typeof connOffline === 'function' && connOffline();
+    if (title) title.textContent = on ? (offline ? 'This device is offline' : 'COS on your Mac is not answering') : 'Connect this browser';
+    if (intro) intro.classList.toggle('hidden', !!on);
+    var text = $('auth-offline-text');
+    if (text && on) text.textContent = offline ? 'Connect to the internet and Tailscale. This page checks again every 30 seconds.'
+      : 'Your Mac may be asleep, or this device may be offline or off Tailscale. This page checks again every 30 seconds.';
+    authRetrySchedule(!!on);
+    if (on) { var err = $('auth-error'); if (err) { setStatus(err, '', true); err.classList.add('hidden'); } }
+  }
+  if (document.readyState === 'loading' && !cosBootAfter()) document.addEventListener('DOMContentLoaded', boot);
+  else if (cosBootAfter()) cosBootAfter()(boot);
+  else boot();
+  // The scripts come from theme.js's loader (index.html #boot-scripts), which runs boot once every one of them has run
+  // (window.CosBoot.after). Without it (a page from before the loader), as before.
+  function cosBootAfter() { return window.CosBoot && typeof window.CosBoot.after === 'function' ? window.CosBoot.after : null; }
 })();