@officexapp/vidfarm-devcli 0.21.24 → 0.21.27

package/public/serve-shells/tools-image.html

@@ -591,6 +591,7 @@
   background:#fff;border:1px solid var(--rk-border);border-radius:var(--rk-r-full);padding:4px 11px;text-decoration:none;line-height:1.4;
   transition:background var(--rk-dur) var(--rk-ease),border-color var(--rk-dur) var(--rk-ease)}
 .rk-aichat-preview-act:hover{background:var(--rk-gold-tint);border-color:var(--rk-gold-600)}
+.rk-aichat-preview-act[hidden]{display:none}
 
 /* ── markdown pipe tables (assistant messages + .md previews) ── */
 .rk-md-tablewrap{max-width:100%;overflow-x:auto;margin:8px 0;border:1px solid var(--rk-border);border-radius:var(--rk-r-lg)}
@@ -622,6 +623,14 @@
 .rk-aichat-file-thumb--markdown,.rk-aichat-file-thumb--text{background:var(--rk-n-50)}.rk-aichat-file-thumb--audio{background:var(--rk-gold-tint2)}
 .rk-aichat-file-play{position:absolute;inset:0;display:grid;place-items:center;font-size:22px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.55);pointer-events:none}
 .rk-aichat-file-name{font-size:11px;font-weight:600;color:var(--rk-n-600);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:112px}
+/* "Edit in the tool" pencil — only on image/video cards; opens /tools/image or
+   /tools/video in a new tab with this file preloaded as the working file. */
+.rk-aichat-file-open{position:absolute;top:5px;right:5px;width:24px;height:24px;border-radius:var(--rk-r-md);
+  display:grid;place-items:center;background:rgba(255,255,255,.94);border:1px solid var(--rk-border);color:var(--rk-ink);
+  opacity:0;transition:opacity var(--rk-dur) var(--rk-ease),background var(--rk-dur) var(--rk-ease);z-index:2}
+.rk-aichat-file-open svg{width:13px;height:13px}
+.rk-aichat-file:hover .rk-aichat-file-open,.rk-aichat-file-open:focus-visible{opacity:1}
+.rk-aichat-file-open:hover{background:var(--rk-gold-tint)}
 
 /* create_video pipeline: live status row + clickable result links */
 .rk-aichat-flow{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--rk-text-muted);padding:2px 2px}
@@ -1086,13 +1095,16 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
 .rk-ip-tab svg{flex:none}
 
 .rk-inpaint-page{padding-left:var(--rk-gutter);padding-right:var(--rk-gutter)}
-.rk-inpaint-workbench{display:grid;grid-template-columns:320px minmax(0,1fr) 320px;gap:20px;align-items:start}
-@media(max-width:1200px){.rk-inpaint-workbench{grid-template-columns:320px minmax(0,1fr)}.rk-inpaint-output{grid-column:1 / -1;grid-row:2}}
-@media(max-width:820px){.rk-inpaint-workbench{grid-template-columns:1fr}.rk-inpaint-output,.rk-inpaint-stage,.rk-inpaint-panel{grid-column:auto}.rk-inpaint-stage{order:-1}}
+.rk-inpaint-workbench{display:grid;grid-template-columns:300px minmax(0,1fr) 300px;gap:20px;align-items:start}
+@media(max-width:1200px){.rk-inpaint-workbench{grid-template-columns:300px minmax(0,1fr)}.rk-inpaint-output{grid-column:1 / -1;grid-row:2}}
+@media(max-width:820px){.rk-inpaint-workbench{grid-template-columns:1fr}.rk-inpaint-output,.rk-ip-chat,.rk-inpaint-panel{grid-column:auto}.rk-ip-chat{order:-1}}
 
 /* panels (no side borders — uniform hairline) */
-.rk-inpaint-panel,.rk-inpaint-stage,.rk-inpaint-output{background:var(--rk-surface);border:1px solid var(--rk-border);border-radius:var(--rk-r-3xl);box-shadow:var(--rk-shadow-card)}
+.rk-inpaint-panel,.rk-ip-chat,.rk-inpaint-output{background:var(--rk-surface);border:1px solid var(--rk-border);border-radius:var(--rk-r-3xl);box-shadow:var(--rk-shadow-card)}
 .rk-inpaint-panel{padding:18px;display:grid;gap:16px;align-content:start}
+/* fields the chat drives programmatically — present in the DOM, never shown */
+.rk-ip-legacy{display:none!important}
+.rk-ip-maskblock[hidden]{display:none}
 .rk-inpaint-block{display:grid;gap:9px}
 .rk-inpaint-h2{font-family:var(--rk-font-display);font-size:var(--rk-text-lg);font-weight:800;color:var(--rk-ink);letter-spacing:-.01em}
 
@@ -1173,9 +1185,33 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
 .rk-inpaint-workbench.is-locked .rk-inpaint-generate{opacity:1;cursor:default;background:var(--rk-n-50);color:var(--rk-text-muted);border-color:var(--rk-border);box-shadow:none;font-size:12.5px}
 .rk-inpaint-workbench.is-locked .rk-inpaint-generate svg{display:none}
 
-/* center stage + canvas */
-.rk-inpaint-stage{min-height:420px;display:grid;place-items:center;padding:20px;overflow:hidden}
-.rk-inpaint-empty{display:grid;justify-items:center;gap:8px;text-align:center;color:var(--rk-text-muted);padding:34px 20px}
+/* center: chat feed + composer */
+.rk-ip-chat{display:grid;grid-template-rows:minmax(0,1fr) auto;height:min(76vh,860px);min-height:520px;overflow:hidden}
+.rk-ip-feed{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:18px 18px 6px;display:flex;flex-direction:column;gap:14px}
+.rk-ip-canvasholder{display:none}
+.rk-ip-turn{display:flex;flex-direction:column;gap:6px;max-width:100%}
+.rk-ip-turn[data-role="user"]{align-items:flex-end}
+.rk-ip-turn[data-role="assistant"]{align-items:flex-start}
+.rk-ip-bubble{max-width:min(88%,640px);padding:10px 13px;border-radius:var(--rk-r-2xl);font-size:13.5px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
+.rk-ip-turn[data-role="user"] .rk-ip-bubble{background:var(--rk-gold-tint);border:1px solid var(--rk-gold-600);color:var(--rk-ink);border-bottom-right-radius:var(--rk-r-md,8px)}
+.rk-ip-turn[data-role="assistant"] .rk-ip-bubble{background:var(--rk-n-50);border:1px solid var(--rk-border);color:var(--rk-text-muted);border-bottom-left-radius:var(--rk-r-md,8px)}
+.rk-ip-turn-tag{font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--rk-text-faint)}
+.rk-ip-turn-refs{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end}
+.rk-ip-turn-refs img{width:34px;height:34px;border-radius:var(--rk-r-md,8px);border:1px solid var(--rk-border);object-fit:cover}
+.rk-ip-media{width:fit-content;max-width:min(100%,640px);display:grid;gap:7px}
+.rk-ip-media-frame{position:relative;width:fit-content;max-width:100%;border-radius:var(--rk-r-2xl);overflow:hidden;background:var(--rk-n-100);border:1px solid var(--rk-border);line-height:0}
+.rk-ip-media-frame.is-latest{border-color:var(--rk-gold-600);box-shadow:0 0 0 3px var(--rk-gold-tint)}
+.rk-ip-media-frame img,.rk-ip-media-frame video{display:block;max-width:100%;max-height:min(52vh,520px);width:auto;height:auto}
+.rk-ip-media-actions{display:flex;flex-wrap:wrap;align-items:center;gap:5px}
+.rk-ip-act{display:inline-grid;place-items:center;width:27px;height:27px;padding:0;border:1px solid var(--rk-border);border-radius:50%;background:#fff;color:var(--rk-n-700);cursor:pointer;text-decoration:none;transition:background var(--rk-dur) var(--rk-ease),color var(--rk-dur) var(--rk-ease),border-color var(--rk-dur) var(--rk-ease)}
+.rk-ip-act:hover{background:var(--rk-gold-tint);color:var(--rk-gold-700);border-color:var(--rk-gold-600)}
+.rk-ip-act-note{font-size:11.5px;font-weight:700;color:var(--rk-text-faint);margin-left:2px}
+.rk-ip-pending{display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid var(--rk-border);border-radius:var(--rk-r-2xl);background:var(--rk-n-50);font-size:12.5px;font-weight:700;color:var(--rk-text-muted)}
+.rk-ip-pending::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;border:2.5px solid var(--rk-gold-tint2,rgba(252,185,0,.35));border-top-color:var(--rk-gold-700);animation:rk-ip-spin .8s linear infinite}
+.rk-ip-turn.is-flash .rk-ip-bubble,.rk-ip-turn.is-flash .rk-ip-media-frame{box-shadow:0 0 0 3px var(--rk-gold-600)}
+.rk-ip-turn[data-kind="stopped"] .rk-ip-bubble{background:var(--rk-n-100);border-color:var(--rk-border-strong);color:var(--rk-text-muted);font-weight:700}
+.rk-ip-turn[data-kind="error"] .rk-ip-bubble{background:#fdf3f2;border-color:#e6a8a0;color:#b42318;font-weight:600}
+.rk-inpaint-empty{display:grid;justify-items:center;gap:8px;text-align:center;color:var(--rk-text-muted);padding:34px 20px;margin:auto 0}
 .rk-inpaint-empty[hidden]{display:none}
 .rk-inpaint-empty-ic{color:var(--rk-n-400)}
 .rk-inpaint-empty-title{font-family:var(--rk-font-display);font-weight:800;font-size:var(--rk-text-lg);color:var(--rk-ink)}
@@ -1183,26 +1219,48 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
 .editor-inpaint-canvas-wrap{position:relative;display:inline-block;line-height:0;max-width:100%;border-radius:var(--rk-r-2xl);overflow:hidden;box-shadow:var(--rk-shadow-md);
   --inpaint-brush-cursor-size:70px;--inpaint-brush-cursor-x:0px;--inpaint-brush-cursor-y:0px}
 .editor-inpaint-canvas-wrap[hidden]{display:none}
-.editor-inpaint-canvas-wrap img{display:block;max-width:100%;max-height:min(64vh,620px);width:auto;height:auto;object-fit:contain;user-select:none}
+.editor-inpaint-canvas-wrap img{display:block;max-width:100%;max-height:min(52vh,520px);width:auto;height:auto;object-fit:contain;user-select:none}
+/* paint toolbar — sits directly under the image it paints, never over it */
+/* align-items:center keeps the canvas wrap at the image's intrinsic width — stretching
+   it would stretch the absolutely-positioned mask canvas and skew stroke coordinates. */
+.rk-ip-paintstack{display:inline-flex;flex-direction:column;align-items:center;max-width:100%}
+.rk-ip-painttools{width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 8px;border-top:1px solid var(--rk-border);background:var(--rk-n-50);line-height:1;flex-wrap:wrap}
+.rk-ip-painttools-brush{display:flex;align-items:center;gap:6px}
+.rk-ip-painttools-label{font-size:11px;font-weight:800;color:var(--rk-text-muted);white-space:nowrap}
+.rk-ip-painttools .rk-inpaint-range{width:86px}
+.rk-ip-painttool{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--rk-border);background:#fff;color:var(--rk-n-700);cursor:pointer}
+.rk-ip-painttool:hover:not(:disabled){background:var(--rk-gold-tint);color:var(--rk-gold-700);border-color:var(--rk-gold-600)}
+.rk-ip-painttool:disabled{opacity:.45;cursor:default}
+.rk-ip-painttool svg{width:13px;height:13px}
 .editor-inpaint-canvas-wrap canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.86;cursor:none;touch-action:none}
 .editor-inpaint-brush-cursor{position:absolute;z-index:2;left:0;top:0;width:var(--inpaint-brush-cursor-size);height:var(--inpaint-brush-cursor-size);
   border:2px solid rgba(255,255,255,.95);border-radius:50%;box-shadow:0 0 0 1px rgba(28,25,23,.7),0 0 18px rgba(28,25,23,.25);opacity:0;pointer-events:none;
   transform:translate(var(--inpaint-brush-cursor-x),var(--inpaint-brush-cursor-y)) translate(-50%,-50%)}
 .editor-inpaint-brush-cursor[data-visible="true"]{opacity:1}
 
