npm - @galda/cli - Versions diffs - 0.10.17 → 0.10.20 - Mend

@galda/cli 0.10.17 → 0.10.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/CLAUDE.md +43 -1
package/app/index.html +376 -62
package/bin/manager-for-ai.mjs +18 -12
package/engine/lib.mjs +492 -12
package/engine/relay-client.mjs +137 -32
package/engine/server.mjs +445 -21
package/package.json +3 -3

package/app/index.html CHANGED Viewed

@@ -610,10 +610,14 @@
   .confetti-piece{position:fixed;pointer-events:none;z-index:9999;will-change:transform,opacity}
   /* connect modal */
-  .overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);z-index:90;display:none;place-items:center}
-  /* z-index:90 (was 60): the customize-panel discard confirm (#deleteConfirmOverlay, shares this
-     class) can now fire while .gearpop (the customize panel, z-index:80) is open — it was
-     rendering BEHIND the panel it's confirming a discard for (Masa 2026-07-16, real screenshot). */
+  /* A confirm dialog (deleteConfirmOverlay etc.) must always sit above other
+     floating chrome it can be opened from — was 60, then 90 (cleared .gearpop's
+     80 for the customize-panel discard confirm), but that still sat under the
+     context menu (95) and the settings panel rendered in front of its own Log
+     out confirm (Masa 指示 2026-07-16). 100 clears every other floating layer
+     (gearpop 80, context menu 95) while staying under true full-screen gates
+     (lightbox 200, #connectGate 1000). */
+  .overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);z-index:100;display:none;place-items:center}
   .overlay.show{display:grid}
   .modal{width:640px;max-width:92vw;background:var(--surface);border:1px solid var(--hair2);border-radius:16px;padding:20px 22px;box-shadow:0 24px 70px rgba(0,0,0,.6)}
   .modal h3{margin:0 0 6px;font-size:15px;letter-spacing:-.01em}
@@ -634,6 +638,10 @@
   .mbtn.danger{background:color-mix(in srgb,var(--danger) 10%,var(--panel));color:color-mix(in srgb,var(--danger) 78%,var(--ink));
     box-shadow:inset 0 0 0 1px rgba(var(--danger-rgb),.35)}
   .mbtn.danger:hover{box-shadow:inset 0 0 0 1px var(--danger);background:color-mix(in srgb,var(--danger) 16%,var(--panel))}
+  /* Neutral confirm (not destructive/AI — e.g. Log out): same ink-solid tone as
+     the settings Save button (.cfoot .cbtn.save), not the iri default (AI-only, §5.5). */
+  .mbtn.solid{background:var(--ink);color:var(--invink)}
+  .mbtn.solid:hover{opacity:.9}
   /* Slack-style centered delete confirmation (replaces native confirm() — restores a
      decision lost in the flagship rewrite; see docs/confirmed-behaviors.md). Deliberately
@@ -980,7 +988,7 @@
   .gearbtn{display:grid;place-items:center;width:30px;height:28px;border:1px solid var(--hair2);border-radius:8px;background:transparent;color:var(--ink2);cursor:pointer}
   .gearbtn:hover{background:var(--surface2);color:var(--ink)}
   .gearbtn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
-  .gearpop{display:none;position:absolute;top:36px;right:0;z-index:80;background:var(--panel);border-radius:12px;box-shadow:0 10px 30px rgba(20,23,31,.18),0 0 0 1px var(--hair);padding:12px 13px;width:250px;
+  .gearpop{display:none;position:absolute;top:36px;right:0;z-index:80;background:var(--panel);border-radius:12px;box-shadow:0 10px 30px rgba(20,23,31,.18),0 0 0 1px var(--hair);padding:12px 13px;width:320px;
     max-height:78vh;overflow-y:auto;scrollbar-width:thin; /* TB edge + colour sections made it taller than the viewport */
     /* opaque chip fill (HANDOFF-v45 §9): a translucent --canvas would let the wallpaper
        bleed through and colour each row differently — this token mixes off the OPAQUE
@@ -1017,7 +1025,7 @@
      the rail (left is set on open from the measured rail edge), max-height = viewport −
      margins, internal scroll. White-translucent per §3: color-mix 74% + blur28 (theme-tinted).
      The node is adopted to <body> in flagship (positionLayout) — .top is display:none there. */
-  body[data-layout="flagship"] .gearpop{position:fixed;top:120px;right:auto;width:300px;max-height:calc(100vh - 160px);border-radius:14px;
+  body[data-layout="flagship"] .gearpop{position:fixed;top:120px;right:auto;width:380px;max-height:calc(100vh - 160px);border-radius:14px;
     background:color-mix(in srgb,var(--panel) 74%,transparent);
     -webkit-backdrop-filter:blur(28px) saturate(1.35);backdrop-filter:blur(28px) saturate(1.35)}
   /* settings = EDIT SESSION (HANDOFF-v45 §3, flagship .cfoot/.mcpbox port): sticky footer,
@@ -1267,6 +1275,29 @@
   #fsRoot .fsstream::-webkit-scrollbar{display:none}
   #fsFeed{display:flex;flex-direction:column;gap:8px;padding-top:2px}
   #fsRoot .cc-say{font-size:13.5px;color:var(--ink)}
+  /* Pattern A (H23 / AMENDMENT-center-feed-2026-07-16, CDO): the center feed is
+     a conversation — the user's own turns live here too, not just Claude Code's.
+     器を増やさない(§1.5-1): no bubbles — a speaker label + a hairline turn border. */
+  #fsRoot .cc-you{padding-top:11px;border-top:1px solid var(--hair)}
+  #fsRoot .cc-you:first-child{padding-top:0;border-top:0}
+  #fsRoot .cc-you .cy-n{display:block;font:600 8.5px/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);margin-bottom:5px}
+  #fsRoot .cc-you .cy-t{font-size:13.5px;color:var(--ink);line-height:1.45}
+  /* Typing cursor on the streaming reply frontier (rides the client-side reveal —
+     the CLI returns the reply as one block, not token deltas). Solid block, hard
+     terminal blink (steps(1)); --ink adapts across all themes. */
+  #fsRoot .cc-caret{display:inline-block;width:6px;height:14px;margin-left:2px;transform:translateY(2px);
+    background:var(--ink);animation:ccblink 1.05s steps(1) infinite}
+  @keyframes ccblink{50%{opacity:0}}
+  @media (prefers-reduced-motion:reduce){#fsRoot .cc-caret{animation:none}}
+  /* "→ Added to To Do #NN" — shown quietly in the flow when a turn became a task.
+     Undo appears on hover only (§1.5-10). No filled surface. */
+  #fsRoot .cc-mark{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:var(--ink3);padding:1px 0}
+  #fsRoot .cc-mark .cm-ar{color:var(--ink2);font-size:12.5px;line-height:1}
+  #fsRoot .cc-mark .cm-t{color:var(--ink2)}
+  #fsRoot .cc-mark .cm-no{color:var(--ink3);font-variant-numeric:tabular-nums}
+  #fsRoot .cc-mark .cm-undo{margin-left:2px;padding:0;border:0;background:none;font:inherit;color:var(--ink3);cursor:pointer;opacity:0;transition:opacity .15s,color .15s}
+  #fsRoot .cc-mark:hover .cm-undo{opacity:1}
+  #fsRoot .cc-mark .cm-undo:hover{color:var(--blue)}
   /* Claude Code CLI language (HANDOFF-v45 §12, flagship .cc-t port): gap:0 — the bullet's
      own margin-right does the spacing, not a flex gap (keeps ⏺ tight against the tool name
      the way the real CLI reads). */
@@ -1326,6 +1357,10 @@
   #fsRoot .fs-askbar{display:none;border:1px solid var(--hair2);border-bottom:0;border-left:2px solid var(--blue);border-radius:14px 14px 0 0;padding:9px 13px 11px} /* 枠1px (v3 §6.5) */
   #fsRoot .compwrap{max-width:var(--fscenterw,760px);width:100%;margin:10px auto 0;flex:0 0 auto;position:relative;z-index:1;
     transition:max-width .28s cubic-bezier(.4,0,.2,1)}
