@songsid/agend 2.3.0-beta.19 → 2.3.0-beta.20

package/dist/ui/shared/app-stream.js

@@ -33,7 +33,8 @@
 // #1918: traffic — a message between instances moved; delegation — a task opened, or its report closed it (SSE only: the
 // org canvas reads /ui/traffic when it has no stream).
 // #2233: backend_login — a dashboard sign-in started, moved or ended (no details: the page reads its own view).
-const EVENTS = ["status", "message", "agent_reply_live", "delivery", "deliveries", "prompt", "prompts", "prompt_resolved", "activity", "needs", "reply_buttons", "steps_tick", "clock", "traffic", "delegation", "backend_login"];
+// tasks — the task board changed: the card numbers a write touched (SSE only: the board reads again when it is shown).
+const EVENTS = ["status", "message", "agent_reply_live", "delivery", "deliveries", "prompt", "prompts", "prompt_resolved", "activity", "needs", "reply_buttons", "steps_tick", "clock", "traffic", "delegation", "backend_login", "tasks"];
 const MAX_HELD = 1000;                    // live events held during one catch-up read; more → read again afterwards
 const RETRY_DELAYS = [1000, 2000, 4000];  // after the first failed catch-up read; then it waits for Retry
 const POLL_LIMIT_MS = 10000;              // a poll that has not answered by then counts as failed

package/dist/ui/shared/app.css

@@ -834,6 +834,9 @@ img.amb-p { object-fit: contain; }
   .oc-keep { left: var(--s-2); right: var(--s-2); transform: none; max-width: none; flex-wrap: nowrap; }
   .oc-keep-text { flex: 1; flex-direction: column; align-items: flex-start; gap: 0; }
 }
+/* #2299: the toasts are a manual popover (ui-toast.js), so they stand in the top layer above an open dialog's backdrop;
+   the popover's own box (inset 0, margin, border, background) is undone here, before any placement below. */
+:where(.toasts) { inset: auto; margin: 0; padding: 0; border: 0; background: none; color: inherit; overflow: visible; width: auto; height: auto; }
 .toasts { position: fixed; bottom: var(--s-6); right: var(--s-6); z-index: 100; display: flex; flex-direction: column; align-items: flex-end; gap: var(--s-2); pointer-events: none; }
 .toast { padding: 10px var(--s-4); max-width: min(420px, calc(100vw - 32px)); border-radius: var(--r-md); font-size: var(--fs-sm); font-weight: var(--fw-medium); box-shadow: var(--shadow-2); background: var(--accent-fill); color: var(--on-accent); animation: toast-in var(--t-med) var(--ease); }
 .toast.err { background: var(--danger-fill); color: var(--on-danger); }
@@ -860,7 +863,12 @@ img.amb-p { object-fit: contain; }
   .panel-head .sb-new { display: none; }
   .only-narrow { display: inline-flex; }
   .thread { padding: var(--s-3) var(--s-3) var(--s-2); gap: var(--s-5); }
-  .col { padding: var(--s-3) var(--s-3) var(--s-8); }
+  /* #2299: a phone's side gutter is 16 px — the content column, the header and the toasts alike. */
+  .col { padding: var(--s-3) var(--s-4) var(--s-8); }
+  .panel-head { padding: max(var(--s-1), env(safe-area-inset-top)) max(var(--s-4), env(safe-area-inset-right)) var(--s-1) max(var(--s-4), env(safe-area-inset-left)); }
+  /* #2299: the header's controls are a full touch target (its row is 52 px: 44 px plus its padding). */
+  .panel-head .icon-btn { min-width: var(--tap); min-height: var(--tap); }
+  .panel-head .btn, .panel-head .seg-item, .panel-head select { min-height: var(--tap); }
   .dock { padding: 0 max(var(--s-2), env(safe-area-inset-right)) var(--s-2) max(var(--s-2), env(safe-area-inset-left)); }
   .hint { display: none; }
   .msg.user { max-width: 88%; }
