@gotcos/glasses-server 6.99.20 → 6.99.29

package/server/web-control/panes/reader-media.js

@@ -0,0 +1,154 @@
+/* Native session output images. Only opaque DTO ids reach the content route; markdown and paths are never sources. */
+(function () {
+  'use strict';
+  var W = window.COSWeb;
+  if (!W) return;
+  var scopes = new Map(), viewer = null, requests = [], activeRequests = 0;
+  var ID = /^ai_[a-f0-9]{64}$/;
+  // outside_workspace is permanent. unavailable means the workspace lookup failed this time; the content route re-resolves it.
+  var REASONS = { outside_workspace: 'This image is outside the session workspace.',
+    unavailable: 'This image is temporarily unavailable. Retry in a moment.' };
+  var style = document.createElement('style');
+  style.textContent = '.rm-item{display:flex;flex-direction:column;gap:6px;max-width:180px}.rm-label,.rm-status{font:12px/1.4 var(--body);color:var(--sub);overflow-wrap:anywhere}.rm-label{color:var(--text)}.rm-item .cx-thumb{cursor:pointer}.rm-view{position:fixed;inset:0;z-index:10000;background:var(--bg,#171717);color:var(--text,#fff);display:flex;flex-direction:column;padding: max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:16px}.rm-view-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.rm-view-label{margin:0;overflow-wrap:anywhere;font:16px/1.4 var(--body)}.rm-view-body{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px}.rm-view img{max-width:100%;max-height:100%;object-fit:contain}.rm-viewing{overflow:hidden!important}';
+  document.head.appendChild(style);
+
+  function element(tag, cls, text) {
+    var el = document.createElement(tag); if (cls) el.className = cls;
+    if (text != null) el.textContent = text;
+    return el;
+  }
+  function button(text, action, cls) {
+    var b = element('button', cls || 'cx-btn quiet', text); b.type = 'button'; b.addEventListener('click', action); return b;
+  }
+  function path(scope, id, variant) {
+    return '/api/agent-sessions/' + encodeURIComponent(scope.provider) + '/' + encodeURIComponent(scope.id) + '/output-images/' + encodeURIComponent(id) + '/content?variant=' + variant;
+  }
+  function revoke(item) { if (item.url) { URL.revokeObjectURL(item.url); item.url = ''; } }
+  function failWords(err) {
+    if (err && err.status === 401) return 'Signed out. Connect this browser again to view the image.';
+    if (err && err.status === 404) return 'This image is no longer available. Reopen the session to refresh its images.';
+    return 'The image could not load. Check that your Mac is awake, then retry.';
+  }
+  function retryable(err) { return !(err && (err.status === 401 || err.status === 404)); }
+  function imageBlob(blob) { return blob && /^image\/(png|jpeg|webp|gif|avif)$/.test(blob.type || '') && blob.size > 0; }
+  // The server normalizes at most two images at once. Share that budget across both readers and the viewer.
+  function pump() {
+    while (activeRequests < 2 && requests.length) {
+      var job = requests.shift();
+      if (!job.valid()) { job.resolve(null); continue; }
+      activeRequests++;
+      (function (j) {
+        Promise.resolve().then(j.run).then(j.resolve, j.reject).then(function () { activeRequests--; pump(); });
+      })(job);
+    }
+  }
+  function imageRequest(url, valid, foreground) {
+    return new Promise(function (resolve, reject) {
+      var job = { valid: valid, resolve: resolve, reject: reject, run: function () { return W.api(url, { responseType: 'blob', timeoutMs: 20000 }); } };
+      if (foreground) requests.unshift(job); else requests.push(job);
+      pump();
+    });
+  }
+  function fetchImage(scope, item, variant, target, ready, failed) {
+    var generation = ++target.generation;
+    imageRequest(path(scope, item.id, variant), function () { return scope.alive && generation === target.generation; }, variant === 'phone').then(function (blob) {
+      if (!scope.alive || generation !== target.generation) return;
+      if (!imageBlob(blob)) throw new Error('Not a supported image');
+      revoke(target); target.url = URL.createObjectURL(blob); ready(target.url);
+    }).catch(function (err) {
+      if (scope.alive && generation === target.generation) failed(err);
+    });
+  }
+  function loadThumb(scope, item) {
+    if (item.busy) return;
+    item.busy = true; item.open.textContent = 'Loading image…'; item.status.textContent = 'Loading image…'; item.retry.hidden = true; item.open.disabled = true;
+    fetchImage(scope, item, 'thumb', item, function (url) {
+      item.busy = false; item.open.textContent = '';
+      var img = element('img'); img.alt = item.label;
+      img.addEventListener('error', function () {
+        if (!scope.alive || item.url !== url) return;
+        revoke(item); item.open.textContent = 'Image unavailable'; item.open.disabled = true;
+        item.status.textContent = 'The image could not be displayed.'; item.retry.hidden = false;
+      });
+      img.src = url; item.open.appendChild(img); item.open.disabled = false; item.status.textContent = '';
+    }, function (err) {
+      item.busy = false; item.open.textContent = 'Image unavailable'; item.status.textContent = failWords(err); item.retry.hidden = !retryable(err);
+    });
+  }
+  function closeViewer(restore) {
+    var v = viewer; if (!v) return;
+    viewer = null; v.generation++; revoke(v); v.el.remove(); document.documentElement.classList.remove('rm-viewing');
+    if (restore !== false && v.opener && v.opener.isConnected) v.opener.focus();
+  }
+  function openViewer(scope, item) {
+    closeViewer(false);
+    var el = element('div', 'rm-view'), head = element('div', 'rm-view-head'), body = element('div', 'rm-view-body');
+    el.setAttribute('role', 'dialog'); el.setAttribute('aria-modal', 'true'); el.setAttribute('aria-label', 'Image preview: ' + item.label);
+    var close = button('Close image', function () { closeViewer(); });
+    head.appendChild(element('h2', 'rm-view-label', item.label)); head.appendChild(close); el.appendChild(head); el.appendChild(body);
+    var v = viewer = { el: el, body: body, scope: scope, opener: item.open, close: close, url: '', generation: 0 };
+    document.body.appendChild(el); document.documentElement.classList.add('rm-viewing'); close.focus();
+    function load() {
+      body.textContent = ''; var status = element('p', 'rm-status', 'Loading image…'); status.setAttribute('role', 'status'); body.appendChild(status);
+      fetchImage(scope, item, 'phone', v, function (url) {
+        if (viewer !== v) return;
+        body.textContent = ''; var img = element('img'); img.alt = item.label;
+        img.addEventListener('error', function () { if (viewer === v && v.url === url) { revoke(v); failure(new Error('Image decode failed')); } });
+        img.src = url; body.appendChild(img);
+      }, failure);
+    }
+    function failure(err) {
+      if (viewer !== v) return;
+      body.textContent = ''; var status = element('p', 'rm-status', failWords(err)); status.setAttribute('role', 'status'); body.appendChild(status);
+      if (retryable(err)) body.appendChild(button('Retry image', load));
+    }
+    load();
+  }
+  // Window capture runs before Today's document capture handler. An image never pushes history or closes its parent.
+  window.addEventListener('keydown', function (e) {
+    if (!viewer) return;
+    if (e.key === 'Escape') { e.preventDefault(); e.stopImmediatePropagation(); closeViewer(); return; }
+    if (e.key === 'Tab') {
+      var buttons = Array.prototype.slice.call(viewer.el.querySelectorAll('button')).filter(function (b) { return !b.hidden && !b.disabled; });
+      var at = buttons.indexOf(document.activeElement), next = e.shiftKey ? (at <= 0 ? buttons.length - 1 : at - 1) : (at + 1) % buttons.length;
+      e.preventDefault(); e.stopImmediatePropagation(); if (buttons[next]) buttons[next].focus();
+    }
+  }, true);
+  function clearRecord(scope, record) {
+    record.items.forEach(function (item) { item.generation++; revoke(item); });
+    if (viewer && viewer.scope === scope && record.items.some(function (item) { return item.open === viewer.opener; })) closeViewer(false);
+  }
+  function unmount(host) {
+    var scope = scopes.get(host); if (!scope) return;
+    scope.alive = false; scope.records.forEach(function (record) { clearRecord(scope, record); }); scopes.delete(host);
+  }
+  function mount(host, provider, sessionId) {
+    if (!host || !provider || !sessionId) return;
+    var scope = scopes.get(host);
+    if (scope && (scope.provider !== provider || scope.id !== sessionId)) { unmount(host); scope = null; }
+    if (!scope) { scope = { alive: true, provider: String(provider), id: String(sessionId), records: new Map() }; scopes.set(host, scope); }
+    var slots = Array.prototype.slice.call(host.querySelectorAll('[data-reader-images]'));
+    scope.records.forEach(function (record, slot) { if (slots.indexOf(slot) < 0) { clearRecord(scope, record); scope.records.delete(slot); } });
+    slots.forEach(function (slot) {
+      if (scope.records.has(slot)) return;
+      var raw; try { raw = JSON.parse(slot.getAttribute('data-reader-images') || '[]'); } catch (_e) { raw = []; }
+      slot.textContent = ''; slot.className = 'cx-strip'; slot.setAttribute('aria-label', 'Session output images');
+      var record = { items: [] }; scope.records.set(slot, record);
+      (Array.isArray(raw) ? raw : []).forEach(function (dto) {
+        if (!dto || !ID.test(dto.id || '') || ['available', 'unavailable'].indexOf(dto.state) < 0) return;
+        var item = { id: dto.id, label: String(dto.label || 'Output image').slice(0, 180), generation: 0, url: '', busy: false };
+        record.items.push(item);
+        var wrap = element('div', 'rm-item');
+        item.open = button('Image unavailable', function () { openViewer(scope, item); }, 'cx-thumb');
+        item.open.setAttribute('aria-label', 'Open image: ' + item.label); item.open.disabled = true;
+        item.status = element('span', 'rm-status'); item.status.setAttribute('role', 'status');
+        item.retry = button('Retry image', function () { loadThumb(scope, item); }, 'link-btn'); item.retry.hidden = true;
+        wrap.appendChild(item.open); wrap.appendChild(element('span', 'rm-label', item.label)); wrap.appendChild(item.status); wrap.appendChild(item.retry); slot.appendChild(wrap);
+        if (dto.state === 'available') loadThumb(scope, item);
+        else { item.status.textContent = REASONS[dto.reason] || REASONS.unavailable; item.retry.hidden = dto.reason === 'outside_workspace'; }
+      });
+    });
+  }
+  W.readerMedia = { mount: mount, unmount: unmount, isOpen: function () { return !!viewer; }, close: closeViewer };
+  W.registerPane('readerMedia', W.readerMedia);
+})();