-/* text-to-image composer (empty state) */
-.rk-ip-gen{width:100%;max-width:460px;margin-top:16px;display:grid;gap:10px;justify-items:stretch}
-.rk-ip-gen-or{position:relative;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--rk-text-faint)}
-.rk-ip-gen-or::before,.rk-ip-gen-or::after{content:"";position:absolute;top:50%;width:calc(50% - 26px);height:1px;background:var(--rk-border)}
-.rk-ip-gen-or::before{left:0}.rk-ip-gen-or::after{right:0}
-.rk-ip-gen-box{background:#fff;border:1.5px solid var(--rk-border-strong);border-radius:var(--rk-r-2xl);padding:10px 10px 8px;display:grid;gap:8px;
-  box-shadow:var(--rk-shadow-sm);transition:border-color var(--rk-dur) var(--rk-ease),box-shadow var(--rk-dur) var(--rk-ease);text-align:left}
-.rk-ip-gen-box:focus-within{border-color:var(--rk-gold-600);box-shadow:0 0 0 3px var(--rk-gold-tint)}
-.rk-ip-gen.is-dragref .rk-ip-gen-box{border-color:var(--rk-gold-600);border-style:dashed;background:var(--rk-gold-tint)}
-.rk-ip-gen.is-busy .rk-ip-gen-box{opacity:.75}
-.rk-ip-gen-input{width:100%;border:0;outline:0;resize:none;background:transparent;font:inherit;font-size:14px;line-height:1.45;color:var(--rk-ink);min-height:44px;padding:2px 4px}
-.rk-ip-gen-input::placeholder{color:var(--rk-text-faint)}
-.rk-ip-gen-input:disabled{cursor:not-allowed;color:var(--rk-text-muted)}
+/* chat composer */
+.rk-ip-composer{flex:none;margin:0;padding:12px 18px 16px;border-top:1px solid var(--rk-border);background:var(--rk-surface);display:grid;gap:8px;
+  border-bottom-left-radius:var(--rk-r-3xl);border-bottom-right-radius:var(--rk-r-3xl)}
+.rk-ip-composer.is-dragref{background:var(--rk-gold-tint)}
+.rk-ip-composer.is-busy .rk-ip-comp-status{color:var(--rk-gold-700)}
+.rk-ip-comp-input{width:100%;border:1.5px solid var(--rk-border-strong);border-radius:var(--rk-r-2xl);background:#fff;outline:0;resize:none;font:inherit;font-size:14px;line-height:1.45;
+  color:var(--rk-ink);min-height:56px;max-height:232px;overflow-y:hidden;padding:10px 12px;transition:border-color var(--rk-dur) var(--rk-ease),box-shadow var(--rk-dur) var(--rk-ease)}
+.rk-ip-comp-input:focus{border-color:var(--rk-gold-600);box-shadow:0 0 0 3px var(--rk-gold-tint)}
+.rk-ip-comp-input::placeholder{color:var(--rk-text-faint)}
+.rk-ip-comp-input:disabled{cursor:not-allowed;color:var(--rk-text-muted);background:var(--rk-n-50)}
+.rk-ip-comp-bar{display:flex;align-items:center;gap:8px}
+.rk-ip-comp-modeselect{appearance:none;-webkit-appearance:none;border:1px solid var(--rk-border-strong);border-radius:999px;background:var(--rk-n-50);color:var(--rk-ink);
+  font:inherit;font-size:12px;font-weight:800;padding:7px 26px 7px 12px;cursor:pointer;outline:0;
+  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 20 20' fill='none' stroke='%2378716c' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m5 8 5 5 5-5'/%3E%3C/svg%3E");
+  background-repeat:no-repeat;background-position:right 9px center}
+.rk-ip-comp-modeselect:focus{border-color:var(--rk-gold-600);box-shadow:0 0 0 3px var(--rk-gold-tint)}
+.rk-ip-comp-status{flex:1;min-width:0;margin:0;font-size:11.5px;font-weight:600;line-height:1.35;color:var(--rk-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.rk-ip-comp-status[data-tone="error"]{color:#b42318}
+.rk-ip-comp-status[data-tone="success"]{color:#1f7a44}
+.rk-ip-comp-mask{display:flex;align-items:center;gap:8px;padding:6px 8px 6px 11px;border:1px solid var(--rk-gold-600);border-radius:999px;background:var(--rk-gold-tint);
+  font-size:11.5px;font-weight:700;color:var(--rk-gold-700);justify-self:start;max-width:100%}
+.rk-ip-comp-mask[hidden]{display:none}
+.rk-ip-comp-mask button{border:0;background:transparent;color:inherit;font:inherit;font-size:11.5px;font-weight:800;text-decoration:underline;cursor:pointer;padding:0}
 .rk-ip-gen-clip:disabled{opacity:.5;cursor:not-allowed}
 .rk-ip-gen-presets{display:flex;flex-wrap:wrap;gap:6px}
 .rk-ip-preset{flex:none;border:1px dashed var(--rk-border-strong,var(--rk-border));background:var(--rk-n-50);color:var(--rk-n-700);border-radius:999px;padding:4px 10px;font-size:11.5px;font-weight:600;cursor:pointer;transition:background var(--rk-dur) var(--rk-ease),color var(--rk-dur) var(--rk-ease),border-color var(--rk-dur) var(--rk-ease)}
@@ -1222,6 +1280,8 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
 .rk-ip-gen-send{border:0;background:var(--rk-gold-500,var(--rk-gold-600));color:var(--rk-ink)}
 .rk-ip-gen-send:hover:not(:disabled){background:var(--rk-gold-600)}
 .rk-ip-gen-send:disabled{opacity:.5;cursor:default}
+.rk-ip-gen-send[data-mode="stop"]{background:var(--rk-ink);color:#fff}
+.rk-ip-gen-send[data-mode="stop"]:hover{background:#000}
 .rk-ip-gen-send.is-busy{background:var(--rk-gold-tint);pointer-events:none}
 .rk-ip-gen-spin,.rk-ip-gen-send .rk-ip-gen-spin{width:16px;height:16px;border-radius:50%;border:2.5px solid var(--rk-gold-tint2,rgba(252,185,0,.35));border-top-color:var(--rk-gold-700);animation:rk-ip-spin .8s linear infinite}
 .rk-ip-gen-status{font-size:12px;font-weight:600;min-height:16px;color:var(--rk-text-muted);text-align:left;padding-left:2px}
@@ -1256,6 +1316,8 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
 .custom-inpaint-history-item[data-kind="source"]{background:var(--rk-gold-tint);border-color:var(--rk-gold-600)}
 .custom-inpaint-history-thumb-button{width:54px;height:54px;display:grid;padding:0;border:0;border-radius:var(--rk-r-lg);background:transparent;cursor:zoom-in}
 .custom-inpaint-history-thumb{width:54px;height:54px;border:1px solid var(--rk-border);border-radius:var(--rk-r-lg);object-fit:cover;background:var(--rk-n-200)}
+.custom-inpaint-history-videothumb{display:grid;place-items:center;font-size:16px;color:var(--rk-n-600);background:var(--rk-n-100)}
+.custom-inpaint-history-thumb-button{cursor:pointer}
 .custom-inpaint-history-generating{width:54px;height:54px;display:grid;place-items:center;border:1px solid var(--rk-border);border-radius:var(--rk-r-lg);background:var(--rk-n-100)}
 .custom-inpaint-history-generating::before{content:"";width:22px;height:22px;border-radius:50%;border:2.5px solid var(--rk-gold-tint2,rgba(252,185,0,.35));border-top-color:var(--rk-gold-700);animation:rk-ip-spin .8s linear infinite}
 .custom-inpaint-history-meta{min-width:0;display:grid;gap:5px}
@@ -1283,7 +1345,8 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
 .custom-inpaint-lightbox-title{min-width:0;margin:0;color:var(--rk-ink);font-size:14px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .custom-inpaint-lightbox-actions{display:flex;align-items:center;gap:8px}
 .custom-inpaint-lightbox-stage{min-height:0;display:grid;place-items:center;overflow:auto}
-.custom-inpaint-lightbox-stage img{max-width:100%;max-height:calc(94svh - 92px);object-fit:contain;border-radius:var(--rk-r-xl);background:var(--rk-n-100)}
+.custom-inpaint-lightbox-stage img,.custom-inpaint-lightbox-stage video{max-width:100%;max-height:calc(94svh - 92px);object-fit:contain;border-radius:var(--rk-r-xl);background:var(--rk-n-100)}
+.custom-inpaint-lightbox-stage img[hidden],.custom-inpaint-lightbox-stage video[hidden]{display:none}
 
 @keyframes rk-ip-spin{to{transform:rotate(360deg)}}
 
@@ -1394,17 +1457,18 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
     <div class="rk-inpaint-head-text">
       <div class="rk-ip-tabs" role="tablist" aria-label="Editor mode"><a class="rk-ip-tab is-active" href="/tools/image" role="tab" aria-selected="true"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="16" rx="2"/><circle cx="8.5" cy="9" r="1.5"/><path d="m4 17 4.5-4.5 3 3L16 11l4 4"/></svg><span>Image</span></a><a class="rk-ip-tab" href="/tools/video" role="tab" aria-selected="false"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="5" width="14" height="14" rx="2"/><path d="m17 9 4-2v10l-4-2"/></svg><span>Video</span></a><a class="rk-ip-tab" href="/tools/clipper" role="tab" aria-selected="false"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="6" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M8.1 8.1 20 18M8.1 15.9 20 6"/></svg><span>Clipper</span></a></div>
       <h1 class="rk-h1">Create Image</h1>
-      <p class="rk-sub">Upload an image (or generate one), paint mask regions in different colors, give each color its own instruction, add an optional whole-image prompt, and generate — everything outside your mask stays untouched.</p>
+      <p class="rk-sub">Chat to create an image, then keep chatting to refine it — every message edits the newest image, and only that image, so instructions stay sharp. Paint a mask on it to change only that region, or switch the composer to Video to animate it.</p>
     </div>
     <div class="rk-inpaint-toolbar">
       <button type="button" class="rk-btn rk-btn-ghost rk-btn-sm rk-inpaint-startnew" data-custom-inpaint-start-new><svg width="14" height="14" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 4v12"/><path d="M4 10h12"/></svg> Start New</button>
+      <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-copy-chat aria-label="Copy chat ID" title="Copy chat ID"><svg width="13" height="13" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M8.4 11.6a3.2 3.2 0 0 0 4.5 0l2.2-2.2a3.2 3.2 0 0 0-4.5-4.5L9.4 6.1"/><path d="M11.6 8.4a3.2 3.2 0 0 0-4.5 0L4.9 10.6a3.2 3.2 0 0 0 4.5 4.5l1.2-1.2"/></svg></button>
       <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-settings-button aria-label="Settings" title="Settings"><svg width="16" height="16" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M8.8 3.4 9.4 2h1.2l.6 1.4 1.2.5 1.4-.6.9.9-.6 1.4.5 1.2 1.4.6v1.2l-1.4.6-.5 1.2.6 1.4-.9.9-1.4-.6-1.2.5-.6 1.4H9.4l-.6-1.4-1.2-.5-1.4.6-.9-.9.6-1.4-.5-1.2L4 8.6V7.4l1.4-.6.5-1.2-.6-1.4.9-.9 1.4.6 1.2-.5Z"/><circle cx="10" cy="8" r="2.4"/></svg></button>
       <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-history-toggle aria-label="Past sessions" title="Past sessions"><svg width="16" height="16" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M3.2 10a6.8 6.8 0 1 1 2 4.8"/><path d="M3.2 14.4v-3.6h3.6"/><path d="M10 6.2V10l2.6 1.6"/></svg></button>
     </div>
   </div>
 
   <div class="rk-inpaint-workbench">
-    <!-- LEFT: source + prompts + brush/color controls -->
+    <!-- LEFT: source + per-color mask instructions (mask block appears once you paint) -->
     <section class="rk-inpaint-panel" aria-label="Controls">
       <div class="rk-inpaint-block">
         <label class="rk-label">Source image</label>
@@ -1414,98 +1478,99 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
           <span class="rk-inpaint-drop-name" data-custom-inpaint-source-name>No image selected</span>
         </button>
         <input data-custom-inpaint-file type="file" accept="image/png,image/jpeg,image/webp,image/gif,image/avif" hidden />
+        <span class="rk-hint">Optional — just type in the chat and the first generated image becomes your working image.</span>
       </div>
 
-      <div class="rk-inpaint-block">
-        <label class="rk-label">Whole image prompt</label>
-        <div class="rk-ip-promptfield">
-          <textarea class="rk-textarea rk-ip-global" data-editor-inpaint-global-prompt placeholder="Describe the overall edit, style, constraints, or preservation notes (optional)."></textarea>
-          <button type="button" class="rk-ip-attach" data-editor-inpaint-attach-scope="global" aria-label="Attach reference image" title="Attach reference image"><svg width="18" height="18" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="m8.1 10.7 4.8-4.8a2.5 2.5 0 0 1 3.5 3.5l-6.1 6.1a4 4 0 0 1-5.7-5.7l6.3-6.3"/><path d="m10 8.8-4.1 4.1a1.6 1.6 0 0 0 2.3 2.3l5.6-5.6"/></svg></button>
-        </div>
-        <span class="editor-inpaint-attachment-chips rk-ip-attach-chips" data-editor-inpaint-attachments="global"></span>
-        <input data-editor-inpaint-attachment-input type="file" accept="image/jpeg,image/png,image/webp" multiple hidden />
-        <span class="rk-hint">Guidance for the masked edit and overall consistency. It never permits changing unmasked pixels.</span>
-      </div>
-
-      <div class="rk-inpaint-block">
+      <div class="rk-inpaint-block rk-ip-maskblock" data-ip-mask-block hidden>
         <div class="rk-inpaint-brushrow">
-          <label class="rk-label">Brush <span data-editor-inpaint-brush-label>70</span>&nbsp;px</label>
-          <div class="rk-ip-toolbtns">
-            <button type="button" class="rk-ip-iconbtn" data-editor-inpaint-undo aria-label="Undo stroke" title="Undo"><svg width="16" height="16" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M7.2 7H3.8V3.6"/><path d="M4 7a7 7 0 1 1 1.9 6.6"/></svg></button>
-            <button type="button" class="rk-ip-iconbtn" data-editor-inpaint-redo aria-label="Redo stroke" title="Redo"><svg width="16" height="16" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12.8 7h3.4V3.6"/><path d="M16 7a7 7 0 1 0-1.9 6.6"/></svg></button>
-            <button type="button" class="rk-ip-iconbtn" data-editor-inpaint-clear aria-label="Clear mask" title="Clear mask"><svg width="15" height="15" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 5l10 10M15 5 5 15"/></svg></button>
-          </div>
-        </div>
-        <input data-editor-inpaint-brush class="rk-inpaint-range" type="range" min="6" max="180" step="1" value="70" />
-      </div>
-
-      <div class="rk-inpaint-block">
-        <div class="rk-inpaint-brushrow">
-          <label class="rk-label">Mask colors</label>
+          <label class="rk-label">Mask regions</label>
           <input class="rk-ip-colorpicker" data-editor-inpaint-color-picker type="color" value="#ff2d55" aria-label="Mask color" />
         </div>
-        <span class="rk-hint">Paint regions in different colors, then give each color its own replacement instruction below.</span>
+        <span class="rk-hint">Paint on the image in the chat. Give each color its own replacement instruction — the chat box stays the whole-image prompt.</span>
         <div class="editor-inpaint-swatches" data-editor-inpaint-swatches></div>
         <div class="editor-inpaint-prompts" data-editor-inpaint-prompts></div>
         <button type="button" class="rk-btn rk-btn-ghost rk-btn-sm rk-ip-addcolor" data-editor-inpaint-add-color>+ Add color</button>
       </div>
 
-      <div class="rk-inpaint-block">
-        <button type="button" class="rk-btn rk-btn-gold rk-inpaint-generate" data-editor-inpaint-submit><svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2.5l1.9 5.1 5.1 1.9-5.1 1.9L12 16.5l-1.9-5.1L5 9.5l5.1-1.9z"/></svg> <span data-editor-inpaint-submit-label>Generate edit</span></button>
-        <p class="custom-inpaint-status rk-inpaint-status" data-custom-inpaint-status data-tone="" aria-live="polite"></p>
+      <!-- Legacy fields the chat drives behind the scenes: the composer text is written
+           into the whole-image prompt, and the composer's send press clicks submit. -->
+      <div class="rk-ip-legacy" aria-hidden="true">
+        <textarea class="rk-textarea rk-ip-global" data-editor-inpaint-global-prompt></textarea>
+        <button type="button" class="rk-ip-attach" data-editor-inpaint-attach-scope="global" aria-label="Attach reference image"><svg width="18" height="18" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="m8.1 10.7 4.8-4.8a2.5 2.5 0 0 1 3.5 3.5l-6.1 6.1a4 4 0 0 1-5.7-5.7l6.3-6.3"/><path d="m10 8.8-4.1 4.1a1.6 1.6 0 0 0 2.3 2.3l5.6-5.6"/></svg></button>
+        <span class="editor-inpaint-attachment-chips rk-ip-attach-chips" data-editor-inpaint-attachments="global"></span>
+        <input data-editor-inpaint-attachment-input type="file" accept="image/jpeg,image/png,image/webp" multiple hidden />
+        <button type="button" data-editor-inpaint-submit><svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2.5l1.9 5.1 5.1 1.9-5.1 1.9L12 16.5l-1.9-5.1L5 9.5l5.1-1.9z"/></svg> <span data-editor-inpaint-submit-label>Generate edit</span></button>
+        <div class="custom-inpaint-output" data-custom-inpaint-output hidden>
+          <button type="button" data-custom-inpaint-result-open aria-label="View image edit result">
+            <img data-custom-inpaint-result alt="Image edit result" />
+          </button>
+          <button type="button" data-custom-inpaint-save>Save to Files</button>
+        </div>
       </div>
     </section>
 
-    <!-- CENTER: canvas stage (with text-to-image empty state) -->
-    <section class="rk-inpaint-stage" aria-label="Canvas">
-      <div class="rk-inpaint-empty" data-custom-inpaint-empty>
-        <span class="rk-inpaint-empty-ic" aria-hidden="true"><svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 16V4"/><path d="m7 9 5-5 5 5"/><path d="M4 16v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"/></svg></span>
-        <p class="rk-inpaint-empty-title">Upload an image to start</p>
-        <p class="rk-inpaint-empty-sub">Then paint mask regions in one or more colors.</p>
-
-        <!-- Or generate an image from scratch (text-to-image) -->
-        <div class="rk-ip-gen" id="rk-ip-gen">
-          <span class="rk-ip-gen-or">or</span>
-          <div class="rk-ip-gen-box">
-            <textarea id="rk-ip-genprompt" class="rk-ip-gen-input" rows="2" placeholder="Or type your image prompt"></textarea>
-            <div class="rk-ip-gen-presets" id="rk-ip-genpresets">
-              <button type="button" class="rk-ip-preset" data-preset="character-card" title="Fill the prompt with a character reference sheet (multi-angle, expressions, poses)">＋ Character card</button>
-              <button type="button" class="rk-ip-preset" data-preset="storyboard" title="Fill the prompt with a numbered storyboard (sequential shot panels)">＋ Storyboard</button>
-            </div>
-            <div class="rk-ip-gen-refs" id="rk-ip-genrefs" hidden></div>
-            <div class="rk-ip-gen-bar">
-              <button type="button" class="rk-ip-gen-clip" id="rk-ip-genclip" aria-label="Attach reference images from your files" title="Attach reference images from your files"><svg width="18" height="18" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="m8.1 10.7 4.8-4.8a2.5 2.5 0 0 1 3.5 3.5l-6.1 6.1a4 4 0 0 1-5.7-5.7l6.3-6.3"/><path d="m10 8.8-4.1 4.1a1.6 1.6 0 0 0 2.3 2.3l5.6-5.6"/></svg></button>
-              <span class="rk-ip-gen-hint">Generate a brand-new image, then paint to refine it.</span>
-              <button type="button" class="rk-ip-gen-send" id="rk-ip-gensend" aria-label="Generate image"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M12 19V5"/><path d="m5 12 7-7 7 7"/></svg></button>
-            </div>
+    <!-- CENTER: chat feed + composer. Every turn appends to the feed; edits always
+         apply to the LATEST image, which is the one you paint on in-feed. -->
+    <section class="rk-ip-chat" aria-label="Create Image chat">
+      <div class="rk-ip-feed" data-ip-feed>
+        <div class="rk-inpaint-empty" data-custom-inpaint-empty>
+          <span class="rk-inpaint-empty-ic" aria-hidden="true"><svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2.5l1.9 5.1 5.1 1.9-5.1 1.9L12 16.5l-1.9-5.1L5 9.5l5.1-1.9z"/></svg></span>
+          <p class="rk-inpaint-empty-title">Describe the image you want</p>
+          <p class="rk-inpaint-empty-sub">Then keep chatting to refine it — every message edits the newest image. Paint a mask on it first to edit just that region, or switch the composer to Video to animate it.</p>
+          <div class="rk-ip-gen-presets" id="rk-ip-genpresets">
+            <button type="button" class="rk-ip-preset" data-preset="character-card" title="Fill the prompt with a character reference sheet (multi-angle, expressions, poses)">＋ Character card</button>
+            <button type="button" class="rk-ip-preset" data-preset="storyboard" title="Fill the prompt with a numbered storyboard (sequential shot panels)">＋ Storyboard</button>
           </div>
-          <p class="rk-ip-gen-status" id="rk-ip-genstatus" data-tone="" aria-live="polite"></p>
         </div>
       </div>
-      <div class="rk-inpaint-canvaswrap editor-inpaint-canvas-wrap" data-custom-inpaint-canvas-wrap hidden>
-        <img data-editor-inpaint-image class="rk-inpaint-img" alt="" />
-        <canvas data-editor-inpaint-canvas class="rk-inpaint-canvas"></canvas>
-        <div class="editor-inpaint-brush-cursor" data-editor-inpaint-brush-cursor aria-hidden="true"></div>
+
+      <!-- The paint surface. JS moves this whole stack into the newest image bubble,
+           so the brush toolbar always travels with the image it paints. -->
+      <div class="rk-ip-canvasholder" data-ip-canvas-holder hidden>
+        <div class="rk-ip-paintstack" data-ip-paint-stack>
+          <div class="rk-inpaint-canvaswrap editor-inpaint-canvas-wrap" data-custom-inpaint-canvas-wrap hidden>
+            <img data-editor-inpaint-image class="rk-inpaint-img" alt="" />
+            <canvas data-editor-inpaint-canvas class="rk-inpaint-canvas"></canvas>
+            <div class="editor-inpaint-brush-cursor" data-editor-inpaint-brush-cursor aria-hidden="true"></div>
+          </div>
+          <div class="rk-ip-painttools" data-ip-painttools>
+            <span class="rk-ip-painttools-brush">
+              <span class="rk-ip-painttools-label">Brush <span data-editor-inpaint-brush-label>70</span></span>
+              <input data-editor-inpaint-brush class="rk-inpaint-range" type="range" min="6" max="180" step="1" value="70" aria-label="Brush size" />
+            </span>
+            <button type="button" class="rk-ip-painttool" data-editor-inpaint-undo aria-label="Undo stroke" title="Undo stroke (⌘Z)"><svg width="16" height="16" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M7.2 7H3.8V3.6"/><path d="M4 7a7 7 0 1 1 1.9 6.6"/></svg></button>
+            <button type="button" class="rk-ip-painttool" data-editor-inpaint-redo aria-label="Redo stroke" title="Redo stroke (⇧⌘Z)"><svg width="16" height="16" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12.8 7h3.4V3.6"/><path d="M16 7a7 7 0 1 0-1.9 6.6"/></svg></button>
+            <button type="button" class="rk-ip-painttool" data-editor-inpaint-clear aria-label="Clear mask" title="Clear mask"><svg width="15" height="15" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 5l10 10M15 5 5 15"/></svg></button>
+          </div>
+        </div>
       </div>
-    </section>
 
-    <!-- RIGHT: result + tracer-grouped history -->
-    <section class="rk-inpaint-output" aria-label="Result and history">
-      <div class="custom-inpaint-output rk-inpaint-result" data-custom-inpaint-output hidden>
-        <div class="rk-inpaint-result-head">
-          <h2 class="rk-inpaint-h2">Result</h2>
-          <button type="button" class="rk-btn rk-btn-ghost rk-btn-sm" data-custom-inpaint-save>Save to Files</button>
+      <div class="rk-ip-composer" data-ip-composer>
+        <div class="rk-ip-comp-mask" data-ip-comp-mask hidden></div>
+        <div class="rk-ip-gen-refs" id="rk-ip-genrefs" hidden></div>
+        <textarea id="rk-ip-genprompt" class="rk-ip-comp-input" rows="2" placeholder="Describe the image you want…"></textarea>
+        <div class="rk-ip-comp-bar">
+          <span class="rk-ip-comp-mode" data-ip-mode-wrap>
+            <select class="rk-ip-comp-modeselect" data-ip-mode aria-label="What to create">
+              <option value="image">Image</option>
+              <option value="video">Video</option>
+            </select>
+          </span>
+          <button type="button" class="rk-ip-gen-clip" id="rk-ip-genclip" aria-label="Attach reference images from your files" title="Attach reference images"><svg width="18" height="18" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="m8.1 10.7 4.8-4.8a2.5 2.5 0 0 1 3.5 3.5l-6.1 6.1a4 4 0 0 1-5.7-5.7l6.3-6.3"/><path d="m10 8.8-4.1 4.1a1.6 1.6 0 0 0 2.3 2.3l5.6-5.6"/></svg></button>
+          <p class="custom-inpaint-status rk-ip-comp-status" data-custom-inpaint-status data-tone="" aria-live="polite"></p>
+          <button type="button" class="rk-ip-gen-send" id="rk-ip-gensend" aria-label="Send"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M12 19V5"/><path d="m5 12 7-7 7 7"/></svg></button>
         </div>
-        <button type="button" class="rk-inpaint-result-imgwrap custom-inpaint-preview" data-custom-inpaint-result-open aria-label="View image edit result">
-          <img class="rk-inpaint-result-img" data-custom-inpaint-result alt="Image edit result" />
-        </button>
+        <p class="rk-ip-gen-status" id="rk-ip-genstatus" data-tone="" aria-live="polite" hidden></p>
       </div>
+    </section>
 
+    <!-- RIGHT: tracer-grouped session history -->
+    <section class="rk-inpaint-output" aria-label="Session history">
       <div class="rk-inpaint-history">
         <div class="rk-inpaint-history-head">
           <h2 class="rk-inpaint-h2">This session</h2>
           <div class="rk-ip-histtools">
-            <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-history-refresh aria-label="Refresh history" title="Refresh history"><svg width="15" height="15" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M16.5 10a6.5 6.5 0 1 1-1.9-4.6"/><path d="M16.5 4.2v4.2h-4.2"/></svg></button>
+            <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-history-refresh aria-label="Reload this session from the server" title="Reload this session"><svg width="15" height="15" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M16.5 10a6.5 6.5 0 1 1-1.9-4.6"/><path d="M16.5 4.2v4.2h-4.2"/></svg></button>
           </div>
         </div>
         <div class="custom-inpaint-history-list rk-inpaint-historylist" data-custom-inpaint-history-list>
@@ -1553,13 +1618,15 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
       <div class="custom-inpaint-lightbox-head">
         <p class="custom-inpaint-lightbox-title" id="custom-inpaint-lightbox-title" data-custom-inpaint-lightbox-title>Image edit output</p>
         <div class="custom-inpaint-lightbox-actions">
-          <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-lightbox-copy aria-label="Copy image URL" title="Copy URL"><svg width="13" height="13" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M8.4 11.6a3.2 3.2 0 0 0 4.5 0l2.2-2.2a3.2 3.2 0 0 0-4.5-4.5L9.4 6.1"/><path d="M11.6 8.4a3.2 3.2 0 0 0-4.5 0L4.9 10.6a3.2 3.2 0 0 0 4.5 4.5l1.2-1.2"/></svg></button>
+          <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-lightbox-copy aria-label="Copy file URL" title="Copy URL"><svg width="13" height="13" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M8.4 11.6a3.2 3.2 0 0 0 4.5 0l2.2-2.2a3.2 3.2 0 0 0-4.5-4.5L9.4 6.1"/><path d="M11.6 8.4a3.2 3.2 0 0 0-4.5 0L4.9 10.6a3.2 3.2 0 0 0 4.5 4.5l1.2-1.2"/></svg></button>
+          <a class="rk-ip-iconbtn" data-custom-inpaint-lightbox-link href="#" target="_blank" rel="noopener noreferrer" aria-label="Open the direct file URL" title="Open direct file URL"><svg width="13" height="13" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M8.6 11.4a3 3 0 0 0 4.3 0l2.4-2.4a3 3 0 1 0-4.3-4.3l-1 1"/><path d="M11.4 8.6a3 3 0 0 0-4.3 0l-2.4 2.4a3 3 0 1 0 4.3 4.3l1-1"/></svg></a>
           <a class="rk-btn rk-btn-ink rk-btn-sm" data-custom-inpaint-lightbox-download href="#" target="_blank" rel="noopener noreferrer" download><svg width="15" height="15" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M10 3v9"/><path d="m6.5 8.5 3.5 3.5 3.5-3.5"/><path d="M4 16h12"/></svg> Download</a>
           <button type="button" class="rk-ip-iconbtn" data-custom-inpaint-lightbox-close aria-label="Close preview" title="Close"><svg width="15" height="15" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M5 5l10 10"/><path d="M15 5 5 15"/></svg></button>
         </div>
       </div>
       <div class="custom-inpaint-lightbox-stage">
         <img data-custom-inpaint-lightbox-image alt="Image edit output preview" />
+        <video data-custom-inpaint-lightbox-video controls playsinline hidden></video>
       </div>
     </div>
   </div>
@@ -1697,7 +1764,17 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
           const lightboxImage = document.querySelector("[data-custom-inpaint-lightbox-image]");
           const lightboxCopy = document.querySelector("[data-custom-inpaint-lightbox-copy]");
           const lightboxDownload = document.querySelector("[data-custom-inpaint-lightbox-download]");
+          const lightboxLink = document.querySelector("[data-custom-inpaint-lightbox-link]");
+          const lightboxVideo = document.querySelector("[data-custom-inpaint-lightbox-video]");
           const lightboxClose = document.querySelector("[data-custom-inpaint-lightbox-close]");
+          // chat surface
+          const chatFeed = document.querySelector("[data-ip-feed]");
+          const canvasHolder = document.querySelector("[data-ip-canvas-holder]");
+          const composerEl = document.querySelector("[data-ip-composer]");
+          const modeSelect = document.querySelector("[data-ip-mode]");
+          const maskBlock = document.querySelector("[data-ip-mask-block]");
+          const maskChip = document.querySelector("[data-ip-comp-mask]");
+          const paintStack = document.querySelector("[data-ip-paint-stack]");
           if (!(uploadButton instanceof HTMLButtonElement)
             || !(startNewButton instanceof HTMLButtonElement)
             || !(fileInput instanceof HTMLInputElement)
@@ -1737,7 +1814,14 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             || !(lightboxImage instanceof HTMLImageElement)
             || !(lightboxCopy instanceof HTMLButtonElement)
             || !(lightboxDownload instanceof HTMLAnchorElement)
-            || !(lightboxClose instanceof HTMLButtonElement)) {
+            || !(lightboxClose instanceof HTMLButtonElement)
+            || !(chatFeed instanceof HTMLElement)
+            || !(canvasHolder instanceof HTMLElement)
+            || !(composerEl instanceof HTMLElement)
+            || !(modeSelect instanceof HTMLSelectElement)
+            || !(maskBlock instanceof HTMLElement)
+            || !(maskChip instanceof HTMLElement)
+            || !(paintStack instanceof HTMLElement)) {
             return;
           }
 
@@ -1752,13 +1836,15 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
           let inpaintAttachments = [];
           let pendingInpaintAttachmentScope = null;
           let inpaintHistoryItems = [];
+          // Chat state. Declared up here because the legacy helpers below (loadSourceUrl,
+          // applyCompletedInpaintJob, resetWorkspace) push turns into it.
+          let chatTurns = [];
+          let activeTurnId = "";
           // Local "starting image" history entries (uploaded / generated / deep-linked
           // sources). They are not job runs, so they survive server-history reloads by
           // being re-injected after each rebuild — this lets users see where a session
           // started from.
-          let sourceHistoryItems = [];
           let historyTracerRefreshTimer = 0;
-          const hiddenInpaintHistoryKeys = new Set();
           const maxInpaintAttachments = 8;
           const allowedInpaintAttachmentTypes = new Set(["image/jpeg", "image/png", "image/webp"]);
 
@@ -1831,12 +1917,12 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               : (sessionLocked ? "Edit generated \u2014 Start New to edit again" : "Generate edit");
           }
 
-          // Once an edit is generated the inputs that produced it are frozen (prompts,
-          // masks, brush, colors, references, source) so the record stays truthful —
-          // to make another edit the user hits Start New (or opens/loads another image).
+          // The chat surface iterates forever on the newest image, so the old
+          // freeze-after-one-edit lock is gone: setSessionLocked() is kept as a no-op
+          // so every legacy call site still type-checks and simply never locks.
           let sessionLocked = false;
           function applySessionLock() {
-            const locked = sessionLocked;
+            const locked = false;
             const workbench = document.querySelector(".rk-inpaint-workbench");
             if (workbench instanceof HTMLElement) workbench.classList.toggle("is-locked", locked);
             inpaintGlobalPrompt.readOnly = locked;
@@ -1854,8 +1940,8 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             // Keep the submit button + label consistent with the lock while not loading.
             if (inpaintSubmit.getAttribute("data-loading") !== "true") setSubmitLoading(false);
           }
-          function setSessionLocked(locked) {
-            sessionLocked = Boolean(locked);
+          function setSessionLocked() {
+            sessionLocked = false;
             applySessionLock();
           }
 
@@ -1873,15 +1959,31 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             return prefix + "-" + stamp + ".png";
           }
 
-          function openImagePreview(url, label, downloadName) {
+          // Fullscreen preview for any feed item — images and generated videos alike.
+          function openImagePreview(url, label, downloadName, mediaKind) {
             if (!url) return;
-            lightboxImage.src = url;
-            lightboxImage.alt = label || "Image edit output preview";
+            const isVideo = mediaKind === "video";
+            if (isVideo && lightboxVideo instanceof HTMLVideoElement) {
+              lightboxVideo.src = url;
+              lightboxVideo.hidden = false;
+              lightboxImage.hidden = true;
+              lightboxImage.removeAttribute("src");
+            } else {
+              if (lightboxVideo instanceof HTMLVideoElement) {
+                lightboxVideo.pause();
+                lightboxVideo.removeAttribute("src");
+                lightboxVideo.hidden = true;
+              }
+              lightboxImage.hidden = false;
+              lightboxImage.src = url;
+              lightboxImage.alt = label || "Image edit output preview";
+            }
             lightboxTitle.textContent = label || "Image edit output";
             lightboxCopy.dataset.copyUrl = url;
             lightboxCopy.setAttribute("title", "Copy URL");
             lightboxDownload.href = url;
-            lightboxDownload.setAttribute("download", downloadName || imageDownloadName("inpaint-output"));
+            lightboxDownload.setAttribute("download", downloadName || imageDownloadName(isVideo ? "video-output" : "inpaint-output"));
+            if (lightboxLink instanceof HTMLAnchorElement) lightboxLink.href = url;
             lightbox.hidden = false;
             lightbox.setAttribute("data-open", "true");
             document.body.style.overflow = "hidden";
@@ -1891,9 +1993,15 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             lightbox.setAttribute("data-open", "false");
             lightbox.hidden = true;
             lightboxImage.removeAttribute("src");
+            if (lightboxVideo instanceof HTMLVideoElement) {
+              lightboxVideo.pause();
+              lightboxVideo.removeAttribute("src");
+              lightboxVideo.hidden = true;
+            }
             lightboxCopy.dataset.copyUrl = "";
             lightboxCopy.setAttribute("title", "Copy URL");
             lightboxDownload.href = "#";
+            if (lightboxLink instanceof HTMLAnchorElement) lightboxLink.href = "#";
             document.body.style.overflow = "";
           }
 
@@ -2104,6 +2212,31 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             }
             renderAllAttachmentChips();
             applySessionLock();
+            syncMaskUi();
+          }
+
+          // The mask controls only exist while a mask exists: the left block holds the
+          // per-color instructions, and the composer grows a chip so it is obvious the
+          // next message is a MASKED edit rather than a whole-image one.
+          function syncMaskUi() {
+            const painted = inpaintStrokes.length > 0;
+            const showBlock = Boolean(sourceImageUrl) && (painted || redoStrokes.length > 0);
+            maskBlock.hidden = !showBlock;
+            const usedColors = new Set(inpaintStrokes.map((stroke) => normalizeHexColor(stroke.color)));
+            maskChip.hidden = !painted;
+            if (painted) {
+              maskChip.innerHTML = "";
+              const label = document.createElement("span");
+              label.textContent = "Masked edit \u00b7 " + usedColors.size + " region" + (usedColors.size === 1 ? "" : "s") + " painted";
+              const clear = document.createElement("button");
+              clear.type = "button";
+              clear.dataset.ipClearMask = "true";
+              clear.textContent = "Clear mask";
+              maskChip.append(label, clear);
+            }
+            inpaintUndo.disabled = !inpaintStrokes.length;
+            inpaintRedo.disabled = !redoStrokes.length;
+            inpaintClear.disabled = !painted;
           }
 
           function redrawInpaintMask() {
@@ -2161,6 +2294,7 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             inpaintStrokes.push(currentInpaintStroke);
             redoStrokes = [];
             redrawInpaintMask();
+            syncMaskUi();
           }
 
           function continueInpaintStroke(event) {
@@ -2451,22 +2585,17 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               setStatus("The source image URL is invalid.", "error");
               return;
             }
-            setSessionLocked(false);
-            sourceImageUrl = url;
             sourceImageName = firstSearchParam(["source_image_name", "image_name", "file_name"]) || sourceNameFromUrl(url);
-            sourceName.textContent = sourceImageName;
-            emptyState.hidden = true;
-            canvasWrap.hidden = false;
-            outputPanel.hidden = true;
-            resultImage.removeAttribute("src");
-            resetMask();
-            inpaintImage.onload = () => {
-              syncInpaintCanvasSize();
-              resetMask();
-            };
-            inpaintImage.src = sourceImageUrl;
-            recordSourceHistoryItem(sourceImageUrl, origin || "url", sourceImageName);
-            setStatus("Source ready from URL.", "success");
+            adoptLatestImage(url, sourceImageName);
+            addTurn({
+              role: "assistant",
+              kind: "media",
+              mediaKind: "image",
+              url,
+              note: origin === "generated" ? "generated" : "starting image"
+            });
+            recordSourceHistoryItem(url, origin || "url", sourceImageName);
+            setStatus("Working image ready — describe an edit, or paint a mask on it first.", "success");
           }
 
           function clearInpaintUrlParams() {
@@ -2539,6 +2668,7 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             currentInpaintStroke = null;
             isInpaintPainting = false;
             redrawInpaintMask();
+            syncMaskUi();
           }
 
           function resetWorkspace() {
@@ -2546,7 +2676,6 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             sourceImageUrl = "";
             sourceImageName = "";
             sourceName.textContent = "No image selected";
-            emptyState.hidden = false;
             canvasWrap.hidden = true;
             outputPanel.hidden = true;
             resultImage.removeAttribute("src");
@@ -2559,9 +2688,11 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             pendingInpaintAttachmentScope = null;
             activeInpaintColor = "#ff2d55";
             inpaintColorPicker.value = activeInpaintColor;
-            sourceHistoryItems = [];
+            chatTurns = [];
+            activeTurnId = "";
             resetMask();
             renderInpaintControls();
+            renderChat();
             setStatus("", "");
           }
 
@@ -2580,26 +2711,15 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               const wasAutoPending = tracerAutoPending;
               if (wasAutoPending) nameTracerFromSeed(fileName.replace(/\.[a-z0-9]+$/i, ""));
               const uploadedUrl = await uploadTemporaryBlob(file, fileName, file.type || "image/png", "inpaints/" + getTracerValue());
-              setSessionLocked(false);
-              sourceImageUrl = absoluteUrl(uploadedUrl);
-              sourceImageName = fileName;
-              sourceName.textContent = fileName;
-              emptyState.hidden = true;
-              canvasWrap.hidden = false;
-              outputPanel.hidden = true;
-              resultImage.removeAttribute("src");
-              resetMask();
-              inpaintImage.onload = () => {
-                syncInpaintCanvasSize();
-                resetMask();
-              };
-              inpaintImage.src = sourceImageUrl;
+              const uploaded = absoluteUrl(uploadedUrl);
+              adoptLatestImage(uploaded, fileName);
+              addTurn({ role: "assistant", kind: "media", mediaKind: "image", url: uploaded, note: "uploaded image" });
               if (wasAutoPending) {
                 void loadInpaintHistory();
                 void loadTracerSessions();
               }
-              recordSourceHistoryItem(sourceImageUrl, "upload", fileName);
-              setStatus("Source ready.", "success");
+              recordSourceHistoryItem(uploaded, "upload", fileName);
+              setStatus("Uploaded — describe an edit, or paint a mask on it first.", "success");
             } catch (error) {
               console.error(error);
               setStatus(error instanceof Error ? error.message : "Unable to upload source image.", "error");
@@ -2641,48 +2761,11 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             };
           }
 
-          function upsertInpaintHistoryItem(item) {
-            if (!item || !item.key) return;
-            inpaintHistoryItems = inpaintHistoryItems.filter((entry) => (
-              entry.key !== item.key
-              && (!item.jobId || entry.jobId !== item.jobId)
-            ));
-            inpaintHistoryItems.unshift(item);
-            inpaintHistoryItems.sort((a, b) => Date.parse(b.createdAt || 0) - Date.parse(a.createdAt || 0));
-            renderInpaintHistory();
-          }
-
-          // Record the image a session started from (upload / generation / deep-link) so
-          // it appears in History. De-duplicated by URL; kept in sourceHistoryItems so a
-          // subsequent server-history reload doesn't drop it.
-          function recordSourceHistoryItem(url, origin, name) {
-            if (!url) return;
-            let abs = "";
-            try { abs = absoluteUrl(url); } catch { return; }
-            const key = "source:" + abs;
-            let item = sourceHistoryItems.find((entry) => entry.key === key);
-            if (!item) {
-              item = {
-                key,
-                kind: "source",
-                origin: origin || "upload",
-                url: abs,
-                name: name || sourceNameFromUrl(abs),
-                createdAt: new Date().toISOString()
-              };
-              sourceHistoryItems.push(item);
-            }
-            upsertInpaintHistoryItem(item);
-          }
-
-          function reinjectSourceHistoryItems() {
-            for (const item of sourceHistoryItems) {
-              if (!inpaintHistoryItems.some((entry) => entry.key === item.key)) {
-                inpaintHistoryItems.push(item);
-              }
-            }
-            inpaintHistoryItems.sort((a, b) => Date.parse(b.createdAt || 0) - Date.parse(a.createdAt || 0));
-          }
+          // The right-hand session rail is DERIVED from the chat (see syncSessionAssets),
+          // so the old push-based item store is gone. These two shims stay because the
+          // legacy job-polling paths still call them; the chat is the source of truth.
+          function upsertInpaintHistoryItem() {}
+          function recordSourceHistoryItem() {}
 
           // Mirror each completed inpaint output into /temp/inpaints/<tracer>/ so a
           // session's outputs are browsable as files (grouped by the same tracer that
@@ -2713,16 +2796,11 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             const url = absoluteUrl(outputUrl);
             const jobId = String(payload?.job_id || payload?.jobId || "");
             resultImage.src = url;
-            outputPanel.hidden = false;
-            setSessionLocked(true);
+            // The finished edit becomes the newest image in the chat — and therefore
+            // the thing the next message edits and the surface you paint on.
+            resolveActiveTurn({ kind: "media", mediaKind: "image", url, jobId });
+            adoptLatestImage(url);
             void persistInpaintOutputToTemp(url, jobId);
-            upsertInpaintHistoryItem({
-              key: historyItemKey({ jobId: jobId || "inpaint" }, url, 0),
-              kind: "output",
-              jobId,
-              url,
-              createdAt: String(payload?.completed_at || payload?.updated_at || new Date().toISOString())
-            });
             return url;
           }
 
@@ -2736,12 +2814,12 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               try {
                 const parsed = new URL(value, window.location.href);
                 const storageKey = parsed.searchParams.get("key") || decodeURIComponent(parsed.pathname).replace(/^\/+/, "");
-                return !/\/temporary\/inpaints\/_inputs(?:\/|$)/i.test(storageKey)
+                return !/\/temporary\/inpaints\/_(?:inputs|context)(?:\/|$)/i.test(storageKey)
                   && !/\/temporary\/inpaint(?:-|\/|$)/i.test(storageKey)
                   && !/\/temporary\/inpaint-masks(?:\/|$)/i.test(storageKey)
                   && !/inpaint-mask-[^/]+\.png/i.test(storageKey);
               } catch {
-                return !/\/temporary\/inpaints\/_inputs(?:\/|$)/i.test(value)
+                return !/\/temporary\/inpaints\/_(?:inputs|context)(?:\/|$)/i.test(value)
                   && !/\/temporary\/inpaint(?:-|\/|$)/i.test(value)
                   && !/\/temporary\/inpaint-masks(?:\/|$)/i.test(value)
                   && !/inpaint-mask-[^/]+\.png/i.test(value);
@@ -2749,16 +2827,21 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             });
           }
 
