feat: v0.7.0 files pane: browse, preview, diff, Claude's edits

- devdesk attach --fs-list/--fs-read/--git-status/--git-show/--asset
  (libexec/devdesk-files.sh), confined to the session folder.
- The state hook records files Claude edits (Edit/Write/MultiEdit/
  NotebookEdit) for the Changes tab's "C" badge; rename/end carry it.
- Files pane: folders, CodeMirror read-only view, sanitized markdown preview
  in a sandboxed iframe with inlined relative images, images, Changes tab with
  line counts and diff against HEAD, "→ Claude" @path, resizable split.
- The editor bundle ships as /usr/share/devdesk/assets/editor.js, is fetched
  over ttyd on first use, verified against the page's SHA-256 and cached in
  IndexedDB.
- Fix: the state hook's field split collapsed empty fields.

Closes #19

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/styles.css

@@ -699,3 +699,134 @@ html[data-theme="light"] .lt-notif-dot { box-shadow: none; }
   .dd-panels-icon { display: inline; font-size: 1rem; }
   .dd-inbox-panel { position: fixed; top: calc(var(--header-height) + 4px); right: 8px; left: 8px; width: auto; }
 }
+
+/* ---- files pane (devdesk#19) -------------------------------------------------------- */
+.dd-files {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  flex: 0 0 var(--dd-files-w, 46%);
+  min-width: 0;
+  margin: 0;
+  background: var(--bg-terminal);
+}
+.dd-files[hidden] { display: none; }
+body.dd-resizing { cursor: col-resize; user-select: none; }
+body.dd-resizing .dd-terminal { pointer-events: none; }
+.dd-files-resizer {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: calc(-1 * var(--dd-gap) - 2px);
+  width: calc(var(--dd-gap) + 6px);
+  cursor: col-resize;
+  z-index: 3;
+}
+.dd-files-resizer:hover,
+.dd-files-resizer:focus-visible,
+body.dd-resizing .dd-files-resizer { background: linear-gradient(90deg, transparent 40%, var(--accent-cyan) 40%, var(--accent-cyan) 60%, transparent 60%); outline: none; }
+#files-toggle[aria-expanded="true"] { color: var(--accent-orange); border-color: var(--accent-orange-border); }
+
+.dd-files-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; padding: 2px 6px 0 6px; border-bottom: 1px solid var(--border-dim); }
+.dd-files-tabs { display: flex; }
+.dd-files-tabs button {
+  padding: 7px 10px 6px;
+  border: 0;
+  border-bottom: 2px solid transparent;
+  background: none;
+  color: var(--text-muted);
+  font-family: var(--font-mono);
+  font-size: 0.7rem;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  cursor: pointer;
+}
+.dd-files-tabs button:hover { color: var(--text-primary); }
+.dd-files-tabs button[aria-selected="true"] { color: var(--accent-orange); border-bottom-color: var(--accent-orange); }
+.dd-files-count:not(:empty) { margin-left: 4px; padding: 0 5px; border-radius: 8px; background: var(--accent-amber-dim); color: var(--accent-amber); font-size: 0.62rem; }
+.dd-files-actions { display: flex; gap: 2px; padding-bottom: 4px; }
+
+.dd-files-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 1px; min-height: 28px; padding: 4px 10px; border-bottom: 1px solid var(--border-dim); font-family: var(--font-mono); font-size: 0.72rem; }
+.dd-crumb { padding: 1px 3px; border: 0; background: none; color: var(--accent-cyan); font: inherit; cursor: pointer; }
+.dd-crumb:hover { text-decoration: underline; }
+.dd-crumb.is-current,
+.dd-crumb.is-file { color: var(--text-primary); text-decoration: none; cursor: default; }
+.dd-crumb-sep { color: var(--text-dim); }
+
+.dd-files-body { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: auto; outline: none; }
+.dd-file-list { margin: 0; padding: 4px 0; list-style: none; }
+.dd-file {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 4px 10px;
+  border: 0;
+  background: none;
+  color: var(--text-primary);
+  font-family: var(--font-mono);
+  font-size: 0.76rem;
+  text-align: left;
+  cursor: pointer;
+}
+.dd-file:hover:not(:disabled),
+.dd-file:focus-visible { background: var(--accent-cyan-dim); outline: none; }
+.dd-file:disabled { opacity: 0.55; cursor: default; }
+.dd-file-icon { flex: 0 0 12px; color: var(--text-dim); text-align: center; }
+.dd-file.is-dir .dd-file-icon,
+.dd-file.is-dir .dd-file-name { color: var(--accent-cyan); }
+.dd-file.is-up .dd-file-name { color: var(--text-muted); }
+.dd-file-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dd-file-meta { color: var(--text-muted); font-size: 0.66rem; white-space: nowrap; }
+.dd-file-age { flex: 0 0 2.6em; text-align: right; }
+.dd-file-status { flex: 0 0 1.2em; font-weight: 700; text-align: center; }
+.dd-file-status.is-amber { color: var(--accent-amber); }
+.dd-file-status.is-green { color: var(--accent-green); }
+.dd-file-status.is-red { color: var(--accent-red); }
+.dd-file-status.is-cyan { color: var(--accent-cyan); }
+.dd-claude-chip { padding: 0 4px; border: 1px solid var(--accent-orange-border); color: var(--accent-orange); font-size: 0.6rem; font-weight: 700; }
+.dd-add { color: var(--accent-green); }
+.dd-del { color: var(--accent-red); }
+.dd-files-msg { padding: 14px; color: var(--text-muted); font-size: 0.76rem; line-height: 1.5; }
+.dd-files-msg.is-error { color: var(--accent-red); }
+
+.dd-viewer-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; padding: 4px 8px; border-bottom: 1px solid var(--border-dim); }
+.dd-viewer-meta { flex: 1; min-width: 8em; color: var(--text-muted); font-size: 0.68rem; }
+.dd-viewer-actions { display: flex; flex-wrap: wrap; gap: 4px; }
+.dd-viewer-btn {
+  padding: 2px 8px;
+  border: 1px solid var(--border-color);
+  background: none;
+  color: var(--accent-cyan);
+  font-family: var(--font-mono);
+  font-size: 0.68rem;
+  cursor: pointer;
+}
+.dd-viewer-btn:hover { border-color: var(--accent-cyan); background: var(--accent-cyan-dim); }
+.dd-viewer-back { font-size: 0.8rem; }
+.dd-viewer-stale { padding: 4px 10px; background: var(--accent-amber-dim); color: var(--accent-amber); font-size: 0.72rem; }
+.dd-viewer-stale[hidden] { display: none; }
+.dd-viewer-content { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; }
+.dd-viewer-content > .cm-editor { flex: 1; min-height: 0; }
+.dd-viewer-content .cm-editor.cm-focused { outline: none; }
+.dd-viewer-content.is-image {
+  align-items: center;
+  justify-content: center;
+  overflow: auto;
+  padding: 12px;
+  background: repeating-conic-gradient(var(--bg-secondary) 0 25%, var(--bg-terminal) 0 50%) 0 0 / 20px 20px;
+}
+.dd-viewer-content.is-image img { max-width: 100%; height: auto; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3); }
+.dd-md-frame { flex: 1; width: 100%; border: 0; background: var(--bg-terminal); }
+.dd-plain { flex: 1; margin: 0; padding: 10px; overflow: auto; font-size: 0.76rem; white-space: pre; }
+
+@media (max-width: 1099px) {
+  /* Narrow: the pane covers the terminal instead of squeezing it (squeezing
+     would resize tmux for every client). */
+  .dd-files { position: absolute; inset: var(--dd-gap); z-index: 18; flex: none; }
+  .dd-files-resizer { display: none; }
+}
+@media (max-width: 719px) {
+  .dd-cmd-btn { display: none; }
+  .dd-file-age { display: none; }
+}