@@ -876,7 +884,7 @@ img.amb-p { object-fit: contain; }
   .tab-badge { position: absolute; top: 6px; left: calc(50% + 6px); min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--r-full); background: var(--danger-fill); color: var(--on-danger); font-size: 10px; line-height: 16px; text-align: center; }
   .main { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
   .kb-open .main { padding-bottom: 0; }
-  .toasts { top: calc(60px + env(safe-area-inset-top)); bottom: auto; left: var(--s-3); right: var(--s-3); align-items: stretch; }
+  .toasts { top: calc(60px + env(safe-area-inset-top)); bottom: auto; left: var(--s-4); right: var(--s-4); align-items: stretch; }
   .tour { left: var(--s-4); right: var(--s-4); width: auto; top: calc(64px + env(safe-area-inset-top)); }
   .dlg { width: 100vw; max-width: 100vw; margin: auto 0 0; border-radius: var(--r-lg) var(--r-lg) 0 0; max-height: 90vh; }
   .dlg-box { max-height: 90vh; }
@@ -1737,3 +1745,263 @@ strong.org-name { font-size: var(--fs-sm); color: var(--text); }
 .panel-head:has(> .chat-fx-notice) { flex-wrap: wrap; }
 .chat-fx-notice { order: 10; flex: 1 1 100%; min-width: 0; max-width: 100%; font-size: var(--fs-sm); overflow-wrap: anywhere; }
 .chat-fx-notice > span { display: block; }
+
+/* ── #2293: global search — the sidebar row's shortcut, the header's button (collapsed sidebar, phone), the dialog ── */
+.kbd-hint { font: inherit; font-size: var(--fs-xs); color: var(--text-3); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 0 var(--s-1); line-height: 18px; white-space: nowrap; }
+.panel-head .sb-search { display: none; }
+.sb-collapsed .panel-head .sb-search { display: inline-flex; }
+.chip-btn.on { color: var(--text); background: var(--surface-2); font-weight: var(--fw-semibold); }
+.dlg.search-dlg { width: min(680px, calc(100vw - 32px)); margin: 10vh auto auto; max-height: 76vh; }
+.search-box { display: flex; flex-direction: column; max-height: 76vh; }
+.search-head { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-2) var(--s-2) var(--s-2) var(--s-4); border-bottom: 1px solid var(--border); color: var(--text-2); }
+.search-input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--text); font-size: max(16px, var(--fs-lg)); padding: var(--s-2) 0; }
+.search-input:focus { outline: none; }
+.search-filters-toggle { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
+.search-filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); padding: var(--s-2) var(--s-4); border-bottom: 1px solid var(--border); font-size: var(--fs-sm); }
+.search-field { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--text-2); }
+.search-field select { max-width: 260px; }
+/* The filter chips' "on" state in the accent, so it reads apart from the hover and from the folded toggle. */
+.search-chips .chip-btn.on { background: var(--accent-dim); color: var(--accent); }
+.search-chips { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px; }
+.search-mine { display: inline-flex; align-items: center; gap: 6px; margin-left: var(--s-2); color: var(--text-2); cursor: pointer; }
+.search-mine input { margin: 0; accent-color: var(--accent); }
+.search-body { flex: 1; min-height: 140px; overflow-y: auto; padding: var(--s-2); }
+.search-foot { padding: var(--s-2) var(--s-4); border-top: 1px solid var(--border); color: var(--text-3); font-size: var(--fs-xs); }
+.search-hint, .search-status, .search-note { margin: 0; padding: var(--s-2) var(--s-3); color: var(--text-2); font-size: var(--fs-sm); }
+.search-status.bad { color: var(--danger); }
+.search-note { color: var(--warn); }
+.search-recent-head { display: flex; align-items: center; justify-content: space-between; padding: var(--s-2) var(--s-3) 0; color: var(--text-3); font-size: var(--fs-xs); }
+.search-recent ul { list-style: none; margin: 0; padding: 0; }
+.search-recent-item { display: flex; align-items: center; gap: var(--s-2); width: 100%; border: 0; border-radius: var(--r-sm); background: transparent; color: var(--text); padding: var(--s-2) var(--s-3); font-size: var(--fs-sm); text-align: left; cursor: pointer; }
+.search-recent-item:hover { background: var(--surface-2); }
+.search-recent-item svg { color: var(--text-3); flex: none; }
+.search-results.stale { opacity: 0.6; }
+.search-group + .search-group { margin-top: var(--s-2); }
+.search-group-head { display: flex; justify-content: space-between; gap: var(--s-2); padding: var(--s-2) var(--s-3) var(--s-1); font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--text-2); }
+.search-count { color: var(--text-3); font-weight: var(--fw-regular); }
+.search-row { padding: var(--s-2) var(--s-3); border-radius: var(--r-sm); cursor: pointer; }
+.search-row.on { background: var(--surface-2); box-shadow: inset 2px 0 0 var(--accent); }
+.search-row-top { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-xs); color: var(--text-2); }
+.search-who { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.search-kind { color: var(--text-3); }
+.search-time { color: var(--text-3); white-space: nowrap; }
+.search-badge { flex: none; font-size: 10px; line-height: 16px; font-weight: var(--fw-semibold); padding: 0 6px; border-radius: var(--r-full); background: var(--surface-2); color: var(--text-2); }
+.search-badge.chat { background: var(--accent-dim); color: var(--accent); }
+.search-badge.xmsg { background: var(--warn-bg); color: var(--warn); }
+.search-badge.task { background: var(--ok-bg); color: var(--ok); }
+.search-snippet { margin-top: 2px; font-size: var(--fs-sm); color: var(--text); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
+.search-snippet mark, .search-ctx-text mark { background: var(--accent-dim); color: inherit; border-radius: 2px; padding: 0 1px; }
+.search-detail-head { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-1) var(--s-1) var(--s-2); font-size: var(--fs-sm); }
+.search-detail-head .chip-btn { display: inline-flex; align-items: center; gap: 4px; }
+.search-ctx { list-style: none; margin: 0; padding: 0 var(--s-1); display: flex; flex-direction: column; gap: var(--s-1); }
+.search-ctx-line { padding: var(--s-2) var(--s-3); border-radius: var(--r-sm); }
+.search-ctx-line.here { background: var(--surface-2); box-shadow: inset 2px 0 0 var(--accent); }
+.search-ctx-text { margin-top: 2px; font-size: var(--fs-sm); white-space: pre-wrap; overflow-wrap: anywhere; }
+.search-detail-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--s-2); padding: var(--s-3) var(--s-1) var(--s-1); }
+@media (max-width: 899px) {
+  .panel-head .sb-search { display: inline-flex; }
+  .dlg.search-dlg { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; border-radius: 0; }
+  .search-box { height: 100%; max-height: 100dvh; padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom); box-sizing: border-box; }
+  .search-foot { display: none; }
+  .search-row { padding: var(--s-3); }
+  .search-filters-toggle, .search-chips .chip-btn { min-height: var(--tap); }
+/* The task board (Fleet › Tasks: fleet-tasks.js, fleet-task-card.js). Status colours: to do neutral, in progress the
+   accent, blocked danger, waiting for you warn, done ok. Bars are SVG rects (no style attribute: the CSP). */
+.tb { display: flex; flex-direction: column; gap: var(--s-4); min-width: 0; }
+.tb-grow { flex: 1; }
+.tb-head { flex-wrap: wrap; }
+.tb-code { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-3); white-space: nowrap; }
+.tb-who { font-size: var(--fs-xs); color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 14em; }
+.tb-link { color: var(--accent); font-size: var(--fs-xs); background: none; border: 0; padding: 0; cursor: pointer; text-align: left; }
+.tb-link:hover { text-decoration: underline; }
+.tb-select { min-height: 30px; padding: 0 var(--s-2); border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--bg); color: var(--text); font-size: var(--fs-xs); max-width: 100%; }
+.tb-select:disabled, .tb-check input:disabled { opacity: 0.6; cursor: default; }
+.tb-check { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); color: var(--text-2); cursor: pointer; }
+.tb-check input { width: auto; min-height: 0; margin: 0; }
+.tb-form-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-3); }
+.tb-chev { transition: transform var(--t-fast) var(--ease); transform: rotate(-90deg); }
+.tb-chev.open { transform: rotate(0deg); }
+
+.tb-pill, .tb-tag, .tb-flag { display: inline-flex; align-items: center; gap: 2px; font-size: 11px; font-weight: var(--fw-semibold); padding: 1px var(--s-2); border-radius: var(--r-full); background: var(--surface-2); color: var(--text-2); white-space: nowrap; }
+.tb-pill.st-claimed, .tb-tag.st-claimed { background: var(--accent-dim); color: var(--accent); }
+.tb-pill.st-blocked, .tb-tag.st-blocked, .tb-flag.st-blocked, .tb-tag.p-urgent { background: var(--danger-bg); color: var(--danger); }
+.tb-pill.st-review, .tb-tag.st-review, .tb-flag.st-review, .tb-tag.p-high { background: var(--warn-bg); color: var(--warn); }
+.tb-pill.st-done, .tb-tag.st-done { background: var(--ok-bg); color: var(--ok); }
+.tb-pill.st-cancelled { color: var(--text-3); text-decoration: line-through; }
+.tb-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--text-3); flex-shrink: 0; }
+.tb-col.st-claimed > .tb-col-head > .tb-dot, .tb-dot.st-claimed { background: var(--accent); }
+.tb-col.st-blocked > .tb-col-head > .tb-dot, .tb-dot.st-blocked { background: var(--danger); }
+.tb-col.st-review > .tb-col-head > .tb-dot, .tb-dot.st-review { background: var(--warn); }
+.tb-col.st-done > .tb-col-head > .tb-dot, .tb-dot.st-done { background: var(--ok); }
+
+.tb-bar { width: 96px; height: 6px; border-radius: var(--r-full); overflow: hidden; flex-shrink: 0; }
+.tb-bar.wide { width: 100%; flex-shrink: 1; }
+.tb-bar-track { fill: var(--surface-2); }
+.tb-seg.st-done { fill: var(--ok); }
+.tb-seg.st-review { fill: var(--warn); }
+.tb-seg.st-claimed { fill: var(--accent); }
+.tb-seg.st-blocked { fill: var(--danger); }
+.tb-pct { font-weight: var(--fw-semibold); font-variant-numeric: tabular-nums; }
+
+/* Home: what waits for the person, then the projects. */
+.tb-home { display: flex; flex-direction: column; gap: var(--s-4); }
+/* The public link: the board is shown, not changed. */
+.tb-readonly { display: flex; align-items: center; gap: var(--s-2); margin: 0 0 var(--s-3); padding: var(--s-2) var(--s-3); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); color: var(--text-2); font-size: var(--fs-sm); }
+.tb-home > .list-head { margin: 0; }
+.tb-section-title { display: flex; align-items: center; gap: var(--s-2); margin: 0 0 var(--s-2); font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--text-2); }
+.tb-waiting { padding: var(--s-3); border: 1px solid var(--warn-line); border-radius: var(--r-lg); }
+.tb-wait-row { flex-wrap: wrap; align-items: flex-start; }
+/* #2299: the pill sits on the title's first line (one baseline); the reason, under the title; the actions after. */
+.tb-wait-main { flex: 1 1 320px; min-width: 0; display: flex; align-items: baseline; gap: var(--s-2) var(--s-3); }
+.tb-wait-main > .tb-pill { flex-shrink: 0; min-width: 112px; justify-content: center; }
+.tb-wait-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin-left: auto; }
+.tb-wait-actions .btn { min-width: 88px; padding: 0 var(--s-4); }
+.tb-wait-title { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2); background: none; border: 0; padding: 0; color: var(--text); text-align: left; cursor: pointer; font-size: var(--fs-sm); }
+.tb-wait-title:hover { text-decoration: underline; }
+.tb-wait-reason { flex-basis: 100%; margin-top: 2px; color: var(--danger); font-size: var(--fs-xs); line-height: var(--lh-xs); overflow-wrap: anywhere; }
+.tb-projects { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--s-3); }
+.tb-project { position: relative; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); min-width: 0; }
+.tb-project:hover { border-color: var(--border-strong); }
+.tb-project.is-archived { opacity: 0.7; }
+.tb-project-open { display: flex; flex-direction: column; gap: var(--s-2); width: 100%; padding: var(--s-4); padding-right: calc(var(--s-4) + 32px); background: none; border: 0; color: inherit; text-align: left; cursor: pointer; border-radius: inherit; }
+.tb-project-name { font-weight: var(--fw-bold); font-size: var(--fs-md); overflow-wrap: anywhere; }
+.tb-project-desc { color: var(--text-2); font-size: var(--fs-xs); overflow-wrap: anywhere; }
+.tb-project-pct { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); }
+.tb-project-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1) var(--s-3); font-size: var(--fs-xs); color: var(--text-2); }
+.tb-project-menu { position: absolute; top: var(--s-2); right: var(--s-2); }
+.tb-archived { display: flex; flex-direction: column; gap: var(--s-2); align-items: flex-start; }
+.tb-archived > .tb-projects { align-self: stretch; }
+
+.tb-search { position: relative; min-width: 180px; flex: 0 1 280px; }
+.tb-search input { width: 100%; min-height: 34px; padding: 0 var(--s-3) 0 30px; border: 1px solid var(--border); border-radius: var(--r-full); background: var(--bg); color: var(--text); font-size: var(--fs-sm); }
+.tb-search input:focus { border-color: var(--focus); outline: none; box-shadow: 0 0 0 3px var(--accent-dim); }
+.tb-search-icon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--text-3); pointer-events: none; }
+.tb-search-results { position: absolute; z-index: 5; top: calc(100% + 4px); right: 0; width: min(440px, calc(100vw - 32px)); max-height: 60vh; overflow-y: auto; margin: 0; padding: var(--s-1); list-style: none; background: var(--bg); border: 1px solid var(--border-strong); border-radius: var(--r-md); box-shadow: var(--shadow-2); }
+.tb-search-results button { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); width: 100%; padding: var(--s-2); background: none; border: 0; border-radius: var(--r-sm); color: var(--text); text-align: left; cursor: pointer; font-size: var(--fs-sm); }
+.tb-search-results li.active button, .tb-search-results button:hover { background: var(--surface-2); }
+.tb-search-title { flex: 1; min-width: 0; overflow-wrap: anywhere; }
+.tb-search-where { flex-basis: 100%; font-size: var(--fs-xs); overflow-wrap: anywhere; }
+.tb-search-none { padding: var(--s-2); font-size: var(--fs-sm); }
+
+/* A project: its header, then one column per status. */
+.tb-bar-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); }
+.tb-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2); min-width: 0; }
+.tb-title h2 { margin: 0; font-size: var(--fs-lg); overflow-wrap: anywhere; }
+.tb-stats { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); }
+.tb-scroll { overflow-x: auto; margin: 0 calc(-1 * var(--s-2)); padding: 0 var(--s-2) var(--s-2); }
+/* #2299: 176 px a column fits all five beside the sidebar from 1280 px wide (220 px cut Done off at 1366). */
+.tb-columns { display: grid; grid-template-columns: repeat(5, minmax(176px, 1fr)); gap: var(--s-3); align-items: start; min-width: min-content; }
+.tb-col { display: flex; flex-direction: column; gap: var(--s-2); min-height: 120px; padding: var(--s-2); border-radius: var(--r-lg); background: var(--surface); border: 1px dashed transparent; }
+.tb-col.can-drop { border-color: var(--border); }
+.tb-col.over { border-color: var(--accent); background: var(--accent-dim); }
+.tb-col-head { display: flex; align-items: center; gap: var(--s-2); margin: 0; padding: var(--s-1) var(--s-1) 0; font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--text-2); text-transform: uppercase; letter-spacing: 0.04em; }
+.tb-col-head .tb-link { text-transform: none; letter-spacing: 0; font-weight: var(--fw-regular); }
+.tb-count { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--text-3); }
+.tb-drop-line { height: 3px; border-radius: 2px; background: var(--accent); }
+
+.tb-tile { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-3); border-radius: var(--r-md); background: var(--bg); border: 1px solid var(--border); border-left: 3px solid var(--text-3); cursor: pointer; font-size: var(--fs-sm); min-width: 0; }
+.tb-tile:hover { border-color: var(--border-strong); }
+.tb-tile.st-claimed { border-left-color: var(--accent); }
+.tb-tile.st-blocked { border-left-color: var(--danger); }
+.tb-tile.st-review { border-left-color: var(--warn); }
+.tb-tile.st-done { border-left-color: var(--ok); }
+.tb-tile.dragging { opacity: 0.4; }
+.tb-tile.flash { animation: tb-flash 1.6s var(--ease); }
+@keyframes tb-flash { from { box-shadow: 0 0 0 3px var(--accent-dim); background: var(--accent-dim); } to { box-shadow: none; } }
+.tb-tile-top { display: flex; align-items: center; gap: var(--s-2); }
+.tb-size { font-size: var(--fs-xs); color: var(--text-3); }
+/* The tile's control: its title, a plain-looking button (Enter opens the card, Alt+arrows move it). */
+.tb-tile-title { display: block; width: 100%; padding: 0; background: none; border: 0; border-radius: var(--r-sm); color: var(--text); font: inherit; font-weight: var(--fw-medium); text-align: left; cursor: pointer; overflow-wrap: anywhere; }
+.tb-tile-title:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
+.tb-tile:has(.tb-tile-title:focus-visible) { border-color: var(--focus); }
+.tb-tile-note { display: flex; gap: var(--s-1); align-items: flex-start; font-size: var(--fs-xs); color: var(--text-2); overflow-wrap: anywhere; }
+/* A main task's sub task at work now (its worker in the foot), and what a card waiting for you still lacks. */
+.tb-tile-now { display: flex; align-items: baseline; gap: var(--s-1); min-width: 0; font-size: var(--fs-xs); color: var(--text-2); }
+.tb-now-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.tb-now-label { flex-shrink: 0; font-size: 11px; font-weight: var(--fw-semibold); color: var(--text-2); }
+.tb-now-label.st-claimed { color: var(--accent); }
+.tb-now-label.st-blocked { color: var(--danger); }
+.tb-now-label.st-review { color: var(--warn); }
+.tb-tag.wrapup { background: var(--warn-bg); color: var(--warn); }
+.tb-wait-reason.wrapup, .tc-hint.wrapup { color: var(--warn); }
+.tb-wait-asked { flex-basis: 100%; font-size: var(--fs-xs); }
+.tc-now { display: flex; align-items: baseline; gap: var(--s-2); width: 100%; padding: 0; background: none; border: 0; color: var(--text); text-align: left; cursor: pointer; font-size: var(--fs-sm); }
+.tc-now:hover .tc-child-title { text-decoration: underline; }
+.tb-tile-note.st-blocked { color: var(--danger); }
+.tb-tile-progress { display: flex; align-items: center; gap: var(--s-2); width: 100%; padding: 0; background: none; border: 0; color: var(--text-2); font-size: var(--fs-xs); cursor: pointer; }
+.tb-tile-progress > span { white-space: nowrap; }
+.tb-tile-progress > .tb-bar { flex: 1; min-width: 40px; }
+.tb-subs { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--border); padding-top: var(--s-2); }
+.tb-subs button { display: flex; align-items: center; gap: var(--s-2); width: 100%; padding: 2px var(--s-1); background: none; border: 0; border-radius: var(--r-sm); color: var(--text); text-align: left; cursor: pointer; font-size: var(--fs-xs); }
+.tb-subs button:hover { background: var(--surface-2); }
+.tb-sub-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.tb-sub-blocked { padding-left: 22px; font-size: var(--fs-xs); color: var(--danger); overflow-wrap: anywhere; }
+.tb-sub-more { font-size: var(--fs-xs); padding-left: var(--s-1); }
+.tb-tile-foot { display: flex; align-items: center; gap: var(--s-2); }
+.tb-tile-foot > .tb-who { flex: 1; min-width: 0; max-width: none; }
+.tb-tile-stats { display: inline-flex; gap: var(--s-2); font-size: var(--fs-xs); color: var(--text-3); }
+.tb-tile-stats > span { display: inline-flex; align-items: center; gap: 2px; }
+.tb-tile-stats > .all { color: var(--ok); }
+.tb-tile-stats > .reply { color: var(--accent); }
+
+/* One card, in the app's dialog. */
+.tc { display: flex; flex-direction: column; gap: var(--s-3); min-width: 0; }
+.tc-head { display: flex; align-items: center; gap: var(--s-2); }
+.tc-title { flex: 1; min-width: 0; padding: var(--s-1) var(--s-2); margin-left: calc(-1 * var(--s-2)); background: none; border: 1px solid transparent; border-radius: var(--r-sm); color: var(--text); font: inherit; font-size: var(--fs-lg); font-weight: var(--fw-semibold); text-align: left; cursor: text; overflow-wrap: anywhere; }
+.tc-title:hover { border-color: var(--border); }
+.tc-title-input { flex: 1; min-width: 0; padding: var(--s-1) var(--s-2); border: 1px solid var(--focus); border-radius: var(--r-sm); background: var(--bg); color: var(--text); font-size: max(16px, var(--fs-lg)); font-weight: var(--fw-semibold); }
+.tc-ver { font-size: var(--fs-xs); }
+.tc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); padding-bottom: var(--s-3); border-bottom: 1px solid var(--border); }
+.tc-hint { font-size: var(--fs-xs); }
+.tc-meta { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--s-2) var(--s-4); margin: 0; font-size: var(--fs-sm); align-items: center; }
+.tc-meta dt { color: var(--text-2); }
+.tc-meta dd { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin: 0; min-width: 0; }
+.tc-value { color: var(--text); overflow-wrap: anywhere; }
+.tc-dep { padding: 1px var(--s-2); border: 1px solid var(--ok); border-radius: var(--r-full); background: none; color: var(--ok); font-family: var(--font-mono); font-size: var(--fs-xs); cursor: pointer; }
+.tc-dep.waiting { border-color: var(--warn); color: var(--warn); }
+.tc-field h3 { margin: 0 0 var(--s-1); font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--text-2); text-transform: uppercase; letter-spacing: 0.04em; }
+.tc-field.tone-blocked h3 { color: var(--danger); }
+.tc-text { display: block; width: 100%; padding: var(--s-2); background: none; border: 1px solid transparent; border-radius: var(--r-sm); color: var(--text); font: inherit; font-size: var(--fs-sm); text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; cursor: text; }
+.tc-text:hover { border-color: var(--border); background: var(--surface); }
+.tc-text.empty { color: var(--text-3); }
+.tc-edit textarea, .tc-composer textarea, .tc-quick-add { width: 100%; padding: var(--s-2); border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--bg); color: var(--text); font-size: var(--fs-sm); resize: vertical; }
+.tc-edit textarea:focus, .tc-composer textarea:focus, .tc-quick-add:focus { border-color: var(--focus); outline: none; box-shadow: 0 0 0 3px var(--accent-dim); }
+.tc-edit-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin-top: var(--s-1); font-size: var(--fs-xs); }
+.tc-counter { font-variant-numeric: tabular-nums; color: var(--text-3); }
+.tc-counter.over { color: var(--danger); font-weight: var(--fw-semibold); }
+.tc-checklist { display: flex; flex-direction: column; gap: var(--s-1); margin: 0 0 var(--s-1); padding: 0; list-style: none; }
+.tc-checklist .done { color: var(--text-3); text-decoration: line-through; }
+.tc-children { display: flex; flex-direction: column; gap: 2px; margin: 0 0 var(--s-2); padding: 0; list-style: none; }
+.tc-children button { display: flex; align-items: center; gap: var(--s-2); width: 100%; padding: var(--s-1) var(--s-2); background: none; border: 0; border-radius: var(--r-sm); color: var(--text); text-align: left; cursor: pointer; font-size: var(--fs-sm); }
+.tc-children button:hover { background: var(--surface); }
+.tc-child-title { flex: 1; min-width: 0; overflow-wrap: anywhere; }
+.tc-tabs { padding: 0; margin: var(--s-2) 0 0; max-width: none; }
+.tc-feed { display: flex; flex-direction: column; gap: var(--s-1); margin: 0; padding: 0; list-style: none; font-size: var(--fs-sm); overflow-wrap: anywhere; }
+.tc-comments { display: flex; flex-direction: column; gap: var(--s-2); }
+.tc-comment { padding: var(--s-2) var(--s-3); border-radius: var(--r-md); background: var(--surface); font-size: var(--fs-sm); }
+.tc-comment.person { background: var(--accent-dim); }
+.tc-comment-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin-bottom: 2px; font-size: var(--fs-xs); }
+.tc-comment-body { white-space: pre-wrap; overflow-wrap: anywhere; }
+.tc-composer { display: flex; gap: var(--s-2); align-items: flex-end; }
+
+@media (max-width: 899px) {
+  /* A phone stacks the columns: no sideways scrolling, and a card moves through its dialog's "Move to…". */
+  .tb-scroll { overflow-x: visible; margin: 0; padding: 0; }
+  .tb-columns { grid-template-columns: minmax(0, 1fr); min-width: 0; }
+  .tb-col { min-height: 0; }
+  .tb-form-row { grid-template-columns: minmax(0, 1fr); }
+  .tb-search { flex: 1 1 100%; }
+  /* #2299: a phone's waiting row: pill and title on one line, the actions under them (assignee left, buttons right). */
+  .tb-wait-main > .tb-pill { min-width: 0; }
+  .tb-wait-actions { flex-basis: 100%; margin-left: 0; }
+  .tb-wait-actions > .muted { margin-right: auto; }
+  /* #2299: on the board its toasts come in above the tabs, not over its title, search and progress — unless a card's
+     sheet is open (its buttons are at the bottom). */
+  .shell:has(.tb-home, .tb-board-page):not(:has(dialog[open])) .toasts { top: auto; bottom: calc(56px + env(safe-area-inset-bottom) + var(--s-3)); }
+  /* …and they do not pile down the board: an older confirmation gives way to two newer toasts; an error never does. */
+  .shell:has(.tb-home, .tb-board-page) .toasts > .toast.ok:nth-last-child(n+3) { display: none; }
+}
+@media (prefers-reduced-motion: reduce) {
+  .tb-tile.flash { animation: none; }
+  .tb-chev { transition: none; }
+}

