@oar-sh/oar 0.9.14 → 0.9.16

package/server/public/app/relay-schedule-view.mjs

@@ -0,0 +1,119 @@
+// Relay schedules in the browser: the "scheduled" marker on a conversation's
+// sidebar row and the header's "N scheduled" chip with its list and Cancel
+// buttons.
+//
+// DOM-free on purpose, like relay-event-view.mjs: the callers own the
+// elements, this module owns the decisions and the markup.
+//
+// The interval words mirror shared/relay-schedules.mjs, which the browser
+// cannot import (only server/public is served); relay-schedule-view.test.mjs
+// holds the two together.
+
+export const RELAY_SCHEDULE_SOCKET_EVENT = 'relay_schedules';
+export const RELAY_SCHEDULE_MESSAGE_KIND = 'relay-schedule';
+
+function defaultEscape(value) {
+  return String(value ?? '')
+    .replace(/&/g, '&')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+}
+
+function defaultFormatTime(iso) {
+  const at = new Date(iso);
+  if (!Number.isFinite(at.getTime())) return '';
+  const sameDay = new Date().toDateString() === at.toDateString();
+  return at.toLocaleString([], sameDay
+    ? { hour: '2-digit', minute: '2-digit' }
+    : { weekday: 'short', day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' });
+}
+
+function activeList(schedules) {
+  return (Array.isArray(schedules) ? schedules : []).filter((schedule) => schedule && schedule.id && !schedule.endedAt);
+}
+
+/** "every 30 min", "every 2 h", "every day", "every 7 days". */
+export function describeScheduleInterval(everyMinutes) {
+  const minutes = Number(everyMinutes);
+  if (!(minutes > 0)) return '';
+  if (minutes % 1440 === 0) return minutes === 1440 ? 'every day' : `every ${minutes / 1440} days`;
+  if (minutes % 60 === 0) return minutes === 60 ? 'every hour' : `every ${minutes / 60} h`;
+  return `every ${minutes} min`;
+}
+
+/** The schedules that fire into a conversation. */
+export function schedulesInto(schedules, conversationId) {
+  const id = String(conversationId || '').trim();
+  if (!id) return [];
+  return activeList(schedules).filter((schedule) => schedule.session?.id === id);
+}
+
+/** The schedules that fire into a conversation or that it set for another. */
+export function schedulesOf(schedules, conversationId) {
+  const id = String(conversationId || '').trim();
+  if (!id) return [];
+  return activeList(schedules).filter((schedule) => schedule.session?.id === id || schedule.setBy?.id === id);
+}
+
+/** "every 30 min · next 10:30", or "once · 06:30". */
+export function describeScheduleWhen(schedule, { formatTime = defaultFormatTime } = {}) {
+  const next = schedule?.nextFireAt ? formatTime(schedule.nextFireAt) : '';
+  const every = schedule?.once ? '' : describeScheduleInterval(schedule?.everyMinutes);
+  if (every) return next ? `${every} · next ${next}` : every;
+  return next ? `once · ${next}` : 'once';
+}
+
+/** The earliest next time among the schedules, or null. */
+export function nextScheduledAt(schedules) {
+  const times = activeList(schedules).map((schedule) => Date.parse(schedule.nextFireAt || '')).filter(Number.isFinite);
+  return times.length ? new Date(Math.min(...times)).toISOString() : null;
+}
+
+export function scheduleChipText(schedules) {
+  const count = activeList(schedules).length;
+  return count ? `${count} scheduled` : '';
+}
+
+function conversationTitle(conversations, id, fallback = '') {
+  const title = String(conversations?.[id]?.title || fallback || '').trim();
+  return title || `session ${String(id).slice(0, 8)}`;
+}
+
+/** The sidebar's marker for a conversation a schedule fires into, or ''. */
+export function renderScheduledBadgeHtml(schedules, conversationId, { escHtml = defaultEscape, formatTime = defaultFormatTime } = {}) {
+  const into = schedulesInto(schedules, conversationId);
+  if (!into.length) return '';
+  const next = nextScheduledAt(into);
+  const hint = `${into.length} schedule${into.length === 1 ? '' : 's'}${next ? ` · next ${formatTime(next)}` : ''}`;
+  return `<span class="conv-scheduled-badge" title="${escHtml(hint)}">scheduled</span>`;
+}
+
+/**
+ * The chip's list for the conversation on screen: one row per schedule, what
+ * it is called and sends, where it goes or who set it, when it fires next,
+ * and its Cancel button.
+ */
+export function renderSchedulePanelHtml(schedules, conversationId, { conversations = null, escHtml = defaultEscape, formatTime = defaultFormatTime } = {}) {
+  const id = String(conversationId || '').trim();
+  const rows = schedulesOf(schedules, id).map((schedule) => {
+    const name = String(schedule.title || '').trim() || String(schedule.text || '').trim().split(/\r?\n/)[0] || schedule.id;
+    const where = schedule.session?.id !== id
+      ? `for ${conversationTitle(conversations, schedule.session?.id, schedule.session?.title)}`
+      : (schedule.setBy?.id ? `set by ${conversationTitle(conversations, schedule.setBy.id, schedule.setBy.title)}` : '');
+    // Held: its setter's agent has prompted other agents as often as it may
+    // before you write in that conversation.
+    const held = schedule.heldForApproval
+      ? `waiting until you write in ${conversationTitle(conversations, schedule.setBy?.id, schedule.setBy?.title)}`
+      : '';
+    const details = [held || describeScheduleWhen(schedule, { formatTime }), where, schedule.skippedCount ? `${schedule.skippedCount} skipped` : '']
+      .filter(Boolean).join(' · ');
+    return '<li class="relay-watch-item relay-schedule-item">'
+      + `<span class="relay-watch-what" title="${escHtml(schedule.text || '')}">${escHtml(name)}</span>`
+      + `<span class="relay-watch-events">${escHtml(details)}</span>`
+      + `<button type="button" class="relay-schedule-cancel" data-schedule-id="${escHtml(schedule.id)}">Cancel</button>`
+      + '</li>';
+  }).join('');
+  return `<ul class="relay-watch-list">${rows}</ul>`;
+}

package/server/public/app/relay-schedules-ui.js

@@ -0,0 +1,172 @@
+// Relay schedules on the page: the header's "N scheduled" chip with its list
+// and Cancel buttons (on a conversation a schedule fires into or that set
+// one), and the "scheduled" marker on the sidebar row of a conversation a
+// schedule fires into. The relay sends the whole active list on every change
+// (socket `relay_schedules`); the page loads it once at start.
+
+import { apiFetch } from './api-client.js';
+import { conversations, currentConvId, escHtml, IS_SHARED_VIEW, showTransientRelayNotice } from './store.js';
+import {
+  nextScheduledAt,
+  renderScheduledBadgeHtml,
+  renderSchedulePanelHtml,
+  scheduleChipText,
+  schedulesOf,
+} from './relay-schedule-view.mjs';
+
+let schedules = [];
+let renderedChipKey = '';
+let panelOpen = false;
+let panelConversationId = '';
+const changeListeners = new Set();
+
+/** Runs after every change of the list (the sidebar re-renders its markers). */
+export function onRelaySchedulesChanged(listener) {
+  changeListeners.add(listener);
+  return () => changeListeners.delete(listener);
+}
+
+export function applyRelaySchedules(list) {
+  schedules = Array.isArray(list) ? list.filter((schedule) => schedule && typeof schedule === 'object') : [];
+  syncRelayScheduleHeader();
+  for (const listener of changeListeners) {
+    try { listener(schedules); } catch {}
+  }
+}
+
+export async function loadRelaySchedules() {
+  if (IS_SHARED_VIEW) return;
+  const response = await apiFetch('/api/relay-schedules');
+  if (response && Array.isArray(response.schedules)) applyRelaySchedules(response.schedules);
+}
+
+/** The sidebar's marker for one conversation. */
+export function relayScheduleMarkerHtml(conversationId) {
+  if (IS_SHARED_VIEW) return '';
+  return renderScheduledBadgeHtml(schedules, conversationId, { escHtml });
+}
+
+async function cancelSchedule(scheduleId, button) {
+  if (!scheduleId) return;
+  if (button) button.disabled = true;
+  const response = await apiFetch(`/api/relay-schedules/${encodeURIComponent(scheduleId)}`, { method: 'DELETE' });
+  if (!response?.ok) {
+    if (button) button.disabled = false;
+    showTransientRelayNotice?.('The schedule could not be cancelled. Try again in a moment.');
+    return;
+  }
+  // The socket brings the new list; this page does not wait for it.
+  applyRelaySchedules(schedules.filter((schedule) => schedule.id !== scheduleId));
+}
+
+// A fixed popover on <body>, placed under the chip, like the subscriptions'
+// list: the title slot clips its overflow.
+function ensurePanel() {
+  let panel = document.getElementById('relay-schedule-panel');
+  if (panel) return panel;
+  panel = document.createElement('div');
+  panel.id = 'relay-schedule-panel';
+  panel.className = 'relay-watch-panel';
+  panel.hidden = true;
+  document.body.appendChild(panel);
+  panel.addEventListener('click', (event) => {
+    const target = event.target instanceof Element ? event.target : null;
+    const cancelButton = target?.closest?.('.relay-schedule-cancel');
+    if (!cancelButton) return;
+    void cancelSchedule(cancelButton.getAttribute('data-schedule-id'), cancelButton);
+  });
+  document.addEventListener('click', (event) => {
+    if (!panelOpen) return;
+    // composedPath: a Cancel click may have re-rendered the panel already.
+    const path = event.composedPath();
+    if (path.includes(panel) || path.some((node) => node instanceof Element && node.classList.contains('relay-schedule-chip'))) return;
+    setPanelOpen(false);
+  });
+  document.addEventListener('keydown', (event) => {
+    if (!panelOpen || event.key !== 'Escape') return;
+    event.stopPropagation();
+    setPanelOpen(false);
+    document.querySelector('#chat-title-relay-schedules .relay-schedule-chip')?.focus?.();
+  }, true);
+  window.addEventListener('resize', () => { if (panelOpen) placePanel(); });
+  return panel;
+}
+
+function setPanelOpen(open) {
+  panelOpen = Boolean(open);
+  renderedChipKey = '';
+  syncRelayScheduleHeader();
+}
+
+function placePanel() {
+  const panel = document.getElementById('relay-schedule-panel');
+  const chip = document.querySelector('#chat-title-relay-schedules .relay-schedule-chip');
+  if (!panel || panel.hidden) return;
+  const rect = chip?.getBoundingClientRect?.();
+  if (!rect || (!rect.width && !rect.height)) {
+    panel.hidden = true;
+    return;
+  }
+  const margin = 8;
+  const viewportWidth = document.documentElement.clientWidth || window.innerWidth;
+  const top = Math.round(rect.bottom + 4);
+  panel.style.top = `${top}px`;
+  panel.style.maxHeight = `${Math.max(120, window.innerHeight - top - margin)}px`;
+  panel.style.left = '0px';
+  const width = panel.offsetWidth;
+  const left = Math.max(margin, Math.min(rect.left, viewportWidth - width - margin));
+  panel.style.left = `${Math.round(left)}px`;
+}
+
+function ensureHeaderElements() {
+  const slot = document.getElementById('chat-title-slot');
+  if (!slot) return null;
+  let line = document.getElementById('chat-title-relay-schedules');
+  if (!line) {
+    line = document.createElement('span');
+    line.id = 'chat-title-relay-schedules';
+    line.hidden = true;
+    const after = document.getElementById('chat-title-relay-events') || document.getElementById('chat-title-origin');
+    if (after?.nextSibling) slot.insertBefore(line, after.nextSibling);
+    else slot.appendChild(line);
+    line.addEventListener('click', (event) => {
+      const target = event.target instanceof Element ? event.target : null;
+      if (target?.closest?.('.relay-schedule-chip')) {
+        event.stopPropagation();
+        setPanelOpen(!panelOpen);
+      }
+    });
+  }
+  return line;
+}
+
+/** The header's chip for the conversation on screen. Idempotent. */
+export function syncRelayScheduleHeader() {
+  const line = ensureHeaderElements();
+  if (!line) return;
+  const panel = ensurePanel();
+  const id = String(currentConvId || '').trim();
+  // Another conversation on screen closes the list.
+  if (id !== panelConversationId) panelOpen = false;
+  panelConversationId = id;
+  const mine = IS_SHARED_VIEW || !id ? [] : schedulesOf(schedules, id);
+  const chipText = scheduleChipText(mine);
+  if (!chipText) panelOpen = false;
+  const key = JSON.stringify([id, chipText, panelOpen, mine.map((schedule) => [schedule.id, schedule.nextFireAt, schedule.skippedCount || 0])]);
+  if (key === renderedChipKey) return;
+  renderedChipKey = key;
+  if (!chipText) {
+    line.hidden = true;
+    line.innerHTML = '';
+    panel.hidden = true;
+    panel.innerHTML = '';
+    return;
+  }
+  const next = nextScheduledAt(mine);
+  const nextText = next ? new Date(next).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }) : '';
+  line.innerHTML = `<button type="button" class="relay-watch-chip relay-schedule-chip" aria-expanded="${panelOpen ? 'true' : 'false'}" aria-controls="relay-schedule-panel" title="Prompts the relay queues at set times (agents set them with remote_relay schedule)">⏰ ${escHtml(chipText)}${nextText ? ` <span class="relay-watch-hint">next ${escHtml(nextText)}</span>` : ''}</button>`;
+  line.hidden = false;
+  panel.innerHTML = panelOpen ? renderSchedulePanelHtml(schedules, id, { conversations, escHtml }) : '';
+  panel.hidden = !panelOpen;
+  if (panelOpen) placePanel();
+}

