@leftoff/cli 0.9.9-beta.7 → 0.9.9-beta.9

package/docs/SECURITY.md

@@ -113,7 +113,8 @@ Live link is opt-in, per session: only sessions started with `leftoff live` have
 - **This Mac's own board** starts it at once. **A phone or another Mac** may start one only when that Mac has *Allow starting sessions from other devices* on (Settings → Privacy & security, off by default) **and** *Trust my paired devices* is on. The switch is kept on that Mac (`~/.config/checkpoints/local/`, not the synced folder, so turning it on one Mac never turns it on another) and only that Mac's own browser can change it (loopback; a phone, the relay or a peer gets 403). Every start from another device shows a notification on the Mac. With the switch off, the request waits up to 5 minutes for a yes on that Mac's board, like Remote Restore. At most 3 wait at once; 3 starts at once, then 1 a minute.
 - **The repo list is folders that Mac has already run Claude Code in** (from its session records; no typed paths). A headless run loads a repo's hooks and `.mcp.json` without the trust dialog, so a folder Claude Code never ran in is treated as a first time:
   - **Other folder…** browses that Mac's folders: names only (never a file or what's in one), inside your home by real path (a symlink out of home is refused or left out), never the synced Leftoff folder or anything in it, no hidden folders, `node_modules` or `Library`, at most 500 per listing. Another Mac's are read over the peer link (`fs.dirs`, not an open action, the same as any read), a phone's through the relay. Nothing is written.