package/dist/ui/shared/app.js

@@ -8,7 +8,7 @@
 // #1665 first: the host's preferences go into this browser's cache before any module below reads its key.
 import { bootPrefs } from "./app-prefs.js";
 import { html, render } from "./app-html.js";
-import { Shell, handleKey, showDialog, closeDrawer, openDrawer, shellStore, retryable, setNewInstanceOpener } from "./app-shell.js";
+import { Shell, handleKey, handleSearchKey, showDialog, closeDrawer, openDrawer, shellStore, retryable, setNewInstanceOpener } from "./app-shell.js";
 import { installSwipe } from "./app-swipe.js";
 import { startRouter, navStore, navigate } from "./app-nav.js";
 import { createStream } from "./app-stream.js";
@@ -123,6 +123,8 @@ if (!guest) installOwnerCss();
 }
 
 document.addEventListener("keydown", handleKey);
+// #2293: Ctrl+K / ⌘K (and Ctrl+F in a chat) — an admin's full app only; the server refuses a guest's search anyway.
+if (mode === "full" && !guest) document.addEventListener("keydown", handleSearchKey);
 // #1605: on a phone (the sidebar is a drawer), swipe right in the main area to open it, left to close it — the same
 // open/close as ☰ and the scrim. Nothing that owns a sideways drag (code, tables, the terminal, inputs, dialogs) and
 // never the left edge (iOS: "back").