package/server/public/app/settings-modal.js

@@ -1502,6 +1502,11 @@ const WINDOWS_BOOT_CUSTOMISATION_LABELS = Object.freeze({
   'boot-delay': 'boot delay',
   launcher: 'launcher edited or from an older OAR',
   'launcher-missing': 'launcher missing',
+  user: 'account',
+  'run-level': 'run level',
+  settings: 'settings',
+  other: 'other parts',
+  unreadable: 'unreadable',
 });
 
 function windowsAutostartStatusText() {
@@ -1511,21 +1516,30 @@ function windowsAutostartStatusText() {
   }
   if (boot?.lastError) return boot.lastError;
   if (boot?.readError) return `The boot task could not be read: ${boot.readError}`;
+  const [startupEntry] = windowsAutostartState?.signinHandMade || [];
+  if (startupEntry) {
+    const starts = startupEntry.otherInstall ? ` (it starts the OAR install in ${startupEntry.otherInstall})` : '';
+    return `A Startup entry OAR did not make is there: ${startupEntry.path}${starts}. OAR leaves it as it is; to replace it, keeping a copy: oar autostart signin --replace.`;
+  }
   if (windowsAutostartState?.mode === 'boot' && windowsAutostartState?.signinEnabled) {
     return 'A sign-in Startup entry also exists and can double-start the relay. Re-select "At system startup" to clean it up.';
   }
+  // OAR never deletes or writes over an entry it did not make (as `oar autostart`).
+  const replaceHint = 'OAR leaves it as it is; to replace it, keeping a copy: oar autostart boot --replace';
   if (windowsAutostartState?.mode === 'boot' && boot?.customised) {
     const labels = (boot.customisations || []).map((name) => WINDOWS_BOOT_CUSTOMISATION_LABELS[name] || name);
-    return `The boot task or its launcher differs from what OAR generates (${labels.join(', ')}). Re-selecting "At system startup" regenerates both and keeps a changed launcher as a .bak copy.`;
+    return boot.handMade?.length
+      ? `The boot task or its launcher was changed by hand (${labels.join(', ')}). ${replaceHint}.`
+      : `The boot task or its launcher differs from what OAR generates (${labels.join(', ')}). Re-selecting "At system startup" regenerates it.`;
   }
   if (windowsAutostartState?.mode === 'boot' && boot?.launcherBackupPath) {
     return `The previous launcher was replaced and kept as ${boot.launcherBackupPath}.`;
   }
   if (boot?.taskStatus === 'foreign') {
-    return `A task named "${boot.taskName}" exists but was not created by OAR. Selecting "At system startup" replaces it.`;
+    return `A task named "${boot.taskName}" exists but was not created by OAR. ${replaceHint}.`;
   }
   if (boot?.legacyTaskPresent && windowsAutostartState?.mode !== 'boot') {
-    return 'A pre-rebrand boot task exists. Selecting "At system startup" migrates it (one admin confirmation).';
+    return `A pre-rebrand boot task exists. ${replaceHint}.`;
   }
   return '';
 }