package/server/web-control/panes/sessions.css

@@ -181,6 +181,8 @@
 .sx-queue-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 8px 10px; align-items: center; padding: 8px 10px; border-radius: 9px; background: var(--panel); border: 1px solid var(--panel-border); }
 .sx-queue-state { font: 700 9.5px/1.2 var(--mono); color: var(--accent); }
 .sx-queue-text { font-size: 13px; line-height: 1.4; color: var(--ink); overflow-wrap: anywhere; }
+.sx-queue-refused .sx-queue-state { color: var(--sub); }
+.sx-queue-reason { display: block; margin-top: 2px; font-size: 12px; color: var(--sub); }
 @media (max-width: 599px) {
   .sx-queue-row { grid-template-columns: minmax(0, 1fr) auto; }
   .sx-queue-state { grid-column: 1 / -1; }

package/server/web-control/panes/settings.js

@@ -24,21 +24,76 @@
     // 6.99.11 (Drop it P2): shown only when the server has the P2 settings and Drop it is on.
     { id: 'reach', title: 'COS reaching out', summary: 'What COS tells you about on its own, when it may interrupt, and your reminders.', mac: [], p2: true },
     { id: 'privacy', title: 'Privacy and permissions', summary: 'What COS can use on this Mac. Each permission turns on one feature.', mac: ['Permissions'] },
-    { id: 'pet', title: 'Pet', summary: 'The session pet: its character, size and motion.', mac: ['Session pet', 'Characters'] },
+    { id: 'pet', title: 'Pet', summary: 'Which pet this browser shows on Today, and whether it shows. Size, motion and the Mac\u2019s own pet are set in COS Control.', mac: ['Session pet size and motion', 'Characters on the Mac'] },
     { id: 'system', title: 'System and updates', summary: 'The COS server on this Mac, app updates, and checks when something is off.', mac: ['App updates', 'Troubleshooting'] }
   ];
   var DAYS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
 
   function soft(p) { return p.then(function (d) { return d; }, function () { return null; }); }