-          function isInpaintHistoryEntry(entry) {
-            const templateId = String(entry?.linkedJob?.template_id || entry?.linkedJob?.templateId || "").toLowerCase();
+          // Which chat turn an api-history entry represents. These four routes ARE the
+          // conversation — everything else in the customer's run history is ignored here.
+          function chatEntryKind(entry) {
             const path = String(entry?.path || "").toLowerCase();
-            return templateId === "primitive:image_inpaint"
-              || path.includes("/primitives/images/inpaint")
-              || path.includes("/primitives/image_inpaint");
+            const templateId = String(entry?.linkedJob?.template_id || entry?.linkedJob?.templateId || "").toLowerCase();
+            if (path.includes("/primitives/images/inpaint") || templateId === "primitive:image_inpaint") return "inpaint";
+            if (path.includes("/primitives/images/edit") || templateId === "primitive:image_edit") return "edit";
+            if (path.includes("/primitives/images/generate") || templateId === "primitive:image_generate") return "generate";
+            if (path.includes("/primitives/videos/generate") || templateId === "primitive:video_generate") return "video";
+            return "";
           }
 
-          function historyItemKey(entry, url, index) {
-            return String(entry?.jobId || entry?.job_id || entry?.id || "inpaint") + ":" + index + ":" + String(url || "");
+          function historyEntryVideoUrls(entry) {
+            const urls = Array.isArray(entry?.outputMediaUrls) ? entry.outputMediaUrls : [];
+            return urls.filter((url) => /\.(mp4|mov|webm|m4v)(\?|#|$)/i.test(String(url || "")));
           }
 
           function setHistoryEmpty(message) {
@@ -2769,14 +2852,46 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             historyList.append(empty);
           }
 
+          // ---- right rail: every asset this session produced, derived from the chat ----
+          function syncSessionAssets() {
+            const items = [];
+            for (let i = chatTurns.length - 1; i >= 0; i--) {
+              const turn = chatTurns[i];
+              if (turn.role !== "assistant") continue;
+              if (turn.kind === "media" && turn.url) {
+                items.push({
+                  key: turn.id,
+                  kind: "output",
+                  mediaKind: turn.mediaKind === "video" ? "video" : "image",
+                  url: turn.url,
+                  jobId: turn.jobId || "",
+                  title: turn.prompt || turn.note || (turn.mediaKind === "video" ? "Video" : "Image"),
+                  createdAt: turn.at
+                });
+              } else if (turn.kind === "pending") {
+                items.push({
+                  key: turn.id,
+                  kind: "pending",
+                  jobId: turn.jobId || "",
+                  title: turn.prompt || "Working…",
+                  status: turn.label || "",
+                  createdAt: turn.at
+                });
+              }
+            }
+            inpaintHistoryItems = items;
+            renderInpaintHistory();
+          }
+
           function renderInpaintHistory() {
             historyList.innerHTML = "";
-            const visible = inpaintHistoryItems.filter((item) => !hiddenInpaintHistoryKeys.has(item.key));
-            if (!visible.length) {
-              setHistoryEmpty("No inpaint outputs yet.");
+            if (!inpaintHistoryItems.length) {
+              setHistoryEmpty(resolveTracer()
+                ? "Nothing in this session yet. Send a message to create your first image."
+                : "New session — outputs land here as you chat.");
               return;
             }
-            for (const item of visible) {
+            for (const item of inpaintHistoryItems) {
               const row = document.createElement("div");
               row.className = "custom-inpaint-history-item";
               row.dataset.historyKey = item.key;
@@ -2785,158 +2900,83 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               if (item.kind === "pending") {
                 thumbButton = document.createElement("div");
                 thumbButton.className = "custom-inpaint-history-generating";
-                thumbButton.setAttribute("aria-label", "Image edit generating");
+                thumbButton.setAttribute("aria-label", "Generating");
                 thumbButton.setAttribute("role", "img");
               } else {
                 thumbButton = document.createElement("button");
                 thumbButton.type = "button";
                 thumbButton.className = "custom-inpaint-history-thumb-button";
                 thumbButton.dataset.historyPreview = item.key;
-                thumbButton.setAttribute("aria-label", "View inpaint output");
-                const thumb = document.createElement("img");
-                thumb.className = "custom-inpaint-history-thumb";
-                thumb.src = item.url;
-                thumb.alt = "Image edit output";
-                thumb.loading = "lazy";
-                thumbButton.append(thumb);
+                thumbButton.setAttribute("aria-label", "Jump to this message");
+                if (item.mediaKind === "video") {
+                  const badge = document.createElement("span");
+                  badge.className = "custom-inpaint-history-thumb custom-inpaint-history-videothumb";
+                  badge.textContent = "▶";
+                  thumbButton.append(badge);
+                } else {
+                  const thumb = document.createElement("img");
+                  thumb.className = "custom-inpaint-history-thumb";
+                  thumb.src = item.url;
+                  thumb.alt = "";
+                  thumb.loading = "lazy";
+                  thumbButton.append(thumb);
+                }
               }
               const meta = document.createElement("div");
               meta.className = "custom-inpaint-history-meta";
               const title = document.createElement("div");
               title.className = "custom-inpaint-history-title";
-              title.textContent = item.kind === "pending"
-                ? "Generating inpaint"
-                : item.kind === "source"
-                ? (item.origin === "generated" ? "Generated starting image"
-                  : item.origin === "upload" ? "Uploaded starting image"
-                  : "Starting image")
-                : (item.createdAt ? new Date(item.createdAt).toLocaleString() : "Image edit output");
-              if (item.kind === "pending") {
-                const subtitle = document.createElement("div");
-                subtitle.className = "custom-inpaint-history-subtitle";
-                const progress = Number(item.progress || 0);
-                subtitle.textContent = "Job " + (item.status || "queued") + (progress > 0 ? " · " + Math.round(progress * 100) + "%" : "");
-                meta.append(title, subtitle);
-              } else if (item.kind === "source") {
-                const subtitle = document.createElement("div");
-                subtitle.className = "custom-inpaint-history-subtitle";
-                subtitle.textContent = "Where you started" + (item.createdAt ? " · " + new Date(item.createdAt).toLocaleString() : "");
-                meta.append(title, subtitle);
-              } else {
-                meta.append(title);
-              }
+              title.textContent = item.title;
+              title.title = item.title;
+              const subtitle = document.createElement("div");
+              subtitle.className = "custom-inpaint-history-subtitle";
+              subtitle.textContent = item.kind === "pending"
+                ? (item.status || "Working…")
+                : (item.mediaKind === "video" ? "Video" : "Image") + (item.createdAt ? " · " + relTimeShort(item.createdAt) : "");
+              meta.append(title, subtitle);
               const actions = document.createElement("div");
               actions.className = "custom-inpaint-history-actions";
               if (item.kind === "pending") {
-                const check = document.createElement("button");
-                check.type = "button";
-                check.className = "custom-inpaint-history-check";
-                check.dataset.historyCheck = item.jobId || "";
-                check.textContent = "Check Status";
-                actions.append(check);
+                if (item.jobId) {
+                  const check = document.createElement("button");
+                  check.type = "button";
+                  check.className = "custom-inpaint-history-check";
+                  check.dataset.historyCheck = item.jobId;
+                  check.textContent = "Check Status";
+                  actions.append(check);
+                }
               } else {
                 const download = document.createElement("a");
                 download.className = "custom-inpaint-history-icon";
                 download.href = item.url;
                 download.target = "_blank";
                 download.rel = "noopener noreferrer";
-                download.download = imageDownloadName("inpaint-history", item.createdAt);
-                download.setAttribute("aria-label", "Download inpaint output");
+                download.download = imageDownloadName(item.mediaKind === "video" ? "vidfarm-video" : "vidfarm-image", item.createdAt);
+                download.setAttribute("aria-label", "Download");
                 download.setAttribute("title", "Download");
                 download.innerHTML = '<svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 3v9"></path><path d="m6.5 8.5 3.5 3.5 3.5-3.5"></path><path d="M4 16h12"></path></svg>';
                 const copy = document.createElement("button");
                 copy.type = "button";
                 copy.className = "custom-inpaint-history-icon";
                 copy.dataset.historyCopy = item.key;
-                copy.setAttribute("aria-label", "Copy inpaint output URL");
+                copy.setAttribute("aria-label", "Copy the file URL");
                 copy.setAttribute("title", "Copy URL");
                 copy.innerHTML = '<svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8.4 11.6a3.2 3.2 0 0 0 4.5 0l2.2-2.2a3.2 3.2 0 0 0-4.5-4.5L9.4 6.1"></path><path d="M11.6 8.4a3.2 3.2 0 0 0-4.5 0L4.9 10.6a3.2 3.2 0 0 0 4.5 4.5l1.2-1.2"></path></svg>';
                 const save = document.createElement("button");
                 save.type = "button";
                 save.className = "custom-inpaint-history-icon";
                 save.dataset.historySave = item.key;
-                save.setAttribute("aria-label", "Save this output to My Files");
-                save.setAttribute("title", "Save to Files");
+                save.setAttribute("aria-label", "Save to My Files");
+                save.setAttribute("title", "Save to My Files");
                 save.innerHTML = '<svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 4h8l2 2v10H5z"></path><path d="M8 4v4h4V4"></path><path d="M8 12h4"></path></svg>';
                 actions.append(download, copy, save);
               }
-              const remove = document.createElement("button");
-              remove.type = "button";
-              remove.className = "custom-inpaint-history-icon";
-              remove.dataset.historyRemove = item.key;
-              remove.setAttribute("aria-label", "Remove inpaint output from history strip");
-              remove.setAttribute("title", "Remove");
-              remove.innerHTML = '<svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 5l10 10"></path><path d="M15 5 5 15"></path></svg>';
-              actions.append(remove);
               meta.append(actions);
-              const confirm = document.createElement("div");
-              confirm.className = "custom-inpaint-history-popconfirm";
-              confirm.hidden = true;
-              confirm.dataset.historyConfirm = item.key;
-              const confirmText = document.createElement("p");
-              confirmText.textContent = "Remove from this history strip?";
-              const confirmActions = document.createElement("div");
-              confirmActions.className = "custom-inpaint-history-popconfirm-actions";
-              const cancel = document.createElement("button");
-              cancel.type = "button";
-              cancel.dataset.historyCancel = item.key;
-              cancel.textContent = "Cancel";
-              const confirmRemove = document.createElement("button");
-              confirmRemove.type = "button";
-              confirmRemove.dataset.historyConfirmRemove = item.key;
-              confirmRemove.dataset.danger = "true";
-              confirmRemove.textContent = "Remove";
-              confirmActions.append(cancel, confirmRemove);
-              confirm.append(confirmText, confirmActions);
-              row.append(thumbButton, meta, confirm);
+              row.append(thumbButton, meta);
               historyList.append(row);
             }
           }
 
-          function closeInpaintHistoryConfirms(exceptKey) {
-            historyList.querySelectorAll("[data-history-confirm]").forEach((entry) => {
-              if (!(entry instanceof HTMLElement)) return;
-              entry.hidden = exceptKey ? entry.dataset.historyConfirm !== exceptKey : true;
-            });
-          }
-
-          function extractInpaintHistoryItems(entries) {
-            const items = [];
-            const seen = new Set();
-            for (const entry of Array.isArray(entries) ? entries : []) {
-              if (!isInpaintHistoryEntry(entry)) continue;
-              const linkedJob = entry?.linkedJob || null;
-              if (linkedJob && isPendingJobStatus(linkedJob.status)) {
-                const pending = makePendingInpaintHistoryItem({
-                  job_id: linkedJob.job_id,
-                  status: linkedJob.status,
-                  progress: linkedJob.progress,
-                  created_at: linkedJob.created_at || entry.createdAt,
-                  updated_at: linkedJob.updated_at || entry.createdAt
-                });
-                if (pending && !seen.has(pending.key)) {
-                  seen.add(pending.key);
-                  items.push(pending);
-                }
-                continue;
-              }
-              historyEntryUrls(entry).forEach((rawUrl, index) => {
-                const url = absoluteUrl(rawUrl);
-                const key = historyItemKey(entry, url, index);
-                if (seen.has(key)) return;
-                seen.add(key);
-                items.push({
-                  key,
-                  kind: "output",
-                  jobId: String(entry?.jobId || entry?.job_id || entry?.linkedJob?.job_id || ""),
-                  url,
-                  createdAt: String(entry.createdAt || new Date().toISOString())
-                });
-              });
-            }
-            return items;
-          }
-
           async function copyText(value) {
             if (navigator.clipboard && window.isSecureContext) {
               try {
@@ -2960,36 +3000,121 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             return copied;
           }
 
-          async function loadInpaintHistory() {
+          // ---- session restore -----------------------------------------------------
+          // A session IS its chat. Every turn was a POST to one of the four primitive
+          // routes, and the api-call history stores each request body — including the
+          // the chat_message field we attach purely so the transcript rebuilds verbatim
+          // (the API strips unknown envelope fields, so it never reaches a provider).
+          function userTextFromEntry(entry, kind) {
+            const body = (entry && entry.request && entry.request.body) || {};
+            if (typeof body.chat_message === "string" && body.chat_message.trim()) return body.chat_message.trim();
+            // Fallback for turns made before chat_message existed: recover what we can
+            // from the prompt/instruction we composed.
+            const payload = body.payload || {};
+            const raw = String(payload.prompt || payload.instruction || "");
+            if (!raw) return kind === "video" ? "(video)" : "(edit)";
+            const latest = raw.split("LATEST INSTRUCTION: ").pop();
+            if (latest && latest !== raw) return latest.trim();
+            const edited = raw.split("Edit the SOURCE IMAGE as follows: ")[1];
+            if (edited) return edited.split(" Keep everything else about the source image")[0].trim();
+            const whole = raw.split("Whole image prompt: ")[1];
+            if (whole) return whole.split(". Apply this only as guidance")[0].trim();
+            return raw.length > 240 ? raw.slice(0, 240) + "…" : raw;
+          }
+
+          function turnsFromHistoryEntries(entries) {
+            const rows = (Array.isArray(entries) ? entries : [])
+              .map((entry) => ({ entry, kind: chatEntryKind(entry) }))
+              .filter((row) => row.kind)
+              .sort((a, b) => Date.parse(a.entry.createdAt || 0) - Date.parse(b.entry.createdAt || 0));
+            const turns = [];
+            const seenJobs = new Set();
+            for (const row of rows) {
+              const entry = row.entry;
+              const jobId = String(entry.jobId || (entry.linkedJob && entry.linkedJob.job_id) || "");
+              if (jobId && seenJobs.has(jobId)) continue;
+              if (jobId) seenJobs.add(jobId);
+              const body = (entry.request && entry.request.body) || {};
+              const text = userTextFromEntry(entry, row.kind);
+              const at = String(entry.createdAt || new Date().toISOString());
+              turns.push({
+                id: nextTurnId(), at, role: "user", kind: "text", text,
+                mode: row.kind === "video" ? "video" : "image",
+                masked: row.kind === "inpaint" || body.chat_masked === true,
+                isEdit: row.kind === "edit" || row.kind === "inpaint"
+              });
+              const status = String((entry.linkedJob && entry.linkedJob.status) || "");
+              const urls = row.kind === "video" ? historyEntryVideoUrls(entry) : historyEntryUrls(entry);
+              if (urls.length) {
+                let url = "";
+                try { url = absoluteUrl(urls[0]); } catch { url = String(urls[0]); }
+                turns.push({
+                  id: nextTurnId(), at, role: "assistant", kind: "media",
+                  mediaKind: row.kind === "video" ? "video" : "image",
+                  url, jobId, prompt: text
+                });
+              } else if (status === "failed" || status === "cancelled") {
+                turns.push({ id: nextTurnId(), at, role: "assistant", kind: "error", text: "That job " + status + "." });
+              } else if (isPendingJobStatus(status)) {
+                turns.push({
+                  id: nextTurnId(), at, role: "assistant", kind: "pending", jobId, prompt: text,
+                  label: "Still running (" + status + ") — use Check Status."
+                });
+              }
+            }
+            return turns;
+          }
+
+          // Rebuild the whole conversation for the active tracer from the server.
+          async function restoreSession(options) {
             const tracer = resolveTracer();
-            // Brand-new (unnamed) session: nothing on the server yet — just show any
-            // local starting image, without minting a random tracer.
             if (!tracer) {
-              inpaintHistoryItems = [];
-              reinjectSourceHistoryItems();
-              renderInpaintHistory();
+              // Brand-new unnamed session: nothing on the server yet.
+              renderChat();
               return;
             }
+            // Never stomp on a turn that is mid-flight locally.
+            if (genBusy || activeTurnId) { syncSessionAssets(); return; }
             historyRefresh.disabled = true;
             try {
               const endpoint = new URL("/job-runs/history", window.location.origin);
-              endpoint.searchParams.set("limit", "120");
-              endpoint.searchParams.set("template_id", "primitive:image_inpaint");
+              endpoint.searchParams.set("limit", "250");
               endpoint.searchParams.set("tracer", tracer);
               const response = await fetch(endpoint, { credentials: "same-origin" });
               const payload = await parseJsonResponse(response);
-              if (!response.ok || (payload && payload.error)) throw new Error(payload.error || "Unable to load inpaint history.");
-              inpaintHistoryItems = extractInpaintHistoryItems(payload.entries);
-              reinjectSourceHistoryItems();
-              renderInpaintHistory();
+              if (!response.ok || (payload && payload.error)) throw new Error(payload.error || "Unable to load this session.");
+              const turns = turnsFromHistoryEntries(payload.entries);
+              // A refresh must never LOSE messages: run history can lag a job by a moment,
+              // and a fresh upload-only session has nothing on the server at all. Only a
+              // deliberate session switch (replaceEmpty) may shrink the transcript.
+              if (turns.length < chatTurns.length && !(options && options.replaceEmpty)) {
+                renderChat();
+                return;
+              }
+              chatTurns = turns;
+              activeTurnId = "";
+              // The newest IMAGE in the restored conversation becomes the paint surface
+              // and the source of the next edit.
+              let latest = "";
+              for (let i = turns.length - 1; i >= 0; i--) {
+                const turn = turns[i];
+                if (turn.kind === "media" && turn.mediaKind === "image" && turn.url) { latest = turn.url; break; }
+              }
+              if (latest) adoptLatestImage(latest);
+              else renderChat();
             } catch (error) {
               console.error(error);
-              setHistoryEmpty(error instanceof Error ? error.message : "Unable to load inpaint history.");
+              setStatus(error instanceof Error ? error.message : "Unable to load this session.", "error");
             } finally {
               historyRefresh.disabled = false;
             }
           }
 
+          // Legacy call sites (job polling, submit) refresh the session through this name.
+          async function loadInpaintHistory() {
+            await restoreSession();
+          }
+
           async function checkInpaintJobStatus(jobId, button) {
             if (!jobId) return null;
             if (button instanceof HTMLButtonElement) {
@@ -3035,6 +3160,7 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
 
           async function pollInpaintJob(jobId) {
             for (let attempt = 0; attempt < 90; attempt += 1) {
+              throwIfStopped();
               const response = await fetch("/api/v1/primitives/image_inpaint/jobs/" + encodeURIComponent(jobId), {
                 credentials: "same-origin"
               });
@@ -3051,6 +3177,7 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
                 return outputUrl;
               }
               upsertInpaintHistoryItem(makePendingInpaintHistoryItem(payload));
+              updatePendingLabel(activeTurnId, "Applying the masked edit (" + (payload.status || "running") + ")\u2026");
               setStatus("Image edit job " + jobId + " is " + (payload.status || "running") + ".", "");
               await new Promise((resolve) => window.setTimeout(resolve, attempt < 8 ? 1500 : 3000));
             }
@@ -3059,8 +3186,12 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             return null;
           }
 
-          async function submitInpaintJob() {
-            if (!sourceImageUrl || inpaintSubmit.disabled) {
+          async function submitInpaintJob(options) {
+            const extraRefs = (options && Array.isArray(options.extraRefs)) ? options.extraRefs : [];
+            // The user's own words, stored alongside the request so the chat can be
+            // rebuilt later without un-parsing the composed instruction.
+            const chatMessage = (options && options.chatMessage) ? String(options.chatMessage) : inpaintGlobalPrompt.value.trim();
+            if (!sourceImageUrl) {
               setStatus("Upload a source image first.", "error");
               return;
             }
@@ -3075,11 +3206,12 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               setStatus("Add a replacement prompt for " + missingPromptColor.color.toUpperCase() + ".", "error");
               return;
             }
-            const instruction = buildInpaintInstruction();
-            if (!instruction) {
+            const builtInstruction = buildInpaintInstruction();
+            if (!builtInstruction) {
               setStatus("Add a replacement prompt for at least one color.", "error");
               return;
             }
+            const instruction = builtInstruction;
             setSubmitLoading(true);
             uploadButton.disabled = true;
             setStatus("Uploading masks...", "");
@@ -3095,11 +3227,14 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
                 headers: { "content-type": "application/json" },
                 body: JSON.stringify({
                   tracer,
+                  chat_message: chatMessage,
+                  chat_mode: "image",
+                  chat_masked: true,
                   payload: {
                     source_image_url: sourceImageUrl,
                     mask_url: absoluteUrl(maskUrl),
                     instruction,
-                    reference_attachments: inpaintAttachments.map((attachment) => attachment.url),
+                    reference_attachments: inpaintAttachments.map((attachment) => attachment.url).concat(extraRefs),
                     ...(inpaintProviderSelect.value ? { provider: inpaintProviderSelect.value } : {}),
                     size: "auto",
                     ...(getInpaintAspectRatio() ? { aspect_ratio: getInpaintAspectRatio() } : {}),
@@ -3110,13 +3245,19 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               const payload = await parseJsonResponse(response);
               if (!response.ok) throw new Error(payload.error || "Unable to create image edit job.");
               setStatus("Image edit job " + (payload.job_id || "") + " started.", "success");
+              activeJob = { kind: "image_inpaint", jobId: String(payload.job_id || "") };
               upsertInpaintHistoryItem(makePendingInpaintHistoryItem(payload));
               await pollInpaintJob(payload.job_id);
+              if (activeTurnId) {
+                updatePendingLabel(activeTurnId, "Still running \u2014 use Check Status in this session\u2019s history.");
+                activeTurnId = "";
+              }
               await loadInpaintHistory();
               void loadTracerSessions();
             } catch (error) {
               console.error(error);
               setStatus(error instanceof Error ? error.message : "Unable to create image edit.", "error");
+              throw error;
             } finally {
               setSubmitLoading(false);
               // Respect the post-generate lock — don't re-enable source upload if the
@@ -3133,25 +3274,23 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
           historyRefresh.addEventListener("click", () => {
             void loadInpaintHistory();
           });
-          historyList.addEventListener("pointerdown", (event) => {
-            const target = event.target;
-            if (target instanceof Element && target.closest("[data-history-confirm]")) {
-              event.stopPropagation();
-            }
-          });
           historyList.addEventListener("click", (event) => {
             const target = event.target;
             if (!(target instanceof Element)) return;
-            const confirmPopover = target.closest("[data-history-confirm]");
-            if (confirmPopover instanceof HTMLElement) {
-              event.stopPropagation();
-            }
+            // The rail mirrors the chat, so its thumbnail scrolls the feed to that turn
+            // instead of opening a second, competing viewer.
             const previewButton = target.closest("[data-history-preview]");
             if (previewButton instanceof HTMLElement) {
               const key = previewButton.dataset.historyPreview || "";
+              const row = chatFeed.querySelector('[data-turn-id="' + CSS.escape(key) + '"]');
+              if (row instanceof HTMLElement) {
+                row.scrollIntoView({ behavior: "smooth", block: "center" });
+                row.classList.add("is-flash");
+                window.setTimeout(() => row.classList.remove("is-flash"), 1200);
+                return;
+              }
               const item = inpaintHistoryItems.find((entry) => entry.key === key);
-              if (!item) return;
-              openImagePreview(item.url, item.createdAt ? new Date(item.createdAt).toLocaleString() : "Image edit output", imageDownloadName("image-edit-history", item.createdAt));
+              if (item && item.url) openImagePreview(item.url, item.title, imageDownloadName("vidfarm-output", item.createdAt), item.mediaKind);
               return;
             }
             const copyButton = target.closest("[data-history-copy]");
@@ -3169,40 +3308,12 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             if (saveButton instanceof HTMLElement) {
               const key = saveButton.dataset.historySave || "";
               const item = inpaintHistoryItems.find((entry) => entry.key === key);
-              if (item && item.url) saveMediaToFiles(item.url, imageDownloadName("inpaint-output", item.createdAt));
+              if (item && item.url) saveMediaToFiles(item.url, imageDownloadName("vidfarm-output", item.createdAt));
               return;
             }
             const checkButton = target.closest("[data-history-check]");
             if (checkButton instanceof HTMLButtonElement) {
               void checkInpaintJobStatus(checkButton.dataset.historyCheck || "", checkButton);
-              return;
-            }
-            const removeButton = target.closest("[data-history-remove]");
-            if (removeButton instanceof HTMLElement) {
-              const key = removeButton.dataset.historyRemove || "";
-              const confirm = historyList.querySelector('[data-history-confirm="' + CSS.escape(key) + '"]');
-              const shouldOpen = !(confirm instanceof HTMLElement) || confirm.hidden;
-              closeInpaintHistoryConfirms();
-              if (confirm instanceof HTMLElement) {
-                confirm.hidden = !shouldOpen;
-              }
-              removeButton.setAttribute("aria-expanded", shouldOpen ? "true" : "false");
-              return;
-            }
-            const cancelButton = target.closest("[data-history-cancel]");
-            if (cancelButton instanceof HTMLElement) {
-              const confirm = cancelButton.closest("[data-history-confirm]");
-              if (confirm instanceof HTMLElement) confirm.hidden = true;
-              return;
-            }
-            const confirmRemove = target.closest("[data-history-confirm-remove]");
-            if (confirmRemove instanceof HTMLElement) {
-              const key = confirmRemove.dataset.historyConfirmRemove || "";
-              if (key) {
-                hiddenInpaintHistoryKeys.add(key);
-                renderInpaintHistory();
-              }
-              return;
             }
           });
           resultOpenButton.addEventListener("click", () => {
@@ -3272,18 +3383,22 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
           inpaintGlobalPrompt.addEventListener("paste", (event) => {
             handleAttachmentPaste(event, "global");
           });
-          inpaintUndo.addEventListener("click", () => {
+          function undoStroke() {
             const stroke = inpaintStrokes.pop();
             if (stroke) redoStrokes.push(stroke);
             redrawInpaintMask();
+            syncMaskUi();
             setStatus("", "");
-          });
-          inpaintRedo.addEventListener("click", () => {
+          }
+          function redoStroke() {
             const stroke = redoStrokes.pop();
             if (stroke) inpaintStrokes.push(stroke);
             redrawInpaintMask();
+            syncMaskUi();
             setStatus("", "");
-          });
+          }
+          inpaintUndo.addEventListener("click", undoStroke);
+          inpaintRedo.addEventListener("click", redoStroke);
           inpaintClear.addEventListener("click", () => {
             resetMask();
             setStatus("", "");
@@ -3349,7 +3464,7 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             hideBrushCursor();
           });
           inpaintSubmit.addEventListener("click", () => {
-            void submitInpaintJob();
+            submitInpaintJob().catch(() => {});
           });
           function openSettingsModal() {
             settingsPopover.hidden = false;
@@ -3366,6 +3481,20 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             if (settingsPopover.hidden) openSettingsModal(); else closeSettingsModal();
           });
           if (settingsClose) settingsClose.addEventListener("click", () => closeSettingsModal());
+
+          // Copy chat ID — the session tracer IS this chat's thread id (it's what
+          // /job-runs/history groups on, what ?tracer= reopens, and what the past-
+          // sessions rail keys off). A still-unnamed session mints its id here so
+          // there is always something concrete to copy/share.
+          const copyChatButton = document.querySelector("[data-custom-inpaint-copy-chat]");
+          if (copyChatButton instanceof HTMLButtonElement) {
+            copyChatButton.addEventListener("click", () => {
+              const tracer = resolveTracer() || getTracerValue();
+              void copyText(tracer).then((copied) => {
+                setStatus(copied ? "Chat ID copied — " + tracer : "Chat ID: " + tracer, copied ? "success" : "");
+              });
+            });
+          }
           settingsPopover.addEventListener("click", (event) => {
             if (event.target === settingsPopover) closeSettingsModal();
           });
@@ -3384,16 +3513,6 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             if (sessionsBackdrop) sessionsBackdrop.hidden = true;
             if (settingsPopover.hidden) document.body.style.overflow = "";
           }
-          function isImageSessionEntry(entry) {
-            const templateId = String(entry && entry.linkedJob && (entry.linkedJob.template_id || entry.linkedJob.templateId) || "").toLowerCase();
-            const path = String(entry && entry.path || "").toLowerCase();
-            return templateId.includes("image_inpaint")
-              || templateId.includes("image_generate")
-              || path.includes("/primitives/images/inpaint")
-              || path.includes("/primitives/image_inpaint")
-              || path.includes("/primitives/images/generate")
-              || path.includes("/primitives/image_generate");
-          }
           function relTimeShort(value) {
             const then = Date.parse(value || 0);
             if (!then) return "";
@@ -3454,13 +3573,14 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               meta.className = "rk-ip-session-meta";
               const title = document.createElement("div");
               title.className = "rk-ip-session-title";
-              title.textContent = isImage ? (group.name || "Standalone image") : group.tracer;
+              title.textContent = isImage ? (group.name || "Standalone image") : (group.title || group.tracer);
+              title.title = isImage ? "" : (group.title ? group.title + " (" + group.tracer + ")" : group.tracer);
               const sub = document.createElement("div");
               sub.className = "rk-ip-session-sub";
               const when = relTimeShort(group.createdAt);
               sub.textContent = isImage
-                ? "Standalone image — tap to edit" + (when ? " · " + when : "")
-                : (group.count ? group.count + " image" + (group.count === 1 ? "" : "s") : "session") + (when ? " · " + when : "");
+                ? "Standalone image — tap to start a chat from it" + (when ? " · " + when : "")
+                : (group.count ? group.count + " message" + (group.count === 1 ? "" : "s") : "session") + (when ? " · " + when : "");
               meta.append(title, sub);
               row.append(meta);
               sessionsList.append(row);
@@ -3477,16 +3597,17 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               const payload = await parseJsonResponse(response);
               if (!response.ok || (payload && payload.error)) throw new Error((payload && payload.error) || "Unable to load sessions.");
               const groups = new Map();
-              // Past image gens that carry NO session tracer (e.g. one-off generations
-              // from other surfaces) can't be reopened as a session, so surface each as
-              // a standalone image the user can load fresh into a new inpaint session.
+              // Past one-off image gens with NO session tracer can't be reopened as a
+              // conversation, so each is offered as a standalone image to start one from.
               const loose = [];
               const looseSeen = new Set();
               for (const entry of Array.isArray(payload.entries) ? payload.entries : []) {
-                if (!isImageSessionEntry(entry)) continue;
-                const urls = historyEntryUrls(entry);
+                const kind = chatEntryKind(entry);
+                if (!kind) continue;
+                const urls = kind === "video" ? historyEntryVideoUrls(entry) : historyEntryUrls(entry);
                 const tracer = String(entry.tracer || "").trim();
                 if (!tracer) {
+                  if (kind === "video") continue;
                   for (const raw of urls) {
                     let url = "";
                     try { url = absoluteUrl(raw); } catch { continue; }
@@ -3497,9 +3618,16 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
                   continue;
                 }
                 let group = groups.get(tracer);
-                if (!group) { group = { kind: "session", tracer, thumb: "", count: 0, createdAt: entry.createdAt || "" }; groups.set(tracer, group); }
-                if (!group.thumb && urls[0]) { try { group.thumb = absoluteUrl(urls[0]); } catch {} }
-                group.count += urls.length;
+                if (!group) { group = { kind: "session", tracer, thumb: "", title: "", count: 0, createdAt: entry.createdAt || "", firstAt: entry.createdAt || "" }; groups.set(tracer, group); }
+                group.count += 1;
+                // Newest image in the session is its cover; oldest message is its name.
+                if (kind !== "video" && urls[0] && Date.parse(entry.createdAt || 0) >= Date.parse(group.createdAt || 0)) {
+                  try { group.thumb = absoluteUrl(urls[0]); } catch {}
+                }
+                if (!group.title || Date.parse(entry.createdAt || 0) <= Date.parse(group.firstAt || 0)) {
+                  const text = userTextFromEntry(entry, kind);
+                  if (text) { group.title = text.length > 60 ? text.slice(0, 60) + "…" : text; group.firstAt = entry.createdAt || group.firstAt; }
+                }
                 if (Date.parse(entry.createdAt || 0) > Date.parse(group.createdAt || 0)) group.createdAt = entry.createdAt;
               }
               const list = Array.from(groups.values()).concat(loose)
@@ -3512,7 +3640,7 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
               sessionsLoading = false;
             }
           }
-          function switchToTracer(tracer, sourceUrl) {
+          async function switchToTracer(tracer) {
             const value = String(tracer || "").trim();
             if (!value) return;
             clearInpaintUrlParams();
@@ -3521,16 +3649,14 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             tracerInput.value = value;
             tracerAutoPending = false;
             closeSessionsPanel();
-            void loadInpaintHistory();
+            setStatus("Opening " + value + "…", "");
+            // Rebuild the whole conversation — messages, edits, outputs — and put the
+            // newest image back under the brush.
+            await restoreSession({ replaceEmpty: true });
             void loadTracerSessions();
-            // Load this session's latest image straight onto the canvas so it's ready
-            // to paint/refine — reopening a session with a blank stage is useless.
-            if (sourceUrl) {
-              loadSourceUrl(sourceUrl, "history");
-              setStatus("Opened session " + value + " — paint mask regions to keep editing.", "success");
-            } else {
-              setStatus("Opened session " + value + ".", "");
-            }
+            setStatus(chatTurns.length
+              ? "Session restored — keep chatting to pick up where you left off."
+              : "Opened " + value + " — no messages in it yet.", chatTurns.length ? "success" : "");
           }
           // A past image gen with no session tracer: start a brand-new session and drop
           // that image onto the editor as the source so it can be edited immediately.
@@ -3545,7 +3671,7 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             closeSessionsPanel();
             loadSourceUrl(value, "history");
             void loadTracerSessions();
-            setStatus("New session started from that image — paint mask regions to edit it.", "success");
+            setStatus("New session started from that image — describe an edit, or paint a mask first.", "success");
           }
           if (sessionsToggle) sessionsToggle.addEventListener("click", () => {
             if (sessionsPanel && sessionsPanel.classList.contains("is-open")) closeSessionsPanel(); else openSessionsPanel();
@@ -3562,19 +3688,10 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             }
             const row = target.closest("[data-session-tracer]");
             if (row instanceof HTMLElement && row.dataset.sessionTracer) {
-              const thumb = row.querySelector("img.rk-ip-session-thumb");
-              switchToTracer(row.dataset.sessionTracer, thumb instanceof HTMLImageElement ? thumb.src : "");
+              void switchToTracer(row.dataset.sessionTracer);
             }
           });
 
-          window.addEventListener("click", (event) => {
-            const target = event.target;
-            if (!(target instanceof Node)) return;
-            const isHistoryConfirmTarget = target instanceof Element && Boolean(target.closest("[data-history-confirm]"));
-            if (!historyList.contains(target) && !isHistoryConfirmTarget) {
-              closeInpaintHistoryConfirms();
-            }
-          });
           window.addEventListener("resize", () => syncInpaintCanvasSize());
           window.addEventListener("keydown", (event) => {
             if (event.key !== "Escape") return;
@@ -3583,30 +3700,93 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             if (sessionsPanel && sessionsPanel.classList.contains("is-open")) { closeSessionsPanel(); return; }
           });
 
-          // ===== text-to-image "Create Image" empty-state composer =====================
+          // ===== chat composer + feed ================================================
           // Layered on top of the legacy inpaint logic; reuses its in-scope helpers
-          // (setStatus, loadSourceUrl, uploadTemporaryBlob, getTracerValue, parseJsonResponse,
-          // absoluteUrl, extractOutputUrl, inpaintProviderSelect). A generated image becomes
-          // the editable SOURCE so you can immediately paint to refine it.
+          // (setStatus, uploadTemporaryBlob, getTracerValue, parseJsonResponse,
+          // absoluteUrl, extractOutputUrl, inpaintProviderSelect, submitInpaintJob).
+          // Every finished image becomes the newest image, which is both the paint
+          // surface and the source the NEXT message edits.
           var genPrompt = document.getElementById('rk-ip-genprompt');
           var genClip = document.getElementById('rk-ip-genclip');
           var genSend = document.getElementById('rk-ip-gensend');
           var genRefsEl = document.getElementById('rk-ip-genrefs');
           var genStatusEl = document.getElementById('rk-ip-genstatus');
-          var genWrap = document.getElementById('rk-ip-gen');
+          var genWrap = composerEl;
           var GEN_SEND_HTML = genSend ? genSend.innerHTML : '';
           var genRefs = [];
           var genBusy = false;
 
-          function setGenStatus(m, t){ if(!genStatusEl) return; genStatusEl.textContent = m || ''; genStatusEl.setAttribute('data-tone', t || ''); }
-          function canGenNew(){ return Boolean((genPrompt && genPrompt.value || '').trim()) && !genBusy; }
+          // One status line for the whole surface — the composer's.
+          function setGenStatus(m, t){ setStatus(m, t); }
+          function maskHasInstruction(){
+            return inpaintStrokes.length > 0 && inpaintMaskColors.some(function(entry){ return String(entry.prompt || '').trim(); });
+          }
+          function canGenNew(){ return !genBusy && (Boolean((genPrompt && genPrompt.value || '').trim()) || maskHasInstruction()); }
+          // While a turn is in flight the composer stays fully usable — you can keep
+          // typing the next message, attach references, and scroll the history. The send
+          // button turns into Stop, which cancels the running job.
           function syncGenSend(){
-            if(genPrompt) genPrompt.disabled = genBusy;
-            if(genClip) genClip.disabled = genBusy;
             if(!genSend) return;
+            if(genBusy){
+              genSend.disabled = false;
+              genSend.dataset.mode = 'stop';
+              genSend.setAttribute('aria-label', 'Stop generating');
+              genSend.setAttribute('title', 'Stop generating');
+              genSend.innerHTML = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\"><rect x=\"5\" y=\"5\" width=\"10\" height=\"10\" rx=\"2\"/></svg>";
+              return;
+            }
+            genSend.dataset.mode = 'send';
+            genSend.setAttribute('aria-label', 'Send');
+            genSend.setAttribute('title', 'Send');
             genSend.disabled = !canGenNew();
-            genSend.classList.toggle('is-busy', genBusy);
-            genSend.innerHTML = genBusy ? '<span class="rk-ip-gen-spin" aria-hidden="true"></span>' : GEN_SEND_HTML;
+            genSend.innerHTML = GEN_SEND_HTML;
+          }
+          function setGenBusy(value){
+            genBusy = Boolean(value);
+            composerEl.classList.toggle('is-busy', genBusy);
+            syncGenSend();
+          }
+
+          // ---- stop --------------------------------------------------------------
+          // Stop aborts the client poll AND best-effort cancels the job server-side so a
+          // long video render stops burning provider time.
+          var activeJob = { kind: '', jobId: '' };
+          var stopRequested = false;
+          function stopError(){ var e = new Error('__vidfarm_stopped__'); e.stopped = true; return e; }
+          function throwIfStopped(){ if(stopRequested) throw stopError(); }
+          function stopActiveTurn(){
+            if(!genBusy || stopRequested) return;
+            stopRequested = true;
+            setStatus('Stopping…', '');
+            if(activeTurnId) updatePendingLabel(activeTurnId, 'Stopping…');
+            if(activeJob.kind && activeJob.jobId){
+              fetch('/api/v1/primitives/' + activeJob.kind + '/jobs/' + encodeURIComponent(activeJob.jobId) + '/cancel', {
+                method: 'POST', credentials: 'same-origin'
+              }).catch(function(){});
+            }
+          }
+          function composerPlaceholder(){
+            if(!genPrompt) return;
+            genPrompt.placeholder = modeSelect.value === 'video'
+              ? (sourceImageUrl ? 'Describe the video \u2014 the newest image is used as its opening frame\u2026' : 'Describe the video you want\u2026')
+              : (sourceImageUrl ? (inpaintStrokes.length ? 'Describe the masked edit (whole-image guidance)\u2026' : 'Describe the next edit to the newest image\u2026') : 'Describe the image you want\u2026');
+          }
+          // Grows with the message up to 10 rows, then scrolls inside itself.
+          var COMPOSER_MAX_ROWS = 10;
+          function composerMaxHeight(){
+            if(!genPrompt) return 0;
+            var styles = window.getComputedStyle(genPrompt);
+            var line = parseFloat(styles.lineHeight) || 20;
+            var pad = (parseFloat(styles.paddingTop) || 0) + (parseFloat(styles.paddingBottom) || 0)
+              + (parseFloat(styles.borderTopWidth) || 0) + (parseFloat(styles.borderBottomWidth) || 0);
+            return Math.round(line * COMPOSER_MAX_ROWS + pad);
+          }
+          function autoGrowComposer(){
+            if(!genPrompt) return;
+            var max = composerMaxHeight();
+            genPrompt.style.height = 'auto';
+            genPrompt.style.height = Math.min(max, Math.max(56, genPrompt.scrollHeight)) + 'px';
+            genPrompt.style.overflowY = genPrompt.scrollHeight > max ? 'auto' : 'hidden';
           }
           function renderGenRefs(){
             if(!genRefsEl) return;
@@ -3710,28 +3890,6 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
           }
           function dtHasFiles(e){ var t = (e.dataTransfer && e.dataTransfer.types) || []; return Array.prototype.indexOf.call(t, 'Files') !== -1; }
 
-          function pollImageGenerateJob(jobId){
-            var attempt = 0;
-            function step(){
-              return fetch('/api/v1/primitives/image_generate/jobs/' + encodeURIComponent(jobId), { credentials: 'same-origin' }).then(function(r){
-                return parseJsonResponse(r).then(function(payload){
-                  if(!r.ok) throw new Error(payload.error || 'Unable to poll image job.');
-                  if(payload.status === 'failed' || payload.status === 'cancelled'){ throw new Error((payload.error && payload.error.message) || ('Image job ' + payload.status + '.')); }
-                  var out = extractOutputUrl(payload);
-                  if(payload.status === 'succeeded' || payload.status === 'complete' || out){
-                    if(!out) throw new Error('Image job completed without an output URL.');
-                    return absoluteUrl(out);
-                  }
-                  setGenStatus('Generating image (' + (payload.status || 'running') + ')\u2026', '');
-                  attempt++;
-                  if(attempt >= 90){ setGenStatus('Still running \u2014 check back shortly.', ''); return ''; }
-                  return new Promise(function(res){ setTimeout(res, attempt < 8 ? 1500 : 3000); }).then(step);
-                });
-              });
-            }
-            return step();
-          }
-
           // "character card" / "storyboard" shorthand — spell out the full layout
           // so the image model produces a reference sheet / numbered shot board
           // instead of a single picture. Snippets are shared with the AI chat +
@@ -3765,36 +3923,404 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             btn.addEventListener('click', function(){ applyGenPreset(btn.getAttribute('data-preset') || 'character-card'); });
           });
 
-          function submitGenerate(){
-            var p = expandShorthand((genPrompt && genPrompt.value || '').trim());
-            if(!p){ setGenStatus('Type a prompt to generate an image.', 'error'); if(genPrompt) genPrompt.focus(); return; }
+          // ---- chat state ----------------------------------------------------------
+          // chatTurns/activeTurnId/renderChat/addTurn/adoptLatestImage are declared with
+          // var + function declarations so the earlier legacy helpers (loadSourceUrl,
+          // applyCompletedInpaintJob, resetWorkspace) can call them safely.
+          var turnSeq = 0;
+          function nextTurnId(){ turnSeq += 1; return 't' + turnSeq; }
+          function addTurn(turn){
+            var item = Object.assign({ id: nextTurnId(), at: new Date().toISOString(), role: 'assistant' }, turn);
+            chatTurns.push(item);
+            renderChat();
+            return item;
+          }
+          function updateTurn(id, patch){
+            if(!id) return;
+            chatTurns = chatTurns.map(function(t){ return t.id === id ? Object.assign({}, t, patch) : t; });
+            renderChat();
+          }
+          // Pending labels tick every poll; patch the node in place so a full re-render
+          // never restarts a video that is playing further up the feed.
+          function updatePendingLabel(id, label){
+            if(!id) return;
+            chatTurns = chatTurns.map(function(t){ return t.id === id ? Object.assign({}, t, { label: label }) : t; });
+            var node = chatFeed.querySelector('[data-pending-id="' + id + '"]');
+            if(node) node.textContent = label;
+          }
+          function resolveActiveTurn(patch){
+            if(activeTurnId){ updateTurn(activeTurnId, patch); activeTurnId = ''; return; }
+            addTurn(Object.assign({ role: 'assistant' }, patch));
+          }
+
+          // Make the given url the newest image: the paint surface AND the source of the next edit.
+          function adoptLatestImage(url, name){
+            if(!url) return;
+            sourceImageUrl = url;
+            sourceImageName = name || sourceNameFromUrl(url);
+            sourceName.textContent = sourceImageName;
+            canvasWrap.hidden = false;
+            outputPanel.hidden = true;
+            inpaintImage.onload = function(){ syncInpaintCanvasSize(); resetMask(); };
+            inpaintImage.src = url;
+            resetMask();
+            renderChat();
+            composerPlaceholder();
+          }
+
+          // ---- feed rendering ------------------------------------------------------
+          function mediaActionsRow(turn){
+            var row = document.createElement('div');
+            row.className = 'rk-ip-media-actions';
+            var full = document.createElement('button');
+            full.type = 'button'; full.className = 'rk-ip-act'; full.dataset.ipOpen = turn.id;
+            full.setAttribute('aria-label', 'Open fullscreen'); full.title = 'Fullscreen';
+            full.innerHTML = "<svg width=\"13\" height=\"13\" viewBox=\"0 0 20 20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3h5v5\"/><path d=\"M8 17H3v-5\"/><path d=\"M17 3l-6 6\"/><path d=\"M3 17l6-6\"/></svg>";
+            var download = document.createElement('a');
+            download.className = 'rk-ip-act'; download.href = turn.url; download.target = '_blank'; download.rel = 'noopener noreferrer';
+            download.setAttribute('download', imageDownloadName(turn.mediaKind === 'video' ? 'vidfarm-video' : 'vidfarm-image', turn.at));
+            download.setAttribute('aria-label', 'Download this file'); download.title = 'Download';
+            download.innerHTML = "<svg width=\"15\" height=\"15\" viewBox=\"0 0 20 20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M10 3v9\"/><path d=\"m6.5 8.5 3.5 3.5 3.5-3.5\"/><path d=\"M4 16h12\"/></svg>";
+            var link = document.createElement('a');
+            link.className = 'rk-ip-act'; link.href = turn.url; link.target = '_blank'; link.rel = 'noopener noreferrer';
+            link.setAttribute('aria-label', 'Open the direct file URL'); link.title = 'Open direct file URL';
+            link.innerHTML = "<svg width=\"13\" height=\"13\" viewBox=\"0 0 20 20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8.6 11.4a3 3 0 0 0 4.3 0l2.4-2.4a3 3 0 1 0-4.3-4.3l-1 1\"/><path d=\"M11.4 8.6a3 3 0 0 0-4.3 0l-2.4 2.4a3 3 0 1 0 4.3 4.3l1-1\"/></svg>";
+            var copy = document.createElement('button');
+            copy.type = 'button'; copy.className = 'rk-ip-act'; copy.dataset.ipCopy = turn.id;
+            copy.setAttribute('aria-label', 'Copy the file URL'); copy.title = 'Copy URL';
+            copy.innerHTML = "<svg width=\"13\" height=\"13\" viewBox=\"0 0 20 20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8.4 11.6a3.2 3.2 0 0 0 4.5 0l2.2-2.2a3.2 3.2 0 0 0-4.5-4.5L9.4 6.1\"/><path d=\"M11.6 8.4a3.2 3.2 0 0 0-4.5 0L4.9 10.6a3.2 3.2 0 0 0 4.5 4.5l1.2-1.2\"/></svg>";
+            var save = document.createElement('button');
+            save.type = 'button'; save.className = 'rk-ip-act'; save.dataset.ipSave = turn.id;
+            save.setAttribute('aria-label', 'Save to My Files'); save.title = 'Save to My Files';
+            save.innerHTML = "<svg width=\"13\" height=\"13\" viewBox=\"0 0 20 20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 4h8l2 2v10H5z\"/><path d=\"M8 4v4h4V4\"/><path d=\"M8 12h4\"/></svg>";
+            row.append(full, download, link, copy, save);
+            return row;
+          }
+
+          function renderChat(){
+            // Detach the paint surface first — innerHTML rebuild would otherwise drop it.
+            if(paintStack.parentElement !== canvasHolder) canvasHolder.appendChild(paintStack);
+            var wasNearBottom = (chatFeed.scrollHeight - chatFeed.scrollTop - chatFeed.clientHeight) < 120;
+            chatFeed.innerHTML = '';
+            if(!chatTurns.length){
+              emptyState.hidden = false;
+              chatFeed.appendChild(emptyState);
+              return;
+            }
+            emptyState.hidden = true;
+            var latestPaintableId = '';
+            for(var i = chatTurns.length - 1; i >= 0; i--){
+              var candidate = chatTurns[i];
+              if(candidate.kind === 'media' && candidate.mediaKind !== 'video' && candidate.url && candidate.url === sourceImageUrl){ latestPaintableId = candidate.id; break; }
+            }
+            chatTurns.forEach(function(turn){
+              var row = document.createElement('div');
+              row.className = 'rk-ip-turn';
+              row.dataset.role = turn.role;
+              row.dataset.kind = turn.kind;
+              row.dataset.turnId = turn.id;
+              if(turn.role === 'user'){
+                if(turn.refs && turn.refs.length){
+                  var refs = document.createElement('div');
+                  refs.className = 'rk-ip-turn-refs';
+                  turn.refs.forEach(function(url){ var im = document.createElement('img'); im.src = url; im.alt = ''; im.loading = 'lazy'; refs.appendChild(im); });
+                  row.appendChild(refs);
+                }
+                var tag = document.createElement('span');
+                tag.className = 'rk-ip-turn-tag';
+                tag.textContent = turn.mode === 'video' ? 'Video' : (turn.masked ? 'Masked edit' : (turn.isEdit ? 'Edit' : 'New image'));
+                row.appendChild(tag);
+                var bubble = document.createElement('div');
+                bubble.className = 'rk-ip-bubble';
+                bubble.textContent = turn.text || '';
+                row.appendChild(bubble);
+              } else if(turn.kind === 'pending'){
+                var pending = document.createElement('div');
+                pending.className = 'rk-ip-pending';
+                pending.dataset.pendingId = turn.id;
+                pending.textContent = turn.label || 'Working\u2026';
+                row.appendChild(pending);
+              } else if(turn.kind === 'error' || turn.kind === 'stopped'){
+                var err = document.createElement('div');
+                err.className = 'rk-ip-bubble';
+                err.textContent = turn.text || 'Something went wrong.';
+                row.appendChild(err);
+              } else if(turn.kind === 'media' && turn.url){
+                var media = document.createElement('div');
+                media.className = 'rk-ip-media';
+                var isLatest = turn.id === latestPaintableId;
+                var frame = document.createElement('div');
+                frame.className = 'rk-ip-media-frame' + (isLatest ? ' is-latest' : '');
+                if(isLatest){
+                  canvasWrap.hidden = false;
+                  frame.appendChild(paintStack);
+                } else if(turn.mediaKind === 'video'){
+                  var video = document.createElement('video');
+                  video.src = turn.url; video.controls = true; video.playsInline = true; video.preload = 'metadata';
+                  frame.appendChild(video);
+                } else {
+                  var img = document.createElement('img');
+                  img.src = turn.url; img.alt = turn.note || 'Generated image'; img.loading = 'lazy';
+                  frame.appendChild(img);
+                }
+                media.appendChild(frame);
+                var actions = mediaActionsRow(turn);
+                if(isLatest){
+                  var note = document.createElement('span');
+                  note.className = 'rk-ip-act-note';
+                  note.textContent = inpaintStrokes.length ? 'Newest \u00b7 masked' : 'Newest \u00b7 paint to mask a region';
+                  actions.appendChild(note);
+                } else if(turn.note){
+                  var tagNote = document.createElement('span');
+                  tagNote.className = 'rk-ip-act-note';
+                  tagNote.textContent = turn.note;
+                  actions.appendChild(tagNote);
+                }
+                media.appendChild(actions);
+                row.appendChild(media);
+              } else {
+                var text = document.createElement('div');
+                text.className = 'rk-ip-bubble';
+                text.textContent = turn.text || '';
+                row.appendChild(text);
+              }
+              chatFeed.appendChild(row);
+            });
+            if(wasNearBottom) chatFeed.scrollTop = chatFeed.scrollHeight;
+            updateBrushCursorSize();
+            syncSessionAssets();
+          }
+
+          function turnById(id){ return chatTurns.filter(function(t){ return t.id === id; })[0] || null; }
+
+          chatFeed.addEventListener('click', function(event){
+            var target = event.target;
+            if(!(target instanceof Element)) return;
+            var open = target.closest('[data-ip-open]');
+            if(open instanceof HTMLElement){
+              var openTurn = turnById(open.dataset.ipOpen || '');
+              if(openTurn) openImagePreview(openTurn.url, openTurn.mediaKind === 'video' ? 'Generated video' : 'Generated image', imageDownloadName(openTurn.mediaKind === 'video' ? 'vidfarm-video' : 'vidfarm-image', openTurn.at), openTurn.mediaKind);
+              return;
+            }
+            var copy = target.closest('[data-ip-copy]');
+            if(copy instanceof HTMLElement){
+              var copyTurn = turnById(copy.dataset.ipCopy || '');
+              if(!copyTurn) return;
+              void copyText(copyTurn.url).then(function(copied){
+                copy.title = copied ? 'Copied' : 'Copy failed';
+                setStatus(copied ? 'File URL copied.' : 'Copy failed.', copied ? 'success' : 'error');
+                window.setTimeout(function(){ copy.title = 'Copy URL'; }, 1200);
+              });
+              return;
+            }
+            var save = target.closest('[data-ip-save]');
+            if(save instanceof HTMLElement){
+              var saveTurn = turnById(save.dataset.ipSave || '');
+              if(saveTurn) saveMediaToFiles(saveTurn.url, imageDownloadName(saveTurn.mediaKind === 'video' ? 'vidfarm-video' : 'vidfarm-image', saveTurn.at));
+            }
+          });
+
+          maskChip.addEventListener('click', function(event){
+            var target = event.target;
+            if(target instanceof Element && target.closest('[data-ip-clear-mask]')){
+              resetMask();
+              renderChat();
+              composerPlaceholder();
+            }
+          });
+
+          // ---- what each request carries -------------------------------------------
+          // DELIBERATELY no conversation context. Each turn sends ONLY the user's latest
+          // message and (for edits) the current image. Feeding back a transcript plus
+          // earlier versions of the same picture made the models blend instructions
+          // across turns and drift back toward superseded versions. The newest image
+          // already encodes every edit before it, so it is the only history worth
+          // sending. References the user attaches by hand still go through untouched.
+          // ---- job polling ---------------------------------------------------------
+          function extractVideoOutputUrl(payload){
+            var result = (payload && payload.result) || {};
+            var out = result.output || {};
+            return (out.video && out.video.file_url) || out.primary_file_url || (result.video && result.video.file_url) || result.primary_file_url
+              || (Array.isArray(out.files) ? out.files[0] : '') || (Array.isArray(result.files) ? result.files[0] : '') || '';
+          }
+          function pollPrimitiveJob(kind, jobId, label, isVideo){
+            var attempt = 0;
+            var maxAttempts = isVideo ? 150 : 90;
+            function step(){
+              throwIfStopped();
+              return fetch('/api/v1/primitives/' + kind + '/jobs/' + encodeURIComponent(jobId), { credentials: 'same-origin' }).then(function(r){
+                return parseJsonResponse(r).then(function(payload){
+                  if(!r.ok) throw new Error(payload.error || ('Unable to poll ' + label + '.'));
+                  if(payload.status === 'failed' || payload.status === 'cancelled'){ throw new Error((payload.error && payload.error.message) || (label + ' ' + payload.status + '.')); }
+                  var out = isVideo ? extractVideoOutputUrl(payload) : extractOutputUrl(payload);
+                  if(payload.status === 'succeeded' || payload.status === 'complete' || out){
+                    if(!out) throw new Error(label + ' finished without an output URL.');
+                    return absoluteUrl(out);
+                  }
+                  var note = label + ' (' + (payload.status || 'running') + ')\u2026';
+                  updatePendingLabel(activeTurnId, note);
+                  setStatus(note, '');
+                  attempt++;
+                  if(attempt >= maxAttempts){ return ''; }
+                  return new Promise(function(res){ setTimeout(res, attempt < 8 ? 1500 : (isVideo ? 4000 : 3000)); }).then(step);
+                });
+              });
+            }
+            return step();
+          }
+
+          // ---- the four kinds of turn ---------------------------------------------
+          function runGenerateTurn(text, refs){
+            return Promise.resolve().then(function(){
+              var pending = addTurn({ kind: 'pending', label: 'Generating image\u2026', prompt: text });
+              activeTurnId = pending.id;
+              var payload = { prompt: text, output_format: 'png' };
+              if(refs.length) payload.prompt_attachments = refs;
+              if(inpaintProviderSelect.value) payload.provider = inpaintProviderSelect.value;
+              var tracer = tracerAutoPending ? nameTracerFromSeed(text) : getTracerValue();
+              return fetch('/api/v1/primitives/images/generate', {
+                method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' },
+                body: JSON.stringify({ tracer: tracer, payload: payload, chat_message: text, chat_mode: 'image' })
+              }).then(parseJsonResponse).then(function(j){
+                if(!j || !j.job_id) throw new Error((j && j.error) || 'Unable to start image generation.');
+                activeJob = { kind: 'image_generate', jobId: j.job_id };
+                return pollPrimitiveJob('image_generate', j.job_id, 'Generating image', false).then(function(out){
+                  if(!out){ updatePendingLabel(activeTurnId, 'Still generating \u2014 it will appear in this session\u2019s history when it lands.'); activeTurnId = ''; return; }
+                  resolveActiveTurn({ kind: 'media', mediaKind: 'image', url: out, jobId: j.job_id });
+                  adoptLatestImage(out);
+                  recordSourceHistoryItem(out, 'generated', 'Generated image');
+                  setStatus('Image ready \u2014 keep chatting to refine it.', 'success');
+                  void loadTracerSessions();
+                });
+              });
+            });
+          }
+
+          function runEditTurn(text, refs){
+            return Promise.resolve().then(function(){
+              var pending = addTurn({ kind: 'pending', label: 'Editing the newest image\u2026', prompt: text });
+              activeTurnId = pending.id;
+              var instruction = 'Edit the SOURCE IMAGE as follows: ' + text
+                + ' Keep everything else about the source image \u2014 subject identity, composition, framing, style, and unrelated details \u2014 unchanged unless the instruction asks otherwise.';
+              var payload = { source_image_url: sourceImageUrl, instruction: instruction, output_format: 'png' };
+              if(refs.length) payload.reference_attachments = refs;
+              if(inpaintProviderSelect.value) payload.provider = inpaintProviderSelect.value;
+              var tracer = tracerAutoPending ? nameTracerFromSeed(text) : getTracerValue();
+              return fetch('/api/v1/primitives/images/edit', {
+                method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' },
+                body: JSON.stringify({ tracer: tracer, payload: payload, chat_message: text, chat_mode: 'image' })
+              }).then(parseJsonResponse).then(function(j){
+                if(!j || !j.job_id) throw new Error((j && j.error) || 'Unable to start the edit.');
+                activeJob = { kind: 'image_edit', jobId: j.job_id };
+                return pollPrimitiveJob('image_edit', j.job_id, 'Editing image', false).then(function(out){
+                  if(!out){ updatePendingLabel(activeTurnId, 'Still editing \u2014 it will appear in this session\u2019s history when it lands.'); activeTurnId = ''; return; }
+                  resolveActiveTurn({ kind: 'media', mediaKind: 'image', url: out, jobId: j.job_id });
+                  adoptLatestImage(out);
+                  void persistInpaintOutputToTemp(out, j.job_id);
+                  setStatus('Edit applied \u2014 the newest image is now the one you are editing.', 'success');
+                  void loadTracerSessions();
+                });
+              });
+            });
+          }
+
+          function runMaskedTurn(text, refs){
+            return Promise.resolve().then(function(){
+              // The composer text is the legacy "whole image prompt"; per-color prompts
+              // stay in the left panel and are merged by buildInpaintInstruction().
+              inpaintGlobalPrompt.value = text;
+              var pending = addTurn({ kind: 'pending', label: 'Applying the masked edit\u2026', prompt: text });
+              activeTurnId = pending.id;
+              return submitInpaintJob({ extraRefs: refs, chatMessage: text });
+            });
+          }
+
+          function runVideoTurn(text){
+            return Promise.resolve().then(function(){
+              var pending = addTurn({ kind: 'pending', label: 'Generating video \u2014 this can take a few minutes\u2026', prompt: text });
+              activeTurnId = pending.id;
+              var payload = { prompt: text, output_format: 'mp4' };
+              // The newest image is the only visual reference — it is the opening frame.
+              if(sourceImageUrl) payload.input_references = [sourceImageUrl];
+              if(inpaintProviderSelect.value) payload.provider = inpaintProviderSelect.value;
+              var tracer = tracerAutoPending ? nameTracerFromSeed(text) : getTracerValue();
+              return fetch('/api/v1/primitives/videos/generate', {
+                method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' },
+                body: JSON.stringify({ tracer: tracer, payload: payload, chat_message: text, chat_mode: 'video' })
+              }).then(parseJsonResponse).then(function(j){
+                if(!j || !j.job_id) throw new Error((j && j.error) || 'Unable to start video generation.');
+                activeJob = { kind: 'video_generate', jobId: j.job_id };
+                return pollPrimitiveJob('video_generate', j.job_id, 'Generating video', true).then(function(out){
+                  if(!out){ updatePendingLabel(activeTurnId, 'Still rendering \u2014 check the Video tool\u2019s history shortly.'); activeTurnId = ''; return; }
+                  resolveActiveTurn({ kind: 'media', mediaKind: 'video', url: out, jobId: j.job_id, note: 'video' });
+                  setStatus('Video ready.', 'success');
+                  void loadTracerSessions();
+                });
+              });
+            });
+          }
+
+          // ---- send ----------------------------------------------------------------
+          function sendChatMessage(){
             if(genBusy) return;
-            genBusy = true; syncGenSend(); if(genWrap) genWrap.classList.add('is-busy');
-            setGenStatus('Creating image\u2026', '');
-            var payload = { prompt: p, output_format: 'png' };
-            if(genRefs.length) payload.prompt_attachments = genRefs.slice();
-            if(inpaintProviderSelect && inpaintProviderSelect.value) payload.provider = inpaintProviderSelect.value;
-            var genTracer = tracerAutoPending ? nameTracerFromSeed(p) : getTracerValue();
-            if(tracerAutoPending === false){ void loadTracerSessions(); }
-            fetch('/api/v1/primitives/images/generate', {
-              method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' },
-              body: JSON.stringify({ tracer: genTracer, payload: payload })
-            }).then(parseJsonResponse).then(function(j){
-              if(!j || !j.job_id){ throw new Error((j && j.error) || 'Unable to start image generation.'); }
-              setGenStatus('Generating image\u2026', '');
-              return pollImageGenerateJob(j.job_id);
-            }).then(function(out){
-              if(out){ loadSourceUrl(out, 'generated'); setStatus('Generated image ready. Paint mask regions to refine, or download it.', 'success'); }
-            }).catch(function(err){
-              var msg = (err && err.message) ? err.message : 'Unable to generate image.';
-              if(/401|403|sign in|unauth/i.test(msg)) msg = 'Sign in to generate images.';
-              setGenStatus(msg, 'error');
-            }).then(function(){ genBusy = false; if(genWrap) genWrap.classList.remove('is-busy'); syncGenSend(); });
+            var mode = modeSelect.value === 'video' ? 'video' : 'image';
+            var raw = (genPrompt && genPrompt.value || '').trim();
+            var text = mode === 'image' ? expandShorthand(raw) : raw;
+            var masked = mode === 'image' && inpaintStrokes.length > 0;
+            if(!text && !(masked && maskHasInstruction())){
+              setStatus(mode === 'video' ? 'Describe the video you want.' : 'Type what you want to create or change.', 'error');
+              if(genPrompt) genPrompt.focus();
+              return;
+            }
+            if(mode === 'video' && !text){ setStatus('Describe the video you want.', 'error'); return; }
+            var refs = genRefs.slice();
+            addTurn({
+              role: 'user', kind: 'text',
+              text: text || 'Apply the painted mask instructions.',
+              refs: refs, mode: mode, masked: masked,
+              isEdit: mode === 'image' && Boolean(sourceImageUrl)
+            });
+            if(genPrompt){ genPrompt.value = ''; autoGrowComposer(); }
+            genRefs = [];
+            renderGenRefs();
+            stopRequested = false;
+            activeJob = { kind: '', jobId: '' };
+            setGenBusy(true);
+            setStatus(mode === 'video' ? 'Creating video\u2026' : 'Working\u2026', '');
+            var work;
+            if(mode === 'video') work = runVideoTurn(text);
+            else if(!sourceImageUrl) work = runGenerateTurn(text, refs);
+            else if(masked) work = runMaskedTurn(text, refs);
+            else work = runEditTurn(text, refs);
+            work.catch(function(err){
+              if(err && (err.stopped || err.message === '__vidfarm_stopped__')){
+                resolveActiveTurn({ kind: 'stopped', text: 'Stopped.' });
+                setStatus('Stopped.', '');
+                return;
+              }
+              var msg = (err && err.message) ? err.message : 'That request failed.';
+              if(/401|403|sign in|unauth/i.test(msg)) msg = 'Sign in to generate media.';
+              resolveActiveTurn({ kind: 'error', text: msg });
+              setStatus(msg, 'error');
+            }).then(function(){
+              stopRequested = false;
+              activeJob = { kind: '', jobId: '' };
+              setGenBusy(false);
+              composerPlaceholder();
+              syncGenSend();
+              void loadInpaintHistory();
+            });
           }
 
           if(genPrompt){
-            genPrompt.addEventListener('input', syncGenSend);
-            genPrompt.addEventListener('keydown', function(e){ if(e.key === 'Enter' && !e.shiftKey){ e.preventDefault(); submitGenerate(); } });
+            genPrompt.addEventListener('input', function(){ syncGenSend(); autoGrowComposer(); });
+            genPrompt.addEventListener('keydown', function(e){
+              if(e.key !== 'Enter' || e.shiftKey) return;
+              e.preventDefault();
+              // Keep typing freely while a turn runs; Enter just won't fire a second one.
+              if(genBusy){ setStatus('Still generating — press Stop to cancel, or wait and send then.', ''); return; }
+              sendChatMessage();
+            });
             genPrompt.addEventListener('paste', function(e){ var imgs = imagesFromClipboard(e); if(imgs.length){ e.preventDefault(); addGenReferenceFiles(imgs); } });
           }
           if(genWrap){
@@ -3803,9 +4329,21 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
             genWrap.addEventListener('drop', function(e){ if(dtHasFiles(e)){ e.preventDefault(); e.stopPropagation(); genWrap.classList.remove('is-dragref'); addGenReferenceFiles(e.dataTransfer.files); } });
           }
           if(genClip) genClip.addEventListener('click', openGenFilePanel);
-          if(genSend) genSend.addEventListener('click', submitGenerate);
+          if(genSend) genSend.addEventListener('click', function(){ if(genBusy) stopActiveTurn(); else sendChatMessage(); });
+          modeSelect.addEventListener('change', function(){ composerPlaceholder(); syncGenSend(); });
+          // ⌘Z / ⇧⌘Z anywhere outside a text field undoes and redoes the paint.
+          window.addEventListener('keydown', function(e){
+            if(!(e.metaKey || e.ctrlKey) || String(e.key).toLowerCase() !== 'z') return;
+            var el = document.activeElement;
+            if(el && (el.tagName === 'TEXTAREA' || el.tagName === 'INPUT')) return;
+            if(!inpaintStrokes.length && !redoStrokes.length) return;
+            e.preventDefault();
+            if(e.shiftKey) redoStroke(); else undoStroke();
+          });
           renderGenRefs();
           syncGenSend();
+          composerPlaceholder();
+          renderChat();
 
           // Drag-and-drop onto the upload dropzone (legacy only wired click).
           var dropZone = document.querySelector('[data-custom-inpaint-upload]');
@@ -4365,6 +4903,34 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
   }
   function fileIcon(kind) { return kind === 'pdf' ? '📕' : kind === 'json' ? '{ }' : kind === 'markdown' ? '📝' : kind === 'audio' ? '🎵' : kind === 'text' ? '📄' : '📄'; }
 
+  // ── "edit this media" hand-off: dock chat → the matching creative tool ──
+  // Images open /tools/image, videos /tools/video, each with the file preloaded as
+  // that tool's working file (its chat then edits THAT media). Deliberately a fresh
+  // tool session — no ?tracer — so the tool names its own chat from the first prompt.
+  var PENCIL_SVG = '<svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M13.6 3.6a1.9 1.9 0 0 1 2.8 2.8L7.7 15.1l-3.6.8.8-3.6z"/></svg>';
+  function toolEditUrl(file) {
+    if (!file || !file.viewUrl) return '';
+    var k = fileKind(file.name, file.contentType);
+    var name = file.name || '';
+    if (k === 'image') return '/tools/image?source_image_url=' + encodeURIComponent(file.viewUrl) + (name ? '&source_image_name=' + encodeURIComponent(name) : '');
+    if (k === 'video') return '/tools/video?source_video_url=' + encodeURIComponent(file.viewUrl) + (name ? '&source_video_name=' + encodeURIComponent(name) : '');
+    return '';
+  }
+  function toolEditLink(file, className) {
+    var href = toolEditUrl(file);
+    if (!href) return null;
+    var a = document.createElement('a');
+    a.className = className;
+    a.href = href;
+    a.target = '_blank';
+    a.rel = 'noopener noreferrer';
+    a.title = 'Edit in the ' + (fileKind(file.name, file.contentType) === 'video' ? 'video' : 'image') + ' tool';
+    a.setAttribute('aria-label', a.title);
+    // The card itself opens the lightbox; the pencil must not also trigger it.
+    a.addEventListener('click', function (e) { e.stopPropagation(); });
+    return a;
+  }
+
   // Compact markdown → HTML for .md previews (headings, lists, quotes, rules,
   // fenced + inline code, bold/italic/links). Escapes first, then injects tags
   // (same order as linkify). Backticks are built via char codes to avoid
@@ -4425,7 +4991,9 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
     var dlBtn = document.createElement('a'); dlBtn.className = 'rk-aichat-preview-act'; dlBtn.target = '_blank'; dlBtn.rel = 'noopener noreferrer'; dlBtn.textContent = 'Download';
     var linkBtn = document.createElement('button'); linkBtn.type = 'button'; linkBtn.className = 'rk-aichat-preview-act'; linkBtn.textContent = 'Copy link';
     var xBtn = document.createElement('button'); xBtn.type = 'button'; xBtn.className = 'rk-aichat-modal-x'; xBtn.setAttribute('aria-label', 'Close'); xBtn.innerHTML = '&times;';
-    head.appendChild(nameEl); head.appendChild(copyBtn); head.appendChild(dlBtn); head.appendChild(linkBtn); head.appendChild(xBtn);
+    // Same hand-off as the card pencil, spelled out as a labelled action here.
+    var editBtn = document.createElement('a'); editBtn.className = 'rk-aichat-preview-act'; editBtn.target = '_blank'; editBtn.rel = 'noopener noreferrer'; editBtn.textContent = 'Edit';
+    head.appendChild(nameEl); head.appendChild(editBtn); head.appendChild(copyBtn); head.appendChild(dlBtn); head.appendChild(linkBtn); head.appendChild(xBtn);
     function flashAct(btn, label) { var o = btn.getAttribute('data-label') || btn.textContent; btn.setAttribute('data-label', o); btn.textContent = label; setTimeout(function () { btn.textContent = o; }, 1400); }
     // Copy = file text (json/md/txt) or its URL for binaries. Copy link = the
     // durable public S3 URL. Download opens in a new tab when the browser can't
@@ -4474,6 +5042,9 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
       var it = items[idx];
       nameEl.textContent = it.name || 'file'; nameEl.title = it.name || '';
       dlBtn.href = it.viewUrl; dlBtn.setAttribute('download', it.name || '');
+      var editHref = toolEditUrl(it);
+      editBtn.hidden = !editHref;
+      if (editHref) { editBtn.href = editHref; editBtn.title = 'Edit in the ' + (fileKind(it.name, it.contentType) === 'video' ? 'video' : 'image') + ' tool'; }
       linkBtn.style.display = it.publicUrl ? '' : 'none';
       body.innerHTML = '';
       var kind = fileKind(it.name, it.contentType);
@@ -4528,7 +5099,15 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
     var files = [], seen = {};
     var arts = (job && job.artifacts) || [];
     for (var i = 0; i < arts.length; i++) { var f = rkFileFromArtifact(arts[i]); if (f && !seen[f.viewUrl]) { seen[f.viewUrl] = true; files.push(f); } }
-    var mu = rkResultMediaUrl(job); if (mu && !seen[mu]) { seen[mu] = true; files.push({ name: (job.tracer || 'output'), contentType: '', viewUrl: mu, publicUrl: mu }); }
+    // Name the direct result URL after the FILE, not the tracer — fileKind() reads the
+    // extension, and a tracer-named entry ("my-poster") classifies as 'other', losing
+    // the image/video thumbnail and the edit-in-tool hand-off.
+    var mu = rkResultMediaUrl(job);
+    if (mu && !seen[mu]) {
+      seen[mu] = true;
+      var seg = String(mu).split('?')[0].split('/').pop() || '';
+      files.push({ name: (/.[a-z0-9]{2,5}$/i.test(seg) ? seg : (job.tracer || 'output')), contentType: '', viewUrl: mu, publicUrl: mu });
+    }
     var res = job && job.result;
     if (res && typeof res === 'object' && !Array.isArray(res) && Object.keys(res).length) {
       try { var blob = new Blob([JSON.stringify(res, null, 2)], { type: 'application/json' }); files.push({ name: (job.tracer || 'result') + '.json', contentType: 'application/json', viewUrl: URL.createObjectURL(blob), publicUrl: null }); } catch (e) {}
@@ -4581,14 +5160,21 @@ body.vf-has-topbanner.rk-has-sidebar .rk-content{padding-top:var(--vf-topbanner-
         var grid = document.createElement('div'); grid.className = 'rk-aichat-files-grid';
         list.forEach(function (f, ix) {
           var k = fileKind(f.name, f.contentType);
-          var card = document.createElement('button'); card.type = 'button'; card.className = 'rk-aichat-file';
+          // A div, not a button: media cards carry a nested "edit in tool" link, and
+          // an anchor inside a button is invalid (and unclickable in some browsers).
+          var card = document.createElement('div'); card.className = 'rk-aichat-file'; card.tabIndex = 0; card.setAttribute('role', 'button');
           var thumb = document.createElement('div'); thumb.className = 'rk-aichat-file-thumb rk-aichat-file-thumb--' + k;
           if (k === 'image') { var im = document.createElement('img'); im.src = f.viewUrl; im.alt = ''; im.loading = 'lazy'; thumb.appendChild(im); }
           else if (k === 'video') { var v = document.createElement('video'); v.src = f.viewUrl; v.muted = true; v.preload = 'metadata'; v.playsInline = true; thumb.appendChild(v); var pl = document.createElement('span'); pl.className = 'rk-aichat-file-play'; pl.textContent = '▶'; thumb.appendChild(pl); }
           else { var ic = document.createElement('span'); ic.className = 'rk-aichat-file-ic'; ic.textContent = fileIcon(k); thumb.appendChild(ic); }
+          var edit = toolEditLink(f, 'rk-aichat-file-open');
+          if (edit) { edit.innerHTML = PENCIL_SVG; thumb.appendChild(edit); }
           var nm = document.createElement('div'); nm.className = 'rk-aichat-file-name'; nm.textContent = f.name || 'file'; nm.title = f.name || '';
           card.appendChild(thumb); card.appendChild(nm);
           card.addEventListener('click', function () { openFilePreview(list, ix); });
+          card.addEventListener('keydown', function (e) {
+            if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); openFilePreview(list, ix); }
+          });
           grid.appendChild(card);
         });
         wrap.appendChild(grid); turn.appendChild(wrap); logBottom();