package/server/public/app/socket-handlers.js

@@ -38,6 +38,9 @@ import { publishStatusEvent, recordStatusEvent } from './status-store.mjs';
 import { clearOpenConversation, renderConvList, refreshConversations, scheduleLoadedConversationsRefresh, applyConversationGroupEvent, openConversation } from './journal-view.js';
 import { applyBackgroundTasksToConversation, applyTurnStatusToConversation } from './conversation-turn-state.mjs';
 import { applyRelayEventSubscriptions, loadRelayEventSubscriptions } from './relay-event-subscriptions-ui.js';
+import { applyRelaySchedules, loadRelaySchedules } from './relay-schedules-ui.js';
+import { noteInboxQuestionsChanged, noteRelayAskUpdated, refreshInbox } from './inbox-ui.js';
+import { RELAY_ASK_SOCKET_EVENT } from './inbox-view.mjs';
 import {
   upsertRelayQuestion,
   loadRelayQuestions,
@@ -368,6 +371,10 @@ export async function connectSocket(overrideDeps) {
     void handleTaskConsoleReconnect();
     // Subscriptions that changed while away.
     void loadRelayEventSubscriptions();
+    // Schedules that changed or fired while away.
+    void loadRelaySchedules();
+    // Questions asked or answered while away.
+    void refreshInbox();
     // Shares made or stopped while away.
     void refreshShares().catch(() => {});
   });