+  // ── Pet (this browser) ──────────────────────────────────
+  // Which pet Today shows here and whether it shows at all. Kept per browser (COSWeb.petPrefs), like the theme.
+  // The Mac's own pet is changed in COS Control: the app does not watch its pet folder, so a change from here
+  // would leave the Mac showing the old pet. Catalog: GET /api/web-pet/catalog (lib/web-pet-choice.ts).
+  var PET = { catalog: null, state: 'idle', q: '' };
+  function loadPetCatalog() {
+    if (PET.state === 'loading' || PET.state === 'ready') return;
+    PET.state = 'loading';
+    api('/api/web-pet/catalog').then(function (c) { PET.catalog = c; PET.state = 'ready'; render(); },
+      function () { PET.state = 'error'; render(); });
+  }
+  function petChoiceRow(pet, name, desc, preview, current) {
+    var on = current === pet;
+    return '<button type="button" class="cx-set-row cx-set-choice pet-choice" data-pet="' + esc(pet) + '" aria-pressed="' + on + '">' +
+      (preview ? '<img class="pet-thumb" alt="" loading="lazy" src="' + esc(preview) + '">' : '<span class="pet-thumb"></span>') +
+      '<span class="cx-set-text"><span class="cx-set-name">' + esc(name) + '</span>' + (desc ? '<span class="cx-set-desc">' + esc(desc) + '</span>' : '') + '</span>' +
+      '<span class="value">' + (on ? '<span class="check">✓</span>' : '') + '</span></button>';
+  }
+  function petBody() {
+    var prefs = W.petPrefs ? W.petPrefs() : { pet: 'mac', show: true };
+    var out = group('On this browser', '',
+      row('Show the pet on Today', 'Only here. The pet on your Mac stays as it is.', toggle(prefs.show, 'data-set="pet-show"', 'Show the pet on Today')));
+    if (PET.state === 'idle') loadPetCatalog();
+    if (PET.state !== 'ready') {
+      return out + group('Character', '', PET.state === 'error'
+        ? '<p class="cx-set-row">Could not load the pets. <button type="button" class="cx-btn quiet" data-set="pet-retry">Try again</button></p>'
+        : W.skeletonRows(3));
+    }
+    var c = PET.catalog || {}, shipped = c.shipped || [], gallery = c.gallery || [];
+    out += group('Character', 'The pet this browser shows on Today. It does not change the pet on your Mac.',
+      petChoiceRow('mac', 'Same as my Mac', c.mac && c.mac.available ? 'Follows the pet COS Control shows.' : 'Your Mac has no pet set.', c.mac && c.mac.preview, prefs.pet) +
+      shipped.map(function (p) { return petChoiceRow(p.pet, p.name, p.summary || (p.animated ? 'Animated.' : ''), p.preview, prefs.pet); }).join(''));
+    if (gallery.length) {
+      var picked = gallery.filter(function (p) { return p.pet === prefs.pet; })[0];
+      out += '<div class="cx-set-group"><h3 class="cx-set-title">Gallery</h3><p class="cx-set-blurb">' + gallery.length +
+        ' pets from the OpenPets gallery COS Control uses. Each shows as one still picture, as it does on the Mac.' + (picked ? ' In use: ' + esc(picked.name) + '.' : '') + '</p>' +
+        '<input type="search" class="pet-search" id="pet-search" placeholder="Search the gallery" aria-label="Search the gallery" value="' + esc(PET.q) + '">' +
+        '<div class="pet-grid" id="pet-grid">' + gallery.map(function (p) {
+          var on = p.pet === prefs.pet, words = (p.name + ' ' + p.category + ' ' + p.description).toLowerCase();
+          return '<button type="button" class="pet-tile" data-pet="' + esc(p.pet) + '" data-words="' + esc(words) + '" aria-pressed="' + on + '" title="' + esc(p.description || p.name) + '">' +
+            '<img alt="" loading="lazy" src="' + esc(p.preview) + '"><span>' + esc(p.name) + '</span></button>';
+        }).join('') + '</div><p class="cx-set-blurb hidden" id="pet-none">No pets match that search.</p></div>';
+    }
+    return out;
+  }
+  function filterPets() {
+    var q = PET.q.trim().toLowerCase(), grid = $('pet-grid'), shown = 0;
+    if (!grid) return;
+    grid.querySelectorAll('.pet-tile').forEach(function (t) {
+      var hit = !q || (t.getAttribute('data-words') || '').indexOf(q) >= 0;
+      t.classList.toggle('hidden', !hit); if (hit) shown++;
+    });
+    var none = $('pet-none'); if (none) none.classList.toggle('hidden', shown > 0);
+  }
+
   function load(force) {
     if (S.state === 'loading' || (S.data && !force)) return;
     S.state = 'loading';
     Promise.all([
       soft(api('/api/decision-provider')), soft(api('/api/live-cues/v2/settings')), soft(api('/api/morning-brief')),
       soft(api('/api/domains')), soft(api('/api/agent-sessions/fences')), soft(api('/api/meeting-import/fireflies/status')),
-      soft(api('/api/health')), soft(api('/api/drops/settings/p2'))
+      soft(api('/api/health')), soft(api('/api/drops/settings/p2')), soft(api('/api/today/brief/settings'))
     ]).then(function (r) {
-      S.data = { dp: r[0], cues: r[1], mb: r[2], domains: r[3], fences: r[4], ff: r[5], health: r[6], p2: r[7] };
+      S.data = { dp: r[0], cues: r[1], mb: r[2], domains: r[3], fences: r[4], ff: r[5], health: r[6], p2: r[7], tb: r[8] };
       S.state = 'ready';
       render();
     });
@@ -67,7 +122,7 @@
     return '<section class="cx-set-cat"><h2 class="cx-col-title">This browser</h2>' +
       group('Appearance', '', themeBtn('system', 'Match this device') + themeBtn('light', 'Light') + themeBtn('dark', 'Dark')) +
       group('Sign-in', '',
-        '<button type="button" class="cx-set-row" id="device-code-btn"><span class="cx-set-text"><span class="cx-set-name">Sign in another device</span><span class="cx-set-desc">Shows a QR for the phone camera, and a code to type.</span></span><span class="chev"></span></button>' +
+        '<button type="button" class="cx-set-row" id="device-code-btn"><span class="cx-set-text"><span class="cx-set-name">Use COS on another phone or browser</span><span class="cx-set-desc">A QR for your iPhone Camera, and a code to type. This is not glasses pairing; pair glasses from COS Control on your Mac.</span></span><span class="chev"></span></button>' +
         '<div id="device-code-panel" class="device-code hidden" aria-live="polite"></div>' +
         '<button type="button" class="cx-set-row" id="copy-link"><span class="cx-set-text"><span class="cx-set-name">Copy link for your phone</span><span class="cx-set-desc" id="tailnet-url">' + esc(W.state.tailnetUrl || 'Checking Tailscale') + '</span></span></button>' +
         '<button type="button" class="cx-set-row" id="sign-out"><span class="cx-set-text"><span class="cx-set-name">Sign out of this browser</span></span></button>' +
@@ -150,10 +205,30 @@
     }, function (err) { if (undo) undo(); say((err && err.message) || 'That did not save.', true); });
   }
 
