spectoflow 0.22.2 → 0.22.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spectoflow",
-  "version": "0.22.2",
+  "version": "0.22.4",
   "description": "Agent-agnostic spec-driven development framework + real-time local control plane. Markdown artifacts, intent router, workflow-by-scope.",
   "keywords": [
     "spec-driven-development",

package/templates/dashboard/public/app.js

@@ -35,7 +35,7 @@ function connect(){
   es.onmessage = (ev)=>{
     let m; try{ m=JSON.parse(ev.data); }catch{ return; }
     if(m.type==='change'||m.type==='message') return scheduleLoad(); // messages live from runtime.messages
-    if(m.type==='run-start'||m.type==='run-end') { chatState.forEach(st=>{ st.rawBlock=null; }); return; }
+    if(m.type==='run-start'||m.type==='run-end') { chatState.forEach(st=>{ st.rawBlock=null; }); sseBusy=(m.type==='run-start'); updateChatBusyUI(); return; }
     if(m.type==='run-line') return appendRaw(m.chunk);          // raw output is ephemeral (not logged)
   };
   es.onerror = ()=>{ $('#sync').classList.add('offline'); $('#syncLabel').textContent='offline'; };
@@ -115,7 +115,11 @@ function setChat(open){
 // doRun/doOrchestrate default to the floating widget's textarea/select; the Chat tab has its own
 // #tabRunPrompt/#tabRunAgent (an id can't be shared by two elements) and passes them explicitly —
 // one code path, same endpoints, for both surfaces.
+// isChatBusy() also guards the Ctrl/Cmd+Enter keyboard shortcuts, which call doRun() directly and
+// would otherwise bypass the buttons' own disabled state.
+function isChatBusy(){ return sseBusy || (P&&P.runtime&&P.runtime.orchestration&&P.runtime.orchestration.status==='running'); }
 async function doRun(promptEl,agentEl){
+  if(isChatBusy()) return;
   promptEl=promptEl||$('#runPrompt'); agentEl=agentEl||$('#runAgent');
   const prompt=promptEl.value.trim(); if(!prompt) return;
   const agent=agentEl.value;
@@ -123,6 +127,7 @@ async function doRun(promptEl,agentEl){
   promptEl.value=''; // the prompt renders as a bubble from the message log
 }
 async function doOrchestrate(promptEl){
+  if(isChatBusy()) return;
   promptEl=promptEl||$('#runPrompt');
   const prompt=promptEl.value.trim(); if(!prompt) return;
   await fetch('/api/orchestrate',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({request:prompt})});
@@ -132,6 +137,7 @@ async function approve(decision){ await fetch('/api/orchestrate/approve',{method
 // ---- chat context management: condense the log via the agent, or wipe it (Chat tab only — the
 // floating widget stays "quick access", full controls live where there's room to read them) ----
 async function summarizeChat(agentEl){
+  if(isChatBusy()) return;
   const agent=(agentEl||$('#tabRunAgent'))?.value;
   flash();
   await fetch('/api/chat/summarize',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({agent})});
@@ -145,6 +151,23 @@ async function addComment(id,text,action){ flash(); await fetch('/api/task/'+enc
 async function toggleStep(name){ flash(); await fetch('/api/workflow/toggle',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({name})}); }
 function flash(){ const s=$('#sync'); s.classList.add('saving'); $('#syncLabel').textContent='writing…'; setTimeout(()=>{ s.classList.remove('saving'); $('#syncLabel').textContent='live'; },800); }
 
+// ---- "agent is running" state — no visible feedback used to exist between clicking Send/
+// Orchestrate/Summarize and the result showing up (the only outward sign, on Windows, was a real
+// console window popping up behind the agent's own spawn — now suppressed, so this replaces it):
+// a small spinner + disabled buttons for as long as an agent run is actually in flight. Driven by
+// two signals — SSE run-start/run-end (Send, Summarize, each individual Orchestrate step) and
+// runtime.orchestration.status (stays 'running' across the gaps between orchestrate steps, which
+// SSE run-start/run-end alone would flicker through). ----
+let sseBusy=false;
+function updateChatBusyUI(){
+  const orchStatus=P&&P.runtime&&P.runtime.orchestration&&P.runtime.orchestration.status;
+  const busy=sseBusy||orchStatus==='running';
+  document.body.classList.toggle('chat-busy',!!busy);
+  [$('#runBtn'),$('#orchBtn'),$('#widgetSummarizeBtn'),$('#tabRunBtn'),$('#tabOrchBtn'),$('#tabSummarizeBtn')].forEach(b=>{ if(b) b.disabled=!!busy; });
+  const tabStatus=$('#tabChatStatus'); if(tabStatus) tabStatus.hidden=!busy;
+  const widgetStatus=$('#widgetChatStatus'); if(widgetStatus) widgetStatus.hidden=!busy;
+}
+
 function render(){
   const c = P.config||{};
   i18nSetLang(c.language||'en'); updateStatusLabels(); // language drives the whole UI, not just agent output
@@ -165,7 +188,7 @@ function render(){
   if(meter) meter.title=`${t('kpi.globalProgress')}: ${s.pct}% (${s.done}/${s.total} ${t('kpi.tasksLabel')})`;
   renderOverview(); renderBoard(); renderBacklog(); renderWorkflow(); renderTeam();
   renderChatLog($('#chatLog')); renderChatLog($('#chatTabLog'));
-  renderSidebar(); renderRequests(); renderAttention(); renderInfo(); renderDocs(); renderSettings(); renderFiles(); applySideHidden();
+  renderSidebar(); renderRequests(); renderAttention(); renderInfo(); renderDocs(); renderSettings(); renderFiles(); applySideHidden(); updateChatBusyUI();
   renderCustomDashboards(); // adds/removes nav tabs + panels before applyActiveTab() below reads them
   applyActiveTab(); // re-apply the current tab so an SSE-driven re-render never resets to Board
   applyI18nStatic(); // re-translate the static markup (nav, headers, placeholders…) for this tick's language
@@ -1298,6 +1321,7 @@ function renderDocs(){
 // event refreshes the TREE listing but never overwrites an open file's editor buffer, so an
 // unrelated agent write elsewhere can't clobber unsaved work here. ----
 let filesTreeData=null, filesOpenPath=null, filesOpenDirty=false;
+let filesSelectedDir=''; // '' = project root — the folder + File/+ Folder create inside
 const filesOpenDirs=new Set(); // persists which tree folders are expanded across a refresh
 async function loadFilesTree(){
   try{
@@ -1315,7 +1339,8 @@ function renderFiles(){
   loadFilesTree();
 }
 function fNode(entry){
-  const row=el('div','f-row'+(entry.type==='dir'&&filesOpenDirs.has(entry.path)?' is-open':'')+(entry.path===filesOpenPath?' is-active':''));
+  const isTarget=entry.type==='dir'&&entry.path===filesSelectedDir;
+  const row=el('div','f-row'+(entry.type==='dir'&&filesOpenDirs.has(entry.path)?' is-open':'')+(entry.path===filesOpenPath?' is-active':'')+(isTarget?' is-target':''));
   row.tabIndex=0;
   if(entry.type==='dir'){
     const chev=document.createElementNS('http://www.w3.org/2000/svg','svg');
@@ -1330,10 +1355,17 @@ function fNode(entry){
     const kids=el('div','f-children'); kids.hidden=!filesOpenDirs.has(entry.path);
     (entry.children||[]).forEach(c=> kids.append(fNode(c)));
     wrap.append(kids);
+    // a click both toggles expand/collapse AND marks this folder as where +File/+Folder create —
+    // the two are independent ideas but sharing the click keeps the tree from needing a second,
+    // easy-to-miss gesture just to pick a target folder.
     row.addEventListener('click',()=>{
       const open=filesOpenDirs.has(entry.path);
       if(open) filesOpenDirs.delete(entry.path); else filesOpenDirs.add(entry.path);
       row.classList.toggle('is-open',!open); kids.hidden=open;
+      filesSelectedDir=entry.path;
+      const root=$('#filesRootRow'); if(root) root.classList.remove('is-target');
+      $$('#filesTree .f-row.is-target').forEach(r=> r!==row && r.classList.remove('is-target'));
+      row.classList.add('is-target');
     });
   } else {
     row.addEventListener('click',()=> openFilesFile(entry.path));
@@ -1343,10 +1375,104 @@ function fNode(entry){
 function renderFilesTree(){
   const box=$('#filesTree'); if(!box) return;
   box.innerHTML='';
+  const root=$('#filesRootRow'); if(root) root.classList.toggle('is-target',filesSelectedDir==='');
   if(!filesTreeData || !filesTreeData.length){ box.append(el('div','empty',t('files.empty'))); return; }
   filesTreeData.forEach(e=> box.append(fNode(e)));
 }
 function filesExt(p){ const m=/\.([a-z0-9]+)$/i.exec(p||''); return m?m[1].toLowerCase():''; }
+
+// ---- lightweight syntax highlighting — zero-dependency (no CodeMirror/Monaco, per the explicit
+// call made when this tab was designed): a single char-scanner tokenizer good enough to make code
+// readable at a glance in a file browser, not a language-correct parser. Anything not recognized
+// (or with no lang mapping) just renders as plain, unstyled text — never a rendering error. ----
+const FILES_HL_LANG = {
+  js: { comments:[['//','\n'],['/*','*/']], strings:['"',"'",'`'],
+    keywords:'const let var function return if else for while do switch case break continue new class extends super this typeof instanceof in of try catch finally throw async await yield import export default from as null undefined true false void delete'.split(' ') },
+  json: { comments:[], strings:['"'], keywords:'true false null'.split(' ') },
+  css: { comments:[['/*','*/']], strings:['"',"'"], keywords:[] },
+  html: { comments:[['<!--','-->']], strings:['"',"'"], keywords:[], tags:true },
+  py: { comments:[['#','\n']], strings:['"',"'"],
+    keywords:'def class return if elif else for while break continue pass import from as try except finally raise with lambda yield async await None True False and or not in is del global nonlocal'.split(' ') },
+  sh: { comments:[['#','\n']], strings:['"',"'"],
+    keywords:'if then else elif fi for while do done case esac function return exit export local readonly'.split(' ') },
+  yml: { comments:[['#','\n']], strings:['"',"'"], keywords:'true false null'.split(' ') },
+};
+function filesHlLang(ext){
+  if(['js','mjs','cjs','ts','jsx','tsx'].includes(ext)) return 'js';
+  if(ext==='json') return 'json';
+  if(ext==='css') return 'css';
+  if(['html','htm'].includes(ext)) return 'html';
+  if(ext==='py') return 'py';
+  if(['sh','bash'].includes(ext)) return 'sh';
+  if(['yml','yaml'].includes(ext)) return 'yml';
+  return null;
+}
+// Scans `src` one character at a time, classifying spans as it goes; returns an HTML string with
+// each span wrapped in a colored <span> (escaped — this is the only place raw file content becomes
+// markup, so nothing here may skip escHtml).
+function filesHighlight(src,langKey){
+  const lang=FILES_HL_LANG[langKey];
+  if(!lang) return escHtml(src);
+  const n=src.length;
+  let i=0,html='',plain='';
+  const flushPlain=()=>{ if(plain){ html+=escHtml(plain); plain=''; } };
+  const isWordChar=c=>/[A-Za-z0-9_$]/.test(c);
+  while(i<n){
+    let matched=false;
+    // comments
+    for(const [open,close] of lang.comments){
+      if(src.startsWith(open,i)){
+        const end = close==='\n' ? (src.indexOf('\n',i)===-1?n:src.indexOf('\n',i)) : (src.indexOf(close,i+open.length)===-1?n:src.indexOf(close,i+open.length)+close.length);
+        flushPlain(); html+='<span class="hl-comment">'+escHtml(src.slice(i,end))+'</span>'; i=end; matched=true; break;
+      }
+    }
+    if(matched) continue;
+    // strings
+    if(lang.strings.includes(src[i])){
+      const q=src[i]; let j=i+1;
+      while(j<n && src[j]!==q){ if(src[j]==='\\') j++; j++; }
+      j=Math.min(j+1,n);
+      flushPlain(); html+='<span class="hl-string">'+escHtml(src.slice(i,j))+'</span>'; i=j; continue;
+    }
+    // html tags (bonus: <tag ...> / </tag>) — a light touch, not full attribute-vs-value parsing
+    if(lang.tags && src[i]==='<' && /[a-zA-Z/!]/.test(src[i+1]||'')){
+      const end=src.indexOf('>',i); const j=end===-1?n:end+1;
+      flushPlain(); html+='<span class="hl-tag">'+escHtml(src.slice(i,j))+'</span>'; i=j; continue;
+    }
+    // numbers
+    if(/[0-9]/.test(src[i]) && !isWordChar(src[i-1]||'')){
+      let j=i; while(j<n && /[0-9.]/.test(src[j])) j++;
+      flushPlain(); html+='<span class="hl-number">'+escHtml(src.slice(i,j))+'</span>'; i=j; continue;
+    }
+    // keywords
+    if(isWordChar(src[i]) && !isWordChar(src[i-1]||'')){
+      let j=i; while(j<n && isWordChar(src[j])) j++;
+      const word=src.slice(i,j);
+      if(lang.keywords.includes(word)){ flushPlain(); html+='<span class="hl-keyword">'+escHtml(word)+'</span>'; i=j; continue; }
+      plain+=word; i=j; continue;
+    }
+    plain+=src[i]; i++;
+  }
+  flushPlain();
+  return html;
+}
+// A textarea can't render colored text itself, so this overlays one, transparent, on top of a
+// highlighted <pre><code> "backdrop" showing through it (the standard technique for a highlighted
+// plain-text editor without a full editor component) — same font metrics on both, scroll positions
+// kept in lockstep, backdrop re-rendered on every keystroke.
+function filesCodeEditor(content,langKey,onInput){
+  const wrap=el('div','files-code-wrap');
+  const pre=document.createElement('pre'); pre.className='files-code-backdrop'; pre.setAttribute('aria-hidden','true');
+  const code=document.createElement('code'); pre.append(code);
+  const ta=el('textarea','files-editor files-code-input'); ta.spellcheck=false; ta.value=content;
+  const paint=()=>{ code.innerHTML=filesHighlight(ta.value,langKey)+'\n'; }; // trailing \n: a final blank line still gets backdrop height
+  const syncScroll=()=>{ pre.scrollTop=ta.scrollTop; pre.scrollLeft=ta.scrollLeft; };
+  ta.addEventListener('input',()=>{ paint(); if(onInput) onInput(ta.value); });
+  ta.addEventListener('scroll',syncScroll);
+  paint();
+  wrap.append(pre,ta);
+  return { wrap, textarea:ta };
+}
 async function openFilesFile(relPath){
   // no native confirm() dialog (it blocks the whole tab, including our own SSE/automation) — a
   // dirty editor just refuses to switch until the user explicitly saves or discards.
@@ -1409,15 +1535,19 @@ function renderFilesMd(box,actions,relPath,content){
   const showEditor=()=>{
     body.innerHTML='';
     const tb=el('div','files-md-toolbar');
-    const ta=el('textarea','files-editor'); ta.value=content;
-    const wrapSel=(before,after)=>{ const s=ta.selectionStart,e=ta.selectionEnd; const v=ta.value; ta.value=v.slice(0,s)+before+v.slice(s,e)+after+v.slice(e); ta.focus(); ta.selectionStart=s+before.length; ta.selectionEnd=e+before.length; content=ta.value; filesOpenDirty=true; };
+    const {wrap,textarea:ta}=filesCodeEditor(content,null,(v)=>{ content=v; filesOpenDirty=true; });
+    const wrapSel=(before,after)=>{
+      const s=ta.selectionStart,e=ta.selectionEnd; const v=ta.value;
+      ta.value=v.slice(0,s)+before+v.slice(s,e)+after+v.slice(e);
+      ta.dispatchEvent(new Event('input')); // repaints the backdrop and marks dirty via the same path as typing
+      ta.focus(); ta.selectionStart=s+before.length; ta.selectionEnd=e+before.length;
+    };
     [['B','**','**'],['I','_','_'],['H','## ',''],['Link','[','](url)']].forEach(([label,a,b])=>{
       const bt=el('button',null,label); bt.type='button'; bt.addEventListener('click',()=>wrapSel(a,b)); tb.append(bt);
     });
     const saveBtn=el('button',null,t('files.save')); saveBtn.type='button'; saveBtn.addEventListener('click',()=>{ content=ta.value; filesSave(relPath,content,actions); });
     tb.append(saveBtn,filesDiscardBtn(relPath));
-    ta.addEventListener('input',()=>{ content=ta.value; filesOpenDirty=true; });
-    body.append(tb,ta); ta.focus(); editBtn.textContent=t('files.preview');
+    body.append(tb,wrap); ta.focus(); editBtn.textContent=t('files.preview');
   };
   editBtn.addEventListener('click',()=>{ editing=!editing; if(editing) showEditor(); else showPreview(); });
   showPreview();
@@ -1438,23 +1568,21 @@ function renderFilesHtml(box,actions,relPath,content){
   };
   const showEditor=()=>{
     body.innerHTML='';
-    const ta=el('textarea','files-editor'); ta.value=content;
-    ta.addEventListener('input',()=>{ content=ta.value; filesOpenDirty=true; });
+    const {wrap,textarea:ta}=filesCodeEditor(content,'html',(v)=>{ content=v; filesOpenDirty=true; });
     const saveBtn=el('button','btn primary',t('files.save')); saveBtn.type='button'; saveBtn.addEventListener('click',()=>filesSave(relPath,content,actions));
     const tb=el('div','files-md-toolbar'); tb.append(saveBtn,filesDiscardBtn(relPath));
-    body.append(tb,ta); ta.focus(); editBtn.textContent=t('files.preview');
+    body.append(tb,wrap); ta.focus(); editBtn.textContent=t('files.preview');
   };
   editBtn.addEventListener('click',()=>{ editing=!editing; if(editing) showEditor(); else showPreview(); });
   showPreview();
 }
 // Anything else that reads as text: a plain monospace editor, editable straight away.
 function renderFilesText(box,actions,relPath,content){
-  const ta=el('textarea','files-editor'); ta.value=content;
-  ta.addEventListener('input',()=>{ filesOpenDirty=true; });
+  const {wrap,textarea:ta}=filesCodeEditor(content,filesHlLang(filesExt(relPath)),()=>{ filesOpenDirty=true; });
   const saveBtn=el('button','btn primary',t('files.save')); saveBtn.type='button';
   saveBtn.addEventListener('click',()=>filesSave(relPath,ta.value,actions));
   actions.append(saveBtn,filesDiscardBtn(relPath));
-  box.append(ta); ta.focus();
+  box.append(wrap); ta.focus();
 }
 // "+ File"/"+ Folder" open the same inline form (never a native prompt()/alert() — those block the
 // whole tab, including our own SSE connection, until dismissed).
@@ -1465,6 +1593,7 @@ function openFilesCreateForm(kind){
   const input=$('#filesCreateInput');
   input.placeholder = kind==='dir' ? t('files.newFolderPrompt') : t('files.newFilePrompt');
   input.value='';
+  const target=$('#filesCreateTarget'); if(target) target.textContent=t('files.creatingIn',{path:filesSelectedDir||t('files.projectRoot')});
   const err=$('#filesCreateError'); if(err) err.hidden=true;
   form.hidden=false; form.classList.add('is-open');
   input.focus();
@@ -1477,7 +1606,7 @@ async function submitFilesCreate(){
   const input=$('#filesCreateInput'); const err=$('#filesCreateError');
   const name=(input.value||'').trim();
   if(!name){ if(err){ err.textContent=t('backlog.addTitleRequired'); err.hidden=false; } return; }
-  const rel=name.replace(/^\/+/,'');
+  const rel=(filesSelectedDir?filesSelectedDir+'/':'')+name.replace(/^\/+/,'');
   const kind=filesCreateKind;
   const endpoint = kind==='dir' ? '/api/files/mkdir' : '/api/files/write';
   const payload = kind==='dir' ? {path:rel} : {path:rel,content:''};
@@ -1615,6 +1744,12 @@ $$('#backlogTable thead th').forEach(th=> th.addEventListener('click', ()=>{
 const filesNewFileBtn=$('#filesNewFile'); if(filesNewFileBtn) filesNewFileBtn.addEventListener('click',()=>openFilesCreateForm('file'));
 const filesNewFolderBtn=$('#filesNewFolder'); if(filesNewFolderBtn) filesNewFolderBtn.addEventListener('click',()=>openFilesCreateForm('dir'));
 const filesRefreshBtn=$('#filesRefresh'); if(filesRefreshBtn) filesRefreshBtn.addEventListener('click',loadFilesTree);
+const filesRootRowBtn=$('#filesRootRow');
+if(filesRootRowBtn) filesRootRowBtn.addEventListener('click',()=>{
+  filesSelectedDir='';
+  $$('#filesTree .f-row.is-target').forEach(r=> r.classList.remove('is-target'));
+  filesRootRowBtn.classList.add('is-target');
+});
 const filesCreateGoBtn=$('#filesCreateGo'); if(filesCreateGoBtn) filesCreateGoBtn.addEventListener('click',submitFilesCreate);
 const filesCreateCancelBtn=$('#filesCreateCancel'); if(filesCreateCancelBtn) filesCreateCancelBtn.addEventListener('click',closeFilesCreateForm);
 const filesCreateInputEl=$('#filesCreateInput'); if(filesCreateInputEl) filesCreateInputEl.addEventListener('keydown',e=>{ if(e.key==='Enter') submitFilesCreate(); });

package/templates/dashboard/public/i18n.js

@@ -85,13 +85,13 @@ en: {
   'team.skillsTitle':'Skills','team.skillsSub':'Evolving procedures — the <em>how</em>.',
   'team.standardsLabel':'standards','team.usesLabel':'uses','team.standardLabel':'standard',
   'drawer.agent':'Agent','drawer.skill':'Skill','drawer.file':'File · {rel}',
-  'drawer.loading':'Loading…','drawer.loadError':'Could not load this file.','files.title':'Files','files.sub':'Browse the project\'s files — view Markdown & HTML, edit any text file, create new ones.','files.newFile':'+ File','files.newFolder':'+ Folder','files.pickFile':'Select a file to view it.','files.empty':'No files yet.','files.edit':'Edit','files.preview':'Preview','files.save':'Save','files.saved':'✓ saved','files.saveError':'Could not save this file.','files.loadError':'Could not load this file.','files.binary':'This file can\'t be previewed here (not text).','files.discardConfirm':'Discard unsaved changes?','files.newFilePrompt':'New file path (e.g. notes/todo.md):','files.newFolderPrompt':'New folder path:','files.refresh':'Refresh','files.discard':'Discard','files.create':'Create',
+  'drawer.loading':'Loading…','drawer.loadError':'Could not load this file.','files.title':'Files','files.sub':'Browse the project\'s files — view Markdown & HTML, edit any text file, create new ones.','files.newFile':'+ File','files.newFolder':'+ Folder','files.pickFile':'Select a file to view it.','files.empty':'No files yet.','files.edit':'Edit','files.preview':'Preview','files.save':'Save','files.saved':'✓ saved','files.saveError':'Could not save this file.','files.loadError':'Could not load this file.','files.binary':'This file can\'t be previewed here (not text).','files.discardConfirm':'Discard unsaved changes?','files.newFilePrompt':'New file name (e.g. todo.md):','files.newFolderPrompt':'New folder name:','files.projectRoot':'project root','files.creatingIn':'Creating in: {path}','files.refresh':'Refresh','files.discard':'Discard','files.create':'Create',
   'chat.widgetTitle':'Run an agent','chat.widgetSub':'Quick access · full view in the Chat tab',
   'chat.tabSub':'Full conversation with the runner — the same run as the widget, more room to read it.',
   'chat.idle':'Type a request — the agent runs headless in this project with full memory (<code>CLAUDE.md → AGENTS.md</code>) and updates the board live.',
   'chat.inputPlaceholder':'e.g. Add a login feature with email + password',
   'chat.orchestrateTitle':'Walk the enabled workflow','chat.summarizeTitle':'Condense the recent activity into a summary','chat.clearTitle':'Clear the chat log',
-  'chat.warn':'⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.',
+  'chat.warn':'⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.','chat.running':'Agent running…',
   'info.title':'Info','info.sub':'Project overview — configuration, counts, specs and active workflow.',
   'info.project':'Project','info.projectType':'Project type','info.mode':'Mode','info.language':'Language',
   'info.activeAgent':'Active agent','info.runners':'Runners','info.noRunners':'No runners configured.',
@@ -197,13 +197,13 @@ fr: {
   'team.skillsTitle':'Compétences','team.skillsSub':'Procédures évolutives — le <em>comment</em>.',
   'team.standardsLabel':'standards','team.usesLabel':'utilise','team.standardLabel':'standard',
   'drawer.agent':'Agent','drawer.skill':'Compétence','drawer.file':'Fichier · {rel}',
-  'drawer.loading':'Chargement…','drawer.loadError':'Impossible de charger ce fichier.','files.title':'Fichiers','files.sub':'Parcourez les fichiers du projet — visualisez Markdown et HTML, modifiez tout fichier texte, créez-en de nouveaux.','files.newFile':'+ Fichier','files.newFolder':'+ Dossier','files.pickFile':'Sélectionnez un fichier pour l’afficher.','files.empty':'Aucun fichier pour l’instant.','files.edit':'Modifier','files.preview':'Aperçu','files.save':'Enregistrer','files.saved':'✓ enregistré','files.saveError':'Impossible d’enregistrer ce fichier.','files.loadError':'Impossible de charger ce fichier.','files.binary':'Ce fichier ne peut pas être prévisualisé ici (non textuel).','files.discardConfirm':'Abandonner les modifications non enregistrées ?','files.newFilePrompt':'Chemin du nouveau fichier (ex. notes/todo.md) :','files.newFolderPrompt':'Chemin du nouveau dossier :','files.refresh':'Actualiser','files.discard':'Annuler','files.create':'Créer',
+  'drawer.loading':'Chargement…','drawer.loadError':'Impossible de charger ce fichier.','files.title':'Fichiers','files.sub':'Parcourez les fichiers du projet — visualisez Markdown et HTML, modifiez tout fichier texte, créez-en de nouveaux.','files.newFile':'+ Fichier','files.newFolder':'+ Dossier','files.pickFile':'Sélectionnez un fichier pour l’afficher.','files.empty':'Aucun fichier pour l’instant.','files.edit':'Modifier','files.preview':'Aperçu','files.save':'Enregistrer','files.saved':'✓ enregistré','files.saveError':'Impossible d’enregistrer ce fichier.','files.loadError':'Impossible de charger ce fichier.','files.binary':'Ce fichier ne peut pas être prévisualisé ici (non textuel).','files.discardConfirm':'Abandonner les modifications non enregistrées ?','files.newFilePrompt':'Nom du nouveau fichier (ex. todo.md) :','files.newFolderPrompt':'Nom du nouveau dossier :','files.projectRoot':'racine du projet','files.creatingIn':'Création dans : {path}','files.refresh':'Actualiser','files.discard':'Annuler','files.create':'Créer',
   'chat.widgetTitle':'Lancer un agent','chat.widgetSub':'Accès rapide · vue complète dans l’onglet Chat',
   'chat.tabSub':'Conversation complète avec l’exécuteur — la même exécution que le widget, avec plus de place pour la lire.',
   'chat.idle':'Tapez une demande — l’agent s’exécute sans supervision dans ce projet avec toute sa mémoire (<code>CLAUDE.md → AGENTS.md</code>) et met le tableau à jour en direct.',
   'chat.inputPlaceholder':'ex. Ajouter une fonctionnalité de connexion par email + mot de passe',
   'chat.orchestrateTitle':'Parcourir le workflow activé','chat.summarizeTitle':'Condenser l’activité récente en un résumé','chat.clearTitle':'Effacer le journal de discussion',
-  'chat.warn':'⚠ Lance un agent réel (<code>config.json → runners</code>) qui peut modifier des fichiers et exécuter des commandes.',
+  'chat.warn':'⚠ Lance un agent réel (<code>config.json → runners</code>) qui peut modifier des fichiers et exécuter des commandes.','chat.running':'Agent en cours d’exécution…',
   'info.title':'Infos','info.sub':'Vue d’ensemble du projet — configuration, comptages, specs et workflow actif.',
   'info.project':'Projet','info.projectType':'Type de projet','info.mode':'Mode','info.language':'Langue',
   'info.activeAgent':'Agent actif','info.runners':'Runners','info.noRunners':'Aucun runner configuré.',
@@ -309,13 +309,13 @@ es: {
   'team.skillsTitle':'Habilidades','team.skillsSub':'Procedimientos en evolución — el <em>cómo</em>.',
   'team.standardsLabel':'estándares','team.usesLabel':'usa','team.standardLabel':'estándar',
   'drawer.agent':'Agente','drawer.skill':'Habilidad','drawer.file':'Archivo · {rel}',
-  'drawer.loading':'Cargando…','drawer.loadError':'No se pudo cargar este archivo.','files.title':'Archivos','files.sub':'Explora los archivos del proyecto — visualiza Markdown y HTML, edita cualquier archivo de texto, crea otros nuevos.','files.newFile':'+ Archivo','files.newFolder':'+ Carpeta','files.pickFile':'Selecciona un archivo para verlo.','files.empty':'Aún no hay archivos.','files.edit':'Editar','files.preview':'Vista previa','files.save':'Guardar','files.saved':'✓ guardado','files.saveError':'No se pudo guardar este archivo.','files.loadError':'No se pudo cargar este archivo.','files.binary':'Este archivo no se puede previsualizar aquí (no es texto).','files.discardConfirm':'¿Descartar los cambios sin guardar?','files.newFilePrompt':'Ruta del nuevo archivo (p. ej. notes/todo.md):','files.newFolderPrompt':'Ruta de la nueva carpeta:','files.refresh':'Actualizar','files.discard':'Descartar','files.create':'Crear',
+  'drawer.loading':'Cargando…','drawer.loadError':'No se pudo cargar este archivo.','files.title':'Archivos','files.sub':'Explora los archivos del proyecto — visualiza Markdown y HTML, edita cualquier archivo de texto, crea otros nuevos.','files.newFile':'+ Archivo','files.newFolder':'+ Carpeta','files.pickFile':'Selecciona un archivo para verlo.','files.empty':'Aún no hay archivos.','files.edit':'Editar','files.preview':'Vista previa','files.save':'Guardar','files.saved':'✓ guardado','files.saveError':'No se pudo guardar este archivo.','files.loadError':'No se pudo cargar este archivo.','files.binary':'Este archivo no se puede previsualizar aquí (no es texto).','files.discardConfirm':'¿Descartar los cambios sin guardar?','files.newFilePrompt':'Nombre del nuevo archivo (p. ej. todo.md):','files.newFolderPrompt':'Nombre de la nueva carpeta:','files.projectRoot':'raíz del proyecto','files.creatingIn':'Creando en: {path}','files.refresh':'Actualizar','files.discard':'Descartar','files.create':'Crear',
   'chat.widgetTitle':'Ejecutar un agente','chat.widgetSub':'Acceso rápido · vista completa en la pestaña Chat',
   'chat.tabSub':'Conversación completa con el ejecutor — la misma ejecución que el widget, con más espacio para leerla.',
   'chat.idle':'Escribe una solicitud — el agente se ejecuta sin supervisión en este proyecto con toda su memoria (<code>CLAUDE.md → AGENTS.md</code>) y actualiza el tablero en vivo.',
   'chat.inputPlaceholder':'p. ej. Añadir un inicio de sesión con email + contraseña',
   'chat.orchestrateTitle':'Recorrer el workflow activado','chat.summarizeTitle':'Condensar la actividad reciente en un resumen','chat.clearTitle':'Borrar el registro del chat',
-  'chat.warn':'⚠ Lanza un agente real (<code>config.json → runners</code>) que puede modificar archivos y ejecutar comandos.',
+  'chat.warn':'⚠ Lanza un agente real (<code>config.json → runners</code>) que puede modificar archivos y ejecutar comandos.','chat.running':'Agente en ejecución…',
   'info.title':'Info','info.sub':'Visión general del proyecto — configuración, recuentos, specs y workflow activo.',
   'info.project':'Proyecto','info.projectType':'Tipo de proyecto','info.mode':'Modo','info.language':'Idioma',
   'info.activeAgent':'Agente activo','info.runners':'Runners','info.noRunners':'No hay runners configurados.',
@@ -421,13 +421,13 @@ de: {
   'team.skillsTitle':'Skills','team.skillsSub':'Sich weiterentwickelnde Vorgehensweisen — das <em>Wie</em>.',
   'team.standardsLabel':'Standards','team.usesLabel':'nutzt','team.standardLabel':'Standard',
   'drawer.agent':'Agent','drawer.skill':'Skill','drawer.file':'Datei · {rel}',
-  'drawer.loading':'Lädt…','drawer.loadError':'Diese Datei konnte nicht geladen werden.','files.title':'Dateien','files.sub':'Durchsuche die Projektdateien — Markdown & HTML ansehen, jede Textdatei bearbeiten, neue erstellen.','files.newFile':'+ Datei','files.newFolder':'+ Ordner','files.pickFile':'Wähle eine Datei aus, um sie anzuzeigen.','files.empty':'Noch keine Dateien.','files.edit':'Bearbeiten','files.preview':'Vorschau','files.save':'Speichern','files.saved':'✓ gespeichert','files.saveError':'Diese Datei konnte nicht gespeichert werden.','files.loadError':'Diese Datei konnte nicht geladen werden.','files.binary':'Diese Datei kann hier nicht angezeigt werden (kein Text).','files.discardConfirm':'Nicht gespeicherte Änderungen verwerfen?','files.newFilePrompt':'Pfad der neuen Datei (z. B. notes/todo.md):','files.newFolderPrompt':'Pfad des neuen Ordners:','files.refresh':'Aktualisieren','files.discard':'Verwerfen','files.create':'Erstellen',
+  'drawer.loading':'Lädt…','drawer.loadError':'Diese Datei konnte nicht geladen werden.','files.title':'Dateien','files.sub':'Durchsuche die Projektdateien — Markdown & HTML ansehen, jede Textdatei bearbeiten, neue erstellen.','files.newFile':'+ Datei','files.newFolder':'+ Ordner','files.pickFile':'Wähle eine Datei aus, um sie anzuzeigen.','files.empty':'Noch keine Dateien.','files.edit':'Bearbeiten','files.preview':'Vorschau','files.save':'Speichern','files.saved':'✓ gespeichert','files.saveError':'Diese Datei konnte nicht gespeichert werden.','files.loadError':'Diese Datei konnte nicht geladen werden.','files.binary':'Diese Datei kann hier nicht angezeigt werden (kein Text).','files.discardConfirm':'Nicht gespeicherte Änderungen verwerfen?','files.newFilePrompt':'Name der neuen Datei (z. B. todo.md):','files.newFolderPrompt':'Name des neuen Ordners:','files.projectRoot':'Projektstamm','files.creatingIn':'Erstellen in: {path}','files.refresh':'Aktualisieren','files.discard':'Verwerfen','files.create':'Erstellen',
   'chat.widgetTitle':'Agenten ausführen','chat.widgetSub':'Schnellzugriff · vollständige Ansicht im Chat-Tab',
   'chat.tabSub':'Vollständiges Gespräch mit dem Runner — derselbe Lauf wie im Widget, mit mehr Platz zum Lesen.',
   'chat.idle':'Geben Sie eine Anfrage ein — der Agent läuft eigenständig in diesem Projekt mit vollem Gedächtnis (<code>CLAUDE.md → AGENTS.md</code>) und aktualisiert das Board live.',
   'chat.inputPlaceholder':'z. B. Login mit E-Mail + Passwort hinzufügen',
   'chat.orchestrateTitle':'Den aktivierten Workflow durchlaufen','chat.summarizeTitle':'Die letzten Aktivitäten zu einer Zusammenfassung verdichten','chat.clearTitle':'Chat-Verlauf löschen',
-  'chat.warn':'⚠ Startet einen echten Agenten (<code>config.json → runners</code>), der Dateien ändern und Befehle ausführen kann.',
+  'chat.warn':'⚠ Startet einen echten Agenten (<code>config.json → runners</code>), der Dateien ändern und Befehle ausführen kann.','chat.running':'Agent läuft…',
   'info.title':'Info','info.sub':'Projektübersicht — Konfiguration, Zahlen, Specs und aktiver Workflow.',
   'info.project':'Projekt','info.projectType':'Projekttyp','info.mode':'Modus','info.language':'Sprache',
   'info.activeAgent':'Aktiver Agent','info.runners':'Runner','info.noRunners':'Keine Runner konfiguriert.',
@@ -533,13 +533,13 @@ pt: {
   'team.skillsTitle':'Habilidades','team.skillsSub':'Procedimentos em evolução — o <em>como</em>.',
   'team.standardsLabel':'padrões','team.usesLabel':'usa','team.standardLabel':'padrão',
   'drawer.agent':'Agente','drawer.skill':'Habilidade','drawer.file':'Ficheiro · {rel}',
-  'drawer.loading':'A carregar…','drawer.loadError':'Não foi possível carregar este ficheiro.','files.title':'Ficheiros','files.sub':'Percorra os ficheiros do projeto — veja Markdown e HTML, edite qualquer ficheiro de texto, crie novos.','files.newFile':'+ Ficheiro','files.newFolder':'+ Pasta','files.pickFile':'Selecione um ficheiro para o ver.','files.empty':'Ainda não há ficheiros.','files.edit':'Editar','files.preview':'Pré-visualizar','files.save':'Guardar','files.saved':'✓ guardado','files.saveError':'Não foi possível guardar este ficheiro.','files.loadError':'Não foi possível carregar este ficheiro.','files.binary':'Este ficheiro não pode ser pré-visualizado aqui (não é texto).','files.discardConfirm':'Descartar alterações não guardadas?','files.newFilePrompt':'Caminho do novo ficheiro (ex. notes/todo.md):','files.newFolderPrompt':'Caminho da nova pasta:','files.refresh':'Atualizar','files.discard':'Descartar','files.create':'Criar',
+  'drawer.loading':'A carregar…','drawer.loadError':'Não foi possível carregar este ficheiro.','files.title':'Ficheiros','files.sub':'Percorra os ficheiros do projeto — veja Markdown e HTML, edite qualquer ficheiro de texto, crie novos.','files.newFile':'+ Ficheiro','files.newFolder':'+ Pasta','files.pickFile':'Selecione um ficheiro para o ver.','files.empty':'Ainda não há ficheiros.','files.edit':'Editar','files.preview':'Pré-visualizar','files.save':'Guardar','files.saved':'✓ guardado','files.saveError':'Não foi possível guardar este ficheiro.','files.loadError':'Não foi possível carregar este ficheiro.','files.binary':'Este ficheiro não pode ser pré-visualizado aqui (não é texto).','files.discardConfirm':'Descartar alterações não guardadas?','files.newFilePrompt':'Nome do novo ficheiro (ex. todo.md):','files.newFolderPrompt':'Nome da nova pasta:','files.projectRoot':'raiz do projeto','files.creatingIn':'A criar em: {path}','files.refresh':'Atualizar','files.discard':'Descartar','files.create':'Criar',
   'chat.widgetTitle':'Executar um agente','chat.widgetSub':'Acesso rápido · vista completa no separador Chat',
   'chat.tabSub':'Conversa completa com o executor — a mesma execução do widget, com mais espaço para ler.',
   'chat.idle':'Escreva um pedido — o agente corre sem supervisão neste projeto com toda a sua memória (<code>CLAUDE.md → AGENTS.md</code>) e atualiza o painel em direto.',
   'chat.inputPlaceholder':'ex. Adicionar login com email + palavra-passe',
   'chat.orchestrateTitle':'Percorrer o workflow ativado','chat.summarizeTitle':'Condensar a atividade recente num resumo','chat.clearTitle':'Limpar o registo do chat',
-  'chat.warn':'⚠ Inicia um agente real (<code>config.json → runners</code>) que pode alterar ficheiros e executar comandos.',
+  'chat.warn':'⚠ Inicia um agente real (<code>config.json → runners</code>) que pode alterar ficheiros e executar comandos.','chat.running':'Agente em execução…',
   'info.title':'Info','info.sub':'Visão geral do projeto — configuração, contagens, specs e workflow ativo.',
   'info.project':'Projeto','info.projectType':'Tipo de projeto','info.mode':'Modo','info.language':'Idioma',
   'info.activeAgent':'Agente ativo','info.runners':'Runners','info.noRunners':'Nenhum runner configurado.',
@@ -645,13 +645,13 @@ it: {
   'team.skillsTitle':'Skill','team.skillsSub':'Procedure in evoluzione — il <em>come</em>.',
   'team.standardsLabel':'standard','team.usesLabel':'usa','team.standardLabel':'standard',
   'drawer.agent':'Agente','drawer.skill':'Skill','drawer.file':'File · {rel}',
-  'drawer.loading':'Caricamento…','drawer.loadError':'Impossibile caricare questo file.','files.title':'File','files.sub':'Sfoglia i file del progetto — visualizza Markdown e HTML, modifica qualsiasi file di testo, creane di nuovi.','files.newFile':'+ File','files.newFolder':'+ Cartella','files.pickFile':'Seleziona un file per visualizzarlo.','files.empty':'Nessun file ancora.','files.edit':'Modifica','files.preview':'Anteprima','files.save':'Salva','files.saved':'✓ salvato','files.saveError':'Impossibile salvare questo file.','files.loadError':'Impossibile caricare questo file.','files.binary':'Questo file non può essere visualizzato qui (non è testo).','files.discardConfirm':'Scartare le modifiche non salvate?','files.newFilePrompt':'Percorso del nuovo file (es. notes/todo.md):','files.newFolderPrompt':'Percorso della nuova cartella:','files.refresh':'Aggiorna','files.discard':'Scarta','files.create':'Crea',
+  'drawer.loading':'Caricamento…','drawer.loadError':'Impossibile caricare questo file.','files.title':'File','files.sub':'Sfoglia i file del progetto — visualizza Markdown e HTML, modifica qualsiasi file di testo, creane di nuovi.','files.newFile':'+ File','files.newFolder':'+ Cartella','files.pickFile':'Seleziona un file per visualizzarlo.','files.empty':'Nessun file ancora.','files.edit':'Modifica','files.preview':'Anteprima','files.save':'Salva','files.saved':'✓ salvato','files.saveError':'Impossibile salvare questo file.','files.loadError':'Impossibile caricare questo file.','files.binary':'Questo file non può essere visualizzato qui (non è testo).','files.discardConfirm':'Scartare le modifiche non salvate?','files.newFilePrompt':'Nome del nuovo file (es. todo.md):','files.newFolderPrompt':'Nome della nuova cartella:','files.projectRoot':'radice del progetto','files.creatingIn':'Creazione in: {path}','files.refresh':'Aggiorna','files.discard':'Scarta','files.create':'Crea',
   'chat.widgetTitle':'Avvia un agente','chat.widgetSub':'Accesso rapido · vista completa nella scheda Chat',
   'chat.tabSub':'Conversazione completa con l’esecutore — la stessa esecuzione del widget, con più spazio per leggerla.',
   'chat.idle':'Digita una richiesta — l’agente viene eseguito senza supervisione in questo progetto con tutta la sua memoria (<code>CLAUDE.md → AGENTS.md</code>) e aggiorna la bacheca in diretta.',
   'chat.inputPlaceholder':'es. Aggiungi un login con email + password',
   'chat.orchestrateTitle':'Percorri il workflow attivato','chat.summarizeTitle':'Condensa l’attività recente in un riassunto','chat.clearTitle':'Cancella il registro della chat',
-  'chat.warn':'⚠ Avvia un agente reale (<code>config.json → runners</code>) che può modificare file ed eseguire comandi.',
+  'chat.warn':'⚠ Avvia un agente reale (<code>config.json → runners</code>) che può modificare file ed eseguire comandi.','chat.running':'Agente in esecuzione…',
   'info.title':'Info','info.sub':'Panoramica del progetto — configurazione, conteggi, specs e workflow attivo.',
   'info.project':'Progetto','info.projectType':'Tipo di progetto','info.mode':'Modalità','info.language':'Lingua',
   'info.activeAgent':'Agente attivo','info.runners':'Runner','info.noRunners':'Nessun runner configurato.',

package/templates/dashboard/public/index.html

@@ -226,6 +226,7 @@
               <button id="filesRefresh" class="btn" type="button" title="Refresh" data-i18n-title="files.refresh">⟳</button>
             </div>
             <div class="files-create-form" id="filesCreateForm" hidden>
+              <div class="files-create-target" id="filesCreateTarget"></div>
               <input type="text" id="filesCreateInput" class="bl-add-input" autocomplete="off" />
               <div class="files-create-actions">
                 <button id="filesCreateGo" class="btn primary" type="button" data-i18n="files.create">Create</button>
@@ -233,6 +234,7 @@
               </div>
               <span class="files-error-tip" id="filesCreateError" hidden></span>
             </div>
+            <div class="f-row f-root" id="filesRootRow" tabindex="0" data-i18n="files.projectRoot">project root</div>
             <div class="files-tree" id="filesTree"></div>
           </div>
           <div class="files-content-col" id="filesContent">
@@ -270,6 +272,7 @@
           </div>
         </div>
         <p class="chat-warn" data-i18n-html="chat.warn">⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.</p>
+        <p class="chat-status" id="tabChatStatus" hidden><span class="spinner" aria-hidden="true"></span><span data-i18n="chat.running">Agent running…</span></p>
       </div>
     </section>
 
@@ -389,6 +392,7 @@
       <button id="orchBtn" class="btn chat-send" data-i18n-title="chat.orchestrateTitle" data-i18n="action.orchestrate" title="Walk the enabled workflow">Orchestrate</button>
     </div>
     <p class="chat-warn" data-i18n-html="chat.warn">⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.</p>
+    <p class="chat-status" id="widgetChatStatus" hidden><span class="spinner" aria-hidden="true"></span><span data-i18n="chat.running">Agent running…</span></p>
   </div>
 
   <div class="drawer" id="drawer" aria-hidden="true">

package/templates/dashboard/public/styles.css

@@ -294,7 +294,7 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .team-wrap { max-width:1500px; } /* the agent/skill .cards grid fills more columns instead of sitting capped */
 
 /* Files tab — a two-pane explorer: a collapsible tree, and the selected file's preview/editor */
-.files-wrap { padding:26px 28px 60px; max-width:1600px; height:calc(100vh - 130px); display:flex; flex-direction:column; }
+.files-wrap { padding:26px 28px 16px; max-width:1600px; height:calc(100vh - 90px); display:flex; flex-direction:column; }
 .files-body { flex:1; min-height:0; display:flex; gap:16px; margin-top:8px; }
 .files-tree-col { width:280px; flex-shrink:0; display:flex; flex-direction:column; gap:8px; min-height:0; }
 .files-toolbar { display:flex; gap:8px; }
@@ -304,12 +304,18 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .files-create-form .bl-add-input { width:100%; }
 .files-create-actions { display:flex; gap:8px; }
 .files-create-actions .btn { font-size:12px; padding:6px 11px; }
-.files-tree { flex:1; min-height:0; overflow:auto; border:1px solid var(--line); border-radius:var(--radius); padding:8px; background:var(--surface); }
+.files-tree { flex:1; min-height:0; overflow:auto; border:1px solid var(--line); border-radius:var(--radius); padding:8px; background:var(--surface); scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
+.files-tree::-webkit-scrollbar { width:8px; }
+.files-tree::-webkit-scrollbar-thumb { background:var(--line); border-radius:8px; }
+.files-tree::-webkit-scrollbar-track { background:transparent; }
 .files-content-col { flex:1; min-width:0; display:flex; flex-direction:column; min-height:0; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); overflow:hidden; }
 .files-empty,.files-binary { padding:40px; text-align:center; color:var(--faint); font-style:italic; }
 .f-row { display:flex; align-items:center; gap:6px; padding:4px 6px; border-radius:6px; cursor:pointer; font-size:12.5px; white-space:nowrap; color:var(--muted); }
 .f-row:hover { background:var(--surface-2); color:var(--ink); }
 .f-row.is-active { background:var(--surface-2); color:var(--signal); font-weight:600; }
+.f-row.is-target { background:color-mix(in srgb,var(--signal) 14%,transparent); color:var(--ink); } /* the folder new files/folders will be created in */
+.f-root { font-weight:600; margin-bottom:4px; padding-bottom:6px; border-bottom:1px solid var(--line); border-radius:0; }
+.files-create-target { font-size:11px; color:var(--muted); font-family:var(--mono); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .f-row .f-chevron { width:11px; height:11px; flex-shrink:0; transition:transform .15s; color:var(--faint); }
 .f-row.is-open .f-chevron { transform:rotate(90deg); }
 .f-row .f-name { overflow:hidden; text-overflow:ellipsis; }
@@ -320,8 +326,26 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .files-actions { display:flex; gap:8px; flex-shrink:0; }
 .files-actions .btn { font-size:12px; padding:6px 11px; }
 .files-body-col { flex:1; min-height:0; display:flex; flex-direction:column; }
+.files-view,.files-editor { scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
+.files-view::-webkit-scrollbar,.files-editor::-webkit-scrollbar { width:8px; }
+.files-view::-webkit-scrollbar-thumb,.files-editor::-webkit-scrollbar-thumb { background:var(--line); border-radius:8px; }
+.files-view::-webkit-scrollbar-track,.files-editor::-webkit-scrollbar-track { background:transparent; }
 .files-view { flex:1; min-height:0; overflow:auto; padding:16px 20px; }
 .files-editor { flex:1; min-height:0; width:100%; border:0; resize:none; padding:16px 20px; font-family:var(--mono); font-size:12.5px; line-height:1.6; background:var(--surface); color:var(--ink); outline:none; }
+/* syntax-highlighted editor: a transparent textarea (real caret, real selection, real typing) sits
+   exactly on top of a highlighted <pre><code> backdrop showing through it — the standard technique
+   for highlighting without a full editor component. Both share identical font metrics so characters
+   line up; the backdrop never scrolls on its own (overflow:hidden), its scroll position is just
+   copied from the textarea on every scroll event. */
+.files-code-wrap { position:relative; flex:1; min-height:0; }
+.files-code-backdrop { position:absolute; inset:0; margin:0; overflow:hidden; pointer-events:none; white-space:pre-wrap; word-break:break-word; padding:16px 20px; font-family:var(--mono); font-size:12.5px; line-height:1.6; color:var(--ink); background:transparent; }
+.files-code-backdrop code { font:inherit; background:none; }
+.files-code-wrap .files-code-input { position:absolute; inset:0; background:transparent; color:transparent; caret-color:var(--ink); white-space:pre-wrap; word-break:break-word; }
+.hl-comment { color:var(--faint); font-style:italic; }
+.hl-string { color:var(--s-done); }
+.hl-number { color:var(--cool); }
+.hl-keyword { color:var(--signal); font-weight:600; }
+.hl-tag { color:var(--s-in_progress); }
 .files-iframe { flex:1; min-height:0; width:100%; border:0; background:#fff; }
 .files-md-toolbar { display:flex; gap:6px; padding:8px 14px; border-bottom:1px solid var(--line); }
 .files-md-toolbar button { font-family:var(--mono); font-size:12px; padding:4px 9px; border:1px solid var(--line); border-radius:6px; background:var(--surface-2); color:var(--ink); cursor:pointer; }
@@ -457,6 +481,13 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .chat-ta:focus { outline:2px solid var(--cool); outline-offset:1px; }
 .chat-send { flex:0 0 auto; align-self:auto; padding:8px 16px; }
 .chat-warn { font-size:10.5px; color:var(--signal); margin:6px 12px 10px; }
+body.chat-busy .chat-warn { display:none; } /* the running status below replaces it — one message at a time */
+.chat-status { display:flex; align-items:center; gap:8px; font-size:11.5px; color:var(--signal); margin:6px 12px 10px; font-weight:600; }
+.chat-status[hidden] { display:none; }
+.chat-status .spinner { width:12px; height:12px; border-radius:50%; flex-shrink:0; border:2px solid color-mix(in srgb,var(--signal) 28%,transparent); border-top-color:var(--signal); animation:chat-spin .7s linear infinite; }
+@keyframes chat-spin { to { transform:rotate(360deg); } }
+.chat-send:disabled,.mini-btn:disabled { opacity:.5; cursor:not-allowed; }
+@media (prefers-reduced-motion: reduce) { .chat-status .spinner { animation:none; } }
 .approval { display:flex; flex-direction:column; gap:8px; padding:10px 12px; background:var(--surface-2); border:1px solid color-mix(in srgb,var(--signal) 40%,var(--line)); border-radius:var(--radius); box-shadow:var(--shadow); }
 .approval .c-actions { display:flex; gap:8px; }
 #orchBtn,#tabOrchBtn { background:var(--cool); color:#04202a; border-color:transparent; font-weight:600; }
@@ -478,7 +509,7 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .chat-tab-input { display:flex; gap:10px; margin-top:10px; }
 .chat-tab-input .chat-ta { flex:1; min-height:56px; max-height:180px; }
 .chat-tab-actions { display:flex; flex-direction:column; gap:8px; flex-shrink:0; }
-.chat-tab-wrap .chat-warn { margin:8px 0 0; }
+.chat-tab-wrap .chat-warn,.chat-tab-wrap .chat-status { margin:8px 0 0; }
 @media (max-width:640px){ .chat-tab-input { flex-direction:column; } .chat-tab-actions { flex-direction:row; } }
 
 /* ---- chart & panel motion --------------------------------------------- */

package/templates/dashboard/runner.js

@@ -77,7 +77,10 @@ function startRun(root, { prompt, agent, logPrompt = true }, emit) {
   runStart(root, run); emit({ type: 'run-start', run }); emit({ type: 'change' });
 
   let child;
-  try { child = spawn(parts[0], [...parts.slice(1), p], { cwd: root, env: process.env }); }
+  // windowsHide: without it, spawning a .cmd-shimmed CLI (e.g. a global npm install of `claude` on
+  // Windows) pops up a real, empty console window on top of the browser — jarring, and pointless
+  // since stdout/stderr are already piped and captured below, never read from that window anyway.
+  try { child = spawn(parts[0], [...parts.slice(1), p], { cwd: root, env: process.env, windowsHide: true }); }
   catch (e) {
     runEnd(root, runId, 1);
     emit({ type: 'run-line', runId, chunk: 'spawn error: ' + e.message + '\n' });

package/templates/dashboard/summarize.js

@@ -38,9 +38,15 @@ function runSummarize(root, { agent } = {}, emit) {
     + '\n\n' + formatLog(messages);
 
   const parts = cmdStr.split(/\s+/).filter(Boolean);
+  const runId = 'summarize-' + Date.now().toString(36);
+  // Emitted before the spawn attempt (same order runner.js uses) so the client's "agent running"
+  // indicator lights up immediately, and so a spawn failure below still gets a matching run-end
+  // rather than leaving that indicator stuck on.
+  if (emit) emit({ type: 'run-start', run: { id: runId } });
   let child;
-  try { child = spawn(parts[0], [...parts.slice(1), prompt], { cwd: root, env: process.env }); }
-  catch (e) { return { error: e.message }; }
+  // windowsHide: without it, spawning a .cmd-shimmed CLI on Windows pops up a real console window.
+  try { child = spawn(parts[0], [...parts.slice(1), prompt], { cwd: root, env: process.env, windowsHide: true }); }
+  catch (e) { if (emit) emit({ type: 'run-end', runId, code: 1 }); return { error: e.message }; }
   try { child.stdin && child.stdin.end(); } catch {}
 
   let out = '';
@@ -63,7 +69,7 @@ function runSummarize(root, { agent } = {}, emit) {
     fresh.messages = (fresh.messages || []).filter((m) => !summarizedIds.has(m.id));
     fresh.messages.push(summary);
     store.writeRuntime(root, fresh);
-    if (emit) { emit({ type: 'message', message: summary }); emit({ type: 'change' }); }
+    if (emit) { emit({ type: 'run-end', runId, code }); emit({ type: 'message', message: summary }); emit({ type: 'change' }); }
   });
   return { child };
 }