-  - **A first time starts at once only from that Mac's own board** (loopback, or your hosted board open on it): you are the trust prompt. From a phone or another Mac it **always** waits for a yes on that Mac's board, even with *Allow starting sessions from other devices* on, and the ask and the notification say "first time in <folder>; this runs its hooks". After one run it's in the list like the rest. Home itself is refused; a folder that isn't a git repo can't get a new worktree.
+  - **A first time starts at once only from that Mac's own board** (loopback, or your hosted board open on it): you are the trust prompt. From a phone or another Mac it waits for a yes on that Mac's board, even with *Allow starting sessions from other devices* on (unless it's inside an approved folder, below), and the ask and the notification say "first time in <folder>; this runs its hooks". After one run it's in the list like the rest. Home itself is refused; a folder that isn't a git repo can't get a new worktree.
+  - **Approved folders** (per Mac, 0.9.9): with the switch on, a first time inside a folder you approved on that Mac starts from another device without the ask (and notifies that Mac, like any remote start). They're kept in that Mac's own local file (`~/.config/checkpoints/local/`, not `config.json`, never synced), stored as real paths inside your home; home itself, the synced Leftoff folder (or anything inside it), hidden folders and links out of home are refused. A start counts by the folder's real path, so a link that only looks inside an approved folder doesn't. They're added and removed only at the Mac itself: Settings (locked elsewhere), "Always allow in <folder>" on the first-time ask (the folder above it that holds the repos that Mac knows, or its parent; never home), or `leftoff starts allow|disallow <folder>`.
 - **Permission mode `default`, always passed.** Reads in the repo run; every edit and command becomes a Needs-you request (here, the phone, any board; first answer wins) and waits for it, with no 9.5-minute cap since nobody is at a terminal. A request settled any other way is a no. Never `bypassPermissions` or `auto`. AskUserQuestion is answered "ask in words", so Claude asks in plain text and you reply in Live.
 - **Other Macs** reach it over the signed, encrypted peer link (`session.start`, `session.start.get`, `session.headless`, `fs.dirs`; not open actions, so the target Mac's *Allow other machines* applies too).
 - **Nothing new in the folder.** The card, its title and checkpoints as for any session, plus `startedFrom` (device and how it came, not the prompt) and the run's state. Stream output, stdin and stderr stay in the daemon's memory; Claude's transcript stays in `~/.claude` on that Mac; the Live thread and attachments stay where Live keeps them (`~/.config/checkpoints`).

package/mod/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "leftoff",
-  "version": "0.9.9-beta.7",
+  "version": "0.9.9-beta.9",
   "description": "Leftoff (formerly Checkpoints): WTF was I working on? Tracks every Claude Code session on this machine, writes a 3-line checkpoint when one goes quiet, and adds /cp (checkpoint now), /cp-name and a /leftoff pane. Talks to the local Leftoff daemon on 127.0.0.1:7429 and falls back to writing markdown in ~/checkpoints.",
   "author": {
     "name": "Joel"

package/mod/hooks/register.js

@@ -28,7 +28,7 @@ const END_TIMEOUT_MS = 1000
 const MODEL_TIMEOUT_MS = 20000
 
 // Module state. $.state is not used: the pane redraws with $.ui.invalidate.
-const MOD_VERSION = '0.9.9-beta.7' // keep in step with .claude-plugin/plugin.json
+const MOD_VERSION = '0.9.9-beta.9' // keep in step with .claude-plugin/plugin.json
 
 const st = {
   internal: false,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leftoff/cli",
-  "version": "0.9.9-beta.7",
+  "version": "0.9.9-beta.9",
   "description": "Leftoff: WTF was I working on? Tracks every Claude Code session, writes a 3-line checkpoint when one goes quiet, and gives you a daily digest and a board, on your Mac and (optionally) your phone.",
   "keywords": [
     "claude",

package/ui/app.css

@@ -2114,6 +2114,28 @@ mark.tx, .co-snip mark, .tx-snip mark, .tx-msg-text mark { background: var(--tx-
 .lv-tick { margin-top: 4px; font-size: 11.5px; color: var(--muted); text-align: right; }
 .lv-tick.got span { color: var(--accent); letter-spacing: -2px; padding-right: 2px; }
 .lv-tick.bad { color: var(--red); text-align: left; }
+/* 0.9.9 Queued: sent while Claude works, not taken in yet: dimmed, a dashed edge, Queued (not Working).
+   Compact: no sender line, a long one folds to two lines (a tap opens it), and one small row
+   "◷ Queued · Send now · Edit · Cancel" of text buttons, each with a 44px hit area (the
+   negative margins keep the row 18px tall and the words evenly spaced; neighbours' hit
+   areas don't overlap). Several stack tight. */
+.lv-you.lv-queued { background: transparent; border-style: dashed; border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); padding: 6px 10px; margin-bottom: 6px; }
+.lv-you.lv-queued .lv-text, .lv-you.lv-queued .att-bubble { opacity: .62; }
+.lv-you.lv-queued .lv-text { margin-top: 0; }
+.lv-queued .lv-q-long { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; cursor: pointer; border-radius: 4px; }
+.lv-queued .lv-q-long.open { display: block; -webkit-line-clamp: unset; line-clamp: none; overflow: visible; }
+.lv-queued .lv-q-long:focus:not(:focus-visible) { outline: none; }
+.lv-queued .lv-q-long:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+.lv-q { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; column-gap: 5px; row-gap: 0; margin-top: 4px; min-height: 18px; font-size: 12.5px; line-height: 18px; color: var(--muted); }
+.lv-q-tag { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; letter-spacing: .01em; color: var(--muted); }
+.lv-q-tag::before { content: "◷"; font-size: 13px; font-weight: 400; }
+.lv-q-dot { opacity: .7; }
+.lv-q-hint { color: var(--muted); }
+.lv-q-btn { background: none; border: 0; box-shadow: none; margin: -13px -4px; padding: 0 4px; min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; line-height: 18px; font-weight: 600; color: var(--accent); cursor: pointer; border-radius: 8px; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
+.lv-q-btn:hover { text-decoration: underline; text-underline-offset: 3px; }
+.lv-q-btn:focus:not(:focus-visible) { outline: none; }
+.lv-q-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: -8px; }
+.lv-q-btn:disabled { opacity: .45; cursor: default; text-decoration: none; }
 .lv-working .lvs-line { margin-top: 0; }
 .lv-pending .lv-working { margin-top: 4px; }
 .lvs-sep { color: var(--faint); }
@@ -2888,6 +2910,29 @@ del.gd-x { background: var(--gd-del-word); }
 .headless-bar.running { border-color: var(--green); background: var(--tint-green); }
 .headless-bar.paused { border-color: var(--yellow); background: var(--tint-yellow); }
 .headless-bar .btn { min-height: 44px; }
+/* 0.9.9 Permissions: the New session choice, the session page's switch and its pill beside Live */
+.start-mode { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+.start-mode .start-opt-sub { white-space: normal; }
+.headless-mode { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: -4px 0 10px; }
+.headless-mode .hm-l { font-size: 12.5px; font-weight: 600; color: var(--muted); }
+.hm-seg { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: visible; background: var(--card); }
+.hm-opt { position: relative; min-height: 44px; min-width: 44px; padding: 0 14px; border: 0; border-left: 1px solid var(--line); background: transparent; color: var(--text2); font: inherit; font-size: 13.5px; cursor: pointer; }
+.hm-opt:first-child { border-left: 0; border-radius: 10px 0 0 10px; }
+.hm-opt:last-child { border-radius: 0 10px 10px 0; }
+.hm-opt[aria-checked="true"] { background: var(--tint-accent); color: var(--text); font-weight: 600; box-shadow: inset 0 0 0 1px var(--accent); }
+.hm-opt:disabled { opacity: .55; cursor: default; }
+.hm-opt:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; z-index: 1; }
+.hm-opt[data-tip]::after, .mode-pill[data-tip]::after { content: attr(data-tip); display: none; position: absolute; top: calc(100% + 4px); left: 0; width: max-content; max-width: min(280px, 80vw); padding: 4px 8px; border-radius: 7px; background: var(--card2); border: 1px solid var(--line-strong); box-shadow: var(--toast-shadow); color: var(--text2); font-size: 12px; line-height: 1.35; font-weight: 500; text-align: left; white-space: normal; pointer-events: none; z-index: 20; }
+@media (hover: hover) { .hm-opt[data-tip]:hover::after, .mode-pill[data-tip]:hover::after { display: block; animation: tip-in .12s ease-out .35s both; } }
+.hm-opt[data-tip]:focus-visible::after, .mode-pill[data-tip]:focus-visible::after { display: block; }
+.hm-hint { flex-basis: 100%; margin: 0; font-size: 12px; color: var(--muted); }
+.mode-pill { position: relative; display: inline-block; padding: 1px 8px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--bg2); color: var(--text2); font-size: 11.5px; font-weight: 600; line-height: 1.5; white-space: nowrap; }
+.mode-pill.m-auto { border-color: var(--accent); background: var(--tint-accent); color: var(--text); }
+.mode-pill.m-acceptEdits { border-color: var(--yellow); background: var(--tint-yellow); color: var(--text); }
+@media (max-width: 640px) {
+  .hm-seg { display: flex; width: 100%; }
+  .hm-opt { flex: 1 1 0; padding: 0 6px; }
+}
 .headless-err { margin: -4px 0 10px; padding: 8px 12px; border-radius: 8px; background: var(--tint-red); color: var(--text2); font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 9em; overflow: auto; }
 @media (max-width: 640px) {
   .start-opts { grid-template-columns: 1fr; }
@@ -2984,3 +3029,76 @@ del.gd-x { background: var(--gd-del-word); }
 .form label.check.locked input { cursor: not-allowed; }
 .form label.check .lock { display: inline-flex; color: var(--muted); }
 .form label.check .lock .ic { width: 14px; height: 14px; }
+/* 0.9.9 Settings → Approved folders: a list with Remove, and an add field (16px) */
+.form label[for="f-start-approve"] { align-self: start; padding-top: 12px; }
+.approved { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
+.approved-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
+.approved-list li { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 4px 4px 4px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg2); }
+.approved-path { flex: 1; min-width: 0; overflow-wrap: anywhere; color: var(--text); font-size: 13px; }
+.approved .mono, .start-ask-banner .mono { font-family: var(--mono); }
+.approved-x { flex: none; min-height: 44px; min-width: 44px; justify-content: center; gap: 4px; }
+.approved-x .ic { width: 14px; height: 14px; }
+.approved-none { color: var(--faint); font-size: 13px; }
+.approved-add { display: flex; gap: 8px; align-items: center; }
+.form .approved-add input { flex: 1; min-width: 0; height: 44px; font-size: 16px; }
+.approved-add .btn { min-height: 44px; flex: none; }
+.approved.locked .approved-add input, .approved.locked .approved-add .btn { cursor: not-allowed; }
+.approved .lock { display: inline-flex; color: var(--muted); }
+.approved .lock .ic { width: 14px; height: 14px; }
+.approved-err { color: var(--red); font-size: 12.5px; overflow-wrap: anywhere; }
+.start-ask-banner .btn.approve { max-width: 100%; }
+.start-ask-banner .btn.approve .mono { overflow-wrap: anywhere; white-space: normal; text-align: left; }
+@media (max-width: 640px) {
+  .start-ask-banner > .btn.approve { order: 1; flex: 1 1 100%; }
+}
+
+/* 0.9.9 the ask in Live: a waiting permission prompt (or question) takes the
+   composer's place at the bottom of Live, and stays in reach while you read the
+   thread (sticky inside the Live box, above the phone's tab bar and the home
+   indicator); the thread keeps a short row for each ask where it happened. */
+.ask-dock-wrap { position: sticky; bottom: max(12px, calc(env(safe-area-inset-bottom) + 8px)); z-index: 6; margin-top: 10px; }
+.need.ask-dock { gap: 10px; padding: 12px 14px; border-radius: 16px; border-color: color-mix(in srgb, var(--red) 50%, var(--line)); background: var(--card); box-shadow: 0 8px 28px rgba(15, 20, 35, .14), 0 1px 3px rgba(15, 20, 35, .08); }
+[data-theme="dark"] .need.ask-dock { background: var(--card2); box-shadow: 0 8px 28px rgba(0, 0, 0, .45); }
+.ask-dock .need-head { font-size: 13px; }
+.ask-count { font-size: 12px; font-weight: 600; color: var(--text2); background: var(--field); border: 1px solid var(--line); border-radius: 10px; padding: 1px 8px; font-variant-numeric: tabular-nums; }
+.ask-what { display: grid; gap: 6px; min-width: 0; }
+.ask-verb { font-weight: 600; font-size: 15px; color: var(--text); }
+.ask-detail { display: block; font-family: var(--mono); font-size: 13px; line-height: 1.5; background: var(--field); border: 1px solid var(--line); border-radius: 8px; padding: 6px 9px; white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; max-height: 40vh; overflow: auto; }
+.ask-detail.long { max-height: calc(3 * 1.5em + 12px); overflow: hidden; }
+.ask-detail.long.open { max-height: 40vh; overflow: auto; }
+.ask-more, .ask-reply-instead { justify-self: start; min-height: 44px; padding: 0 2px; margin: -6px 0 -8px; border: 0; background: none; color: var(--accent); font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; -webkit-tap-highlight-color: transparent; }
+.ask-reply-instead { color: var(--muted); }
+.ask-more:hover, .ask-reply-instead:hover { text-decoration: underline; }
+.ask-more:focus-visible, .ask-reply-instead:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
+.ask-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch; }
+.ask-actions .btn, .ask-dock .deny-form .btn { min-height: 44px; font-size: 14px; padding: 8px 16px; justify-content: center; white-space: nowrap; }
+.ask-actions .btn.ask-allow { min-width: 120px; font-size: 15px; }
+.ask-dock .deny-form .deny-note { flex: 1 1 220px; min-width: 0; min-height: 44px; box-sizing: border-box; font-size: 16px; }
+@media (max-width: 699.98px) {
+  .ask-dock-wrap { bottom: calc(var(--bar-h) + 8px + env(safe-area-inset-bottom)); }
+  body.nav-hidden .ask-dock-wrap { bottom: max(10px, calc(env(safe-area-inset-bottom) + 6px)); }
+  .need.ask-dock { padding: 12px; }
+  .ask-actions .btn { flex: 1 1 calc(50% - 4px); font-size: 15px; min-height: 48px; }
+  .ask-actions .btn.ask-allow, .ask-actions .btn.ask-deny { flex-basis: 100%; }
+  .ask-actions .always-wrap { flex: 1 1 calc(50% - 4px); }
+  .ask-actions .always-wrap .btn { flex: 1 1 auto; width: 100%; }
+  .ask-dock .deny-form .btn { flex: 1 1 calc(50% - 4px); min-height: 48px; }
+  .ask-dock .deny-form .deny-note { flex-basis: 100%; }
+}
+/* after "Reply instead": one line above the composer, Answer brings the card back */
+.ask-slim { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 4px 4px 4px 12px; border: 1px solid color-mix(in srgb, var(--red) 40%, var(--line)); border-radius: 12px; background: var(--tint-red); font-size: 13px; min-width: 0; }
+.ask-slim .need-dot { background: var(--red); }
+.ask-slim-t { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text2); }
+.ask-slim .btn { flex: none; min-height: 44px; min-width: 44px; justify-content: center; }
+/* the row in the thread: what it asked, and how it was answered */
+.lv-ask { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; row-gap: 2px; margin: 0 0 8px; padding: 6px 10px; border-left: 3px solid var(--line-strong); border-radius: 0 8px 8px 0; background: color-mix(in srgb, var(--muted) 7%, transparent); font-size: 12.5px; color: var(--text2); min-width: 0; }
+.lv-ask .lva-what { flex: 1 1 200px; min-width: 0; overflow-wrap: anywhere; }
+.lv-ask .lva-verb { font-weight: 600; }
+.lv-ask code { font-family: var(--mono); font-size: 12px; overflow-wrap: anywhere; }
+.lv-ask .lva-state { flex: none; max-width: 100%; font-weight: 600; font-size: 12px; overflow-wrap: anywhere; }
+.lv-ask.t-ok { border-left-color: var(--green); } .lv-ask.t-ok .lva-state { color: var(--green); }
+.lv-ask.t-auto { border-left-color: var(--accent); } .lv-ask.t-auto .lva-state { color: var(--accent); }
+.lv-ask.t-no { border-left-color: var(--red); } .lv-ask.t-no .lva-state { color: var(--red); }
+.lv-ask.t-wait { border-left-color: var(--red); background: var(--tint-red); } .lv-ask.t-wait .lva-state { color: var(--red); }
+.ask-note { color: var(--muted); font-size: 13px; margin-top: -4px; }
+.lv-ask .lva-what { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }

package/ui/app.js

@@ -15,13 +15,13 @@ import { canStartPull, pullStep, pullRelease } from './pull.js'
 import { navHideStep, NAVHIDE_TYPING } from './navhide.js'
 import { openLightbox } from './lightbox.js' // 0.9.8: the image preview
 import { openPdfView, pdfThumb } from './pdfview.js' // 0.9.8: the PDF preview (pdf.js loads on the first PDF)
-import { isBlank, composerKey, isTouchUi, composerHeight, composerBoxHtml } from './composer.js' // 0.9.8 the Live composer
-import { startPageHtml, startPick, startAsksBanner, headlessBarHtml, startsSettingHtml, localPillHtml, lockedAttrs, lockHtml, startViewerLocal as startViewerAt, startTexts, fillStartTexts, browseTarget, startPairAskHtml, typedPath } from './start.js' // 0.9.9 New session
+import { isBlank, composerKey, isTouchUi, composerHeight, composerBoxHtml, keepFocusAfterSend, letGoOfKeyboard } from './composer.js' // 0.9.8 the Live composer
+import { startPageHtml, startPick, startAsksBanner, headlessBarHtml, modePillHtml, modeLabel, startsSettingHtml, localPillHtml, lockedAttrs, lockHtml, startViewerLocal as startViewerAt, startTexts, fillStartTexts, browseTarget, startPairAskHtml, typedPath, fillApproved } from './start.js' // 0.9.9 New session
 import { attachPlan, skippedText, shortName, prepareFile, uploadFile, fetchAttachment, fmtSize, attachKind, pastedName, ATTACH_MAX_FILES } from './attach.js' // 0.9.8 attachments
 import { wireTips } from './tips.js'
 import { factHtml } from './facts.js' // 0.9.9 the session page's info cards
 import { mountUpdateBar, takeCarry } from './update-bar.js' // 0.9.8 "Leftoff updated · Refresh"
-import { needsItems, needsStrip, needPanel, agentNeedPanel, httpsOnly, agentReplyButton, agentChipHtml, cardBadge, questionAnswer, turnsHtml, dismissedHtml } from './needs.js'
+import { needsItems, needsStrip, needPanel, agentNeedPanel, httpsOnly, agentReplyButton, agentChipHtml, cardBadge, questionAnswer, turnsHtml, dismissedHtml, askDocked, askDockHtml, askSlimHtml, askRows, askBottom } from './needs.js'
 import { SUMMARY_EXAMPLES, LENGTH_CHOICES } from './summary-examples.js'
 import { mdInline, renderSection } from './changelog-md.js'
 import { cardPrsHtml, sessionPrsSection, prsPageHtml, prsBodyHtml, prRowHtml, prRows, readPrFilter, prsHash } from './prs.js'
@@ -1398,6 +1398,7 @@ function paintSession(s, data) {
   liveKeeper.before($app)
   $app.innerHTML = sessionPageHtml(s, data)
   liveAfterRender(s.id)
+  fitAskDetail($app)
   if (kf) {
     const nt = $app.querySelector('.composer-input[data-draft="' + CSS.escape(kf.d || '') + '"]')
     if (nt && nt.dataset.draft === kf.d && !nt.disabled) { nt.focus({ preventScroll: true }); try { const n = nt.value.length; nt.setSelectionRange(Math.min(kf.a, n), Math.min(kf.b, n)) } catch {} }
@@ -1495,14 +1496,14 @@ function sessionPageHtml(s, { spv = null, live: liveV = null, lists = null } = {
     // 0.9.8: one line each, 44px, an icon and a short label; the group drops under the title as a whole when it doesn't fit beside it
     '<div class="actions s-actions">' + goButton(s, { page: true }) + (s.status === 'ended' || s.live === 'closed' ? resumeButton(s, s.viewer || { local: state.viewerLocal !== false, ghostty: !!state.ghostty }) : '') + '<a class="btn" href="#/timeline?session=' + encodeURIComponent(s.id) + '" title="Open in Timeline" aria-label="Open in Timeline">' + icon('history') + 'Timeline</a><button type="button" class="btn" data-action="resume" data-id="' + esc(s.id) + '" title="' + esc(resumeTip(s, 'Copy resume command')) + '">' + icon('copy') + 'Copy resume</button>' + (s.liveResumeCommand ? '<button type="button" class="btn" data-action="copy-cmd" data-cmd="' + esc(s.liveResumeCommand) + '" title="Exit the session in its terminal, then run this to bring it back Live">' + icon('copy') + 'Copy Live resume</button>' : '') + (reachOf(s) === 'local' || reachOf(s) === 'peer' ? checkpointSplit(s) : reachOf(s) === 'away' ? '<span class="more-wrap">' + moreMenu(s, awayMenuItems(s), { project: false, title: s.title || 'This session' }) + '</span>' : '') + '</div></div>'
   html += ownerOfflineNote(s) // 0.9.8: before the facts, where it's seen
-  html += headlessBarHtml(s, { esc, icon, may: state.mayAnswer !== false }) // 0.9.9: started from the board: Stop / Resume
+  html += headlessBarHtml(s, { esc, icon, may: state.mayAnswer !== false, busy: modeBusy.get(s.id) || null, local: state.viewerLocal !== false }) // 0.9.9: started from the board: Stop / Resume, Permissions
   if (s.headless && s.headless.error) headlessErrors.set(s.id, s.headless.error)
   html += '<div class="facts">' +
     fact('Machine', mEmoji(s.machine) + ' ' + s.machine + (thisOneSuffix(s.machine, state.health) || (s.isLocal ? '' : ' (synced)'))) + fact('Repo', (s.repoName || '—') + (branch ? ' · ' + branch : ''), '', { copy: (s.repo && s.repo.root) || null, what: 'repo folder' }) + (s.repoProject ? fact('Project', projectLabel(s.repoProject)) : '') + (s.worktree ? fact('Worktree', '⑂ ' + s.worktree.name + (s.worktree.branch ? ' · ' + s.worktree.branch : ''), 'wrap', { copy: s.worktree.path || null, what: 'worktree folder' }) : '') + (s.startedIn ? fact('Started in', s.startedIn) : '') + fact('Directory', s.cwd || '—', '', { copy: s.cwd || null, clip: 34 }) + fact('Last activity', ago(s.lastActivityAt)) + fact('Started', clock(s.startedAt)) +
     fact('Turns', s.turns + ' (' + s.turnsSinceCheckpoint + ' since checkpoint)' + (s.historyTurns ? ' · resumed, ' + s.historyTurns + ' before' : '')) + fact('Capture', s.capture || '—') + fact('Model', s.modelLabel || s.model || '—', 'wrap') + fact('Session id', s.id, '', { copy: s.id, what: 'session id' }) +
     fact('Open?', s.live === 'open' ? 'open' + (s.liveVia === 'pid' ? ' (process ' + s.pid + ' running)' : ' (heartbeat)') : s.live === 'closed' ? 'closed ' + ago(s.closedAt) : 'unknown', '', { copy: s.live === 'open' && s.liveVia === 'pid' && s.pid != null ? String(s.pid) : null, what: 'process id' }) +
     fact('Terminal', (s.terminal ? s.terminal.label : s.codingAgent === 'codex' ? ({ 'codex-ide': 'Codex in the IDE', 'codex-app': 'Codex app', 'codex-exec': 'codex exec' }[s.surface] || 'Codex CLI') : '—') + (s.tty ? ' · ' + s.tty.replace('/dev/', '') : '') + ' · tab cp:' + (s.shortId || ''), '', { copy: s.shortId ? 'cp:' + s.shortId : null, what: 'terminal tab id' }) + '</div>'
-  if (isLive(s)) html += (s.needsYou ? sessionNeedsStrip(s) : '') + liveBoxHtml(s, liveV)
+  if (isLive(s)) html += (s.needsYou && !askDocked(s) ? sessionNeedsStrip(s) : '') + liveBoxHtml(s, liveV) // 0.9.9: a permission ask or question docks in Live, in the composer's place
   html += parkRow(s)
   html += spacePicker(s, spv, 'session', s.id)
   html += '<section class="sprs" id="prs">' + sessionPrsSection(s, { mayEdit: !s.agent, open: prsUi.open, details: prsUi.details }) + '</section>'
@@ -1512,7 +1513,7 @@ function sessionPageHtml(s, { spv = null, live: liveV = null, lists = null } = {
   // 0.9.8: the last tools it ran and its folder's changes, folded; loads when you open it
   html += '<section class="wid" id="what-it-did">' + whatItDidSection(s, widOf(s.id)) + '</section>'
   // 0.9.8: a live-linked session keeps its permission card and the prompt box together, near the top
-  if (s.needsYou && !isLive(s)) html += sessionNeedsStrip(s)
+  if (s.needsYou && !isLive(s) && !askDocked(s)) html += sessionNeedsStrip(s)
   if (!isLive(s)) html += liveBoxHtml(s, liveV)
   if (s.statusChanges && s.statusChanges.length) {
     html += '<div class="striplabel">Status history</div><div class="strip">' + s.statusChanges.slice(-24).map((c) => '<span class="s-' + esc(c.status) + '" title="' + esc(clock(c.at)) + '">' + esc(LABEL[c.status] || c.status) + '</span>').join('') + '</div>'
@@ -1547,6 +1548,16 @@ function sessionNeedsStrip(s) { return '<section class="needs-strip one" aria-la
 // 0.9.8 polish: the thread is ui/live-view.js (entries, status, sticking to the
 // bottom); Claude's answer is the session's own (markdown, like the terminal).
 const liveKeeper = createLiveKeeper()
+// A long command folds to three lines with "Show all"; where it fits anyway (a wide window), no button.
+function fitAskDetail(root) {
+  for (const c of root.querySelectorAll('.ask-dock .ask-detail.long:not(.open)')) {
+    if (c.scrollHeight > c.clientHeight + 2) continue
+    c.classList.remove('long')
+    const b = c.parentElement && c.parentElement.querySelector('.ask-more'); if (b) b.hidden = true
+  }
+}
+// 0.9.9 the docked ask: which ones show their whole command, and which you chose to reply to instead (this page only)
+const askUi = { open: new Set(), reply: new Set() }
 const liveSeenKey = (id) => 'lo-live-seen:' + id
 function liveSeen(id) { try { return localStorage.getItem(liveSeenKey(id)) } catch { return null } }
 function markLiveSeen(id, at) { try { localStorage.setItem(liveSeenKey(id), at || new Date().toISOString()) } catch {} }
@@ -1593,18 +1604,22 @@ function liveBoxHtml(s, v) {
   // a session Leftoff started that isn't running now: what was said, read-only (Resume here sends again)
   if (kind === 'readonly') {
     if (!msgs.length) return ''
-    return '<section class="live-box" id="live" aria-label="Live link" data-id="' + esc(s.id) + '"><div class="live-head"><h2>Live</h2><span class="faint">Not running. Resume it to send more.</span></div>' +
+    return '<section class="live-box" id="live" aria-label="Live link" data-id="' + esc(s.id) + '"><div class="live-head"><h2>Live</h2>' + modePillHtml(s, { esc }) + '<span class="faint">Not running. Resume it to send more.</span></div>' +
       '<div class="live-thread" data-sid="' + esc(s.id) + '"><ol class="live-log" aria-label="Messages with this session">' +
-      earlierHtml((v && v.earlier) || 0, { esc }) + threadHtml(msgs, { esc, ago, md: renderDoc, now, attHtml: (atts) => attBubbleHtml(atts, s.id) }) + '</ol>' +
+      earlierHtml((v && v.earlier) || 0, { esc }) + threadHtml(msgs, { esc, ago, md: renderDoc, now, attHtml: (atts) => attBubbleHtml(atts, s.id), inserts: askRows(s), earlier: (v && v.earlier) || 0, may: false }) + '</ol>' +
       '<button type="button" class="live-jump" data-action="live-jump" hidden>Jump to latest ↓<span class="live-jump-n"></span></button></div></section>'
   }
-  return '<section class="live-box" id="live" aria-label="Live link" data-id="' + esc(s.id) + '"><div class="live-head"><h2>Live</h2><span class="faint">Goes straight into this session' + (s.isLocal === false ? ' on ' + esc(s.machine) : '') + '. Claude reads it as its next prompt.</span></div>' +
+  // 0.9.9: a waiting permission ask (or question) takes the composer's place; "Reply instead" brings the composer back for that ask
+  const rows = askRows(s)
+  const bottom = askBottom(s, askUi.reply)
+  const dock = bottom === 'dock', docked = bottom !== 'composer'
+  return '<section class="live-box" id="live" aria-label="Live link" data-id="' + esc(s.id) + '"><div class="live-head"><h2>Live</h2>' + modePillHtml(s, { esc }) + '<span class="faint">Goes straight into this session' + (s.isLocal === false ? ' on ' + esc(s.machine) : '') + '. Claude reads it as its next prompt.</span></div>' +
     '<div class="live-thread" data-sid="' + esc(s.id) + '"><ol class="live-log" aria-live="polite" aria-label="Messages with this session">' +
-      earlierHtml((v && v.earlier) || 0, { esc }) + threadHtml(msgs, { esc, ago, md: renderDoc, now, attHtml: (atts) => attBubbleHtml(atts, s.id) }) + '</ol>' +
-      '<p class="faint live-empty"' + (msgs.length ? ' hidden' : '') + '>Nothing sent yet. Claude answers here' + (s.headless ? '' : ' and in the terminal') + '.</p>' +
+      earlierHtml((v && v.earlier) || 0, { esc }) + threadHtml(msgs, { esc, ago, md: renderDoc, now, attHtml: (atts) => attBubbleHtml(atts, s.id), inserts: rows, earlier: (v && v.earlier) || 0, may }) + '</ol>' +
+      '<p class="faint live-empty"' + (msgs.length || rows.length ? ' hidden' : '') + '>Nothing sent yet. Claude answers here' + (s.headless ? '' : ' and in the terminal') + '.</p>' +
       '<button type="button" class="live-jump" data-action="live-jump" hidden>Jump to latest ↓<span class="live-jump-n"></span></button></div>' +
     (v && v.error ? '<p class="live-err">' + esc(v.error) + '</p>' : '') +
-    composerHtml(s, draft, may) +
+    (dock ? '<div class="ask-dock-wrap">' + askDockHtml({ ...s.needsYou, session: s }, needOpts({ askOpen: askUi.open })) + '</div>' : (docked ? askSlimHtml(s.needsYou) : '') + composerHtml(s, draft, may)) +
     (may ? '' : '<p class="faint">Sending from another device is off. On a Mac, turn on Settings → Privacy &amp; security → Trust my paired devices.</p>') + '</section>'
 }
 // The Live composer: one rounded box, a textarea that starts at one line and
@@ -2102,6 +2117,58 @@ function onWake(ev) {
 }
 for (const t of ['pageshow', 'focus', 'blur', 'online']) window.addEventListener(t, onWake)
 document.addEventListener('visibilitychange', onWake)
+// 0.9.9 Cancel / Edit on a Queued message: the daemon takes it back from
+// Claude Code's queue (only while it still waits; too late says so plainly).
+// Edit then puts its words (and files) back in the box, after anything typed.
+// 0.9.9 Send now on a Queued message: Claude stops its current step and this
+// one runs next (ahead of any queued before it). The daemon says what Claude
+// Code did; too late (Claude already has it) is a plain message.
+async function sendNowClick(btn) {
+  const box = btn.closest('.live-box')
+  const sid = box && box.dataset.id
+  const msg = btn.dataset.msg
+  if (!sid || !msg || btn.disabled) return
+  const li = btn.closest('.lv')
+  if (li) li.querySelectorAll('.lv-q-btn').forEach((b) => { b.disabled = true })
+  btn.setAttribute('aria-busy', 'true')
+  try {
+    const r = await api('POST', '/v1/sessions/' + encodeURIComponent(sid) + '/live/' + encodeURIComponent(msg) + '/sendnow', {})
+    toast(r.result === 'stopped' ? 'Sent now · Claude stopped its step for it' : 'Sending now', 3000)
+  } catch (e) {
+    toast(e.message, 4200)
+  }
+  await refreshLive('sendnow')
+  await render()
+}
+async function queuedClick(btn, edit) {
+  const box = btn.closest('.live-box')
+  const sid = box && box.dataset.id
+  const msg = btn.dataset.msg
+  if (!sid || !msg || btn.disabled) return
+  const li = btn.closest('.lv')
+  if (li) li.querySelectorAll('.lv-q-btn').forEach((b) => { b.disabled = true })
+  btn.setAttribute('aria-busy', 'true')
+  try {
+    const r = await api('POST', '/v1/sessions/' + encodeURIComponent(sid) + '/live/' + encodeURIComponent(msg) + '/cancel', {})
+    const s = state.sessions.find((x) => x.id === sid)
+    if (edit) {
+      const typed = ((state.drafts && state.drafts['live:' + sid]) || '').trim()
+      state.drafts['live:' + sid] = typed ? typed + '\n\n' + (r.text || '') : (r.text || '')
+      const atts = (r.attachments || []).filter((a) => a && a.id)
+      if (atts.length && !(s && s.isLocal === false)) attachUi.by.set(sid, [...attachList(sid), ...atts.map((a) => ({ lid: 'a' + (++attachUi.seq), sid, file: null, name: a.name || 'file', size: a.size || 0, type: a.type || '', kind: a.kind || 'file', status: 'done', sent: a.size || 0, total: a.size || 0, id: a.id, preview: null, thumb: null, error: null }))])
+      else if (atts.length) toast('Its files didn’t come back: attach them again.', 4200)
+    }
+    toast(edit ? 'Taken back · edit it and send again' : 'Cancelled · Claude never saw it', 3000)
+    await refreshLive('cancel')
+    await render()
+    if (edit) { const ta = document.querySelector('.live-box .composer-input'); if (ta && !ta.disabled) { ta.value = state.drafts['live:' + sid] || ''; fitComposer(ta); ta.focus({ preventScroll: true }) } }
+  } catch (e) {
+    toast(e.message, 4200)
+    await refreshLive('cancel')
+    await render()
+  }
+}
+
 async function liveSendClick(btn) {
   const box = btn.closest('.live-box')
   const ta = box && box.querySelector('.live-text')
@@ -2110,6 +2177,7 @@ async function liveSendClick(btn) {
   if (!text && !attachList(sid).length) { if (ta) ta.focus(); return }
   if (btn.disabled || btn.classList.contains('sending')) return
   const hadFocus = !!(ta && document.activeElement === ta)
+  let sent = false // 0.9.9: went through: a phone's keyboard closes
   btn.classList.add('sending'); btn.disabled = true; btn.setAttribute('aria-busy', 'true'); btn.setAttribute('aria-label', 'Sending…')
   try {
     // 0.9.8: attachments still uploading go first; one that failed waits for you (retry or remove)
@@ -2123,6 +2191,7 @@ async function liveSendClick(btn) {
     if (!ta || ta.value.trim() === text) { if (state.drafts) delete state.drafts['live:' + sid]; if (ta) { ta.value = ''; fitComposer(ta) } }
     if (ids.length) { attachUi.by.set(sid, attachList(sid).filter((a) => !ids.includes(a.id))); paintChips(sid) }
     if (r.state === 'failed') toast('Didn’t arrive: ' + (r.error || 'the session isn’t listening'), 4200)
+    else sent = true
     const ol = box && box.querySelector('.live-log')
     if (ol) ol.scrollTop = ol.scrollHeight // your own message: always follow it
     setTimeout(() => { if (state.route && state.route.name === 's') soon() }, 1500)
@@ -2131,7 +2200,11 @@ async function liveSendClick(btn) {
     const nb = document.querySelector('.live-box [data-action="live-send"]')
     if (nb) { nb.classList.remove('sending'); nb.removeAttribute('aria-busy'); nb.setAttribute('aria-label', 'Send') }
     const nt = document.querySelector('.live-box .composer-input')
-    if (nt) { fitComposer(nt); if (hadFocus && !nt.disabled && document.activeElement !== nt) nt.focus({ preventScroll: true }) }
+    if (nt) {
+      fitComposer(nt)
+      if (!keepFocusAfterSend({ ok: sent, touch: isTouchUi(window.matchMedia) })) letGoOfKeyboard(document)
+      else if (hadFocus && !nt.disabled && document.activeElement !== nt) nt.focus({ preventScroll: true })
+    }
   }
 }
 
@@ -3385,7 +3458,7 @@ async function viewSettings() {
   const panes = {
     general: '<div class="section">Needs you</div>' +
       '<label for="f-notify">Notify me</label><label class="check"><input id="f-notify" type="checkbox"' + (c.notify && c.notify.needsYou === false ? '' : ' checked') + '><span>Show a notification when a prompt or question has waited ' + esc((c.notify && c.notify.delaySec != null) ? c.notify.delaySec : 10) + ' seconds</span></label>' +
-      '<div class="hint">With <code>terminal-notifier</code>, a click jumps to the session.</div>' +
+      '<div class="hint">They come from “Leftoff” on the Mac the session runs on; a click opens the session.</div>' +
       '<div class="full push-slot" data-push-slot hidden></div>' +
       '<div class="section">Appearance</div>' +
       '<label>Theme</label><div class="theme" role="group" aria-label="Theme">' + ['light', 'dark', 'system'].map((t) => '<button type="button" data-theme-set="' + t + '" aria-pressed="' + (pref === t) + '">' + THEME_ICONS[t] + (t === 'system' ? 'System' : t[0].toUpperCase() + t.slice(1)) + '</button>').join('') + '</div>' +
@@ -3436,6 +3509,13 @@ async function viewSettings() {
       SETTINGS.map((x) => '<section class="set-pane" data-sec="' + x.key + '" aria-label="' + esc(x.label) + '" hidden>' + panes[x.key] + '</section>').join('') +
       '<div class="full set-save" id="setSave"><span class="faint" id="setSaveNote">Saves every section to config.json in your Leftoff folder.</span><button class="btn primary" type="submit" disabled aria-disabled="true">' + icon('check') + 'Save</button></div></form></div></div>'
   showSettingsSection(r)
+  approvedUi.info = starts; approvedUi.err = ''
+  fillApproved($app, starts) // approved folders: paths as text
+  const ap = document.getElementById('f-start-approve')
+  if (ap) {
+    ap.addEventListener('keydown', (e) => { if (e.key === 'Enter') { e.preventDefault(); approvedAdd() } })
+    ap.addEventListener('input', () => { if (approvedUi.err) { approvedUi.err = ''; fillApproved($app, approvedUi.info) } })
+  }
   paintSettingsDots()
   syncProviderFields()
   // Claim your name (0.6.1): Enter sends the link instead of saving the form; a link already out keeps polling.
@@ -4183,6 +4263,7 @@ async function render() {
 
 // this Mac's own browser, or the hosted board open on it (the direct door)
 function startViewerLocal(v) { return startViewerAt(v, state.viewerLocal !== false) }
+const modeBusy = new Map() // 0.9.9: a session whose Permissions switch is on its way: id -> mode
 const startUi = { data: null, machine: null, repo: null, where: 'repo', allRepos: false, ask: null, busy: new Set(), sending: false, poll: null, browse: null, custom: null }
 async function viewNewSession() {
   try { startUi.data = await api('GET', '/v1/start') } catch (e) { if (!startUi.data) throw e }
@@ -4241,6 +4322,33 @@ document.addEventListener('click', (ev) => {
   ev.preventDefault()
   pill.classList.toggle('show')
 }, true)
+// 0.9.9 Settings → Approved folders: add (the Mac checks it: inside home, not
+// home itself, not the synced folder; an inline error otherwise, and what you
+// typed stays) and remove. This Mac only (the server checks).
+const approvedUi = { info: null, err: '', busy: false }
+async function approvedAdd() {
+  const inp = document.getElementById('f-start-approve')
+  if (!inp || inp.disabled || approvedUi.busy) return
+  const want = typedPath(inp.value)
+  const fail = (m) => { approvedUi.err = m; fillApproved($app, approvedUi.info, m); inp.focus() }
+  if (!want) return fail('Type a folder, like ~/src.')
+  approvedUi.busy = true
+  try {
+    const r = await api('POST', '/v1/starts/approved', { path: want })
+    approvedUi.busy = false
+    toast(r.added ? 'Approved ' + r.folder + (r.allowRemote ? '' : '. Turn on Allow starting sessions from other devices for it to skip the ask') : r.coveredBy ? 'Already inside ' + r.coveredBy + ', which is approved' : r.folder + ' is already approved', r.added && !r.allowRemote ? 6000 : 3000)
+    await viewSettings()
+    const again = document.getElementById('f-start-approve'); if (again) again.focus({ preventScroll: true })
+  } catch (e) { approvedUi.busy = false; fail(e.message) }
+}
+async function approvedRemove(i) {
+  const a = approvedUi.info && (approvedUi.info.approved || [])[i]
+  if (!a || approvedUi.busy) return
+  approvedUi.busy = true
+  try { const r = await api('POST', '/v1/starts/approved/remove', { path: a.path }); toast(r.folder + ' is no longer approved') } catch (e) { toast(e.message, 5000) }
+  approvedUi.busy = false
+  await viewSettings()
+}
 // 0.9.9: a setting that saves the moment you change it (no Save button) says
 // so beside it: "Saved ✓" for a moment, or what went wrong, inline.
 const savedTimers = new Map()
@@ -4275,8 +4383,9 @@ async function startSend(btn) {
   if (!pick.m || !pick.repo) return toast('Pick a Mac and a repo first')
   startUi.sending = true; btn.disabled = true; btn.classList.add('sending'); btn.setAttribute('aria-busy', 'true')
   try {
-    const r = await api('POST', '/v1/sessions/start', { machine: pick.m.machine, cwd: pick.repo.path, prompt: text, where: pick.where }, { timeoutMs: 60000 })
+    const r = await api('POST', '/v1/sessions/start', { machine: pick.m.machine, cwd: pick.repo.path, prompt: text, where: pick.where, mode: pick.mode }, { timeoutMs: 60000 })
     if (state.drafts) delete state.drafts.start
+    if (!keepFocusAfterSend({ ok: true, touch: isTouchUi(window.matchMedia) })) letGoOfKeyboard(document) // 0.9.9: a phone's keyboard closes
     if (r.state === 'started' && r.sessionId) { startUi.ask = null; toast('Started on ' + (r.machine || pick.m.machine)); location.hash = '#/s/' + encodeURIComponent(r.sessionId); return }
     startUi.ask = { ...r, machine: r.machine || pick.m.machine }
     pollStartAsk()
@@ -5247,7 +5356,7 @@ window.addEventListener('hashchange', () => closeActionMenu())
 const tipsUi = wireTips(document) // 0.9.8: the ⓘ tooltips (Always allow here)
 window.addEventListener('hashchange', () => tipsUi.hide())
 // 0.8.9: a session page's title is a button too (Enter or Space renames it)
-document.addEventListener('keydown', (e) => { const t = e.target; if ((e.key === 'Enter' || e.key === ' ') && t && t.matches && t.matches('.s-title-text[role="button"]')) { e.preventDefault(); t.click() } })
+document.addEventListener('keydown', (e) => { const t = e.target; if ((e.key === 'Enter' || e.key === ' ') && t && t.matches && t.matches('.s-title-text[role="button"], .lv-q-long[role="button"]')) { e.preventDefault(); t.click() } })
 // 0.8.7: a card's ⋯ opens from the keyboard with the arrows too (Enter and Space click it).
 document.addEventListener('keydown', (ev) => {
   const b = ev.target && ev.target.closest && ev.target.closest('[data-action="card-more"]')
@@ -5445,7 +5554,7 @@ document.addEventListener('click', async (ev) => {
     // 0.9.9 New session: the page's choices, the send, a yes or no for a start waiting here, Stop and Resume
     if (action === 'start-pick') {
       const k = btn.dataset.k, v = btn.dataset.v
-      if (k === 'machine') { startUi.machine = v; startUi.repo = null; startUi.allRepos = false; startUi.browse = null; startUi.custom = null } else if (k === 'repo') startUi.repo = v; else if (k === 'where') startUi.where = v === 'worktree' ? 'worktree' : 'repo'
+      if (k === 'machine') { startUi.machine = v; startUi.repo = null; startUi.allRepos = false; startUi.browse = null; startUi.custom = null } else if (k === 'repo') startUi.repo = v; else if (k === 'where') startUi.where = v === 'worktree' ? 'worktree' : 'repo'; else if (k === 'mode') startUi.mode = v
       return render()
     }
     // Other folder…: open the browser at ~, walk it, use a folder
@@ -5491,18 +5600,31 @@ document.addEventListener('click', async (ev) => {
     }
     if (action === 'start-again') { startUi.ask = null; return render() }
     if (action === 'start-send') return startSend(btn)
-    if (action === 'start-ask-confirm' || action === 'start-ask-decline') {
+    if (action === 'start-approved-add') return approvedAdd()
+    if (action === 'start-approved-remove') return approvedRemove(Number(btn.dataset.i))
+    if (action === 'start-ask-confirm' || action === 'start-ask-decline' || action === 'start-ask-approve') {
       if (!id || startUi.busy.has(id)) return
       startUi.busy.add(id); render()
       try {
-        const r = await api('POST', '/v1/sessions/start/' + encodeURIComponent(id) + '/' + (action === 'start-ask-confirm' ? 'confirm' : 'decline'), {}, { timeoutMs: 60000 })
-        toast(r.state === 'started' ? 'Started' : r.state === 'declined' ? 'Declined' : r.state === 'failed' ? 'Didn’t start: ' + (r.error || '') : 'That request was ' + r.state, r.state === 'failed' ? 6000 : 2500)
+        // "Always allow in <folder>": approves that folder here, then starts this one
+        const r = await api('POST', '/v1/sessions/start/' + encodeURIComponent(id) + '/' + (action === 'start-ask-decline' ? 'decline' : 'confirm'), action === 'start-ask-approve' ? { approve: true } : {}, { timeoutMs: 60000 })
+        if (r.approved && r.state !== 'failed') toast((r.state === 'started' ? 'Started. ' : '') + 'Folders inside ' + r.approved + ' now start without asking' + (r.allowRemote ? '' : ' once Allow starting sessions from other devices is on'), 5000)
+        else toast(r.state === 'started' ? 'Started' : r.state === 'switched' ? 'Switched to ' + modeLabel(r.mode) : r.state === 'declined' ? 'Declined' : r.state === 'failed' ? 'Didn’t start: ' + (r.error || '') : 'That request was ' + r.state, r.state === 'failed' ? 6000 : 2500)
         startUi.busy.delete(id)
         if (r.state === 'started' && r.sessionId) { location.hash = '#/s/' + encodeURIComponent(r.sessionId); return }
       } catch (e) { toast(e.message, 5000) }
       startUi.busy.delete(id)
       return render()
     }
+    // 0.9.9 Permissions of a session Leftoff runs: switch it (or, from another device, ask that Mac)
+    if (action === 'headless-mode') {
+      if (!id || modeBusy.has(id) || btn.getAttribute('aria-checked') === 'true') return
+      modeBusy.set(id, btn.dataset.mode); render()
+      try { modeToast(await switchMode(id, btn.dataset.mode)) } catch (e) { toast(e.message, 6000) }
+      modeBusy.delete(id)
+      return render()
+    }
+    if (action === 'ask-auto') return autoRestClick(btn)
     if (action === 'headless-stop' || action === 'headless-run') {
       btn.disabled = true
       try {
@@ -5694,6 +5816,22 @@ document.addEventListener('click', async (ev) => {
       return paintDigestFilter()
     }
     // ---- Needs you (v0.4.4)
+    // 0.9.9 the docked ask: open a long command in place; reply instead (the composer comes back); back to the card
+    if (action === 'ask-expand') {
+      const code = btn.closest('.ask-dock') && btn.closest('.ask-dock').querySelector('.ask-detail')
+      const open = !askUi.open.has(btn.dataset.ask)
+      if (open) askUi.open.add(btn.dataset.ask); else askUi.open.delete(btn.dataset.ask)
+      if (code) code.classList.toggle('open', open)
+      btn.setAttribute('aria-expanded', open ? 'true' : 'false'); btn.textContent = open ? 'Show less' : 'Show all'
+      return
+    }
+    if (action === 'ask-reply-instead' || action === 'ask-back') {
+      if (action === 'ask-reply-instead') askUi.reply.add(btn.dataset.ask); else askUi.reply.delete(btn.dataset.ask)
+      await render()
+      if (action === 'ask-reply-instead') { const ta = document.querySelector('.live-box .composer-input'); if (ta && !ta.disabled) ta.focus({ preventScroll: true }) }
+      else { const a = document.querySelector('.ask-dock [data-action="ask-answer"][data-choice="allow"], .ask-dock button:not([disabled])'); if (a) a.focus({ preventScroll: true }) }
+      return
+    }
     if (action === 'ask-deny-open' || action === 'ask-deny-close') {
       const need = btn.closest('.need')
       const form = need && need.querySelector('.deny-form')
@@ -5709,6 +5847,9 @@ document.addEventListener('click', async (ev) => {
     if (action === 'ask-answer' || action === 'ask-pick-send') return answerClick(btn, action)
     if (action === 'reply-send') return replyClick(btn)
     if (action === 'live-send') return liveSendClick(btn)
+    if (action === 'lv-queued-cancel' || action === 'lv-queued-edit') return queuedClick(btn, action === 'lv-queued-edit')
+    if (action === 'lv-queued-now') return sendNowClick(btn)
+    if (action === 'lv-queued-more') { if (ev.target.closest('a[href]')) return; const open = !btn.classList.contains('open'); btn.classList.toggle('open', open); btn.setAttribute('aria-expanded', open ? 'true' : 'false'); return }
     if (action === 'attach') { const inp = btn.closest('.composer') && btn.closest('.composer').querySelector('.att-input'); if (inp && !inp.disabled) inp.click(); return }
     if (action === 'att-remove') return removeAttachment(btn.dataset.lid)
     if (action === 'att-retry') return retryAttachment(btn.dataset.lid)
@@ -5843,6 +5984,28 @@ document.addEventListener('click', async (ev) => {
 
 // Answer a permission prompt or a question from the board. The daemon hands it
 // to the waiting hook or mod; the terminal's own prompt may already have won.
+// 0.9.9 Permissions mid-session (src/session-start.js switchMode): switched, or waiting for a yes at that Mac.
+function switchMode(id, mode) { return api('POST', '/v1/sessions/' + encodeURIComponent(id) + '/mode', { mode }, { timeoutMs: 30000 }) }
+function modeToast(r) {
+  if (r && r.state === 'pending') toast('Asked ' + (r.machine || 'that Mac') + ': someone there says yes, then it switches', 5000)
+  else toast('Permissions: ' + modeLabel(r && r.mode) + (r && r.running === false ? ' (when it runs again)' : ''), 3000)
+}
+// "Auto-approve the rest" on a permission card: allow this call, and switch the session to Auto.
+async function autoRestClick(btn) {
+  const need = btn.closest('.need')
+  if (!need || !need.dataset.ask) return
+  const sid = need.dataset.id
+  need.querySelectorAll('button, input, textarea').forEach((el) => { if (!el.classList.contains('go')) el.disabled = true })
+  btn.textContent = 'Switching…'
+  let sw = null
+  try { sw = await switchMode(sid, 'auto') } catch (e) { toast(e.message, 6000); render(); return }
+  try {
+    await api('POST', '/v1/asks/' + encodeURIComponent(need.dataset.ask) + '/answer', { action: 'allow', auto: true }) // 0.9.9: the thread's row says Auto-approved
+    toast(sw && sw.state === 'pending' ? 'Allowed. Auto waits for a yes on ' + (sw.machine || 'that Mac') : 'Allowed; the rest of this session runs in Auto', 4000)
+  } catch (e) { toast(e.code === 'not_waiting' ? 'Already handled: ' + e.message : e.message, 4200) }
+  render()
+}
+
 async function answerClick(btn, action) {
   const need = btn.closest('.need, .ql-item') // 0.9.8: Quick look's Allow / Deny are the same buttons
   if (!need) return
@@ -5873,6 +6036,7 @@ async function answerClick(btn, action) {
   try {
     const r = await api('POST', '/v1/asks/' + encodeURIComponent(askId) + '/answer', body)
     toast(r.summary + (r.delivered ? ' · Claude Code has it' : ' · waiting for Claude Code to pick it up'), 3600)
+    if (!keepFocusAfterSend({ ok: true, touch: isTouchUi(window.matchMedia) })) letGoOfKeyboard(document) // a typed answer sent: a phone's keyboard closes
     for (const k of Object.keys(state.drafts)) if (k.includes(askId)) delete state.drafts[k]
   } catch (e) {
     toast(e.code === 'not_waiting' ? 'Already handled: ' + e.message : e.message, 4200)
@@ -5896,6 +6060,7 @@ async function replyClick(btn) {
     const r = await api('POST', '/v1/sessions/' + encodeURIComponent(need.dataset.id) + '/reply', { text })
     delete state.drafts['reply:' + need.dataset.id]
     toast(r.queuedBehindTurn ? 'Sent · Claude reads it when the current turn ends' : 'Sent · Claude has it as its next prompt', 3600)
+    if (!keepFocusAfterSend({ ok: true, touch: isTouchUi(window.matchMedia) })) letGoOfKeyboard(document) // a phone's keyboard closes
   } catch (e) { toast(e.message, 4200) } finally { render() }
 }
 

package/ui/composer.js

@@ -34,6 +34,18 @@ export function isTouchUi(matchMedia) {
   } catch { return false }
 }
 
+// 0.9.9 After a send that went through, a phone's keyboard closes: the text
+// box lets go of focus. On a Mac (a fine pointer) focus stays, so you can keep
+// typing. A send that failed keeps its text and its focus everywhere.
+export function keepFocusAfterSend({ ok = false, touch = false } = {}) { return !ok || !touch }
+// Let go of the focused text box (the on-screen keyboard closes); true if one had it.
+export function letGoOfKeyboard(doc) {
+  const a = doc && doc.activeElement
+  if (!a || a === doc.body || !/^(TEXTAREA|INPUT)$/.test(String(a.tagName || '').toUpperCase()) || typeof a.blur !== 'function') return false
+  a.blur()
+  return true
+}
+
 // The height the box should be for its content: scrollHeight is the
 // textarea's at height:auto (padding included), lineHeight and padY in px.
 // -> { height, scroll } where scroll says the content is taller than the cap.