+  // One line under the Today summary toggle: paused until, today's cap reached, or the last call failed (GET /api/today/brief/settings status).
+  function briefStatus(tb) {
+    var st = tb && tb.enabled && tb.status;
+    if (!st) return '';
+    var at = function (iso) { var d = new Date(iso); return isNaN(d) ? '' : d.toLocaleTimeString(undefined, { hour: 'numeric', minute: '2-digit' }); };
+    if (st.kind === 'paused') return 'Paused after three failed tries. It tries again at ' + at(st.until) + '.';
+    if (st.kind === 'daily_cap') return 'Today\u2019s ' + st.count + ' are used. It writes again tomorrow.';
+    if (st.kind === 'failed') return 'The last try failed at ' + at(st.at) + (st.code === 'timeout' ? ' (it took too long).' : st.code === 'unavailable' ? ' (Claude Code was not found on your Mac).' : '.');
+    return '';
+  }
   function categoryBody(cat) {
     var d = S.data || {};
     var out = '';
     if (cat.id === 'reach') return reachBody();
+    if (cat.id === 'pet') return petBody() + onMac(cat.mac);
+    // The Today summary (routes/today-brief.ts): Haiku on the Mac writes Today's top lines. Off unless switched on here or
+    // by COS_TODAY_BRIEF_LLM on the Mac, which wins when set.
+    if (cat.id === 'general' && d.tb && typeof d.tb.enabled === 'boolean') {
+      out += group('Today summary', '',
+        row('Write the Today summary with a model', d.tb.source === 'env' ? 'Set on the Mac by the server environment.' :
+          'Haiku writes two or three sentences after the count of what needs you. It reads what Today shows (session titles and states, each session\u2019s latest reply, the questions sessions ask you, what needs you) and, on your Mac, each session\u2019s sub-agents and the Work cards in progress. It runs only while Today is open, only when something changed, never during a recording, at most every 10 minutes and 60 times a day.',
+          toggle(d.tb.enabled, 'data-set="today-brief"' + (d.tb.source === 'env' ? ' disabled' : ''), 'Write the Today summary with a model')) +
+        (briefStatus(d.tb) ? '<p class="cx-set-blurb" id="today-brief-status">' + esc(briefStatus(d.tb)) + '</p>' : ''));
+    }
     if (cat.id === 'ai' && d.dp) {
       var p = d.dp.provider || '';
       var name = function (x) { return x === 'subq' ? 'SubQ' : x === 'jev' ? 'Jev' : x || 'Not set'; };
@@ -226,9 +301,10 @@
       browserGroup() +
       (S.state !== 'ready' ? '<div class="cx-list" style="margin-top:18px">' + W.skeletonRows(4) + '</div>' :
         CATEGORIES.filter(function (cat) { return !cat.p2 || p2On(); }).map(function (cat) {
-          return '<section class="cx-set-cat"><h2 class="cx-col-title">' + esc(cat.title) + '</h2><p class="cx-set-blurb">' + esc(cat.summary) + '</p>' + categoryBody(cat) + '</section>';
+          return '<section class="cx-set-cat" id="set-cat-' + cat.id + '"><h2 class="cx-col-title">' + esc(cat.title) + '</h2><p class="cx-set-blurb">' + esc(cat.summary) + '</p>' + categoryBody(cat) + '</section>';
         }).join('')) +
       '<p class="status-line" id="settings-status"></p></div>';
+    if (PET.q) filterPets();
   }
 
   function say(text, isError) { var el = $('settings-status'); if (el) { el.textContent = text; el.classList.toggle('error', !!isError); } }
@@ -236,8 +312,26 @@
   pane.addEventListener('click', function (e) {
     var go = e.target.closest('[data-go]');
     if (go) { var parts = go.getAttribute('data-go').split('/'); return W.go(parts[0], parts.slice(1)); }
+    var pick = e.target.closest('[data-pet]');
+    if (pick && W.setPetPrefs) {
+      W.setPetPrefs({ pet: pick.getAttribute('data-pet') });
+      pane.querySelectorAll('[data-pet]').forEach(function (b) {
+        var on = b === pick; b.setAttribute('aria-pressed', String(on));
+        var v = b.querySelector('.value'); if (v) v.innerHTML = on ? '<span class="check">✓</span>' : '';
+      });
+      W.toast('Pet changed. Today shows it here.');
+      return;
+    }
     var t = e.target.closest('[data-set]');
     if (!t || t.disabled) return;
+    if (t.getAttribute('data-set') === 'pet-show') {
+      var shown = t.getAttribute('aria-checked') === 'true';
+      t.setAttribute('aria-checked', String(!shown));
+      if (W.setPetPrefs) W.setPetPrefs({ show: !shown });
+      W.toast(!shown ? 'Pet on' : 'Pet off');
+      return;
+    }
+    if (t.getAttribute('data-set') === 'pet-retry') { PET.state = 'idle'; return render(); }
     var act = t.getAttribute('data-set');
     if (act === 'refresh') { S.data = null; S.state = 'idle'; load(true); return render(); }
     if (act === 'provider') {
@@ -252,6 +346,19 @@
         .then(function () { W.toast(!on ? 'Live cues on' : 'Live cues off'); }, function (err) { t.setAttribute('aria-checked', String(on)); say(err.message, true); });
       return;
     }
+    if (act === 'today-brief') {
+      var ton = t.getAttribute('aria-checked') === 'true';
+      t.setAttribute('aria-checked', String(!ton));
+      api('/api/today/brief/settings', { method: 'POST', body: { enabled: !ton } })
+        .then(function (v) {
+          if (S.data && v) S.data.tb = v;
+          // Today forgets the summary it showed, so turning it on asks at once and turning it off shows the counts line.
+          if (W.resetTodayBrief) W.resetTodayBrief();
+          W.toast(!ton ? 'Today summary on' : 'Today summary off');
+          render();
+        }, function (err) { t.setAttribute('aria-checked', String(ton)); say(err.message, true); });
+      return;
+    }
     if (act === 'brief') {
       var bon = t.getAttribute('aria-checked') === 'true';
       t.setAttribute('aria-checked', String(!bon));
@@ -273,6 +380,15 @@
     }
   });
 
+  // A gallery picture that will not load shows the pet's name alone, never a broken image.
+  pane.addEventListener('error', function (e) {
+    var img = e.target;
+    if (img && img.tagName === 'IMG' && img.closest && img.closest('.pet-tile, .pet-choice')) img.classList.add('hidden');
+  }, true);
+  pane.addEventListener('input', function (e) {
+    if (e.target && e.target.id === 'pet-search') { PET.q = e.target.value; filterPets(); }
+  });
+
   // Number, time, day and steer fields save when they change (a number is clamped by the server, then shown as saved).
   pane.addEventListener('change', function (e) {
     var f = e.target && e.target.closest ? e.target.closest('[data-p2]') : null;
@@ -287,6 +403,20 @@
   });
 
   W.registerPane('settings', {
-    load: function () { load(false); render(); }
+    load: function (args) {
+      load(false); render();
+      // "Change pet" on Today opens Settings at the Pet section.
+      if (args && args[0] === 'pet') {
+        var tries = 0;
+        (function scroll() {
+          var el = document.getElementById('set-cat-pet');
+          // Land on the pet in use once the catalog has drawn; until then, the Pet section's top.
+          var chosen = el && el.querySelector('[data-pet][aria-pressed="true"]');
+          if (chosen) { chosen.scrollIntoView({ block: 'center' }); return; }
+          if (el && tries === 0) el.scrollIntoView({ block: 'start' });
+          if (++tries < 40) setTimeout(scroll, 150);
+        })();
+      }
+    }
   });
 })();