@@ -618,11 +625,20 @@ export async function connectSocket(overrideDeps) {
     noteTranscriptLiveRow();
     keepLiveRow(conversationId, message, messageId);
   });
-  socket.on('relay_question', ({ question }) => upsertRelayQuestion(question));
-  socket.on('relay_question_updated', ({ question }) => upsertRelayQuestion(question));
+  socket.on('relay_question', ({ question }) => {
+    upsertRelayQuestion(question);
+    noteInboxQuestionsChanged();
+  });
+  socket.on('relay_question_updated', ({ question }) => {
+    upsertRelayQuestion(question);
+    noteInboxQuestionsChanged();
+  });
   socket.on('relay_question_changed', () => {
     loadRelayQuestions(currentConvId);
+    noteInboxQuestionsChanged();
   });
+  // Questions that don't block: one ask, after every change of it.
+  socket.on(RELAY_ASK_SOCKET_EVENT, (payload) => noteRelayAskUpdated(payload));
   socket.on('relay_board', ({ board }) => upsertRelayBoard(board));
   socket.on('relay_board_updated', ({ board }) => upsertRelayBoard(board));
   socket.on('relay_board_changed', () => {
@@ -632,6 +648,10 @@ export async function connectSocket(overrideDeps) {
   socket.on('relay_event_subscriptions', ({ subscriptions }) => {
     applyRelayEventSubscriptions(subscriptions);
   });
+  // Relay schedules: the whole active list, after every change.
+  socket.on('relay_schedules', ({ schedules }) => {
+    applyRelaySchedules(schedules);
+  });
   socket.on('background_tasks', ({ conversationId, tasks, endedTasks }) => {
     setConversationBackgroundTasks(conversationId, tasks, { endedTasks, event: true });
     // The sidebar's row (and its group's head) count background work as
@@ -799,7 +819,7 @@ export async function connectSocket(overrideDeps) {
     applyConversationTitleUpdate(conversationId, title, updatedAt);
     syncChatTitleControls();
   });
-  socket.on('conversation_preferences_updated', ({ conversationId, preferredRelayMode, preferredModel, preferredReasoningEffort, autoCompactWindow, thinkingEnabled, thinkingDisplay, senderClientId }) => {
+  socket.on('conversation_preferences_updated', ({ conversationId, preferredRelayMode, preferredModel, preferredReasoningEffort, autoCompactWindow, thinkingEnabled, thinkingDisplay, mayCreateSessions, senderClientId }) => {
     if (senderClientId && senderClientId === CLIENT_ID) return;
     const id = String(conversationId || '').trim();
     if (!id || !conversations[id]) return;
@@ -821,6 +841,10 @@ export async function connectSocket(overrideDeps) {
       thinkingDisplay: thinkingDisplay === undefined
         ? (conversations[id].thinkingDisplay ?? null)
         : (thinkingDisplay ?? null),
+      // The owner's "agents may start sessions"; an older relay omits it.
+      mayCreateSessions: typeof mayCreateSessions === 'boolean'
+        ? mayCreateSessions
+        : conversations[id].mayCreateSessions === true,
     };
     if (String(currentConvId || '').trim() === id) {
       applyConversationPreferencesForConversation(id, {

package/server/public/app/store.js

@@ -222,6 +222,16 @@ export function setCurrentConv(id) {
   updateCompactButton();
 }
 
+/**
+ * Forgets the kept empty groups before the list's first page names the ones
+ * still kept (one the owner dissolved meanwhile is not named again).
+ */
+export function forgetKeptEmptyConversationGroups() {
+  for (const [id, group] of Object.entries(conversationGroups)) {
+    if (group?.keptEmptyAt) delete conversationGroups[id];
+  }
+}
+
 /** Merges a list payload's `groups` (by id) into the known session groups. */
 export function mergeConversationGroups(groups) {
   if (!groups || typeof groups !== 'object') return;
@@ -240,13 +250,15 @@ export function forgetConversationGroup(groupId) {
 /**
  * Keeps only the groups that a loaded row still belongs to: after a list
  * refresh a dissolved group has no row left, and the picker must not offer
- * it. Returns the ids dropped.
+ * it. An owner's group an agent emptied (`keptEmptyAt`) has no row and
+ * stays: the list's first page names it while it is kept. Returns the ids
+ * dropped.
  */
 export function pruneConversationGroups(keepGroupIds) {
   const keep = new Set((Array.isArray(keepGroupIds) ? keepGroupIds : []).map((id) => String(id || '').trim()).filter(Boolean));
   const dropped = [];
   for (const id of Object.keys(conversationGroups)) {
-    if (keep.has(id)) continue;
+    if (keep.has(id) || conversationGroups[id]?.keptEmptyAt) continue;
     delete conversationGroups[id];
     dropped.push(id);
   }
@@ -1126,9 +1138,10 @@ function measureSidebarHeaderMinWidthPx() {
     sectionCount += 1;
   }
 
-  const statusButton = document.getElementById('status-btn');
-  if (isVisibleElement(statusButton)) {
-    const buttonStyle = window.getComputedStyle(statusButton);
+  for (const id of ['status-btn', 'inbox-btn']) {
+    const headerButton = document.getElementById(id);
+    if (!isVisibleElement(headerButton)) continue;
+    const buttonStyle = window.getComputedStyle(headerButton);
     neededWidth += Math.ceil(parseCssPx(buttonStyle.minWidth));
     sectionCount += 1;
   }

package/server/public/index.html

@@ -788,6 +788,151 @@
   }
   .status-empty { color: var(--muted); text-align: center; }
 
+  /* The Inbox: the sidebar button with its count, the view in the
+     transcript's place (status-view's frame), and the card a question that
+     does not block shows in its session. Every text in it is an agent's,
+     set as plain text. */
+  #inbox-btn {
+    flex: 0 0 auto;
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    min-width: 72px;
+    padding: 10px 12px;
+    background: var(--bg3);
+    color: var(--text);
+    border: 1px solid var(--border);
+    border-radius: 8px;
+    cursor: pointer;
+    font-weight: 600;
+    font-size: var(--fs-meta-md);
+    white-space: nowrap;
+  }
+  #inbox-btn:hover, #inbox-btn[aria-pressed="true"] { border-color: var(--accent); color: var(--accent); }
+  .inbox-count {
+    min-width: 18px;
+    padding: 1px 6px;
+    border-radius: 999px;
+    background: var(--accent);
+    color: var(--bg);
+    font-size: var(--fs-meta-xs);
+    font-variant-numeric: tabular-nums;
+    text-align: center;
+  }
+  .inbox-count:empty { display: none; }
+  body.inbox-view-active #input-area { display: none; }
+  body.inbox-view-active #pending-question-banner { display: none; }
+  .inbox-view { display: grid; gap: 14px; padding: 4px 0 24px; }
+  .inbox-filter { display: flex; gap: 6px; flex-wrap: wrap; }
+  .inbox-filter-option {
+    padding: 6px 12px;
+    border: 1px solid var(--border);
+    border-radius: 999px;
+    background: var(--bg2);
+    color: var(--text);
+    cursor: pointer;
+    font-size: var(--fs-meta-sm);
+  }
+  .inbox-filter-option.active { border-color: var(--accent); color: var(--accent); }
+  .inbox-relay { display: grid; gap: 10px; }
+  .inbox-relay-name { margin: 6px 0 0; font-size: var(--fs-meta-md); color: var(--muted); font-weight: 600; }
+  .inbox-relay-unreachable, .inbox-empty { margin: 0; color: var(--muted); font-size: var(--fs-meta-sm); }
+  .inbox-divider {
+    margin-top: 6px;
+    padding-top: 8px;
+    border-top: 1px dashed var(--border);
+    color: var(--muted);
+    font-size: var(--fs-meta-xs);
+    text-transform: uppercase;
+    letter-spacing: 0.04em;
+  }
+  .inbox-item {
+    display: grid;
+    gap: 8px;
+    min-width: 0;
+    padding: 12px 14px;
+    border: 1px solid var(--border);
+    border-radius: 10px;
+    background: var(--bg2);
+  }
+  .inbox-item[data-status="answered"], .inbox-item[data-status="dismissed"] { opacity: 0.75; }
+  .inbox-item-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; color: var(--muted); font-size: var(--fs-meta-xs); }
+  .inbox-item-kind { font-weight: 600; color: var(--accent); }
+  .inbox-item-urgent { color: var(--danger); font-weight: 600; text-transform: uppercase; }
+  .inbox-item-relay { padding: 0 6px; border: 1px solid var(--border); border-radius: 999px; }
+  .inbox-item-session { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; font-size: var(--fs-meta-sm); }
+  .inbox-open-session {
+    padding: 0;
+    border: 0;
+    background: none;
+    color: var(--accent);
+    cursor: pointer;
+    font: inherit;
+    text-align: left;
+    text-decoration: underline;
+  }
+  .inbox-open-there { color: var(--accent); }
+  .inbox-item-asker { color: var(--muted); }
+  .inbox-item-header { font-weight: 600; font-size: var(--fs-meta-sm); }
+  .inbox-item-question, .inbox-item-recommendation { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
+  .inbox-item-recommendation { color: var(--muted); font-size: var(--fs-meta-sm); }
+  .inbox-item-detail summary { cursor: pointer; color: var(--muted); font-size: var(--fs-meta-sm); }
+  .inbox-item-detail-text {
+    margin: 6px 0 0;
+    padding: 8px 10px;
+    max-height: 320px;
+    overflow: auto;
+    border-radius: 8px;
+    background: var(--bg3);
+    white-space: pre-wrap;
+    overflow-wrap: anywhere;
+    font-size: var(--fs-meta-sm);
+  }
+  .inbox-item-outcome { color: var(--success); font-size: var(--fs-meta-sm); overflow-wrap: anywhere; }
+  .inbox-item-options, .inbox-item-actions { display: flex; flex-wrap: wrap; gap: 8px; }
+  .inbox-item-reply { display: grid; gap: 8px; }
+  .inbox-answer-text {
+    width: 100%;
+    box-sizing: border-box;
+    padding: 8px 10px;
+    border: 1px solid var(--border);
+    border-radius: 8px;
+    background: var(--bg);
+    color: var(--text);
+    font: inherit;
+    resize: vertical;
+  }
+  .inbox-choice, .inbox-answer, .inbox-dismiss, .inbox-open-session-button, .inbox-open-there-button {
+    min-height: 36px;
+    padding: 6px 14px;
+    border: 1px solid var(--border);
+    border-radius: 8px;
+    background: var(--bg3);
+    color: var(--text);
+    cursor: pointer;
+    font: inherit;
+    text-decoration: none;
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+  }
+  .inbox-choice.recommended { border-color: var(--accent); }
+  .inbox-recommended-tag { color: var(--accent); font-size: var(--fs-meta-xs); }
+  .inbox-answer { border-color: var(--accent); color: var(--accent); }
+  .inbox-dismiss { color: var(--muted); }
+  .inbox-view button:disabled, .relay-ask-container button:disabled { opacity: 0.5; cursor: wait; }
+  .relay-ask-container { max-width: 760px; }
+  /* The phone: one column, buttons the full width. */
+  @media (max-width: 680px) {
+    #inbox-btn { min-width: 64px; padding: 9px 10px; }
+    .inbox-item-options, .inbox-item-actions { flex-direction: column; }
+    .inbox-choice, .inbox-answer, .inbox-dismiss, .inbox-open-session-button, .inbox-open-there-button {
+      width: 100%;
+      justify-content: center;
+    }
+    .inbox-item { padding: 12px; }
+  }
+
   #conv-list { flex: 1; overflow-y: auto; padding: 0 8px 8px; }
   .conv-list-footer {
     padding: 10px 12px 6px;
@@ -2508,6 +2653,9 @@
   .ctx-attribution-select { font-size: var(--fs-meta-sm); max-width: 100%; }
   .ctx-attribution-note { margin-top: 6px; font-size: var(--fs-meta-sm); color: var(--muted); line-height: 1.4; overflow-wrap: anywhere; }
   .ctx-attribution-note code { font-size: inherit; }
+  .ctx-agent-sessions { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 6px; }
+  .ctx-agent-sessions-row { display: flex; align-items: flex-start; gap: 8px; font-size: 0.85rem; cursor: pointer; }
+  .ctx-agent-sessions-row input { margin-top: 2px; }
   .ctx-thinking {
     margin-top: 14px;
     padding-top: 12px;
@@ -3789,11 +3937,17 @@
     font-size: var(--fs-meta-xs); line-height: 1.2; color: var(--muted); position: relative;
   }
   #chat-title-relay-events[hidden] { display: none; }
+  #chat-title-relay-schedules {
+    display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 2px;
+    font-size: var(--fs-meta-xs); line-height: 1.2; color: var(--muted); position: relative;
+  }
+  #chat-title-relay-schedules[hidden] { display: none; }
   .relay-watch-panel[hidden] { display: none; }
   .relay-watch-chip {
     font: inherit; color: var(--accent); background: transparent; cursor: pointer;
     border: 1px solid var(--border); border-radius: 10px; padding: 2px 8px;
   }
+  .relay-watch-hint { font-size: var(--fs-meta-xs); color: var(--muted); }
   .relay-watch-panel {
     position: fixed; top: 0; left: 0; z-index: 60; overflow-y: auto; box-sizing: border-box;
     min-width: min(260px, calc(100vw - 16px)); max-width: min(calc(100vw - 16px), 480px);
@@ -3809,11 +3963,13 @@
   .relay-watch-item:last-child { border-bottom: none; }
   .relay-watch-what { color: var(--text, inherit); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
   .relay-watch-events { grid-column: 1; font-size: var(--fs-ui-chip); }
-  .relay-watch-unsubscribe {
+  .relay-watch-unsubscribe,
+  .relay-schedule-cancel {
     grid-column: 2; grid-row: 1 / span 2; font: inherit; cursor: pointer;
     color: var(--danger); background: transparent; border: 1px solid var(--border); border-radius: 6px; padding: 4px 8px;
   }
-  .conv-watched-badge {
+  .conv-watched-badge,
+  .conv-scheduled-badge {
     flex: 0 0 auto; font-size: var(--fs-ui-chip); color: var(--accent);
     border: 1px solid var(--border); border-radius: 8px; padding: 0 5px;
   }
@@ -6876,6 +7032,7 @@
       <span id="cli-dot" title="CLI status"></span>
       <button id="new-conv-btn" onclick="newConversation()">+ New Chat</button>
       <button id="status-btn" type="button" onclick="window.toggleStatusView()">Status</button>
+      <button id="inbox-btn" type="button" onclick="window.toggleInboxView()" aria-label="Inbox" aria-pressed="false">Inbox<span id="inbox-count" class="inbox-count"></span></button>
       <div id="sidebar-actions">
         <button id="install-btn" class="header-icon-btn" onclick="promptInstallApp()" title="Install app to home screen" aria-label="Install app">⬇</button>
       </div>