+  /* #errbar is adopted into .compwrap by positionLayout() (flagship hides .main
+     outright, its original home) — float it just above the input, matching the
+     legacy layout's "just above the composer" placement (CDO判定 2026-07-16). */
+  #fsRoot .compwrap>.errbar{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%)}
   #fsRoot.lanefold{--fscenterw:1020px} /* folded space flows to the center (§1.5-7) — one var flip keeps feed+composer in lockstep */
   /* adopted composer (#composerWrap moves in — same node, same handlers, focus fix intact) */
   body[data-layout="flagship"] #composerWrap{padding:0;border-top:0;max-width:none;width:auto;margin:0}
@@ -2052,6 +2087,11 @@
   .bx-lb{font:600 9px/1 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--red)}
   .bx-q{font-size:13px;color:var(--ink);margin-top:4px}
   .bx-act{flex:none}
+  /* neutral ask (not a limit/error — e.g. the sign-in nudge): same card, --blue
+     accent instead of --red, matching the existing AI-confirmation blue
+     (§7決定ログ「AI確認：色は青系」) rather than inventing a new color. */
+  .bx-ask.info{border-left-color:var(--blue)}
+  .bx-ask.info .bx-lb{color:var(--blue)}
   /* ② post-checkout return bar */
   .bx-cobar{box-shadow:inset 0 0 0 1px var(--hair2);border-radius:11px;padding:10px 13px;display:flex;align-items:center;gap:10px;font-size:12.5px;margin:0 auto 12px;width:100%;max-width:var(--fscenterw,760px)}
   .bx-cobar[hidden]{display:none}
@@ -2097,7 +2137,7 @@
       <button class="laybtn" data-theme="cinema">Cinema</button>
     </div>
     <div class="gearwrap">
-      <button class="gearbtn" id="gearBtn" title="カスタマイズ" aria-label="Customize"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg></button>
+      <button class="gearbtn" id="gearBtn" title="Settings" aria-label="Settings"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg></button>
       <div class="gearpop" id="gearPop"></div>
     </div>
     <button class="pill-btn" id="connect">Connect MCP</button>
@@ -2210,9 +2250,8 @@
       <div class="lbrow"><span class="lb">Projects</span>
         <button class="ghostbtn morebtn" id="fsMoreBtn" title="Settings"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="3.2"/><path d="M19.4 15a1.7 1.7 0 00.34 1.87l.06.06a2 2 0 11-2.83 2.83l-.06-.06a1.7 1.7 0 00-1.87-.34 1.7 1.7 0 00-1 1.56V21a2 2 0 11-4 0v-.09a1.7 1.7 0 00-1-1.56 1.7 1.7 0 00-1.87.34l-.06.06a2 2 0 11-2.83-2.83l.06-.06a1.7 1.7 0 00.34-1.87 1.7 1.7 0 00-1.56-1H3a2 2 0 110-4h.09a1.7 1.7 0 001.56-1 1.7 1.7 0 00-.34-1.87l-.06-.06a2 2 0 112.83-2.83l.06.06a1.7 1.7 0 001.87.34h.09a1.7 1.7 0 001-1.56V3a2 2 0 114 0v.09a1.7 1.7 0 001 1.56h.09a1.7 1.7 0 001.87-.34l.06-.06a2 2 0 112.83 2.83l-.06.06a1.7 1.7 0 00-.34 1.87v.09a1.7 1.7 0 001.56 1H21a2 2 0 110 4h-.09a1.7 1.7 0 00-1.56 1z"/></svg></button>
         <div class="moremenu" id="fsMoreMenu">
-          <button class="ghostbtn" id="fsCust">Customize…</button>
+          <button class="ghostbtn" id="fsCust">Theme</button>
           <button class="ghostbtn" id="fsConn">Connect MCP</button>
-          <button class="ghostbtn" id="fsTodoBd">To Do board</button>
           <button class="ghostbtn" id="fsHist">History</button>
           <button class="ghostbtn" id="fsSet">Settings</button>
         </div>
@@ -2466,7 +2505,7 @@ const savedTheme = (() => {
   if (v !== s) localStorage.setItem('theme', v);
   return v;
 })();