package/server/web-control/panes/today-actions.css

@@ -0,0 +1,167 @@
+/* COS Control Web: Today as a place to act (panes/today-actions.js). A bottom sheet on the folded phone, a side sheet
+   from 600 px. Built from the page's own tokens and pieces: the composer, .btn, .link-btn, .cx-btn, the reader's
+   activity rows (.sx-act-*) and boxes (.sx-box), and the question cards (questions.css). */
+
+/* The Today rows that open it: whole-row buttons. */
+.need-open { display: block; width: 100%; text-align: left; color: inherit; }
+.need-open .need-top { display: flex; }
+.need-open .need-foot { display: flex; }
+.intake-row { width: 100%; text-align: left; color: inherit; align-items: center; min-height: 40px; }
+.intake-row::after { content: ''; width: 7px; height: 7px; border-right: 2px solid var(--grey); border-bottom: 2px solid var(--grey); transform: rotate(-45deg); flex: none; opacity: 0.6; margin-left: 2px; }
+.intake-row .intake-meeting { flex: 1; }
+
+/* The page behind does not scroll. Only the root: hidden on body too would make body a scroll container and unstick the rail. */
+html.ta-open { overflow: hidden; }
+
+.ta-layer {
+  /* 6.99.29 (Miles's unfolded Duo, IMG_0503, 11/07 12:48): with the keyboard closed the layer is the whole fixed
+     viewport, down to the physical bottom edge, whatever visualViewport reports. Sized from visualViewport.height it
+     ended about 106 px short and Today showed below the backdrop and the sheet. The home indicator is cleared once, by
+     the padding inside the sheet (.ta-foot, or .ta-body when there is no reply box), never by the layer or the sheet. */
+  position: fixed; inset: 0; z-index: 45;
+  --ta-bleed: 120px;
+  --run-green: rgb(56, 145, 99);
+}
+/* The keyboard is up (today-actions.js applyFit): the layer is the visible viewport, so it never covers the reply box. */
+.ta-layer.ta-kb { top: var(--ta-vt, 0px); height: var(--ta-vh, 100dvh); }
+:root[data-theme='dark'] .ta-layer { --run-green: rgb(108, 207, 143); }
+@media (prefers-color-scheme: dark) { :root:not([data-theme='light']) .ta-layer { --run-green: rgb(108, 207, 143); } }
+.ta-layer[hidden] { display: none; }
+.ta-scrim { position: absolute; inset: 0; background: rgba(23, 18, 14, 0.45); touch-action: none; animation: fade 160ms ease; }
+/* Past the bottom edge, in case Safari's fixed viewport ever stops short of it: the dim and the sheet run on below the
+   screen, so no band of Today can show under them. Off with the keyboard up (the keyboard covers that edge).
+   QA 6.99.29: the dim's bleed is the LAYER's own pseudo-element, never the scrim, so it is visual only: a tap on that
+   band lands on the layer (no data-ta, so nothing happens) instead of closing the overlay or reaching Today below. */
+.ta-layer:not(.ta-kb)::before { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: var(--ta-bleed); background: rgba(23, 18, 14, 0.45); touch-action: none; animation: fade 160ms ease; }
+.ta-layer:not(.ta-kb) .ta-sheet::after { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: var(--ta-bleed); background: var(--page); pointer-events: none; }
+
+.ta-sheet {
+  position: absolute; left: 0; right: 0; bottom: 0;
+  /* A strip of Today stays in view above it: context, and somewhere to tap outside. */
+  max-height: calc(100% - var(--safe-top) - 56px);
+  display: flex; flex-direction: column;
+  background: var(--page); color: var(--ink);
+  border-radius: 20px 20px 0 0; box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.25);
+  padding-left: var(--safe-left); padding-right: var(--safe-right);
+  outline: none;
+  animation: ta-rise 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+.ta-grip { flex: none; width: 36px; height: 5px; border-radius: 3px; background: var(--panel-border); margin: 8px auto 0; }
+.ta-head { flex: none; display: flex; align-items: flex-start; gap: 10px; padding: 6px var(--gutter) 4px; }
+.ta-head-main { flex: 1; min-width: 0; }
+.ta-back { display: inline-flex; align-items: center; min-height: 44px; margin: 0 0 -6px; padding: 0; }
+.ta-back[hidden] { display: none; }
+.ta-title { flex: 1; min-width: 0; margin: 8px 0 0; font: 500 22px/1.2 var(--display); letter-spacing: -0.005em; overflow-wrap: anywhere; }
+.ta-x { flex: none; display: grid; place-items: center; width: 44px; height: 44px; margin-right: -8px; border-radius: 12px; color: var(--ink); }
+.ta-x .icon { width: 20px; height: 20px; stroke-width: 1.8; }
+.ta-body { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 2px var(--gutter) 16px; }
+.ta-foot { flex: none; padding: 10px var(--gutter) calc(var(--safe-bottom) + 10px); border-top: 1px solid var(--row-border); background: var(--page); }
+.ta-foot:empty, .ta-foot[hidden] { display: none; }
+.ta-foot .composer { margin-top: 0; position: static; }
+.ta-foot .status-line { margin: 6px 4px 0; min-height: 0; }
+.ta-foot .status-line:empty { display: none; }
+.ta-foot .sx-box, .ta-foot .sx-park { margin: 0 0 10px; }
+/* No reply box (the session list, a question answered in its card): the sheet itself keeps the home indicator's strip,
+   so the end of the list and the question card's footer stop above it and nothing scrolls under it. With the keyboard
+   up the keyboard covers that strip. */
+.ta-layer:not(.ta-kb) .ta-sheet:has(> .ta-foot:empty), .ta-layer:not(.ta-kb) .ta-sheet:has(> .ta-foot[hidden]) { padding-bottom: var(--safe-bottom); }
+
+.ta-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 8px; color: var(--sub); font-size: 14.5px; line-height: 1.4; }
+.ta-note { margin: 6px 0 0; color: var(--hot); font-size: 13.5px; line-height: 1.4; }
+.ta-card-line { margin: 0 0 8px; font-size: 14px; color: var(--ink); overflow-wrap: anywhere; }
+.ta-quote { margin: 8px 0 10px; padding-left: 12px; border-left: 2px solid var(--btn-border); font: italic 400 16px/1.42 var(--display); color: var(--ink); overflow-wrap: anywhere; }
+.ta-ask-line { margin: 8px 0 4px; font-size: 14.5px; font-weight: 600; color: var(--hot); }
+.ta-links { display: flex; flex-wrap: wrap; gap: 0 18px; }
+.ta-q { display: grid; gap: 12px; margin: 8px 0 12px; }
+.ta-q[hidden] { display: none; }
+/* 6.99.26: Needs you says where a waiting session can be answered; a pet with nothing in play does nothing */
+.need-where[data-where="here"] { color: var(--hot); font-weight: 600; }
+.pet-btn[aria-disabled="true"] { cursor: default; }
+/* 6.99.26: a question only the Mac's own prompt can answer */
+.ta-mac-line { color: var(--ink); }
+/* 6.99.26: the pet's sessions: waiting on you, running, done today */
+.ta-pet-group { margin: 4px 0 14px; }
+.ta-pet-head { margin: 10px 0 2px; font: 600 15px/1.3 var(--body); color: var(--ink); }
+.ta-pet-row { display: flex; flex-direction: column; gap: 4px; width: 100%; min-height: 56px; padding: 10px 0; text-align: left; border-top: 1px solid var(--row-border); color: inherit; }
+.ta-pet-head + .ta-pet-row { border-top: 0; }
+.ta-pet-top { display: flex; align-items: center; gap: 8px; min-width: 0; }
+.ta-pet-title { font-size: 15.5px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
+.ta-pet-line { font-size: 13.5px; line-height: 1.4; color: var(--sub); overflow-wrap: anywhere; }
+.ta-activity { margin: 8px 0 4px; }
+.ta-activity .sx-act-state { margin-top: 0; }
+.ta-act-prompt { margin: 2px 0 0; font-size: 13.5px; line-height: 1.4; color: var(--ink); overflow-wrap: anywhere; }
+.ta-act-tail { margin-top: 6px; display: flex; flex-direction: column; }
+.ta-last { margin-top: 14px; padding: 12px 14px; border-radius: 14px; background: var(--panel); border: 1px solid var(--panel-border); font-size: 15px; line-height: 1.5; }
+.ta-last-head { margin: 0 0 6px; font-size: 13px; font-weight: 600; color: var(--sub); }
+.ta-last-text.clamped { max-height: 18em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 72%, transparent); mask-image: linear-gradient(#000 72%, transparent); }
+
+/* From today's meetings */
+.ta-list { margin-top: 2px; }
+.ta-group { margin: 18px 0 0; font: 600 15px/1.3 var(--body); color: var(--ink); overflow-wrap: anywhere; }
+.ta-sugg { padding: 12px 0 10px; border-top: 1px solid var(--row-border); }
+.ta-group + .ta-sugg { border-top: 0; padding-top: 8px; }
+.ta-sugg-text { margin: 0; font-size: 15px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
+.ta-sugg-src { margin: 4px 0 0; font-size: 13.5px; line-height: 1.4; color: var(--sub); overflow-wrap: anywhere; }
+.ta-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 18px; margin-top: 6px; }
+.ta-acts .btn.small { min-height: 44px; padding: 0 16px; }
+.ta-acts .link-btn { font-size: 14.5px; }
+.link-btn.quiet { color: var(--sub); font-weight: 500; }
+.ta-wait { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: var(--sub); }
+.ta-done { font-size: 14.5px; font-weight: 600; color: var(--ink); }
+.ta-sugg.settled { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; }
+.ta-sugg.settled > p { flex-basis: 100%; }
+.ta-sugg.settled .ta-sugg-text { color: var(--sub); font-weight: 500; }
+
+/* Unfolded Duo, tablets, desktop: a sheet at the right edge, Today still in view beside it. */
+@media (min-width: 600px) {
+  .ta-sheet {
+    left: auto; top: 0; width: clamp(360px, 60vw, 480px); max-height: none;
+    /* At the right edge only the right inset (a landscape notch or rounded corner) applies. */
+    padding-left: 0;
+    border-radius: 20px 0 0 20px; box-shadow: -16px 0 48px rgba(0, 0, 0, 0.22);
+    animation-name: ta-slide;
+  }
+  .ta-grip { display: none; }
+  .ta-head { padding-top: calc(var(--safe-top) + 14px); }
+  .ta-foot { padding-bottom: calc(var(--safe-bottom) + 14px); }
+}
+/* 6.99.29 (Miles's unfolded Duo, 11/07): the on-screen keyboard is up, at any width (today-actions.js applyFit marks the
+   layer ta-kb when the visible viewport is 120 px or more shorter than the layout one). The sheet fills what is visible,
+   the header folds to one compact row, the reply box stays pinned at the bottom just above the keyboard, and the
+   conversation takes the rest and scrolls. The keyboard covers the home indicator, so the foot drops that inset. */
+.ta-layer.ta-kb .ta-sheet { top: 0; bottom: 0; max-height: none; overflow: hidden; }
+.ta-layer.ta-kb .ta-grip { display: none; }
+.ta-layer.ta-kb .ta-head { align-items: center; padding-top: calc(var(--safe-top) + 6px); padding-bottom: 4px; }
+.ta-layer.ta-kb .ta-head-main { display: flex; align-items: center; gap: 12px; }
+.ta-layer.ta-kb .ta-back { flex: none; min-height: 36px; margin: 0; }
+.ta-layer.ta-kb .ta-title { margin: 0; font-size: 17px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
+.ta-layer.ta-kb .ta-x { width: 36px; height: 36px; margin-right: -6px; }
+.ta-layer.ta-kb .ta-body { padding-bottom: 8px; }
+.ta-layer.ta-kb .ta-foot { padding-top: 8px; padding-bottom: 8px; }
+.ta-layer.ta-kb .ta-foot .composer textarea { max-height: 96px; }
+/* Under about three lines left for the conversation: the "Working right now" note waits until the keyboard closes. */
+.ta-layer.ta-kb-tight .ta-foot .sx-park { display: none; }
+@keyframes ta-rise { from { transform: translateY(32px); opacity: 0.6; } }
+@keyframes ta-slide { from { transform: translateX(32px); opacity: 0.6; } }
+/* Dismiss armed: the second tap removes it (no Undo on this server). */
+.link-btn.quiet.armed { color: var(--hot); font-weight: 600; }
+/* Needs you: "Show N more", "can wait until tomorrow" and a source that could not be read (app.js renderNeeds). */
+.need-more { display: block; width: 100%; text-align: left; padding: 12px 16px; min-height: 44px; border-top: 1px solid var(--row-border); color: var(--accent); font-weight: 600; font-size: 15px; }
+.need-more.need-failed { color: var(--hot); font-weight: 500; }
+/* Next up: Prep me and Open meeting (app.js renderNext). */
+.next-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; padding: 0 16px 14px; }
+.next-actions:empty { display: none; }
+.next-actions .btn.small { min-height: 44px; }
+/* The Ask sheet's File to Work inbox result, on its own row (app.js fileNoteHtml). */
+.nav-row .note.file-error { color: var(--hot); white-space: normal; }
+/* Running card when the session list could not be read (app.js renderRunning). */
+.run-more.run-failed { color: var(--run-open); }
+
+/* Files with a reply or a note (11/07): the COS chat's own chips and clip (cos-chat.css .cc-chip, .cc-attach), placed in
+   the reply box. The chips take their own row above the words; the clip sits beside Send. */
+.ta-composer { flex-wrap: wrap; }
+.ta-composer .ta-files { flex: 1 1 100%; padding: 2px 0 4px; }
+.ta-composer .ta-files.hidden { display: none; }
+.ta-clip:empty { display: none; }
+.ta-clip .cc-attach { height: 38px; width: 42px; border-radius: var(--radius-sm); }
+.ta-composer.dragging { outline: 2px dashed var(--accent); outline-offset: 4px; }