package/dist/ui/shared/ui-toast.js

@@ -1,5 +1,6 @@
-// Toasts: one stack in a corner (under the header on a phone), each gone after a few seconds. Text only.
-import { html, useEffect, useState } from "./app-html.js";
+// Toasts: one stack in a corner (under the header on a phone; above the tabs on the task board), each gone after a few
+// seconds. Text only. A manual popover, so it stands in the top layer above an open dialog (#2299).
+import { html, useEffect, useRef, useState } from "./app-html.js";
 import { createStore } from "./app-store.js";
 
 const toasts = createStore([]);
@@ -14,5 +15,17 @@ export function toast(text, ok = true) {
 export function Toasts() {
   const [list, setList] = useState(toasts.get());
   useEffect(() => toasts.subscribe(setList), []);
-  return html`<div data-trust="toast" class="toasts" role="status" aria-live="polite">${list.map(x => html`<div key=${x.id} class=${`toast ${x.ok ? "ok" : "err"}`}>${x.text}</div>`)}</div>`;
+  // #2299: a manual popover — in the top layer, so an open modal dialog's backdrop does not dim a toast (it did: grey on
+  // grey in the dark theme). Shown again on every new toast, so it is above a dialog opened since. Without popover
+  // support it stays an ordinary fixed box, as before.
+  const box = useRef(null);
+  useEffect(() => {
+    const el = box.current;
+    if (!el || typeof el.showPopover !== "function") return;
+    try {
+      if (el.matches(":popover-open")) el.hidePopover();
+      if (list.length) el.showPopover();
+    } catch { /* a popover that cannot be shown stays where it is */ }
+  }, [list]);
+  return html`<div ref=${box} popover="manual" data-trust="toast" class="toasts" role="status" aria-live="polite">${list.map(x => html`<div key=${x.id} class=${`toast ${x.ok ? "ok" : "err"}`}>${x.text}</div>`)}</div>`;
 }

package/dist/web-api.d.ts

@@ -11,6 +11,7 @@ import type { WebAppearance } from "./web-appearance.js";
 import type { SendOpts } from "./channel/types.js";
 import type { IncomingMessage, ServerResponse } from "node:http";
 import type { LifecycleCreateArgs } from "./instance-lifecycle.js";
+import { type Actor as BoardActor, type TaskBoard } from "./scheduler/task-board.js";
 import { type PreviewAvailability } from "./web-preview.js";
 import { type WebChatHistory, type WebChatMessage } from "./web-chat-history.js";
 import { type WebFileLedger } from "./web-upload.js";
@@ -60,6 +61,9 @@ export interface WebApiContext {
             usage_report_on_public_link?: boolean;
             upload_max_file_mb?: number;
             upload_max_total_mb?: number;
+            search?: {
+                enabled?: boolean;
+            };
         };
         defaults?: {
             backend?: string;
@@ -149,6 +153,10 @@ export interface WebApiContext {
     emitSseEvent(event: string, data: unknown): void;
     /** The web chat's recent messages (history + SSE replay); absent in contexts that have no chat. */
     readonly webChatHistory?: WebChatHistory;
+    /** #2293: the global search index (null or absent: off — web.search.enabled false — or not started). */
+    readonly searchIndex?: Pick<import("./search/search-index.js").SearchIndex, "query" | "context" | "status"> | null;
+    /** #2293: whose cross-instance messages search leaves out now (cross_instance_visibility "hidden"; see searchVisibility). */
+    searchVisibility?(): import("./search/search-docs.js").XmsgVisibility;
     /** Uploads and the files the dashboard may fetch back (web track C2); absent: no file routes. */
     readonly webFiles?: WebFileLedger;
     /** #1630: a cached avatar (an own bot's, or the picture uploaded in View) — never a fetch; null when there is none. */
@@ -332,10 +340,12 @@ export interface WebApiContext {
                 priority?: string;
                 assignee?: string;
                 created_by: string;
-            }): unknown;
-            updateTask(id: string, params: Record<string, unknown>): unknown;
-            claimTask(id: string, assignee: string): unknown;
-            completeTask(id: string, result?: string): unknown;
+            }, by?: BoardActor): unknown;
+            updateTask(id: string, params: Record<string, unknown>, by?: BoardActor): unknown;
+            claimTask(id: string, assignee: string, by?: BoardActor): unknown;
+            completeTask(id: string, result?: string, by?: BoardActor): unknown;
+            /** The task board on the same table (scheduler/task-board.ts); absent in a hand-built context. */
+            board?: TaskBoard;
         };
         list(target?: string): unknown[];
         create(params: unknown): unknown;