-const state = { projects: [], goals: [], tasks: [], act: {}, actAt: {}, todos: {}, active: 'galda2', editing: null, attach: [], connectCommand: '', models: ['sonnet'], agentModels: null, agentEfforts: null, agents: ['claude-code', 'codex'], expanded: new Set(), openThreads: new Set(), queueOrder: {}, externalActivity: [], selectedGoal: null, workflowColumns: {}, wfDraft: null, reviewDefinitions: {}, rdDraft: null, connectedApp: localStorage.getItem('sel:agent') || 'claude-code', reviewOpenGoal: null, reviewApprovals: {}, goalDetailOpen: null, qreplyOpen: new Set(), logCollapsed: localStorage.getItem('logCollapsed') !== '0', logEntries: [], layout: localStorage.getItem('layout') || 'flagship', theme: savedTheme, summaryPattern: Number(localStorage.getItem('summaryPattern')) || 3, peraSpot: 0, skill: null, skillsCache: null,
+const state = { projects: [], goals: [], tasks: [], act: {}, actAt: {}, todos: {}, chatTurns: {}, active: 'galda2', editing: null, attach: [], connectCommand: '', models: ['sonnet'], agentModels: null, agentEfforts: null, agents: ['claude-code', 'codex'], expanded: new Set(), openThreads: new Set(), queueOrder: {}, externalActivity: [], selectedGoal: null, workflowColumns: {}, wfDraft: null, reviewDefinitions: {}, rdDraft: null, connectedApp: localStorage.getItem('sel:agent') || 'claude-code', reviewOpenGoal: null, reviewApprovals: {}, goalDetailOpen: null, qreplyOpen: new Set(), logCollapsed: localStorage.getItem('logCollapsed') !== '0', logEntries: [], layout: localStorage.getItem('layout') || 'flagship', theme: savedTheme, summaryPattern: Number(localStorage.getItem('summaryPattern')) || 3, peraSpot: 0, skill: null, skillsCache: null,
   // per-message send overrides set via slash-commands (reset after each send,
   // except model which is sticky in localStorage). palette = open command list.
   msg: { mode: null, model: null, effort: null, skill: null, later: false, review: false },
@@ -2474,6 +2513,28 @@ const state = { projects: [], goals: [], tasks: [], act: {}, actAt: {}, todos: {
 window.state = state; // top-level const isn't a window property; external checks probe window.state
 const $ = (id) => document.getElementById(id);
+// Question free-text answer boxes (qansinput/fsansinput) are rebuilt from
+// scratch (container.innerHTML = ...) on every SSE-driven render, which — same
+// class of bug as the composer's c32fda1 fix — detaches whatever the user is
+// mid-typing into and drops focus + cursor position + the in-progress text.
+// Since these nodes can't be kept alive like the composer (they're generated
+// HTML strings, not a persistent DOM subtree), save the focused box's value
+// and selection before the rebuild and restore them onto the freshly-rendered
+// node with the same data-attribute id afterward.
+function captureFocusedAnswerInput(container, attr){
+  const el = document.activeElement;
+  if (!el || !container || !container.contains(el) || !el.hasAttribute(attr)) return null;
+  return { id: el.getAttribute(attr), value: el.value, start: el.selectionStart, end: el.selectionEnd };
+}
+function restoreFocusedAnswerInput(container, attr, saved){
+  if (!saved || !container) return;
+  const el = container.querySelector(`[${attr}="${saved.id}"]`);
+  if (!el) return;
+  el.value = saved.value;
+  el.focus();
+  try { el.setSelectionRange(saved.start, saved.end); } catch { /* input type may not support it */ }
+}
 const STATUS_LABEL = {
   sending: 'Sending…', stacked: 'Queued', planning: 'Planning…', queued: 'To do', running: 'Working…', needsInput: 'Needs input',
   review: 'In review', done: 'Done', failed: 'Failed', partial: 'Partly failed', interrupted: 'Interrupted', skipped: 'Skipped',
@@ -2564,10 +2625,15 @@ function setAgentEffort(agent){
   localStorage.setItem('sel:effort', state.stickyEffort);
 }
 function renderAppSelect(){
-  if (!CONNECTED_APPS.some((a) => a.id === state.connectedApp)) state.connectedApp = CONNECTED_APPS[0].id;
-  const app = CONNECTED_APPS.find((a) => a.id === state.connectedApp) ?? CONNECTED_APPS[0];
+  // Only offer agents whose CLI is actually installed (state.agents comes from the
+  // server = AVAILABLE_AGENTS). A claude-only machine never shows Codex; a
+  // Codex-only one never shows Claude Code. Never render an empty picker.
+  const apps = CONNECTED_APPS.filter((a) => (state.agents || []).includes(a.id));
+  const list = apps.length ? apps : CONNECTED_APPS.slice(0, 1);
+  if (!list.some((a) => a.id === state.connectedApp)) state.connectedApp = list[0].id;
+  const app = list.find((a) => a.id === state.connectedApp) ?? list[0];
   $('appbtn').innerHTML = `${app.icon}<span>${esc(app.label)}</span>${ICONS.caret}`;
-  $('appmenu').innerHTML = CONNECTED_APPS.map((a) =>
+  $('appmenu').innerHTML = list.map((a) =>
     `<button type="button" class="appopt${a.id === state.connectedApp ? ' active' : ''}" data-val="${a.id}">${a.icon}<span>${esc(a.label)}</span></button>`
   ).join('');
 }
@@ -2779,6 +2845,14 @@ function buildReviewDigest({ goals, tasks } = {}){
 // Mirrors engine/lib.mjs buildReviewSummary()/requirementSummaryLine() (task 96)
 // — kept in sync manually since the browser script isn't a module. Used by both
 // the review checklist top summary and the chat-side review导线.
+// task 6 (2026-07-16): mirrors engine/lib.mjs goalTokenHistory() — one
+// {weightedTokens, requirementCount} sample per finished goal (excluding the
+// one being summarized), oldest-first, for the token-savings baseline below.
+function goalTokenHistoryLocal(goals, tasks, excludeGoalId){
+  return (goals ?? [])
+    .filter((g) => g && g.id !== excludeGoalId && GOAL_COMPLETE_STATUSES.includes(g.status) && g.runTokens != null)
+    .map((g) => ({ weightedTokens: g.runTokens, requirementCount: (tasks ?? []).filter((t) => t.goalId === g.id && !t.reply).length }));
+}
 function buildReviewSummary({ goal, tasks, approvedN = 0 } = {}){
   const reqs = (tasks ?? []).filter((t) => !t.reply);
   const total = reqs.length;
@@ -2788,6 +2862,9 @@ function buildReviewSummary({ goal, tasks, approvedN = 0 } = {}){
   const source = plan.length ? plan : reqs.map((t) => t.title);
   const what = source.map((s) => String(s ?? '').replace(/\s+/g, ' ').trim()).filter(Boolean).slice(0, 3).join(' / ');
   const fallback = String(goal?.text ?? '').replace(/\s+/g, ' ').trim().slice(0, 80);
+  // History is scoped to the same project as this goal — a goal in a small
+  // toy project shouldn't be judged against a large project's average.
+  const sameProjectGoals = (state.goals || []).filter((g) => g.projectId === goal?.projectId);
   return { approvedN, total, headline: `${approvedN} / ${total} approved`, what: what || fallback,
     detail: `${done}/${total} done${proofs ? ` · proof ×${proofs}` : ''}`,
     failureMemory: goal?.failureMemory?.length ? goal.failureMemory[goal.failureMemory.length - 1] : null,
@@ -2800,6 +2877,8 @@ function buildReviewSummary({ goal, tasks, approvedN = 0 } = {}){
       usedCompact: goal?.executionPlan?.sessionMode === 'compact',
       usedClear: Boolean(goal?.sessionClosedAt),
       agentModel: goal?.model,
+      requirementCount: total,
+      history: goalTokenHistoryLocal(sameProjectGoals, state.tasks || [], goal?.id),
     }) };
 }
 function requirementSummaryLine(task){
@@ -2867,28 +2946,65 @@ function usageBudgetTokensLocal(usage, cacheReadWeight = 0.1){
   const weight = Number.isFinite(Number(cacheReadWeight)) ? Math.max(0, Number(cacheReadWeight)) : 0.1;
   return Math.round((u.input_tokens ?? 0) + (u.output_tokens ?? 0) + (u.cache_creation_input_tokens ?? 0) + ((u.cache_read_input_tokens ?? 0) * weight));
 }
-function estimateTokenOptimizationLocal({ usage = null, weightedTokens = null, cacheReadWeight = 0.1, sessionMode = null, usedHandoff = false, usedCompact = false, usedClear = false, agentModel = null } = {}){
+// task 6 (2026-07-16): mirrors engine/lib.mjs tokenBaselinePerRequirement() —
+// moving average of tokens-per-requirement over up to the last 20 finished
+// goals (needs at least 3 to be meaningful).
+const TOKEN_BASELINE_MIN_HISTORY = 3;
+const TOKEN_BASELINE_MAX_HISTORY = 20;
+function tokenBaselinePerRequirementLocal(history){
+  const samples = (history ?? [])
+    .map((h) => {
+      if (typeof h === 'number') return h;
+      const tokens = Number(h?.weightedTokens);
+      const reqN = Math.max(1, Number(h?.requirementCount) || 1);
+      return Number.isFinite(tokens) ? tokens / reqN : null;
+    })
+    .filter((n) => Number.isFinite(n) && n > 0)
+    .slice(-TOKEN_BASELINE_MAX_HISTORY);
+  if (samples.length < TOKEN_BASELINE_MIN_HISTORY) return null;
+  return samples.reduce((a, b) => a + b, 0) / samples.length;
+}
+// Mirrors engine/lib.mjs estimateTokenOptimization() — see the comment there
+// for why "saved X%" now compares against a real per-project baseline
+// (basis: 'baseline') instead of always reusing this goal's own cache-hit
+// ratio as a stand-in for "cheaper than usual" (basis: 'cache-weight',
+// used only until there's enough finished-goal history).
+function estimateTokenOptimizationLocal({ usage = null, weightedTokens = null, cacheReadWeight = 0.1, sessionMode = null, usedHandoff = false, usedCompact = false, usedClear = false, agentModel = null, requirementCount = 1, history = [] } = {}){
   const u = usage ?? {};
   const raw = (u.input_tokens ?? 0) + (u.output_tokens ?? 0) + (u.cache_creation_input_tokens ?? 0) + (u.cache_read_input_tokens ?? 0);
+  if (raw <= 0) return null;
   const weighted = weightedTokens != null && Number.isFinite(Number(weightedTokens)) ? Number(weightedTokens) : usageBudgetTokensLocal(u, cacheReadWeight);
-  const saved = Math.max(0, raw - weighted);
-  const percent = raw > 0 ? Math.round((saved / raw) * 100) : 0;
+  const reqN = Math.max(1, Number(requirementCount) || 1);
+  const perReq = weighted / reqN;
+  const baseline = tokenBaselinePerRequirementLocal(history);
+  let percent, basis, savedTokens;
+  if (baseline != null) {
+    percent = Math.max(-100, Math.min(100, Math.round(((baseline - perReq) / baseline) * 100)));
+    basis = 'baseline';
+    savedTokens = Math.max(0, Math.round((baseline - perReq) * reqN));
+  } else {
+    savedTokens = Math.max(0, raw - weighted);
+    percent = Math.round((savedTokens / raw) * 100);
+    basis = 'cache-weight';
+  }
   const techniques = [];
-  if ((u.cache_read_input_tokens ?? 0) > 0) techniques.push('cache-read weighting');
-  if (['compact', 'cold-handoff'].includes(sessionMode)) techniques.push(sessionMode === 'compact' ? 'compact handoff' : 'fresh handoff');
-  if (usedHandoff) techniques.push('AI handoff');
-  if (usedCompact) techniques.push('/compact');
-  if (usedClear) techniques.push('/clear');
-  if (agentModel) techniques.push(`model ${agentModel}`);
-  if (!percent && !techniques.length) return null;
-  return { rawTokens: raw, weightedTokens: weighted, savedTokens: saved, percent, techniques: [...new Set(techniques)] };
+  const cacheRatio = Math.round(((u.cache_read_input_tokens ?? 0) / raw) * 100);
+  if (cacheRatio > 0) techniques.push(`${cacheRatio}% of tokens served from cache`);
+  if (usedHandoff || sessionMode === 'cold-handoff') techniques.push('fresh handoff instead of a bloated session');
+  if (usedCompact || sessionMode === 'compact') techniques.push('/compact before continuing');
+  if (usedClear) techniques.push('/clear between unrelated goals');
+  if (agentModel) techniques.push(`${agentModel} for this run`);
+  if (basis === 'baseline' && percent > 0) techniques.push(`${Math.round(perReq / 1000)}k tokens/requirement vs your ${Math.round(baseline / 1000)}k average`);
+  if (!techniques.length) techniques.push(`${Math.round(raw / 1000)}k tokens this run (no cache reuse yet)`);
+  return { rawTokens: raw, weightedTokens: weighted, savedTokens, percent, basis, techniques: [...new Set(techniques)] };
 }
 function tokenOptimizationHtml(opt){
   if (!opt) return '';
-  const techniques = opt.techniques?.length ? opt.techniques.slice(0, 4).join(' / ') : 'session planning';
+  const techniques = opt.techniques?.length ? opt.techniques.slice(0, 4).join(' / ') : 'this run';
   const pct = Number(opt.percent);
+  const cmp = opt.basis === 'baseline' ? 'vs your recent average' : 'from prompt caching';
   const text = pct > 0
-    ? `Token optimized: saved about ${pct}% via ${techniques}`
+    ? `Token optimized: saved about ${pct}% ${cmp} (${techniques})`
     : `Token optimized: ${techniques}`;
   return `<div class="rvtokenopt">${esc(text)}</div>`;
 }
@@ -3511,6 +3627,7 @@ function renderTasks(){
      <div class="cond">shelved — press Start to queue it</div></div>
      <button type="button" class="prmini pstart" data-pstart="${g.id}">Start</button>
      <button type="button" class="pdel" data-pdel="${g.id}" title="Delete">✕</button></div>`).join('');
+  const savedQAns = captureFocusedAnswerInput($('tasklist'), 'data-qansinput');
   $('tasklist').innerHTML =
     sec('Attention', attention, 'attn')
     + sec(pickColumnLabel(cols, 'review', 'Review'), reviewDigest + review, 'reviewsec', reviewDefinitionFor(state.active).description, REVIEW_DEF_HINT)
@@ -3518,6 +3635,7 @@ function renderTasks(){
     + sec(pickColumnLabel(cols, 'todo', 'To do'), todo, 'todosec')
     + sec('Pending', pendingRows, 'dim')
     + sec(pickColumnLabel(cols, 'done', 'Done'), doneRows, 'dim');
+  restoreFocusedAnswerInput($('tasklist'), 'data-qansinput', savedQAns);
   // faint pencil beside the Review subtitle → open the review-definition editor
   $('tasklist').querySelector('[data-editreviewdef]')?.addEventListener('click', (e) => { e.stopPropagation(); openWfEditor(); });
   for (const el of $('tasklist').querySelectorAll('.task[data-task]')) {
@@ -3674,7 +3792,7 @@ function renderTasks(){
 // event listeners, so all wiring above still works. Anchor comments mark each
 // node's home so other layouts restore it exactly.
 function ensureLayoutAnchors(){
-  for (const id of ['tasklist', 'composerWrap', 'actpanel']) {
+  for (const id of ['tasklist', 'composerWrap', 'actpanel', 'errbar']) {
     const el = $(id);
     if (el && !el._anchor) { const a = document.createComment('home:' + id); el.parentNode.insertBefore(a, el); el._anchor = a; }
   }
@@ -3694,11 +3812,19 @@ function positionLayout(){
     // is never detached mid-typing on SSE-driven renders.
     const host = $('fsCompwrap'), cw = $('composerWrap');
     if (host && cw && cw.parentNode !== host) host.appendChild(cw);
+    // #errbar (showErr/showBillingBlocked/showSignInNudge) lives inside .main,
+    // which flagship hides outright (display:none) — every transient message
+    // silently never rendered. Adopt it beside the composer, same technique as
+    // #composerWrap above; a flagship CSS rule floats it just above the input
+    // (CDO判定 2026-07-16 — same fix as #gearPop's body[data-layout] escape).
+    const eb = $('errbar');
+    if (host && eb && eb.parentNode !== host) host.appendChild(eb);
     // tasklist / actpanel go back home (they live hidden inside .main here)
     for (const id of ['tasklist', 'actpanel']) { const el = $(id); if (el && el._anchor && el.parentNode !== el._anchor.parentNode) el._anchor.parentNode.insertBefore(el, el._anchor); }
     return;
   }
   if (state.layout === 'bflow') {
+    { const el = $('errbar'); if (el && el._anchor && el.parentNode !== el._anchor.parentNode) el._anchor.parentNode.insertBefore(el, el._anchor); }
     const bc = $('bcenter'), bt = $('brightTop'), bb = $('brightBottom');
     if (!bc) return;
     const tl = $('tasklist'), cw = $('composerWrap'), ap = $('actpanel');
@@ -3718,7 +3844,7 @@ function positionLayout(){
     if (!bb.querySelector('.brbot-head')) { const h = document.createElement('div'); h.className = 'brbot-head'; h.textContent = 'Implementing'; bb.appendChild(h); }
     if (ap.parentNode !== bb) bb.appendChild(ap);            // right-bottom: Log → Implementing
   } else {
-    for (const id of ['tasklist', 'composerWrap', 'actpanel']) { const el = $(id); if (el && el._anchor && el.parentNode !== el._anchor.parentNode) el._anchor.parentNode.insertBefore(el, el._anchor); }
+    for (const id of ['tasklist', 'composerWrap', 'actpanel', 'errbar']) { const el = $(id); if (el && el._anchor && el.parentNode !== el._anchor.parentNode) el._anchor.parentNode.insertBefore(el, el._anchor); }
   }
 }
@@ -4877,12 +5003,15 @@ function renderFsFeed(){
   // dogfood PRs (質問カードの自由記述回答欄 / 「Needs your answer」カードを削除できるように
   // — see docs/confirmed-behaviors.md): the chips-only card left no way to answer a question
   // with no matching preset option, or to discard a question you don't want to answer.
+  // Questions render at the FEED BOTTOM (composer-adjacent) — built into askHtml
+  // so they sit AFTER the conversation turns (H18/H19 / Pattern A: 質問は末尾固定).
+  let askHtml = '';
   for (const g of state.goals.filter((g) => g.projectId === state.active && g.status === 'needsInput' && g.question)) {
     const chips = (g.question.options || []).map((o) => `<button class="achip" data-fsanswer="${g.id}" data-a="${esc(o)}">${esc(o)}</button>`).join('');
     // QUESTION card (H18): mono label + prompt + option chips + always-on free-text
     // answer + hover trash. Data hooks (data-fsanswer / -ansinput / -anssend /
     // -answerdel) are unchanged so the existing wiring below keeps working.
-    html += `<div class="cc-ask"><div class="cc-ask-lb">Question</div>`
+    askHtml += `<div class="cc-ask"><div class="cc-ask-lb">Question</div>`
       + `<div class="cc-ask-q">${esc(g.question.text)}</div>`
       + (chips ? `<div class="qchips">${chips}</div>` : '')
       + `<div class="answ-inline"><input type="text" data-fsansinput="${g.id}" placeholder="Type your answer…" aria-label="Type your answer">`
@@ -4906,17 +5035,44 @@ function renderFsFeed(){
   // longer flash in and wipe what the user was looking at. While work exists but
   // this pass produced no lines, keep the last known feed (or a calm one-line
   // status) instead of blanking to the hero.
+  // Pattern A (H23): the conversation turns — the user's own messages, Claude
+  // Code's replies (typed out with a caret on the streaming frontier), and
+  // "→ Added to To Do #NN" markers — rendered from state.chatTurns so the
+  // whole-feed re-render (SSE act events) can't drop them. Order per turn:
+  // You → (mark, if it became a task) and, for a reply, speaker line → reply.
+  const turns = (state.chatTurns[state.active] || []).slice(-40);
+  let chatHtml = '';
+  for (const turn of turns) {
+    if (turn.role === 'you') {
+      chatHtml += `<div class="cc-you"><span class="cy-n">You</span><div class="cy-t">${esc(turn.text)}</div></div>`;
+      if (turn.markGoalId != null && !turn.undone) {
+        const mg = state.goals.find((x) => x.id === turn.markGoalId);
+        const n = mg ? goalReviewNumber({ goal: mg, tasks: state.tasks }) : turn.markGoalId;
+        chatHtml += `<div class="cc-mark"><span class="cm-ar">→</span><span class="cm-t">Added to To Do</span><span class="cm-no">#${n}</span><button class="cm-undo" type="button" data-ccundo="${turn.markGoalId}">Undo</button></div>`;
+      }
+    } else { // Claude Code reply — speaker line first (You → speaker → reply), then the text
+      const app = connectedAppMeta(turn.agent);
+      chatHtml += `<div class="cc-who">${app.icon}<span class="cs-n">${esc(app.label)}</span></div>`;
+      const shown = esc((turn.text || '').slice(0, turn.revealed || 0));
+      chatHtml += turn.done
+        ? `<div class="cc-say">${shown}</div>`
+        : `<div class="cc-say"><span id="ccTyping">${shown}</span><span class="cc-caret"></span></div>`;
+    }
+  }
   const pgoals = state.goals.filter((g) => g.projectId === state.active);
   const ptasks = state.tasks.filter((t) => t.projectId === state.active);
-  const hasWork = pgoals.length > 0 || ptasks.length > 0;
-  let out = html;
+  const hasWork = pgoals.length > 0 || ptasks.length > 0 || turns.length > 0;
+  // task feed (with its own speaker line) → conversation turns → question (bottom)
+  let out = html + chatHtml + askHtml;
   if (out) _fsLastFeed[state.active] = out;
   else if (hasWork) out = _fsLastFeed[state.active] || `<div class="cc-c">⎿  ${esc(running.length ? 'working…' : 'no active task')}</div>`;
   $('fsRoot').classList.toggle('clawdhero', !hasWork);
   const sc = feed.parentNode;
   const nearBottom = sc.scrollHeight - sc.clientHeight - sc.scrollTop <= 80;
+  const savedFsAns = captureFocusedAnswerInput(feed, 'data-fsansinput');
   feed.innerHTML = hasWork ? out : '';
   if (nearBottom) sc.scrollTop = sc.scrollHeight;
+  restoreFocusedAnswerInput(feed, 'data-fsansinput', savedFsAns);
   window.__fsCineSync?.(); // Cinema dynamic rule: content growth may reach the band region
   for (const b of feed.querySelectorAll('[data-fsretry]')) b.onclick = () => fsRetryTask(b.dataset.fsretry);
   for (const b of feed.querySelectorAll('[data-fslog]')) b.onclick = () => fsToggleLog(Number(b.dataset.fslog));
@@ -4934,6 +5090,19 @@ function renderFsFeed(){
   // Delete a "needs your answer" card outright (restores 「Needs your answer」カードを削除
   // できるように — a question you don't want to answer had no discard path in flagship).
   for (const b of feed.querySelectorAll('[data-fsanswerdel]')) b.onclick = (e) => { e.stopPropagation(); fsTaskDelete(Number(b.dataset.fsanswerdel)); };
+  // Pattern A (H23): Undo a "→ Added to To Do" marker — cancel the created goal
+  // and drop the mark. A just-created (planning) goal is deletable; if it already
+  // started the server returns non-OK (canDeleteGoal) and we say so quietly.
+  for (const b of feed.querySelectorAll('[data-ccundo]')) b.onclick = async (e) => {
+    e.stopPropagation();
+    const gid = Number(b.dataset.ccundo);
+    const r = await fetch(withKey(`/api/goals/${gid}`), { method: 'DELETE' });
+    if (!r.ok) { showErr('Could not undo — the task may already be running'); return; }
+    const turn = (state.chatTurns[state.active] || []).find((t) => t.markGoalId === gid);
+    if (turn) turn.undone = true;
+    state.goals = state.goals.filter((g) => g.id !== gid);
+    render();
+  };
 }
 async function fsAnswerQuestion(goalId, answer){
   if (!answer) return;
@@ -5456,11 +5625,10 @@ function renderClawdHero(){
   });
   document.addEventListener('keydown', (e) => { if (e.key === 'Escape') closeMobilePanels(); });
   // v46 (HANDOFF-v45 §3): the menu entries deep-link into the 4-tab settings panel —
-  // Customize…→THEME / Connect MCP→MCP / History→HISTORY / Settings→SETTINGS.
+  // Theme→THEME / Connect MCP→MCP / History→HISTORY / Settings→SETTINGS.
   // stopPropagation: the document click-away handler otherwise closes it in the same event.
   $('fsCust').onclick = (e) => { e.stopPropagation(); $('fsMoreMenu').classList.remove('open'); custOpen('theme'); };
   $('fsConn').onclick = (e) => { e.stopPropagation(); $('fsMoreMenu').classList.remove('open'); custOpen('mcp'); };
-  $('fsTodoBd').onclick = () => { $('fsMoreMenu').classList.remove('open'); $('toggle').click(); }; // To Do board stays reachable from the menu; ⌘K itself now opens the project switcher (HANDOFF-v45 §11)
   $('fsHist').onclick = (e) => { e.stopPropagation(); $('fsMoreMenu').classList.remove('open'); custOpen('history'); };
   $('fsSet').onclick = (e) => { e.stopPropagation(); $('fsMoreMenu').classList.remove('open'); custOpen('settings'); };
   // parallel-runs switcher (§1.5-1/-7): same toggle+click-away shape as fsMoreMenu above.
@@ -5567,12 +5735,13 @@ function fsGearAlignX(){
 function upsert(arr, item){ const i = arr.findIndex((x) => x.id === item.id); if (i >= 0) arr[i] = item; else arr.push(item); }
 let errTimer = null;
+let authDown = false; // true while the worker-auth banner is up → keep auto-hide timers from clearing it
 function showErr(msg){
   const bar = $('errbar');
   bar.classList.remove('billing'); // shed the paywall styling if it was last used for that
   bar.textContent = msg; bar.style.display = 'block';
   clearTimeout(errTimer);
-  errTimer = setTimeout(() => { bar.style.display = 'none'; }, 6000);
+  errTimer = setTimeout(() => { if (authDown) return; bar.style.display = 'none'; }, 6000);
 }
 // Minimal placeholder for the free-tier paywall pending CDO design
@@ -5599,6 +5768,55 @@ function showBillingBlocked(blocked){
   const btn = bar.querySelector('#bxUpgrade');
   if (btn) btn.onclick = () => startCheckout();
   clearTimeout(errTimer);
+  errTimer = setTimeout(() => { if (authDown) return; bar.style.display = 'none'; bar.classList.remove('billing'); }, 20000);
+}
+// Worker sign-in banner. The server preflights `claude` at boot (/api/state.auth
+// + SSE ev:'auth'); if it isn't signed in, every worker would fail with "Not
+// logged in", so the queue is held server-side and this standing banner tells
+// the user how to fix it. Reuses #errbar + the .bx-ask card (bordered, red as a
+// left rule only — no new chrome), but WITHOUT an auto-hide timer since the
+// condition persists until the user relaunches signed-in. Chrome is English to
+// match the rest of the app.
+const AUTH_REASON_TEXT = {
+  'logged-out': 'Not signed in to claude. Run `claude` in a terminal and /login, then relaunch the manager from that terminal — tasks are paused until then.',
+  'bad-credentials': 'Worker sign-in failed. Check ANTHROPIC_API_KEY, or run `claude` and /login, then relaunch the manager from that terminal.',
+  'probe-failed': 'Couldn’t verify claude sign-in. Ensure the `claude` CLI is installed and signed in, then relaunch the manager.',
+};
+function renderAuthBanner(auth){
+  const bar = $('errbar');
+  if (auth && auth.ok === false){
+    authDown = true;
+    const text = AUTH_REASON_TEXT[auth.reason] || AUTH_REASON_TEXT['logged-out'];
+    bar.classList.add('billing'); // strips #errbar's error fill so the card stands alone
+    bar.innerHTML = `<div class="bx-ask"><div class="bx-qt"><div class="bx-lb">Sign in</div>`
+      + `<div class="bx-q">${esc(text)}</div></div></div>`;
+    bar.style.display = 'block';
+    clearTimeout(errTimer); // this banner persists — no auto-hide
+  } else if (authDown) {
+    authDown = false;
+    bar.classList.remove('billing');
+    bar.style.display = 'none';
+    bar.innerHTML = '';
+  }
+}
+// Post-logout nudge (Masa指示 2026-07-16): shown once, the next time a signed-out
+// send() actually lands, so it reads as "you just logged out" rather than nagging
+// every anonymous user (the free tier needs no account — this never blocks send).
+// Same #errbar "ask card" look as showBillingBlocked, Sign in instead of Upgrade.
+// .bx-ask.info (blue, not red — CDO判定 2026-07-16): this isn't a limit/error,
+// red is reserved for those (§5.6).
+function showSignInNudge(){
+  const bar = $('errbar');
+  bar.classList.add('billing');
+  bar.innerHTML = `<div class="bx-ask info"><div class="bx-qt"><div class="bx-lb">Signed out</div>`
+    + `<div class="bx-q">Sign in with Google to keep your usage synced across devices.</div></div>`
+    + `<div class="bx-act"><button class="bx-cta" id="bxSignin">Sign in</button></div></div>`;
+  bar.style.display = 'block';
+  const btn = bar.querySelector('#bxSignin');
+  if (btn) btn.onclick = () => beginGoogleSignin((err) => showErr(err));
+  clearTimeout(errTimer);
   errTimer = setTimeout(() => { bar.style.display = 'none'; bar.classList.remove('billing'); }, 20000);
 }
@@ -5670,6 +5888,21 @@ function startGoogleSignin(url){
   const w = window.open(url, 'galda-signin', 'width=520,height=680');
   if (!w) location.href = url; // popup blocked → same-tab fallback
 }
+// Shared by the Settings "Sign in with Google" button and the post-logout nudge
+// (showSignInNudge below) so both go through the same signin-url → popup path.
+async function beginGoogleSignin(onError){
+  try {
+    const r = await fetch(withKey('/api/signin-url'));
+    const data = await r.json().catch(() => ({}));
+    if (r.ok && data.url) { startGoogleSignin(data.url); return true; }
+    onError?.(data.error || 'Sign-in is not available.');
+  } catch { onError?.('Sign-in failed — check your connection.'); }
+  return false;
+}
+// Set right after a confirmed Log out; consumed once by the next successful
+// send() while still signed out, to nudge the user back toward signing in
+// (Masa指示 2026-07-16) — never blocks the send itself (free tier needs no account).
+let recentlySignedOut = false;
 async function refreshAfterSignin(){
   await refresh();
   if (state.billing?.licensed) signinPending = false;
@@ -5713,6 +5946,8 @@ async function refresh(){
     for (const t of state.tasks) { if (t.todos?.length) state.todos[t.id] = t.todos; }
     state.connectCommand = s.connectCommand ?? ''; state.models = s.models ?? ['sonnet']; state.agentModels = s.agentModels ?? null; state.agentEfforts = s.agentEfforts ?? null; state.agents = s.agents ?? ['claude-code', 'codex']; state.uiVersion = s.uiVersion;
     state.billing = s.billing ?? { licensed: false, email: null };
+    renderAppSelect(); // picker follows the server's installed-agent set; may correct a stale connectedApp
+    renderAuthBanner(s.auth); // show/clear the worker sign-in banner from the boot preflight
     setAgentModel(state.connectedApp);
     setAgentEffort(state.connectedApp);
     renderModelSelect();
@@ -5769,6 +6004,7 @@ function connectSSE(){
       if (!state.projects.some((p) => p.id === state.active)) state.active = state.projects[0]?.id;
     }
     else if (m.ev === 'ping') { checkUiVersion(m.uiVersion); return; }
+    else if (m.ev === 'auth') { renderAuthBanner(m.auth); return; } // worker sign-in preflight result
     scheduleRender();
   };
   es.onerror = () => {
@@ -5816,10 +6052,13 @@ function bootDisconnected(info){
     #connectGate .cg-cmd button{font:500 11px/1 var(--mono,monospace);color:#a3a097;background:transparent;
       border:1px solid rgba(255,255,255,.18);border-radius:7px;padding:6px 9px;cursor:pointer}
     #connectGate .cg-cmd button:hover{color:#fff}
+    #connectGate .cg-hint{font-size:12px;line-height:1.6;color:var(--ink3,#6b6862);margin:0 0 16px}
+    #connectGate .cg-hint a{color:var(--blue,#8fb0ff);text-decoration:none}
+    #connectGate .cg-hint a:hover{text-decoration:underline}
     #connectGate .cg-who{font-size:12px;color:var(--ink3,#6b6862);margin:0 0 4px}
     #connectGate .cg-who b{color:var(--ink2,#a3a097)}
     #connectGate .cg-switch{font-size:12px;color:var(--ink3,#6b6862);margin:14px 0 0}
-    #connectGate .cg-switch a{color:#8fb0ff;text-decoration:none}
+    #connectGate .cg-switch a{color:var(--blue,#8fb0ff);text-decoration:none}
     #connectGate .cg-x{position:absolute;top:14px;right:16px;width:28px;height:28px;border:0;background:transparent;color:var(--ink3,#6b6862);font-size:20px;line-height:1;cursor:pointer}
     #connectGate .cg-wait{display:inline-flex;align-items:center;gap:7px;font:500 10.5px/1 var(--mono,monospace);letter-spacing:.08em;color:var(--ink3,#6b6862);margin-top:16px}
     #connectGate .cg-wait i{width:6px;height:6px;border-radius:50%;background:var(--green,#3DDC97);animation:cgpulse 1.8s ease-in-out infinite}
@@ -5833,6 +6072,13 @@ function bootDisconnected(info){
     + '<h2>Connect this device to start</h2>'
     + '<p>Galda runs on your own machine. Run this where you use Claude Code or Codex — this board comes alive the moment it connects, no refresh needed:</p>'
     + '<div class="cg-cmd"><code>npx @galda/cli</code><button class="cg-copy">Copy</button></div>'
+    // One command connects the machine, not an agent: the CLI probes PATH and hands
+    // the whole detected set to the server. So we never split this per agent — we
+    // only point people without either one at the official installers.
+    + '<p class="cg-hint">Don\'t have either yet? Install '
+    + '<a href="https://claude.com/claude-code" target="_blank" rel="noreferrer">Claude Code</a> or '
+    + '<a href="https://openai.com/codex/" target="_blank" rel="noreferrer">Codex</a>, then run the same command '
+    + '— Galda uses whichever agent you have.</p>'
     + '<p class="cg-who">Signed in as <b></b></p>'
     + '<p class="cg-switch">Already running Galda under a different account? Run <code>npx @galda/cli --signin</code> and pick this one. Or <a href="/logout">switch this browser →</a></p>'
     + '<div class="cg-wait"><i></i>WAITING FOR THIS DEVICE</div></div>';
@@ -5944,21 +6190,37 @@ async function postOutboxItem(item){
     if (!r.ok) throw new Error(`HTTP ${r.status}`);
     const goal = await r.json();
     if (goal.kind === 'chat') {
-      // Conversation-first composer (SLICE 2): this was a chat/help/settings
-      // turn, not a To-Do. Retire the optimistic outbox item — a chat turn is
-      // ephemeral by design, so dropping it does NOT weaken the never-lose
-      // guarantee (which protects real tasks/goals). Show the reply quietly
-      // above the input. We must NOT reach land()/upsert(): a kind:'chat'
-      // response carries no goal id, so upserting it would wedge a ghost
-      // "Sending…" row in the queue forever and pollute state.goals.
+      // Conversation-first (SLICE 2 + Pattern A H23): a chat/help/settings turn,
+      // not a To-Do. Retire the optimistic outbox item — a chat turn is ephemeral
+      // by design, so never-lose (which protects real tasks/goals) is untouched.
+      // In flagship the reply is a turn in the center feed (typed out with a
+      // caret); the board layout has no feed, so it falls back to the quiet
+      // .peraanswer bar. Never land()/upsert(): a kind:'chat' response has no id.
       outbox.remove(item.oid);
-      showChatReply(goal.reply);
+      if (state.layout === 'flagship') {
+        const turn = { role: 'clawd', text: String(goal.reply || ''), revealed: 0, done: false, agent: item.agent };
+        (state.chatTurns[item.projectId] ||= []).push(turn);
+        renderFsFeed();
+        typeChatTurn(turn);
+      } else {
+        showChatReply(goal.reply);
+      }
       render();
       return; // finally still runs posting.delete(); skip land()/upsert()
     }
     goal.imageUrls = item.imageUrls;
     outbox.land(item.oid, goal.id);
     upsert(state.goals, goal);
+    if (recentlySignedOut && !state.billing?.licensed) { recentlySignedOut = false; showSignInNudge(); }
+    // Pattern A (H23): this send became a real To-Do — mark the most recent
+    // unmarked user turn "→ Added to To Do #NN" in the feed. Skip a needsInput
+    // goal (it's still asking; shown as the question card at the feed bottom).
+    if (goal.status !== 'needsInput') {
+      const turns = state.chatTurns[item.projectId] || [];
+      for (let k = turns.length - 1; k >= 0; k--) {
+        if (turns[k].role === 'you' && turns[k].markGoalId == null) { turns[k].markGoalId = goal.id; break; }
+      }
+    }
   } catch {
     outbox.mark(item.oid, 'unsent');
   } finally {
@@ -5967,16 +6229,57 @@ async function postOutboxItem(item){
   render();
 }
-// SLICE 2: render / clear the conversation-first composer reply (reuses the
-// .peraanswer surface). Quiet, transient — cleared the moment the user sends
-// the next message so a stale reply never lingers above a new turn.
+// SLICE 2 / Pattern A (H23): the conversational reply TYPES out — "read along as
+// it types" (ChatGPT / Claude Code). The claude CLI returns the reply as one
+// block, NOT token deltas (verified), so this is a client-side reveal of the full
+// text, not network streaming. Reveal progress lives on the turn MODEL
+// (turn.revealed), so the whole-feed re-render (SSE `act` events rebuild #fsFeed)
+// can't reset it; between re-renders we patch just the #ccTyping text node so we
+// don't rebuild the feed 60×/sec. Duration-normalized (~2s) so short/long both
+// feel right.
+let _chatTyper = null;
+function stopChatTyper(){ if (_chatTyper) { clearInterval(_chatTyper); _chatTyper = null; } }
+// Flagship: reveal a reply turn in the center feed. The caret sits next to
+// #ccTyping (a separate span) so patching the text node never wipes it.
+function typeChatTurn(turn){
+  stopChatTyper();
+  const full = turn.text || '';
+  if (!full) { turn.done = true; return; }
+  const step = Math.max(1, Math.round(full.length / 120)); // ~120 frames ≈ 2s
+  _chatTyper = setInterval(() => {
+    turn.revealed = Math.min(full.length, turn.revealed + step);
+    const node = $('ccTyping');
+    if (node) node.textContent = full.slice(0, turn.revealed);
+    if (turn.revealed >= full.length) { turn.done = true; stopChatTyper(); renderFsFeed(); }
+  }, 16);
+}
+// A new send starts: finish any in-flight reply cleanly (complete the model turn +
+// drop the caret, hide the board bar) so a half-typed reply never lingers.
+function finalizeChatTyping(){
+  stopChatTyper();
+  const turns = state.chatTurns[state.active] || [];
+  for (let k = turns.length - 1; k >= 0; k--) {
+    if (turns[k].role === 'clawd' && !turns[k].done) { turns[k].revealed = (turns[k].text || '').length; turns[k].done = true; break; }
+  }
+  const el = $('chatReply'); if (el) { el.hidden = true; el.textContent = ''; }
+}
+// Board layout (no center feed) keeps the quiet .peraanswer bar; same reveal.
 function showChatReply(text){
   const el = $('chatReply'); if (!el) return;
-  const t = (text || '').trim();
-  if (!t) { el.hidden = true; el.textContent = ''; return; }
-  el.className = 'peraanswer'; el.textContent = t; el.hidden = false;
-}
-function clearChatReply(){ const el = $('chatReply'); if (el) { el.hidden = true; el.textContent = ''; } }
+  stopChatTyper();
+  const full = (text || '').trim();
+  if (!full) { el.hidden = true; el.textContent = ''; return; }
+  el.className = 'peraanswer'; el.textContent = ''; el.hidden = false;
+  let i = 0;
+  const step = Math.max(1, Math.round(full.length / 120));
+  _chatTyper = setInterval(() => {
+    i = Math.min(full.length, i + step);
+    el.textContent = full.slice(0, i);
+    el.scrollTop = el.scrollHeight;
+    if (i >= full.length) stopChatTyper();
+  }, 16);
+}
+function clearChatReply(){ finalizeChatTyping(); }
 async function flushOutbox(){
   // Only (re)send items that still need it — never re-POST 'landed' memos that
@@ -6048,6 +6351,10 @@ async function send(){
     status: 'sending', ts: Date.now(),
   };
   outbox.add(item); // saved locally BEFORE any network call
+  // Pattern A (H23): the user's own turn enters the center feed immediately, so
+  // the composer reads like a conversation. If this send becomes a To-Do, a
+  // .cc-mark is attached to this turn later; if it's chat, a reply turn follows.
+  (state.chatTurns[state.active] ||= []).push({ role: 'you', text, ts: Date.now() });
   state.attach = [];
   // mode/skill/later/review are per-message → clear after send (model stays sticky).
   state.msg = { mode: null, model: null, effort: null, skill: null, later: false, review: false };
@@ -6244,6 +6551,8 @@ function saRows(){
         usedCompact: g?.executionPlan?.sessionMode === 'compact',
         usedClear: Boolean(g?.sessionClosedAt),
         agentModel: g?.model,
+        requirementCount: ts.filter((t) => t.goalId === g?.id && !t.reply).length,
+        history: goalTokenHistoryLocal(gs, ts, g?.id),
       }),
     };
   });
@@ -7555,11 +7864,11 @@ function gearSetHTML(){
         <button class="optchip" data-gsignin="1">Sign in with Google</button></div>
        <div class="srow dis" id="licKeyMsg" style="display:none"></div>`;
   } else if (bill.plan === 'paid') {
-    billingRow = `<div class="srow"><div class="sl">Account<span class="sd">Signed in with Google</span></div><span class="bx-sval">${esc(bill.email)}</span></div>
+    billingRow = `<div class="srow"><div class="sl">Account<span class="sd">Signed in with Google · ${esc(bill.email)}</span></div><button class="optchip" data-gsignout="1">Log out</button></div>
        <div class="srow"><div class="sl">Plan</div><span class="bx-pdot"><i></i>Paid</span></div>
        <div class="srow"><div class="sl">Billing<span class="sd">manage or cancel in Stripe</span></div><button class="bx-cchip" data-gportal="1">Manage</button></div>`;
   } else {
-    billingRow = `<div class="srow"><div class="sl">Account<span class="sd">Signed in with Google</span></div><span class="bx-sval">${esc(bill.email)}</span></div>
+    billingRow = `<div class="srow"><div class="sl">Account<span class="sd">Signed in with Google · ${esc(bill.email)}</span></div><button class="optchip" data-gsignout="1">Log out</button></div>
        <div class="srow"><div class="sl">Plan</div><span class="bx-sval">Free</span></div>
        <div class="srow"><div class="sl">To Dos<span class="sd">pending, this install</span></div><span class="bx-sval bx-num">${u.pending ?? 0} / ${lim.pending ?? 5}</span></div>
        <div class="srow"><div class="sl">Lifetime</div><span class="bx-sval bx-num">${u.cumulative ?? 0} / ${lim.cumulative ?? 19}</span></div>
@@ -7609,18 +7918,20 @@ function buildGearPop(){
     if (signBtn) signBtn.onclick = async () => {
       const msg = pop.querySelector('#licKeyMsg');
       signBtn.disabled = true;
-      try {
-        const r = await fetch(withKey('/api/signin-url'));
-        const data = await r.json().catch(() => ({}));
-        if (r.ok && data.url) { startGoogleSignin(data.url); }
-        else { msg.style.display = ''; msg.textContent = data.error || 'Sign-in is not available.'; }
-      } catch { msg.style.display = ''; msg.textContent = 'Sign-in failed — check your connection.'; }
-      finally { signBtn.disabled = false; }
+      await beginGoogleSignin((err) => { msg.style.display = ''; msg.textContent = err; });
+      signBtn.disabled = false;
     };
     const upBtn = pop.querySelector('[data-gupgrade]');
     if (upBtn) upBtn.onclick = () => startCheckout();
     const portalBtn = pop.querySelector('[data-gportal]');
     if (portalBtn) portalBtn.onclick = () => openBillingPortal();
+    const signOutBtn = pop.querySelector('[data-gsignout]');
+    if (signOutBtn) signOutBtn.onclick = async () => {
+      if (!(await confirmDelete({ title: 'Log out of Google?', body: 'You can sign back in anytime.', confirmLabel: 'Log out', confirmDanger: false }))) return;
+      signOutBtn.disabled = true;
+      try { await fetch(withKey('/api/signout'), { method: 'POST' }); recentlySignedOut = true; }
+      finally { await refresh(); if ($('gearPop')) buildGearPop(); }
+    };
     return;
   }
   if (custTab === 'mcp') {
@@ -7804,11 +8115,14 @@ $('gearBtn').onclick = (e) => { e.stopPropagation(); const p = $('gearPop'); if
 // outside-tap = Cancel (v45 §3). e.composedPath() is frozen at dispatch, so a swatch that
 // buildGearPop() re-rendered (detached) mid-click still reads as INSIDE the pop —
 // selections never close the panel. Known trap (v45 §3): #fsMoreMenu clicks are excluded
-// so a menu item is never swallowed as an outside tap.
+// so a menu item is never swallowed as an outside tap. #deleteConfirmOverlay is excluded
+// too (Masa指示 2026-07-16): it's a separate top-level overlay a settings row can open
+// (e.g. Log out) — without this, confirming/cancelling it read as an outside tap and
+// closed the settings panel underneath it as a surprise side effect.
 document.addEventListener('click', (e) => {
   const p = $('gearPop'); if (!p.classList.contains('open')) return;
   if (e.composedPath().includes(p)) return;
-  if (e.target.closest('.gearwrap') || e.target.closest('#fsCust') || e.target.closest('#fsMoreMenu') || e.target.closest('#fsMoreBtn')) return;
+  if (e.target.closest('.gearwrap') || e.target.closest('#fsCust') || e.target.closest('#fsMoreMenu') || e.target.closest('#fsMoreBtn') || e.target.closest('#deleteConfirmOverlay')) return;
   custCancel();
 });
 // Banff BACKDROP free upload (v3 §6.5): file → dataURL → #themebg. Persists via