claude-code-kanban 4.30.0 → 4.31.1

package/README.md

@@ -59,7 +59,7 @@ Run `claude` in any project. You do not configure anything per project. Claude C
 - **Session log.** Every prompt, reply and tool call in order (<kbd>Shift</kbd>+<kbd>L</kbd>). Follow the newest message with <kbd>Shift</kbd>+<kbd>M</kbd>, and pin the messages that matter. [Session log and details](https://nikiforovall.blog/claude-code-kanban/guides/session-details/)
 - **Subagents.** The agents log lists each subagent with its model, status and run time. Open one to read its prompt and response. Team sessions get colored owner badges and an owner filter. [Subagents](https://nikiforovall.blog/claude-code-kanban/guides/subagents/)
 - **Session info and tool stats.** Model, branch, context window use, cost, and which tools ran. The sidebar footer shows your 5-hour and 7-day rate limit use.
-- **Zen mode.** <kbd>Shift</kbd>+<kbd>Z</kbd> shows only the current session in the sidebar, with its context use, scratchpad folder and linked documents.
+- **Zen mode.** <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Z</kbd> shows only the current session in the sidebar, with its context use, scratchpad folder and linked documents.
 
 <picture>
   <source media="(prefers-color-scheme: dark)" srcset="website/public/shots/themes/ember-02-subagent-preview-dark.webp">
@@ -88,7 +88,7 @@ Run `claude` in any project. You do not configure anything per project. Claude C
 
 - **Session groups.** Drag sessions and projects from different folders into one named group in the sidebar. [Session groups](https://nikiforovall.blog/claude-code-kanban/guides/session-groups/)
 - **Filters, search and pins.** Filter by project and activity, search across sessions and tasks, pin a session or make it sticky. <kbd>Shift</kbd>+<kbd>P</kbd> opens the session picker.
-- **Scratchpad and linked documents.** Keep a note per session, project or group (<kbd>N</kbd>), and link files to a session to preview them in one click.
+- **Scratchpad and linked documents.** Keep a note per session, project or group (<kbd>N</kbd>), and link files or web URLs to a session to open them in one click.
 - **Themes.** 17 color themes, each in light and dark. <kbd>T</kbd> switches the mode.
 - **Keyboard first.** Arrow keys move through tasks, and <kbd>Tab</kbd> moves between the sidebar and the board. Press <kbd>?</kbd> for the full list. [Keyboard shortcuts](https://nikiforovall.blog/claude-code-kanban/reference/keyboard-shortcuts/)
 

package/cli.js

@@ -2,25 +2,26 @@ const fs = require('node:fs');
 const path = require('node:path');
 const { getClaudeDir, displayPath } = require('./lib/claude-dir');
 const { isGroupName, suggestGroupName } = require('./lib/dispatch-groups');
+const { linkUrl } = require('./public/link-url');
 // Help is auto-generated from this table — keep flags/usage in sync with `run` behavior.
 const COMMANDS = {
   'preview-doc': {
     summary: 'Open a markdown or HTML file in the preview modal on connected browser tabs',
-    usage: 'claude-code-kanban preview-doc <file.md|file.html> [--session <id>]',
+    usage: 'claude-code-kanban preview-doc <file.md|file.html|url> [--session <id>]',
     flags: {
-      '--session <id>': 'Switch focused session in the browser (does not link the file)',
+      '--session <id>': 'Switch focused session in the browser (does not link the file). Required for a URL.',
     },
-    notes: 'HTML renders in a sandboxed iframe; local stylesheets, scripts and images are inlined. Relative paths resolve against the current dir.',
+    notes: 'HTML renders in a sandboxed iframe; local stylesheets, scripts and images are inlined. Relative paths resolve against the current dir. An http(s) URL is linked to the session instead, and the tab on screen shows an Open button.',
     examples: [
       'claude-code-kanban preview-doc ./notes.md --session $CLAUDE_SESSION_ID',
     ],
     run: runPreviewCli,
   },
   'link-doc': {
-    summary: 'Link a file to a session in the sidebar without opening the preview modal',
-    usage: 'claude-code-kanban link-doc <file> --session <id> [--unlink] | link-doc --list --session <id> [--json]',
+    summary: 'Link a file or URL to a session in the sidebar without opening the preview modal',
+    usage: 'claude-code-kanban link-doc <file|url> --session <id> [--unlink] | link-doc --list --session <id> [--json]',
     flags: {
-      '<file>': 'Any file type; one the preview cannot render opens in the editor',
+      '<file|url>': 'Any file type; one the preview cannot render opens in the editor. An http(s) URL opens in a new tab.',
       '--session <id>': 'Session to link the file to (required unless $PREVIEW_SESSION is set); full id or unique prefix',
       '--unlink': 'Remove the link instead of adding it (the file need not exist)',
       '--list': 'Print the docs the server holds for the session',
@@ -29,6 +30,7 @@ const COMMANDS = {
     notes: 'The server keeps the link, so it shows when a browser tab opens later.',
     examples: [
       'claude-code-kanban link-doc ./design.md --session $CLAUDE_SESSION_ID',
+      'claude-code-kanban link-doc https://github.com/org/repo/pull/12 --session $CLAUDE_SESSION_ID',
       'claude-code-kanban link-doc --list --session $CLAUDE_SESSION_ID',
     ],
     run: runLinkDocCli,
@@ -464,6 +466,8 @@ async function runPreviewCli(args) {
     return 1;
   }
   const sessionId = getArgValue(args, 'session') || process.env.PREVIEW_SESSION || null;
+  const url = linkUrl(filePathArg);
+  if (url) return previewUrlCli(url, sessionId);
   const abs = path.resolve(filePathArg);
   try {
     if (!await cliPostJson('/api/preview', { path: abs, sessionId }, 'Preview')) return 1;
@@ -472,6 +476,27 @@ async function runPreviewCli(args) {
   } catch (e) { reportCliError(e); return 1; }
 }
 
+// The modal cannot show a web page, so a URL is linked instead and the tab on screen
+// offers to open it.
+async function previewUrlCli(url, sessionArg) {
+  const entry = COMMANDS['preview-doc'];
+  if (!sessionArg) return usageError(entry, '--session is required for a URL: it is linked to the session.');
+  const resolved = await resolveSessionByIdOrPrefix(sessionArg);
+  if (!resolved) return 1;
+  return postDocLink(url, resolved.id, { open: true });
+}
+
+async function postDocLink(target, sessionId, { unlink = false, open = false } = {}) {
+  try {
+    const out = await cliPostJson('/api/document/link', { path: target, sessionId, unlink, open }, 'Link');
+    if (!out) return 1;
+    const what = linkUrl(target) ? 'URL' : 'Document';
+    console.log(`${what} ${unlink ? 'unlinked from' : 'linked to'} session ${sessionId.slice(0, 8)}: ${out.path}`);
+    if (!unlink && out.tabs === 0) console.log('No browser tab is open; the board shows it when one opens.');
+    return 0;
+  } catch (e) { reportCliError(e); return 1; }
+}
+
 async function runLinkDocCli(args) {
   const entry = COMMANDS['link-doc'];
   const [filePathArg] = positionals(args, ['--session']);
@@ -487,14 +512,7 @@ async function runLinkDocCli(args) {
   const resolved = await resolveSessionByIdOrPrefix(sessionArg);
   if (!resolved) return 1;
   if (list) return printLinkedDocs(resolved.id, args.includes('--json'));
-  const abs = path.resolve(filePathArg);
-  try {
-    const out = await cliPostJson('/api/document/link', { path: abs, sessionId: resolved.id, unlink }, 'Link');
-    if (!out) return 1;
-    console.log(`Document ${unlink ? 'unlinked from' : 'linked to'} session ${resolved.id.slice(0, 8)}: ${abs}`);
-    if (!unlink && out.tabs === 0) console.log('No browser tab is open; the board shows it when one opens.');
-    return 0;
-  } catch (e) { reportCliError(e); return 1; }
+  return postDocLink(linkUrl(filePathArg) || path.resolve(filePathArg), resolved.id, { unlink });
 }
 
 async function printLinkedDocs(sessionId, asJson) {

package/install.js

@@ -5,6 +5,7 @@ const path = require('node:path');
 const readline = require('node:readline');
 const { execSync } = require('node:child_process');
 const { getClaudeDir, claudeCliEnv, displayPath } = require('./lib/claude-dir');
+const { PLUGIN_ID } = require('./lib/plugin-status');
 
 const CLAUDE_DIR = getClaudeDir();
 const CLI_ENV = claudeCliEnv(CLAUDE_DIR);
@@ -128,7 +129,7 @@ async function runInstall({ pluginOnly = false } = {}) {
     const upd = runCLI('claude plugin marketplace update claude-code-kanban');
     if (!upd.ok) console.log(`    ${yellow('⚠')} Marketplace refresh failed: ${upd.error}`);
 
-    const inst = runCLI('claude plugin install claude-code-kanban@claude-code-kanban', ['already installed', 'already exists']);
+    const inst = runCLI(`claude plugin install ${PLUGIN_ID}`,['already installed', 'already exists']);
     const alreadyInstalled = inst.idempotent || /already installed/i.test(inst.output || '');
     if (inst.ok) {
       console.log(`    ${green('✓')} ${alreadyInstalled ? 'Already installed' : 'Plugin installed'}`);

package/lib/linked-docs.js

@@ -1,7 +1,9 @@
-// Server copy of each session's linked docs. The browser keeps its own list in localStorage
+// Server copy of each session's linked docs: file paths and http(s) URLs. The browser keeps its own list in localStorage
 // and merges this one in when it connects, so a `link-doc` sent while no tab is open is not lost.
 // Newest first, capped like the browser list.
 
+const { linkUrl } = require('../public/link-url');
+
 const MAX_PER_SESSION = 20;
 
 // Same rule as `canonicalPath` in public/app.js: one Windows file is reached as `C:\a` and `c:/a`.
@@ -53,4 +55,4 @@ function createLinkedDocStore({ load, save }) {
   return { link, unlink, get, all };
 }
 
-module.exports = { createLinkedDocStore, canonicalPath, MAX_PER_SESSION };
+module.exports = { createLinkedDocStore, canonicalPath, linkUrl, MAX_PER_SESSION };

package/lib/plugin-status.js

@@ -0,0 +1,38 @@
+const fs = require('node:fs');
+const path = require('node:path');
+const { isDefaultClaudeDir, displayPath } = require('./claude-dir');
+
+const PLUGIN_ID = 'claude-code-kanban@claude-code-kanban';
+const BUNDLED_MANIFEST = path.join(__dirname, '..', 'plugin', 'plugins', 'claude-code-kanban', '.claude-plugin', 'plugin.json');
+
+function readJson(file) {
+  try {
+    return JSON.parse(fs.readFileSync(file, 'utf8'));
+  } catch {
+    return null;
+  }
+}
+
+// The claude CLI records installs in <config dir>/plugins/installed_plugins.json, one entry per scope.
+// A user-scope entry wins, because install.js installs at user scope.
+function pluginStatus(claudeDir, bundledManifest = BUNDLED_MANIFEST) {
+  const bundled = readJson(bundledManifest)?.version ?? null;
+  const installs = readJson(path.join(claudeDir, 'plugins', 'installed_plugins.json'))?.plugins?.[PLUGIN_ID];
+  const entries = Array.isArray(installs) ? installs : [];
+  const entry = entries.find((e) => e?.scope === 'user') ?? entries[0];
+  const installed = typeof entry?.version === 'string' ? entry.version : null;
+  const enabled = readJson(path.join(claudeDir, 'settings.json'))?.enabledPlugins?.[PLUGIN_ID] !== false;
+  let state = 'ok';
+  if (!installed) state = 'missing';
+  else if (!enabled) state = 'disabled';
+  else if (bundled && installed !== bundled) state = 'mismatch';
+  return { bundled, installed, state, configDir: displayPath(claudeDir), installCommand: installCommand(claudeDir) };
+}
+
+// --dir rather than CLAUDE_CONFIG_DIR=…, so the same line runs in bash, PowerShell and cmd.
+function installCommand(claudeDir) {
+  const base = 'claude-code-kanban --install --plugin-only';
+  return isDefaultClaudeDir(claudeDir) ? base : `${base} --dir "${claudeDir}"`;
+}
+
+module.exports = { pluginStatus, installCommand, PLUGIN_ID, BUNDLED_MANIFEST };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-kanban",
-  "version": "4.30.0",
+  "version": "4.31.1",
   "description": "A web-based Kanban board for viewing Claude Code tasks with agent teams support",
   "main": "server.js",
   "type": "commonjs",

package/plugin/plugins/claude-code-kanban/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-kanban",
-  "version": "2.14.0",
+  "version": "2.15.0",
   "description": "claude-code-kanban dashboard integration: agent activity tracking, context statusline, skills to drive the board from a session and to follow it",
   "experimental": {
     "monitors": "./monitors.json"

package/plugin/plugins/claude-code-kanban/skills/kanban/SKILL.md

@@ -24,7 +24,7 @@ claude-code-kanban help <command> <subcommand> # flags and examples
 | `open` (or none) | `session open ${CLAUDE_SESSION_ID}` |
 | `pin` / `unpin` | `session pin ${CLAUDE_SESSION_ID}` (`--sticky`, `--unpin`) |
 | `preview` | `preview-doc <file> --session ${CLAUDE_SESSION_ID}` — opens a modal on the user's screen |
-| `link` | `link-doc <file> --session ${CLAUDE_SESSION_ID}` — no modal, so it is the safe choice while the user is working |
+| `link` | `link-doc <file\|url> --session ${CLAUDE_SESSION_ID}` — no modal, so it is the safe choice while the user is working. An http(s) URL (a PR, an artifact) opens in a new tab |
 | `list` / `search` | `session list`, `session search <text>` |
 | `view` / `peek` | `session view <id>`, `session peek <id>` |
 | tasks, projects | `task list`, `project list` |

package/public/app.js

@@ -749,6 +749,34 @@ function toggleMessagePanel() {
   updateUrl();
 }
 
+function applyMessagePanelFull(on) {
+  document.getElementById('message-panel').classList.toggle('full-width', on);
+  const btn = document.getElementById('message-panel-full-btn');
+  btn.classList.toggle('active', on);
+  btn.setAttribute('aria-pressed', String(on));
+  const label = on ? 'Restore width' : 'Expand to full width';
+  btn.title = label;
+  btn.setAttribute('aria-label', label);
+}
+
+// biome-ignore lint/correctness/noUnusedVariables: used in HTML onclick
+function toggleMessagePanelFull() {
+  const on = !document.getElementById('message-panel').classList.contains('full-width');
+  store.setItem('message-panel-full', on);
+  applyMessagePanelFull(on);
+}
+
+function initMessagePanelFull() {
+  const panel = document.getElementById('message-panel');
+  const sidebar = document.querySelector('.sidebar');
+  if (sidebar) {
+    const sync = () => panel.style.setProperty('--sidebar-edge', `${sidebar.getBoundingClientRect().right}px`);
+    new ResizeObserver(sync).observe(sidebar);
+    sync();
+  }
+  applyMessagePanelFull(store.getItem('message-panel-full') === 'true');
+}
+
 // biome-ignore lint/correctness/noUnusedVariables: used in HTML onclick
 async function openSessionWithBookmarks(sessionId) {
   if (!messagePanelOpen) {
@@ -2346,22 +2374,41 @@ function isAnyModalOpen() {
 
 const ZOOM_KEYS = { '+': 0.1, '=': 0.1, NumpadAdd: 0.1, '-': -0.1, _: -0.1, NumpadSubtract: -0.1, 0: 0, Numpad0: 0 };
 
+function zoomDelta(e) {
+  if (!(e.ctrlKey || e.metaKey) || e.altKey) return undefined;
+  return ZOOM_KEYS[e.key] ?? ZOOM_KEYS[e.code];
+}
+
 let _toastTimer = null;
 let _manualRefreshing = false;
 //#endregion
 
 //#region TOAST
-function showToast(msg, type) {
+// `action` ({label, onClick}) adds a button and keeps the toast up long enough to reach it.
+function showToast(msg, type, action) {
   const el = document.getElementById('toast');
   clearTimeout(_toastTimer);
   el.style.transition = 'none';
-  el.classList.remove('visible', 'toast-success', 'toast-error', 'toast-info');
+  el.classList.remove('visible', 'toast-success', 'toast-error', 'toast-info', 'has-action');
   void el.offsetHeight;
   el.style.transition = '';
   el.textContent = msg;
+  const hide = () => el.classList.remove('visible', 'has-action');
+  if (action) {
+    const btn = document.createElement('button');
+    btn.type = 'button';
+    btn.className = 'toast-action';
+    btn.textContent = action.label;
+    btn.addEventListener('click', () => {
+      hide();
+      action.onClick();
+    });
+    el.append(btn);
+    el.classList.add('has-action');
+  }
   if (type) el.classList.add(`toast-${type}`);
   el.classList.add('visible');
-  _toastTimer = setTimeout(() => el.classList.remove('visible'), 2000);
+  _toastTimer = setTimeout(hide, action ? 8000 : 2000);
 }
 
 async function copyWithFeedback(text, btn) {
@@ -3343,7 +3390,7 @@ function renderSessions() {
 
     if (zenMode) {
       emptyMsg = 'Zen mode: no session open';
-      emptyHint = 'Press Shift+Z to leave zen mode, then open a session';
+      emptyHint = 'Press Ctrl+Shift+Z to leave zen mode, then open a session';
     } else if (searchQuery) {
       emptyMsg = `No results for "${searchQuery}"`;
       emptyHint = 'Try a different search term or clear the search';
@@ -5499,7 +5546,7 @@ const SHORTCUT_PAIRS = [
         { keys: ['['], label: 'Toggle sidebar' },
         { keys: ['T'], label: 'Toggle theme' },
         { keys: ['Shift', 'S'], combo: true, label: 'Storage manager' },
-        { keys: ['Shift', 'Z'], combo: true, label: 'Zen mode (current session only)' },
+        { keys: ['Ctrl', 'Shift', 'Z'], combo: true, label: 'Zen mode (current session only)' },
         { keys: ['Ctrl', '+'], combo: true, label: 'Larger modal text' },
         { keys: ['Ctrl', '−'], combo: true, label: 'Smaller modal text' },
         { keys: ['Ctrl', '0'], combo: true, label: 'Reset modal text size' },
@@ -5536,6 +5583,7 @@ const SHORTCUT_PAIRS = [
         { keys: ['Alt', '`'], combo: true, label: 'Focus terminal / page' },
         { keys: ['Alt', 'Shift', '`'], combo: true, label: 'End and close terminal' },
         { keys: ['Ctrl', 'Shift', '`'], combo: true, label: 'All terminals' },
+        { keys: ['Ctrl', '+/−/0'], combo: true, label: 'Terminal text size' },
       ],
     },
     {
@@ -6081,11 +6129,12 @@ function _renderStorageLinkedDocs() {
     const name = linkedDocLabel(p);
     const sid = escAttrJs(sessionId);
     const jsPath = escAttrJs(p);
+    const what = LINKED_DOC_OPENERS[linkedDocOpener(p)].noun;
     return `<div class="storage-item" style="padding-left:24px;">
       <span class="storage-item-id" title="${escapeHtml(p)}">${escapeHtml(name)}</span>
       <div class="storage-item-actions">
         <button onclick="_storagePreviewLinkedDoc('${jsPath}')">View</button>
-        <button onclick="copyWithFeedback('${jsPath}', this)" title="Copy path" aria-label="Copy path">${ICON_COPY}</button>
+        <button onclick="copyWithFeedback('${jsPath}', this)" title="Copy ${escapeHtml(what)}" aria-label="Copy ${escapeHtml(what)}">${ICON_COPY}</button>
         <button class="danger" onclick="_storageUnlinkDoc('${sid}','${jsPath}')">Unlink</button>
       </div>
     </div>`;
@@ -6234,13 +6283,11 @@ document.addEventListener('keydown', (e) => {
   // Scale the open modal's reading surface instead of letting the browser zoom
   // the whole page. Sits above the text-field guard so it still works with the
   // caret in a field inside the modal.
-  if ((e.ctrlKey || e.metaKey) && !e.altKey) {
-    const delta = ZOOM_KEYS[e.key] ?? ZOOM_KEYS[e.code];
-    if (delta !== undefined && isZoomableModalOpen()) {
-      e.preventDefault();
-      adjustModalZoom(delta);
-      return;
-    }
+  const zoom = zoomDelta(e);
+  if (zoom !== undefined && isZoomableModalOpen()) {
+    e.preventDefault();
+    adjustModalZoom(zoom);
+    return;
   }
 
   // Above the text-field guard: xterm's input is a textarea, and the toggle must work from it.
@@ -6911,10 +6958,13 @@ async function handlePreviewOpenEvent(data) {
 // Linked docs live in localStorage, so the CLI can only reach them through a tab:
 // the server broadcasts the resolved path and every tab applies it idempotently.
 function handleDocumentLinkEvent(data) {
-  const { path: filePath, sessionId, unlink } = data;
+  const { path: filePath, sessionId, unlink, open } = data;
   if (!filePath || !sessionId) return;
   setSessionDocLink(sessionId, filePath, unlink);
-  showToast(`${unlink ? 'Unlinked' : 'Linked'} ${filePath.split(/[\\/]/).pop()}`);
+  const msg = `${unlink ? 'Unlinked' : 'Linked'} ${linkedDocLabel(filePath)}`;
+  // Every tab gets the event; only the one on screen offers to open the URL.
+  if (open && isOnScreen()) showToast(msg, 'info', { label: 'Open', onClick: () => openExternal(filePath) });
+  else showToast(msg);
 }
 
 function getSessionBaseDir(sessionId) {
@@ -6996,10 +7046,13 @@ function isScratchpadPath(p) {
 // `linkedDocOpener` is the only place a linked path is classified; the row's tag,
 // tooltip and action are all read from here, so a new destination is one entry.
 const LINKED_DOC_OPENERS = {
-  preview: { tag: '', hint: '' },
+  preview: { tag: '', hint: '', cls: '', noun: 'path' },
+  url: { tag: '', hint: ' — opens in a new tab', cls: ' is-url', noun: 'URL' },
   scratch: {
     tag: '(scratchpad)',
     hint: ' — opens in the scratch viewer',
+    cls: ' is-editor',
+    noun: 'path',
     url: '/api/scratchpad/open',
     body: (p) => ({ path: p }),
     toast: 'in the scratch viewer',
@@ -7007,6 +7060,8 @@ const LINKED_DOC_OPENERS = {
   editor: {
     tag: '(editor)',
     hint: ' — opens in editor',
+    cls: ' is-editor',
+    noun: 'path',
     url: '/api/open-in-editor',
     body: (p) => ({ file: p }),
     toast: 'in editor',
@@ -7017,6 +7072,7 @@ const LINKED_DOC_OPENERS = {
 // text, but the pad is what the user linked, so the viewer wins over the raw file.
 // Without the CLI there is nothing to launch, so it falls back to the editor.
 function linkedDocOpener(p) {
+  if (linkUrl(p)) return 'url';
   if (isScratchpadPath(p)) return appConfig.scratchAvailable ? 'scratch' : 'editor';
   // A path whose kind has not arrived yet renders as previewable, which is what the
   // click does anyway — openPreviewByPath falls back to the editor on a null kind.
@@ -7026,12 +7082,17 @@ function linkedDocOpener(p) {
 // Every manifest is called scratchpad.json, so the pad's folder names it. Kept
 // independent of the opener: the pad is still the pad when the CLI is missing.
 function linkedDocLabel(p) {
+  if (linkUrl(p)) return p.replace(/^https?:\/\//i, '').replace(/\/$/, '');
   const parts = p.split(/[\\/]/).filter(Boolean);
   return isScratchpadPath(p) ? parts[parts.length - 2] || parts[parts.length - 1] : parts[parts.length - 1];
 }
 
 function openLinkedDoc(p, baseDir) {
   const opener = linkedDocOpener(p);
+  if (opener === 'url') {
+    openExternal(p);
+    return;
+  }
   if (opener === 'preview') {
     openPreviewByPath(p, baseDir, openFileInEditor);
     return;
@@ -7044,21 +7105,24 @@ function renderLinkedDocsHtml(sessionId) {
   const paths = getSessionPreviewPaths(sessionId);
   // Kicked off from the render rather than the three call sites, so a new surface that
   // shows linked docs cannot forget it. Returns at once once every path is cached.
-  loadPreviewKinds(sessionId, paths);
+  const rows = paths.map((p) => ({ p, opener: linkedDocOpener(p) }));
+  const filePaths = rows.filter((r) => r.opener !== 'url').map((r) => r.p);
+  loadPreviewKinds(sessionId, filePaths);
   const baseDir = getSessionBaseDir(sessionId);
-  const items = paths
-    .map((p) => {
-      const opener = linkedDocOpener(p);
-      const { tag, hint } = LINKED_DOC_OPENERS[opener];
+  const items = rows
+    .map(({ p, opener }) => {
+      const { tag, hint, cls, noun } = LINKED_DOC_OPENERS[opener];
       const name = linkedDocLabel(p);
+      const isUrl = opener === 'url';
       const rel = baseDir ? toRelativeIfUnder(p, baseDir) : null;
       const pathSpan = rel ? `<span class="linked-doc-path" title="${escapeHtml(p)}">${escapeHtml(rel)}</span>` : '';
       const attr = escapeHtml(p);
-      return `<li class="linked-doc-item${opener === 'preview' ? '' : ' is-editor'}">
-        <a href="#" class="linked-doc-link" data-path="${attr}" title="${escapeHtml(p + hint)}">${escapeHtml(name)}</a>
+      const href = isUrl ? `href="${attr}" target="_blank" rel="noopener"` : 'href="#"';
+      return `<li class="linked-doc-item${escapeHtml(cls)}">
+        <a ${href} class="linked-doc-link" data-path="${attr}" title="${escapeHtml(p + hint)}">${escapeHtml(name)}</a>${isUrl ? '<span class="linked-doc-external" aria-hidden="true">↗</span>' : ''}
         ${pathSpan}${tag ? `<span class="linked-doc-path">${tag}</span>` : ''}
         <span class="row-actions linked-doc-actions">
-          <button type="button" class="linked-doc-copy" data-path="${attr}" title="Copy path" aria-label="Copy path of ${escapeHtml(name)}">${ICON_COPY}</button>
+          <button type="button" class="linked-doc-copy" data-path="${attr}" title="Copy ${escapeHtml(noun)}" aria-label="Copy ${escapeHtml(noun)} of ${escapeHtml(name)}">${ICON_COPY}</button>
           <button type="button" class="linked-doc-remove" data-path="${attr}" title="Unlink" aria-label="Unlink ${escapeHtml(name)}">&times;</button>
         </span>
       </li>`;
@@ -7067,13 +7131,13 @@ function renderLinkedDocsHtml(sessionId) {
   // Rendered even when empty — the add button has to stay reachable.
   const body = paths.length
     ? `<ul class="linked-doc-list">${items}</ul>`
-    : '<div class="linked-docs-empty">No linked files yet</div>';
+    : '<div class="linked-docs-empty">No linked documents yet</div>';
   return `<div class="linked-docs-section panel-section">
     <div class="panel-section-header">
       ${linkSvg(12)}
       <span>Linked documents</span>
       <span class="panel-section-count">${paths.length}</span>
-      <button type="button" class="linked-docs-add-btn" title="Link a file" aria-label="Link a file">+</button>
+      <button type="button" class="linked-docs-add-btn" title="Link a file or URL" aria-label="Link a file or URL">+</button>
     </div>
     <div class="linked-doc-editor-slot"></div>
     ${body}
@@ -7342,7 +7406,7 @@ function bindLinkedDocsHandlers(container, sessionId) {
   if (!container) return;
   container.addEventListener('click', (e) => {
     const hit = e.target.closest('.linked-doc-link, .linked-doc-copy, .linked-doc-remove, .linked-docs-add-btn');
-    if (!hit) return;
+    if (!hit || hit.target === '_blank') return;
     e.preventDefault();
     if (hit.classList.contains('linked-docs-add-btn')) {
       startLinkedDocInput(container, sessionId);
@@ -7361,7 +7425,7 @@ function bindLinkedDocsHandlers(container, sessionId) {
 function startLinkedDocInput(container, sessionId) {
   const slot = container.querySelector('.linked-doc-editor-slot');
   if (!slot) return;
-  slot.innerHTML = `<input class="linked-doc-input" type="text" spellcheck="false" placeholder="Absolute path, file:// URL, or relative to the session cwd">
+  slot.innerHTML = `<input class="linked-doc-input" type="text" spellcheck="false" placeholder="Path, file:// or https:// URL">
     <div class="linked-doc-hint">${escapeHtml(getSessionBaseDir(sessionId) || 'no session cwd — absolute paths only')}</div>
     <div class="linked-doc-error"></div>
     <div class="edit-actions">
@@ -7375,6 +7439,9 @@ function startLinkedDocInput(container, sessionId) {
   };
   slot.querySelector('.edit-save').addEventListener('click', save);
   slot.querySelector('.edit-cancel').addEventListener('click', cancel);
+  input.addEventListener('input', () => {
+    slot.querySelector('.linked-doc-error').textContent = '';
+  });
   input.addEventListener('keydown', (e) => {
     if (e.key === 'Enter') {
       e.preventDefault();
@@ -7397,27 +7464,38 @@ async function linkFileByPath(sessionId, raw, slot) {
     else showToast(msg, 'error');
   };
   if (!value) {
-    fail('Enter a file path');
+    fail('Enter a file path or URL');
     return;
   }
-  try {
-    const qs = new URLSearchParams({ path: value });
-    const base = getSessionBaseDir(sessionId);
-    if (base) qs.set('base', base);
-    const r = await fetch(`/api/file/resolve?${qs}`);
-    const data = await r.json().catch(() => ({}));
-    if (!r.ok || !data.exists) {
-      fail(data.error || 'File not found');
+  let target;
+  if (/^[a-z][a-z0-9+.-]*:\/\//i.test(value) && !/^file:/i.test(value)) {
+    target = linkUrl(value);
+    if (!target) {
+      fail('Only http and https URLs can be linked');
+      return;
+    }
+  } else {
+    try {
+      const qs = new URLSearchParams({ path: value });
+      const base = getSessionBaseDir(sessionId);
+      if (base) qs.set('base', base);
+      const r = await fetch(`/api/file/resolve?${qs}`);
+      const data = await r.json().catch(() => ({}));
+      if (!r.ok || !data.exists) {
+        fail(data.error || 'File not found');
+        return;
+      }
+      target = data.path;
+    } catch {
+      fail('Failed to resolve file');
       return;
     }
-    // Close the editor before the refresh: a sidebar panel defers its re-render while an
-    // input is open, so leaving it up would hide the file that was just linked.
-    if (slot) slot.innerHTML = '';
-    setSessionDocLink(sessionId, data.path, false);
-    showToast('Linked to session', 'success');
-  } catch {
-    fail('Failed to resolve file');
   }
+  // Close the editor before the refresh: a sidebar panel defers its re-render while an
+  // input is open, so leaving it up would hide the file that was just linked.
+  if (slot) slot.innerHTML = '';
+  setSessionDocLink(sessionId, target, false);
+  showToast('Linked to session', 'success');
 }
 //#endregion
 
@@ -8246,10 +8324,44 @@ function getMermaidTheme() {
   return isLightTheme() ? 'default' : 'dark';
 }
 
+// Mermaid is about 3 MB, so it loads on the first diagram instead of on the page's critical path.
+const MERMAID_SCRIPT = {
+  src: 'https://cdn.jsdelivr.net/npm/mermaid@12.0.0/dist/mermaid.min.js',
+  integrity: 'sha384-xzghz1GQ5u9HCpVskeDPqMsdogD1yvuMQbEK53+wi+G70+6J1AG0L2cfi9PHjDWI',
+};
+let mermaidLoading = null;
+
+function loadMermaid() {
+  mermaidLoading ??= new Promise((resolve, reject) => {
+    const script = document.createElement('script');
+    script.src = MERMAID_SCRIPT.src;
+    script.integrity = MERMAID_SCRIPT.integrity;
+    script.crossOrigin = 'anonymous';
+    script.onload = () => {
+      mermaid.initialize({ startOnLoad: false, theme: getMermaidTheme() });
+      resolve();
+    };
+    script.onerror = () => {
+      script.remove();
+      mermaidLoading = null;
+      reject(new Error('mermaid failed to load'));
+    };
+    document.head.appendChild(script);
+  });
+  return mermaidLoading;
+}
+
 function initMermaidBlocks(container) {
-  if (typeof mermaid === 'undefined') return;
   const blocks = (container || document).querySelectorAll('pre.mermaid:not([data-processed])');
-  if (blocks.length) mermaid.run({ nodes: [...blocks] });
+  if (!blocks.length) return;
+  if (typeof mermaid === 'undefined') {
+    loadMermaid().then(
+      () => initMermaidBlocks(container),
+      (err) => console.warn(err.message),
+    );
+    return;
+  }
+  mermaid.run({ nodes: [...blocks] });
 }
 
 function reinitMermaidTheme() {
@@ -8563,7 +8675,9 @@ function renderZenState() {
   if (!btn) return;
   btn.classList.toggle('active', zenMode);
   btn.setAttribute('aria-pressed', String(zenMode));
-  btn.title = zenMode ? 'Zen mode on — show all sessions (Shift+Z)' : 'Zen mode: current session only (Shift+Z)';
+  btn.title = zenMode
+    ? 'Zen mode on — show all sessions (Ctrl+Shift+Z)'
+    : 'Zen mode: current session only (Ctrl+Shift+Z)';
 }
 
 // biome-ignore lint/correctness/noUnusedVariables: used in HTML
@@ -10153,6 +10267,9 @@ const TERMINAL_TOKEN_RE = /^[0-9a-f]{64}$/;
 // Swap to the previous session.
 const CCK_CTRL_ALT_KEYS = new Set(['KeyN', 'KeyR', 'KeyS']);
 const TERMINAL_MODES_KEY = 'terminal-sessions';
+const TERMINAL_FONT_KEY = 'terminal-font-size';
+const TERMINAL_FONT_MIN = 8;
+const TERMINAL_FONT_MAX = 32;
 const ACK_BATCH_BYTES = 32 * 1024;
 const TERMINAL_RETRY_MS = [500, 1000, 2000, 4000, 8000];
 const TERMINAL_STABLE_MS = 5000;
@@ -10265,11 +10382,24 @@ function terminalPaneFocused() {
   return document.getElementById('terminal-pane').contains(document.activeElement);
 }
 
+const TEXT_FIELD_SELECTOR = 'input, textarea, select, [contenteditable]';
+
 function terminalShortcut(e) {
   const ctrlAlt = e.ctrlKey && e.altKey && !e.shiftKey && !e.metaKey;
+  const ctrlShift = e.ctrlKey && e.shiftKey && !e.altKey && !e.metaKey;
+  // Ctrl+_ is Claude Code's undo, so the zoom keys leave it to the terminal.
+  const zoom = e.key === '_' ? undefined : zoomDelta(e);
+  if (zoom !== undefined && termState.term && terminalPaneFocused()) {
+    return () => adjustTerminalFontSize(Math.sign(zoom));
+  }
   if (ctrlAlt && e.code === 'KeyS') return swapToPreviousSession;
   // Cancelling the default also stops Chrome's system print dialog, which this page has no use for.
-  if (e.ctrlKey && e.shiftKey && !e.altKey && !e.metaKey && e.code === 'KeyP') return toggleSessionPicker;
+  if (ctrlShift && e.code === 'KeyP') return toggleSessionPicker;
+  // Ctrl+Shift+Z is redo in a text field, so only the terminal's own textarea gives it up.
+  if (ctrlShift && e.code === 'KeyZ') {
+    const field = e.target?.closest?.(TEXT_FIELD_SELECTOR);
+    return field && !document.getElementById('terminal-pane').contains(field) ? null : toggleZenMode;
+  }
   if (ctrlAlt && (e.code === 'KeyN' || e.code === 'KeyR') && terminalAvailable()) {
     return () => openNewSession(null, e.code === 'KeyR');
   }
@@ -10379,7 +10509,7 @@ function takeTerminalFocus(sessionId) {
 // The terminal attaches asynchronously; by then the user may be typing elsewhere or reading a modal.
 function promptAwaitsUser(sessionId) {
   if (!sessions.find((s) => s.id === sessionId)?.hasWaitingForUser || isAnyModalOpen()) return false;
-  return !document.activeElement?.matches('input, textarea, select, [contenteditable]');
+  return !document.activeElement?.matches(TEXT_FIELD_SELECTOR);
 }
 
 function onTerminalShown(focus = true) {
@@ -10480,9 +10610,10 @@ function ensureTerm() {
   const host = document.getElementById('terminal-host');
   const fontFamily =
     cfg.fontFamily || getComputedStyle(document.body).getPropertyValue('--font-mono').trim() || 'monospace';
+  const fontSize = terminalFontSize();
   const term = new window.Terminal({
     fontFamily,
-    fontSize: cfg.fontSize,
+    fontSize,
     scrollback: cfg.scrollback,
     cursorBlink: true,
     allowProposedApi: true,
@@ -10506,7 +10637,7 @@ function ensureTerm() {
     // No WebGL: xterm falls back to its DOM renderer.
   }
   document.fonts
-    ?.load(`${cfg.fontSize}px ${fontFamily}`)
+    ?.load(`${fontSize}px ${fontFamily}`)
     .then(repaintTerminal)
     .catch(() => {});
   term.attachCustomKeyEventHandler(terminalKeyFilter);
@@ -10586,6 +10717,27 @@ function fitTerminal() {
   } catch (_) {}
 }
 
+function clampTerminalFont(v) {
+  return Math.min(TERMINAL_FONT_MAX, Math.max(TERMINAL_FONT_MIN, v));
+}
+
+function terminalFontSize() {
+  const saved = Number.parseInt(store.getItem(TERMINAL_FONT_KEY), 10);
+  return saved ? clampTerminalFont(saved) : appConfig.terminal.fontSize;
+}
+
+function adjustTerminalFontSize(step) {
+  const term = termState.term;
+  const size = step === 0 ? appConfig.terminal.fontSize : clampTerminalFont(term.options.fontSize + step);
+  if (size !== term.options.fontSize) {
+    if (step === 0) store.removeItem(TERMINAL_FONT_KEY);
+    else store.setItem(TERMINAL_FONT_KEY, String(size));
+    term.options.fontSize = size;
+    fitTerminal();
+  }
+  showToast(`Terminal ${size}px`);
+}
+
 function terminalSend(msg) {
   if (termState.ws?.readyState === WebSocket.OPEN) termState.ws.send(JSON.stringify(msg));
 }
@@ -11464,19 +11616,16 @@ document.addEventListener('DOMContentLoaded', () => {
     marked.use({ renderer });
   }
 
-  if (typeof mermaid !== 'undefined') {
-    mermaid.initialize({ startOnLoad: false, theme: getMermaidTheme() });
-    let mermaidPending = false;
-    const mo = new MutationObserver(() => {
-      if (mermaidPending) return;
-      mermaidPending = true;
-      queueMicrotask(() => {
-        mermaidPending = false;
-        initMermaidBlocks();
-      });
+  let mermaidPending = false;
+  const mo = new MutationObserver(() => {
+    if (mermaidPending) return;
+    mermaidPending = true;
+    queueMicrotask(() => {
+      mermaidPending = false;
+      initMermaidBlocks();
     });
-    mo.observe(document.body, { childList: true, subtree: true });
-  }
+  });
+  mo.observe(document.body, { childList: true, subtree: true });
 });
 
 loadSidebarState();
@@ -11500,6 +11649,7 @@ initModalResize();
 loadPanelWidths();
 initPanelResize('detail-panel', 'detail-panel-resize', '--detail-panel-width', 'detail-panel-width');
 initPanelResize('message-panel', 'message-panel-resize', '--message-panel-width', 'message-panel-width');
+initMessagePanelFull();
 
 const msgContentEl = document.getElementById('message-panel-content');
 const jumpLatestBtn = document.createElement('button');
@@ -11536,7 +11686,7 @@ msgContentEl.addEventListener('wheel', function (e) {
   }
 });
 
-const footerState = { version: null, limitsKey: null, timer: null };
+const footerState = { version: null, plugin: null, limitsKey: null, timer: null };
 function formatResetIn(epochSec) {
   if (!epochSec) return null;
   const ms = epochSec * 1000 - Date.now();
@@ -11582,12 +11732,45 @@ function renderSidebarFooter(rateLimits) {
   const children = [];
   if (footerState.version) {
     const v = document.createElement('span');
+    v.className = 'footer-version';
     v.textContent = `v${footerState.version}`;
+    const warn = pluginWarning(footerState.plugin);
+    if (warn) v.append(warn);
     children.push(v);
   }
   if (fh != null || sd != null) children.push(makeLimitSpan(rateLimits));
   el.replaceChildren(...children);
 }
+function pluginWarning(plugin) {
+  const problem =
+    plugin &&
+    {
+      missing: 'The claude-code-kanban plugin is not installed',
+      disabled: `The claude-code-kanban plugin ${plugin.installed} is disabled`,
+      mismatch: `Plugin ${plugin.installed} is installed, this board ships ${plugin.bundled}`,
+    }[plugin.state];
+  if (!problem) return null;
+  const fix =
+    plugin.state === 'disabled'
+      ? 'Enable it with /plugin in Claude Code.'
+      : `Click to copy: ${plugin.installCommand}\nThen restart open sessions, they keep the old hooks.`;
+  const btn = document.createElement('button');
+  btn.type = 'button';
+  btn.className = 'footer-plugin-warning';
+  btn.textContent = '⚠';
+  btn.title = `${problem} (${plugin.configDir}).\n${fix}`;
+  btn.setAttribute('aria-label', problem);
+  if (plugin.state !== 'disabled') {
+    btn.addEventListener('click', () =>
+      navigator.clipboard
+        .writeText(plugin.installCommand)
+        .then(() => showToast('Install command copied', 'success'))
+        .catch(() => showToast('Could not copy the command', 'error')),
+    );
+  }
+  return btn;
+}
+
 function refreshRateLimits() {
   if (footerState.timer) return;
   footerState.timer = setTimeout(() => {
@@ -11614,6 +11797,7 @@ fetch('/api/version')
   .then((r) => r.json())
   .then((d) => {
     footerState.version = d.version;
+    footerState.plugin = d.plugin ?? null;
     renderSidebarFooter(null);
     refreshRateLimits();
   })
@@ -11782,6 +11966,13 @@ document.addEventListener('click', (e) => {
   hubPost({ type: 'hub:openExternal', url: url.href });
 });
 
+// The click handler above only catches anchors. A script open goes the same way, because
+// in the hub's installed PWA window a framed app's own `_blank` open does nothing.
+function openExternal(url) {
+  if (window.__HUB__?.enabled) hubPost({ type: 'hub:openExternal', url });
+  else window.open(url, '_blank', 'noopener');
+}
+
 window.hubNavigate = function hubNavigate(app, url) {
   if (!window.__HUB__?.enabled) return;
   hubPost({ type: 'hub:navigate', app, url });

package/public/index.html

@@ -26,9 +26,9 @@
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.12.0/build/styles/github-dark.min.css" integrity="sha384-wH75j6z1lH97ZOpMOInqhgKzFkAInZPPSPlZpYKYTOqsaizPvhQZmAtLcPKXpLyH" crossorigin="anonymous" id="hljs-theme-dark">
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.12.0/build/styles/github.min.css" integrity="sha384-eFTL69TLRZTkNfYZOLM+G04821K1qZao/4QLJbet1pP4tcF+fdXq/9CdqAbWRl/L" crossorigin="anonymous" id="hljs-theme-light" disabled>
   <script defer src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.12.0/build/highlight.min.js" integrity="sha384-wjfDDhOPPdjtva8vWBhWeVprSpmxisEu5aYT3q1JyACqXpdKpo3PWZTMVq24MBix" crossorigin="anonymous"></script>
-  <script defer src="https://cdn.jsdelivr.net/npm/mermaid@12.0.0/dist/mermaid.min.js" integrity="sha384-xzghz1GQ5u9HCpVskeDPqMsdogD1yvuMQbEK53+wi+G70+6J1AG0L2cfi9PHjDWI" crossorigin="anonymous"></script>
   <script>window.__STORAGE_NS__ = null;</script>
   <script defer src="/project-match.js"></script>
+  <script defer src="/link-url.js"></script>
   <script defer src="/app.js"></script>
 </head>
 <body class="booting">
@@ -82,7 +82,7 @@
               id="zen-mode-btn"
               class="icon-btn section-btn"
               onclick="event.stopPropagation(); toggleZenMode()"
-              title="Zen mode: current session only (Shift+Z)"
+              title="Zen mode: current session only (Ctrl+Shift+Z)"
               aria-label="Zen mode: current session only"
               aria-pressed="false"
             >
@@ -367,6 +367,9 @@
         <button class="icon-btn" onclick="openLiveLatestMessage()" title="Follow latest message (Shift+M)" aria-label="Follow latest message">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
         </button>
+        <button id="message-panel-full-btn" class="icon-btn" onclick="toggleMessagePanelFull()" title="Expand to full width" aria-label="Expand to full width" aria-pressed="false">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="16" height="16"><polyline points="15 3 21 3 21 9"/><polyline points="9 21 3 21 3 15"/><line x1="21" y1="3" x2="14" y2="10"/><line x1="3" y1="21" x2="10" y2="14"/></svg>
+        </button>
         <button class="detail-close" onclick="toggleMessagePanel()" aria-label="Close message panel">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
             <path d="M6 18L18 6M6 6l12 12"/>

package/public/link-url.js

@@ -0,0 +1,15 @@
+// Loaded by the page as a plain script and by lib/linked-docs.js through require, so the
+// sidebar, the API and the CLI accept the same URLs. Only http(s): linked docs render as
+// links, so a `javascript:` or `data:` value sent through the API must not become one.
+function linkUrl(value) {
+  if (typeof value !== 'string') return null;
+  const v = value.trim();
+  if (!/^https?:\/\//i.test(v)) return null;
+  try {
+    return new URL(v).href;
+  } catch {
+    return null;
+  }
+}
+
+if (typeof module === 'object' && module.exports) module.exports = { linkUrl };

package/public/style.css

@@ -16,7 +16,7 @@
   --text-muted: #7d808a;
   --accent: #e86f33;
   --accent-text: #f0a070;
-  --accent-dim: rgba(232, 111, 51, 0.22);
+  --accent-dim: rgba(232, 111, 51, 0.25);
   --accent-glow: rgba(232, 111, 51, 0.55);
   --gold: #d9b667;
   --success: #3ecf8e;
@@ -1304,6 +1304,28 @@ body.booting .boot-splash {
   color: var(--text-secondary);
 }
 
+.sidebar-footer .footer-version {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.sidebar-footer .footer-plugin-warning {
+  padding: 0;
+  border: none;
+  background: none;
+  font: inherit;
+  font-size: 11px;
+  line-height: 1;
+  color: var(--warning);
+  cursor: pointer;
+}
+
+.sidebar-footer .footer-plugin-warning:hover,
+.sidebar-footer .footer-plugin-warning:focus-visible {
+  filter: brightness(1.2);
+}
+
 .sidebar.collapsed {
   width: 48px;
 }
@@ -3208,6 +3230,16 @@ body.booting .boot-splash {
 .message-panel.msg-expanded-wide {
   width: 60vw;
 }
+.message-panel.full-width {
+  left: var(--sidebar-edge, 0);
+  width: auto;
+}
+.message-panel.full-width .panel-resize-handle {
+  display: none;
+}
+#message-panel-full-btn.active {
+  color: var(--accent);
+}
 .message-panel-header {
   padding: 16px 20px;
   display: flex;
@@ -3627,6 +3659,28 @@ body.booting .boot-splash {
   opacity: 1;
   transform: translateY(0);
 }
+.toast.has-action.visible {
+  pointer-events: auto;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  max-width: min(480px, calc(100vw - 32px));
+  overflow-wrap: anywhere;
+}
+.toast-action {
+  flex-shrink: 0;
+  font: inherit;
+  font-weight: 600;
+  color: var(--accent-text);
+  background: transparent;
+  border: 1px solid var(--accent);
+  border-radius: 4px;
+  padding: 2px 10px;
+  cursor: pointer;
+}
+.toast-action:hover {
+  background: var(--accent-dim);
+}
 .toast.toast-success {
   border-color: var(--success);
   color: var(--success);
@@ -4705,6 +4759,21 @@ body.booting .boot-splash {
   text-decoration-style: dashed;
 }
 
+.linked-doc-item.is-url .linked-doc-link {
+  flex-shrink: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.linked-doc-external {
+  flex-shrink: 0;
+  color: var(--text-muted);
+  font-size: 10px;
+  margin-left: -4px;
+}
+
 /* A section of the session panel: linked documents, artifacts. */
 .panel-section {
   margin-bottom: 16px;
@@ -5085,11 +5154,11 @@ body.light {
   --session-active-bg: var(--bg-elevated);
   --border: #cfcbc4;
   --text-primary: #0a0a0a;
-  --text-secondary: #444444;
-  --text-tertiary: #666666;
-  --text-muted: #888888;
+  --text-secondary: #2c2c2c;
+  --text-tertiary: #565656;
+  --text-muted: #767676;
   --accent-text: #a0501c;
-  --accent-dim: rgba(232, 111, 51, 0.18);
+  --accent-dim: rgba(184, 90, 32, 0.18);
   --accent-glow: rgba(232, 111, 51, 0.5);
   --gold: #a8842f;
   --success: #1a8a5a;
@@ -6677,10 +6746,11 @@ select.form-input option:checked {
     --session-active-bg: var(--bg-elevated);
     --border: #cfcbc4;
     --text-primary: #0a0a0a;
-    --text-secondary: #444444;
-    --text-tertiary: #666666;
-    --text-muted: #888888;
-    --accent-dim: rgba(232, 111, 51, 0.18);
+    --text-secondary: #2c2c2c;
+    --text-tertiary: #565656;
+    --text-muted: #767676;
+    --accent-text: #a0501c;
+    --accent-dim: rgba(184, 90, 32, 0.18);
     --accent-glow: rgba(232, 111, 51, 0.5);
     --gold: #a8842f;
     --success: #1a8a5a;

package/public/sw.js

@@ -1,5 +1,5 @@
 const CACHE_NAME = 'cc-kanban-v2';
-const PRECACHE_URLS = ['/', '/style.css', '/project-match.js', '/app.js'];
+const PRECACHE_URLS = ['/', '/style.css', '/project-match.js', '/link-url.js', '/app.js'];
 
 let cachePromise = null;
 function getCache() {

package/public/themes.css

@@ -38,6 +38,55 @@ body.light .theme-swatch-vitesse { --sw-bg: #f7f7f7; --sw-accent: #1c6b48; --sw-
 .theme-swatch-synthwave { --sw-bg: #262335; --sw-accent: #ff7edb; --sw-ink: #ffffff; --sw-border: #495495; }
 body.light .theme-swatch-synthwave { --sw-bg: #efecf6; --sw-accent: #c936a6; --sw-ink: #241b2f; --sw-border: #c5bcdd; }
 
+/* Ember */
+body:not([data-color-theme]):not(.light) {
+  --accent: #e86f33;
+  --accent-text: #f0a070;
+  --accent-dim: rgba(232,111,51,0.25);
+  --accent-glow: rgba(232, 111, 51, 0.55);
+  --bg-deep: #101114;
+  --bg-surface: #16181c;
+  --bg-elevated: #1e2025;
+  --bg-hover: #282a30;
+  --border: #363840;
+  --text-primary: #f0f1f3;
+  --text-secondary: #c2c4c9;
+  --text-tertiary: #9a9da5;
+  --text-muted: #7d808a;
+}
+body.light:not([data-color-theme]) {
+  --accent: #e86f33;
+  --accent-text: #a0501c;
+  --accent-dim: rgba(184,90,32,0.18);
+  --accent-glow: rgba(232, 111, 51, 0.5);
+  --bg-deep: #e8e6e3;
+  --bg-surface: #efede9;
+  --bg-elevated: #fbfaf9;
+  --bg-hover: #d2d0cc;
+  --border: #cfcbc4;
+  --text-primary: #0a0a0a;
+  --text-secondary: #2c2c2c;
+  --text-tertiary: #565656;
+  --text-muted: #767676;
+}
+@media (prefers-color-scheme: light) {
+body:not(.dark-forced):not([data-color-theme]) {
+  --accent: #e86f33;
+  --accent-text: #a0501c;
+  --accent-dim: rgba(184,90,32,0.18);
+  --accent-glow: rgba(232, 111, 51, 0.5);
+  --bg-deep: #e8e6e3;
+  --bg-surface: #efede9;
+  --bg-elevated: #fbfaf9;
+  --bg-hover: #d2d0cc;
+  --border: #cfcbc4;
+  --text-primary: #0a0a0a;
+  --text-secondary: #2c2c2c;
+  --text-tertiary: #565656;
+  --text-muted: #767676;
+}
+}
+
 /* Gruvbox */
 body[data-color-theme="gruvbox"]:not(.light) {
   --accent: #fe8019;

package/server.js

@@ -15,6 +15,7 @@ const { createNetGuard } = require('./lib/net-guard');
 const { isContained } = require('./lib/contain');
 const { resolveScratchSubdir, listScratchDir } = require('./lib/scratch-files');
 const { fileUrlToPath } = require('./lib/file-url');
+const { pluginStatus } = require('./lib/plugin-status');
 
 const {
   readRecentMessages: _readRecentMessagesUncached,
@@ -41,7 +42,7 @@ const { getClaudeDir, getArgValue, storageNamespace, isDefaultClaudeDir } = requ
 const { createTerminalService, readTerminalConfig } = require('./lib/terminal');
 const { createDispatchRegistry, formatPreamble, formatDispatchLine, isPeerName } = require('./lib/dispatch');
 const { createGroupStore, isGroupName, suggestGroupName } = require('./lib/dispatch-groups');
-const { createLinkedDocStore } = require('./lib/linked-docs');
+const { createLinkedDocStore, linkUrl } = require('./lib/linked-docs');
 const { pickFolder } = require('./lib/folder-dialog');
 const { loadSessionCache, saveSessionCache } = require('./lib/session-cache');
 const { countTaskDir } = require('./lib/task-counts');
@@ -93,8 +94,12 @@ const LINKED_DOCS_FILE = path.join(CCK_DIR, 'linked-docs.json');
 const SERVER_INFO_FILE = path.join(CCK_DIR, 'server.json');
 const TERMINAL_TOKENS_DIR = path.join(CCK_DIR, 'terminal-tokens');
 const SESSION_CACHE_FILE = path.join(CCK_DIR, 'session-cache.json');
+// os.tmpdir() can be an 8.3 short path on Windows; transcripts record the long form.
+const TEMP_ROOT = (() => {
+  try { return realpathSync.native(os.tmpdir()); } catch { return os.tmpdir(); }
+})();
 // Harness-owned scratchpad root; the per-session dir under it is created lazily.
-const SCRATCHPAD_ROOT = path.join(os.tmpdir(), 'claude');
+const SCRATCHPAD_ROOT = path.join(TEMP_ROOT, 'claude');
 
 // #endregion
 
@@ -1604,10 +1609,6 @@ app.get('/api/sessions/search', (req, res) => {
   res.json(hits.slice(0, SESSION_SEARCH_MAX).map((h) => h.id));
 });
 
-// os.tmpdir() can be an 8.3 short path on Windows; transcripts record the long form.
-const TEMP_ROOT = (() => {
-  try { return realpathSync.native(os.tmpdir()); } catch { return os.tmpdir(); }
-})();
 function isTempPath(p) {
   const rel = path.relative(TEMP_ROOT, p);
   return !!rel && !rel.startsWith('..') && !path.isAbsolute(rel);
@@ -1842,8 +1843,9 @@ async function readCreatedPads(meta) {
   // The project, not `meta.cwd`: cwd is wherever the session last stood, which drifts
   // into subdirectories — a session that made a pad and then worked inside it reports
   // a cwd below the pad, and a scan from there finds nothing above it.
-  const root = meta.project || meta.cwd;
-  const scanned = unresolved.length && root ? await findPads(root) : [];
+  // The session's own scratchpad dir too: a pad made there sits outside the project.
+  const roots = unresolved.length ? [meta.project || meta.cwd, getScratchpadDir(sessionId, meta)] : [];
+  const scanned = (await Promise.all(roots.filter(Boolean).map((r) => findPads(r)))).flat();
   const candidates = [...new Set([...reported, ...scanned.map((dir) => path.join(dir, SCRATCHPAD_MANIFEST))])];
   const rows = await Promise.all(
     candidates.map(async (file) => {
@@ -3160,7 +3162,7 @@ app.get('/api/sessions/:sessionId/cached-image/:n', (req, res) => {
 // #region META_ROUTES
 app.get('/api/version', (_req, res) => {
   const pkg = require('./package.json');
-  res.json({ version: pkg.version });
+  res.json({ version: pkg.version, plugin: pluginStatus(CLAUDE_DIR) });
 });
 
 app.get('/api/config', (_req, res) => {
@@ -3696,16 +3698,19 @@ app.post('/api/preview', async (req, res) => {
 // API: Link a file to a session's sidebar docs without opening the preview modal.
 // Not extension-restricted, matching /api/file/resolve — an unpreviewable link just
 // opens in the editor. Unlinking skips the stat so a deleted file can still be removed.
+// An http(s) URL is linked as it is. `open` comes from `preview-doc <url>`: a tab cannot
+// open a URL without a click, so the tab on screen offers an Open button.
 app.post('/api/document/link', async (req, res) => {
   try {
-    const { path: filePath, sessionId, unlink } = req.body || {};
+    const { path: filePath, sessionId, unlink, open } = req.body || {};
     if (typeof sessionId !== 'string' || !sessionId) return res.status(400).json({ error: 'sessionId is required' });
-    const abs = resolvePreviewPath(filePath);
+    const url = linkUrl(filePath);
+    const abs = url || resolvePreviewPath(filePath);
     if (!abs) return res.status(400).json({ error: 'path is required' });
-    if (!unlink) await statFileTarget(abs);
+    if (!unlink && !url) await statFileTarget(abs);
     if (unlink) linkedDocs.unlink(sessionId, abs);
     else linkedDocs.link(sessionId, abs);
-    broadcast({ type: 'document:link', path: abs, sessionId, unlink: !!unlink });
+    broadcast({ type: 'document:link', path: abs, sessionId, unlink: !!unlink, open: !!(url && open && !unlink) });
     res.json({ success: true, path: abs, tabs: clients.size });
   } catch (error) {
     console.error('Error in /api/document/link:', error);
@@ -3722,7 +3727,8 @@ app.get('/api/document/links', (req, res) => {
 // The browser's own unlink: it already updated its list, so this only drops the server
 // copy that would bring the doc back on the next merge. No path clears the session.
 app.delete('/api/document/links/:sessionId', (req, res) => {
-  const filePath = req.query.path ? resolvePreviewPath(String(req.query.path)) : null;
+  const raw = String(req.query.path || '');
+  const filePath = linkUrl(raw) || resolvePreviewPath(raw);
   res.json({ removed: linkedDocs.unlink(req.params.sessionId, filePath) });
 });