@cccarv82/freya 2.9.0 → 2.11.0

package/cli/web-ui.js

@@ -330,6 +330,47 @@
     }
   }
 
+  // Unified input → Oracle (RAG): reads from the main inboxText textarea
+  async function askFreyaFromInput() {
+    const ta = $('inboxText');
+    const query = ta ? (ta.value || '').trim() : '';
+    if (!query) {
+      setPill('err', 'vazio');
+      setTimeout(() => setPill('ok', 'pronto'), 800);
+      return;
+    }
+
+    if (ta) ta.value = '';
+
+    // Update mode tag
+    const tag = $('chatModeTag');
+    if (tag) { tag.textContent = 'oracle'; tag.style.color = 'var(--accent)'; tag.style.borderColor = 'var(--accent)'; }
+
+    chatAppend('user', query);
+    setPill('run', 'pesquisando…');
+
+    const typingId = 'typing-' + Date.now();
+    chatAppend('assistant', '<div class="typing-indicator"><span></span><span></span><span></span></div>', { id: typingId, html: true });
+
+    try {
+      const sessionId = ensureChatSession();
+      const r = await api('/api/chat/ask', { dir: dirOrDefault(), sessionId, query });
+      const answer = r && r.answer ? r.answer : 'Não encontrei registro';
+
+      const el = $(typingId);
+      if (el) el.remove();
+
+      chatAppend('assistant', answer, { markdown: true });
+      setPill('ok', 'pronto');
+      if (tag) setTimeout(() => { tag.textContent = 'oracle'; tag.style.color = ''; tag.style.borderColor = ''; }, 2000);
+    } catch (e) {
+      const el = $(typingId);
+      if (el) el.remove();
+      setPill('err', 'falhou');
+      chatAppend('assistant', '❌ ' + String(e && e.message ? e.message : e));
+    }
+  }
+
   function setOut(text) {
     state.lastText = text || '';
     const el = $('reportPreview');
@@ -1317,11 +1358,65 @@
     }
   }
 
+  // Priority → color + icon
+  function priColor(pri) {
+    const p = String(pri || '').toUpperCase();
+    if (p === 'CRITICAL') return { dot: '#ef4444', label: 'CRÍTICA' };
+    if (p === 'HIGH')     return { dot: '#f97316', label: 'ALTA' };
+    if (p === 'MEDIUM')   return { dot: '#eab308', label: 'MÉDIA' };
+    if (p === 'LOW')      return { dot: '#22c55e', label: 'BAIXA' };
+    return { dot: 'var(--muted)', label: p || '—' };
+  }
+
+  // Severity → color
+  function sevColor(sev) {
+    const s = String(sev || '').toUpperCase();
+    if (s === 'CRITICAL') return '#ef4444';
+    if (s === 'HIGH')     return '#f97316';
+    if (s === 'MEDIUM')   return '#eab308';
+    return '#94a3b8';
+  }
+
   function renderSwimlanes(tasks, blockers) {
     const el = $('swimlaneContainer');
     if (!el) return;
     el.innerHTML = '';
 
+    // Update top-level summary chips
+    const chips = $('focusSummaryChips');
+    if (chips) {
+      chips.innerHTML = '';
+      if (blockers.length > 0) {
+        const bc = document.createElement('span');
+        bc.style.cssText = 'font-size:11px; font-weight:700; padding:2px 8px; border-radius:10px; background:rgba(239,68,68,0.12); color:#f87171; border:1px solid rgba(239,68,68,0.3);';
+        bc.textContent = blockers.length + ' blocker' + (blockers.length > 1 ? 's' : '');
+        chips.appendChild(bc);
+      }
+      if (tasks.length > 0) {
+        const tc = document.createElement('span');
+        tc.style.cssText = 'font-size:11px; font-weight:700; padding:2px 8px; border-radius:10px; background:rgba(34,197,94,0.10); color:#4ade80; border:1px solid rgba(34,197,94,0.25);';
+        tc.textContent = tasks.length + ' task' + (tasks.length > 1 ? 's' : '');
+        chips.appendChild(tc);
+      }
+    }
+
+    // Update progress bar (tasks completed today vs total — we show pending count)
+    const progWrap = $('focusProgressWrap');
+    const progBar = $('focusProgressBar');
+    const progLabel = $('focusProgressLabel');
+    if (progWrap) {
+      if (tasks.length > 0 || blockers.length > 0) {
+        progWrap.style.display = 'flex';
+        // We only have pending tasks here; show blockers impact
+        const blocker_pct = blockers.length === 0 ? 100 : Math.max(10, Math.round((1 - blockers.length / Math.max(tasks.length + blockers.length, 1)) * 100));
+        if (progBar) progBar.style.width = blocker_pct + '%';
+        if (progBar) progBar.style.background = blockers.length > 0 ? '#f97316' : 'var(--accent)';
+        if (progLabel) progLabel.textContent = blockers.length > 0 ? blockers.length + ' blocking' : 'tudo livre';
+      } else {
+        progWrap.style.display = 'none';
+      }
+    }
+
     const groups = {};
     const addGroup = (slug) => {
       const key = slug || 'Global / Sem Projeto';
@@ -1337,41 +1432,55 @@
       if (b === 'Global / Sem Projeto') return -1;
       return a.localeCompare(b);
     });
-
     sortedKeys.sort((a, b) => groups[b].blockers.length - groups[a].blockers.length);
 
     if (sortedKeys.length === 0) {
       const empty = document.createElement('div');
-      empty.className = 'help';
-      empty.textContent = 'Nenhuma tarefa ou bloqueio pendente hoje.';
+      empty.style.cssText = 'display:flex; flex-direction:column; align-items:center; justify-content:center; padding:48px 24px; gap:8px; flex:1;';
+      empty.innerHTML = '<div style="font-size:28px; line-height:1;">✅</div>'
+        + '<div style="font-size:14px; font-weight:600; color:var(--text);">Dia limpo!</div>'
+        + '<div style="font-size:12px; color:var(--muted); text-align:center;">Nenhuma tarefa pendente (DO_NOW) nem bloqueios em aberto. Use o campo acima para registrar o que estiver fazendo.</div>';
       el.appendChild(empty);
       return;
     }
 
     const createTaskRow = (t) => {
       const row = document.createElement('div');
-      row.className = 'rep';
-      const pri = (t.priority || '').toUpperCase();
-      row.innerHTML = '<div style="display:flex; justify-content:space-between; gap:10px; align-items:center">'
-        + '<div style="min-width:0"><div style="font-weight:600">' + escapeHtml(t.description || '') + '</div>'
-        + '<div style="opacity:.7; font-size:11px; margin-top:4px; font-weight:500;">' + escapeHtml(String(t.category || ''))
-        + (pri ? (' · ' + escapeHtml(pri)) : '') + '</div></div>'
-        + '<div style="display:flex; gap:8px">'
-        + '<button class="btn small complete-btn" type="button">Concluir</button>'
-        + '<button class="btn small edit-btn" type="button">Editar</button>'
+      const pc = priColor(t.priority);
+      row.style.cssText = 'display:flex; justify-content:space-between; gap:10px; align-items:center; padding:10px 16px; background:var(--bg); border-bottom:1px solid var(--border); transition:background 0.15s;';
+      row.onmouseover = () => row.style.background = 'var(--paper)';
+      row.onmouseout = () => row.style.background = 'var(--bg)';
+      row.innerHTML =
+        '<div style="display:flex; align-items:center; gap:10px; min-width:0; flex:1;">'
+        + '<div style="width:8px; height:8px; border-radius:50%; background:' + pc.dot + '; flex-shrink:0;" title="Prioridade: ' + escapeHtml(pc.label) + '"></div>'
+        + '<div style="min-width:0;">'
+        + '<div style="font-weight:600; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;">' + escapeHtml(t.description || '') + '</div>'
+        + '<div style="font-size:11px; color:var(--muted); margin-top:2px;">'
+        + escapeHtml(pc.label)
+        + (t.category ? ' · <span style="font-family:var(--mono);">' + escapeHtml(t.category) + '</span>' : '')
         + '</div>'
+        + '</div></div>'
+        + '<div style="display:flex; gap:6px; flex-shrink:0;">'
+        + '<button class="btn small complete-btn" type="button" style="padding:3px 10px; font-size:11px;" title="Marcar como concluída">✓ Concluir</button>'
+        + '<button class="btn small edit-btn" type="button" style="padding:3px 8px; font-size:11px;">✎</button>'
         + '</div>';
       row.querySelector('.edit-btn').onclick = () => editTask(t);
       row.querySelector('.complete-btn').onclick = async () => {
+        const btn = row.querySelector('.complete-btn');
+        btn.disabled = true;
+        btn.textContent = '…';
         try {
-          setPill('run', 'completing…');
+          setPill('run', 'concluindo…');
           await api('/api/tasks/complete', { dir: dirOrDefault(), id: t.id });
+          row.style.opacity = '0.4';
+          row.style.pointerEvents = 'none';
           await refreshToday();
-          setPill('ok', 'completed');
+          setPill('ok', 'concluída');
           setTimeout(() => setPill('ok', 'pronto'), 800);
         } catch (e) {
-          setPill('err', 'complete failed');
-          setOut(String(e && e.message ? e.message : e));
+          btn.disabled = false;
+          btn.textContent = '✓ Concluir';
+          setPill('err', 'falhou');
         }
       };
       return row;
@@ -1379,81 +1488,57 @@
 
     const createBlockerRow = (b) => {
       const row = document.createElement('div');
-      row.className = 'rep';
-      row.style.borderLeft = '4px solid var(--warn)';
-      row.style.background = 'var(--warn-bg)';
       const sev = String(b.severity || '').toUpperCase();
-      row.innerHTML = '<div style="display:flex; justify-content:space-between; gap:10px; align-items:center">'
-        + '<div style="min-width:0"><div style="font-weight:800; color:var(--warn)">' + escapeHtml(sev) + '</div>'
-        + '<div style="margin-top:4px; font-weight:600;">' + escapeHtml(b.title || '') + '</div>'
+      const color = sevColor(sev);
+      const when = fmtWhen(new Date(b.createdAt || Date.now()).getTime());
+      row.style.cssText = 'display:flex; justify-content:space-between; gap:10px; align-items:center; padding:10px 16px; border-bottom:1px solid rgba(239,68,68,0.15); border-left:3px solid ' + color + '; background:rgba(239,68,68,0.04); transition:background 0.15s;';
+      row.onmouseover = () => row.style.background = 'rgba(239,68,68,0.08)';
+      row.onmouseout = () => row.style.background = 'rgba(239,68,68,0.04)';
+      row.innerHTML =
+        '<div style="display:flex; align-items:flex-start; gap:10px; min-width:0; flex:1;">'
+        + '<div style="flex-shrink:0; margin-top:1px;">'
+        + '<span style="font-size:10px; font-weight:800; letter-spacing:0.5px; padding:2px 6px; border-radius:4px; background:' + color + '22; color:' + color + '; border:1px solid ' + color + '44;">' + escapeHtml(sev || 'BLOCKER') + '</span>'
         + '</div>'
-        + '<div style="display:flex; gap:8px; align-items:center">'
-        + '<div style="opacity:.7; font-size:11px; white-space:nowrap; font-weight:500;">' + escapeHtml(fmtWhen(new Date(b.createdAt || Date.now()).getTime())) + '</div>'
-        + '<button class="btn small edit-btn" type="button" style="border-color:var(--warn); color:var(--warn);">Editar</button>'
-        + '</div>'
-        + '</div>';
+        + '<div style="min-width:0; flex:1;">'
+        + '<div style="font-weight:600; font-size:13px; color:var(--text);">' + escapeHtml(b.title || '') + '</div>'
+        + '<div style="font-size:11px; color:var(--muted); margin-top:3px;">🕐 ' + escapeHtml(when) + '</div>'
+        + '</div></div>'
+        + '<button class="btn small edit-btn" type="button" style="padding:3px 8px; font-size:11px; flex-shrink:0; border-color:' + color + '66; color:' + color + ';">✎</button>';
       row.querySelector('.edit-btn').onclick = () => editBlocker(b);
       return row;
     };
 
     for (const key of sortedKeys) {
       const g = groups[key];
+      const bCount = g.blockers.length;
+      const tCount = g.tasks.length;
+      const hasBlockers = bCount > 0;
+
       const swimlane = document.createElement('div');
-      swimlane.className = 'panel';
-      swimlane.style.border = '1px solid var(--border)';
-      swimlane.style.borderRadius = '8px';
-      swimlane.style.boxShadow = 'none';
-      swimlane.style.overflow = 'hidden';
+      swimlane.style.cssText = 'border-bottom:1px solid var(--border); overflow:hidden;';
 
       const head = document.createElement('div');
-      head.style.display = 'flex';
-      head.style.justifyContent = 'space-between';
-      head.style.alignItems = 'center';
-      head.style.cursor = 'pointer';
-      head.style.padding = '10px 16px';
-      head.style.background = 'var(--bg2)';
-      head.style.borderBottom = '1px solid var(--border)';
-      head.style.transition = 'background 0.2s';
+      head.style.cssText = 'display:flex; justify-content:space-between; align-items:center; cursor:pointer; padding:9px 16px; background:var(--bg2); transition:background 0.15s;'
+        + (hasBlockers ? 'border-left:3px solid #f97316;' : 'border-left:3px solid transparent;');
       head.onmouseover = () => head.style.background = 'var(--paper2)';
       head.onmouseout = () => head.style.background = 'var(--bg2)';
 
-      const bCount = g.blockers.length;
-      const tCount = g.tasks.length;
-
       head.innerHTML = `
-        <div style="font-weight:700; font-size:13px; display:flex; gap:8px; align-items:center;">
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="opacity:0.6; transition: transform 0.2s;"><polyline points="6 9 12 15 18 9"></polyline></svg>
-          <span style="font-family: var(--mono); color: var(--accent);">${escapeHtml(key)}</span>
+        <div style="display:flex; align-items:center; gap:8px; min-width:0;">
+          <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0; opacity:0.5; transition:transform 0.2s;"><polyline points="6 9 12 15 18 9"></polyline></svg>
+          <span style="font-family:var(--mono); font-size:12px; font-weight:700; color:var(--accent); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;">${escapeHtml(key)}</span>
         </div>
-        <div style="display:flex; gap:6px; font-size:11px;">
-          ${bCount > 0 ? `<span style="color:var(--warn); background:var(--warn-bg); padding:2px 8px; border-radius:12px; font-weight:700;">🔴 ${bCount} Blockers</span>` : ''}
-          ${tCount > 0 ? `<span style="color:var(--info); background:var(--bg2); border: 1px solid var(--border); padding:2px 8px; border-radius:12px; font-weight:700;">🟢 ${tCount} Tasks</span>` : ''}
+        <div style="display:flex; gap:5px; align-items:center; flex-shrink:0;">
+          ${bCount > 0 ? `<span style="font-size:11px; font-weight:700; padding:2px 7px; border-radius:10px; background:rgba(239,68,68,0.12); color:#f87171; border:1px solid rgba(239,68,68,0.3);">⛔ ${bCount}</span>` : ''}
+          ${tCount > 0 ? `<span style="font-size:11px; font-weight:700; padding:2px 7px; border-radius:10px; background:rgba(34,197,94,0.10); color:#4ade80; border:1px solid rgba(34,197,94,0.25);">✓ ${tCount}</span>` : ''}
         </div>
       `;
 
       const body = document.createElement('div');
-      body.style.display = 'flex';
-      body.style.flexDirection = 'column';
-      body.style.background = 'var(--bg)';
-
-      for (const b of g.blockers) {
-        const r = createBlockerRow(b);
-        r.style.margin = '0';
-        r.style.borderRadius = '0';
-        r.style.borderBottom = '1px solid var(--border)';
-        r.style.borderLeft = '4px solid var(--warn)';
-        r.style.boxShadow = 'none';
-        body.appendChild(r);
-      }
-      for (const t of g.tasks) {
-        const r = createTaskRow(t);
-        r.style.margin = '0';
-        r.style.borderRadius = '0';
-        r.style.borderBottom = '1px solid var(--border)';
-        r.style.borderLeft = '4px solid transparent';
-        r.style.boxShadow = 'none';
-        body.appendChild(r);
-      }
+      body.style.cssText = 'display:flex; flex-direction:column; background:var(--bg);';
+
+      for (const b of g.blockers) body.appendChild(createBlockerRow(b));
+      for (const t of g.tasks) body.appendChild(createTaskRow(t));
 
       let isOpen = true;
       head.onclick = () => {
@@ -1484,22 +1569,30 @@
 
   function renderBlockersInsights(payload) {
     const el = $('blockersInsights');
+    const wrap = $('blockersInsightsWrap');
     if (!el) return;
+
     if (!payload || !payload.summary) {
-      el.textContent = 'Sem insights no momento.';
+      // Hide the strip if no content
+      if (wrap) wrap.style.display = 'none';
       return;
     }
+
     const lines = [];
-    lines.push('<div class="help" style="margin-bottom:6px"><b>Resumo:</b> ' + escapeHtml(payload.summary) + '</div>');
+    lines.push('<div style="margin-bottom:6px; color:var(--text);">' + escapeHtml(payload.summary) + '</div>');
     if (payload.suggestions && payload.suggestions.length) {
-      lines.push('<div class="help"><b>Proximos passos:</b></div>');
-      lines.push('<ul style="margin:6px 0 0 18px; padding:0;">' + payload.suggestions.map((s) => '<li class="help">' + escapeHtml(s) + '</li>').join('') + '</ul>');
+      lines.push('<div style="font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:0.5px; color:var(--muted); margin:8px 0 4px;">Próximos passos</div>');
+      lines.push('<ul style="margin:0 0 0 14px; padding:0;">' + payload.suggestions.map((s) => '<li style="margin-bottom:3px;">' + escapeHtml(s) + '</li>').join('') + '</ul>');
     }
     if (payload.top && payload.top.length) {
-      lines.push('<div class="help" style="margin-top:8px"><b>Top blockers:</b></div>');
-      lines.push('<ul style="margin:6px 0 0 18px; padding:0;">' + payload.top.map((b) => '<li class="help">' + escapeHtml(String(b.severity || '')) + ' - ' + escapeHtml(String(b.title || '')) + '</li>').join('') + '</ul>');
+      lines.push('<div style="font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:0.5px; color:var(--muted); margin:8px 0 4px;">Top blockers</div>');
+      lines.push('<ul style="margin:0 0 0 14px; padding:0;">' + payload.top.map((b) => {
+        const c = sevColor(String(b.severity || '').toUpperCase());
+        return '<li style="margin-bottom:3px;"><span style="color:' + c + '; font-weight:700;">' + escapeHtml(String(b.severity || '')) + '</span> — ' + escapeHtml(String(b.title || '')) + '</li>';
+      }).join('') + '</ul>');
     }
     el.innerHTML = lines.join('');
+    if (wrap) wrap.style.display = 'block';
   }
 
   async function refreshBlockersInsights() {
@@ -2125,16 +2218,21 @@
       if (!ta) return;
       const text = (ta.value || '').trim();
       if (!text) {
-        setPill('err', 'empty');
+        setPill('err', 'vazio');
+        setTimeout(() => setPill('ok', 'pronto'), 800);
         return;
       }
 
+      // Update mode tag
+      const tag = $('chatModeTag');
+      if (tag) { tag.textContent = 'inbox'; tag.style.color = 'var(--primary)'; tag.style.borderColor = 'var(--primary)'; }
+
       chatAppend('user', text);
 
-      setPill('run', 'saving…');
+      setPill('run', 'salvando…');
       await api('/api/inbox/add', { dir: dirOrDefault(), text });
 
-      setPill('run', 'planning…');
+      setPill('run', 'processando…');
       const r = await api('/api/agents/plan', { dir: dirOrDefault(), text });
 
       state.lastPlan = r.plan || '';
@@ -2164,9 +2262,11 @@
         setPill('ok', 'planned');
       }
 
+      const tag2 = $('chatModeTag');
+      if (tag2) setTimeout(() => { tag2.textContent = 'oracle'; tag2.style.color = ''; tag2.style.borderColor = ''; }, 1500);
       setTimeout(() => setPill('ok', 'pronto'), 1200);
     } catch (e) {
-      setPill('err', 'plan failed');
+      setPill('err', 'falhou');
     }
   }
 
@@ -2385,4 +2485,5 @@
   window.exportChatObsidian = exportChatObsidian;
   window.askFreya = askFreya;
   window.askFreyaInline = askFreyaInline;
+  window.askFreyaFromInput = askFreyaFromInput;
 })();

package/cli/web.js

@@ -1207,122 +1207,135 @@ function buildHtml(safeDefault, appVersion) {
           </div>
 
           <div class="centerBody">
-            <section style="margin-bottom: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; height: 380px; max-height: 450px;">
-              <div class="promptBar" style="width: 100%; border-radius: 20px; height: 100%; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden;">
-                <div style="flex: 1; display: flex; flex-direction: column;">
-                  <div class="promptMeta">
-                    <div class="promptTitle" style="display: flex; align-items: center; gap: 8px;">
-                      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="color: var(--primary)"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg>
-                      <span>Inbox & Prompt</span>
-                    </div>
-                    <div id="status" class="small">pronto</div>
+            <!-- Unified Input + Chat Panel -->
+            <section style="margin-bottom: 24px; display: grid; grid-template-columns: 1fr 1.6fr; gap: 16px; height: 420px; max-height: 480px;">
+
+              <!-- Left: Unified Input -->
+              <div class="promptBar" style="width: 100%; border-radius: 20px; height: 100%; display: flex; flex-direction: column; overflow: hidden;">
+                <div class="promptMeta" style="flex-shrink:0;">
+                  <div class="promptTitle" style="display: flex; align-items: center; gap: 8px;">
+                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="color: var(--primary)"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg>
+                    <span>Freya Input</span>
                   </div>
-                  <textarea id="inboxText" placeholder="Cole updates do dia (status, blockers, decisões, ideias) ou faça uma pergunta para a Freya..." style="resize:none; flex: 1; min-height: 0;"></textarea>
+                  <div id="status" class="small">pronto</div>
                 </div>
-                <div style="display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 12px;">
-                  <div class="promptActions" style="margin: 0;">
-                    <button class="btn primary small" type="button" onclick="saveAndPlan()">Salvar + Processar</button>
-                    <button class="btn small" type="button" onclick="runSuggestedReports()">Rodar relatórios sugeridos</button>
-                  </div>
-                  <div class="promptToggles" style="margin: 0;">
-                    <label class="toggleRow">
+
+                <textarea id="inboxText" placeholder="Cole updates, decisões, blockers... ou faça uma pergunta à Freya.&#10;&#10;▸ Salvar & Processar → extrai tarefas e blockers&#10;▸ Perguntar → consulta o histórico (RAG)" style="resize:none; flex: 1; min-height: 0; border-radius: 0; border-left: none; border-right: none; border-top: none; border-bottom: 1px solid var(--border); padding: 14px 16px; font-size: 13px; line-height: 1.6;"
+                  onkeydown="if((event.metaKey||event.ctrlKey)&&event.key==='Enter'){event.preventDefault();window.saveAndPlan();}"></textarea>
+
+                <!-- Primary actions -->
+                <div style="padding: 10px 14px 6px; display: flex; gap: 8px; flex-wrap: wrap; flex-shrink:0;">
+                  <button class="btn primary small" type="button" onclick="saveAndPlan()" style="flex:1; min-width: 120px;" title="Ctrl+Enter">
+                    <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="display:inline;vertical-align:-2px;margin-right:5px"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg>
+                    Salvar & Processar
+                  </button>
+                  <button class="btn small" type="button" onclick="window.askFreyaFromInput()" style="flex:1; min-width: 90px;" title="Consulta semântica ao histórico">
+                    <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="display:inline;vertical-align:-2px;margin-right:5px"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>
+                    Perguntar
+                  </button>
+                </div>
+
+                <!-- Toggles + secondary -->
+                <div style="padding: 0 14px 12px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; flex-shrink:0;">
+                  <div class="promptToggles" style="margin:0;">
+                    <label class="toggleRow" title="Aplica o plano automaticamente após processar">
                       <input id="autoApply" type="checkbox" checked style="width:auto; margin: 0;" onchange="toggleAutoApply()" />
                       Auto-apply
                     </label>
-                    <label class="toggleRow">
+                    <label class="toggleRow" title="Roda relatórios sugeridos após aplicar">
                       <input id="autoRunReports" type="checkbox" style="width:auto; margin: 0;" onchange="toggleAutoRunReports()" />
-                      Auto-run reports
+                      Auto-reports
                     </label>
                   </div>
+                  <div style="display:flex; gap:6px;">
+                    <button class="btn small" type="button" onclick="runSuggestedReports()" title="Rodar relatórios sugeridos pelo último plan" style="font-size:11px; padding: 3px 8px;">📋 Sugeridos</button>
+                    <button class="btn small" type="button" onclick="exportChatObsidian()" style="font-size:11px; padding: 3px 8px;" title="Exportar conversa para Obsidian">⬆ Log</button>
+                  </div>
                 </div>
               </div>
 
+              <!-- Right: Unified Chat Thread (Oracle responses + Plan outputs) -->
               <div class="panel" style="height: 100%; display: flex; flex-direction: column;">
-                <div class="panelHead">
-                  <b style="display: flex; align-items: center; gap: 8px;">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>
-                    Consultar Oracle
+                <div class="panelHead" style="flex-shrink:0;">
+                  <b style="display: flex; align-items: center; gap: 8px; font-size:13px;">
+                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="color:var(--accent)"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>
+                    Conversa com a Freya
                   </b>
                   <div class="stack">
-                    <button class="btn small" type="button" onclick="exportChatObsidian()">Exportar Log</button>
-                  </div>
-                </div>
-                <div class="panelBody" style="flex:1; display:flex; flex-direction:column; padding:0; background:var(--glass-bg); min-height:0;">
-                  <div id="chatThread" style="flex:1; overflow-y:auto; overflow-x:hidden; padding:12px; display:flex; flex-direction:column; gap:8px;"></div>
-                  <div style="padding: 12px; border-top: 1px solid var(--glass-border); display:flex; gap: 8px; background: var(--paper);">
-                    <input type="text" id="oracleInput" autocomplete="off" style="flex:1;" placeholder="Pergunte algo à Freya..." onkeydown="if(event.key==='Enter') window.askFreyaInline()" />
-                    <button class="btn primary small" type="button" onclick="window.askFreyaInline()">Enviar</button>
+                    <span id="chatModeTag" style="font-size:11px; padding:2px 8px; border-radius:10px; background:var(--bg2); color:var(--muted); border:1px solid var(--border);">oracle</span>
                   </div>
                 </div>
+                <div id="chatThread" style="flex:1; overflow-y:auto; overflow-x:hidden; padding:12px; display:flex; flex-direction:column; gap:8px; min-height:0;"></div>
               </div>
             </section>
 
             <div class="centerHead">
               <div>
                 <h1 style="margin:0">Seu dia em um painel</h1>
-                <div class="subtitle">Workspaces, Hoje (tarefas/bloqueios), relatórios e preview. Use o painel da direita como um “chat” para capturar updates.</div>
+                <div class="subtitle">Use o campo acima para capturar updates (<b>Salvar &amp; Processar</b>) ou consultar o histórico (<b>Perguntar</b>). As respostas aparecem no chat ao lado.</div>
               </div>
               <div class="statusLine">
                 <span class="small" id="last"></span>
               </div>
             </div>
 
-            <div class="midGrid">
-              <!-- Hoje Panel gets more prominent focus -->
-              <section class="panel midSpan">
-                <div class="panelHead" style="background: linear-gradient(90deg, var(--paper2), var(--paper)); border-left: 4px solid var(--accent)">
-                  <b style="color: var(--text); font-size: 14px;">Foco de Hoje</b>
-                  <div class="stack">
-                    <button class="btn small" type="button" onclick="refreshToday()">Atualizar</button>
+            <section class="panel" style="display:flex; flex-direction:column; min-height:0; margin-bottom:16px;">
+                <!-- Header with live counters -->
+                <div class="panelHead" style="background: linear-gradient(90deg, var(--paper2), var(--paper)); border-left: 4px solid var(--accent); flex-shrink:0;">
+                  <div style="display:flex; align-items:center; gap:10px;">
+                    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="color:var(--accent); flex-shrink:0;"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>
+                    <b style="color: var(--text); font-size: 14px;">Foco de Hoje</b>
+                    <div id="focusSummaryChips" style="display:flex; gap:5px; margin-left:4px;"></div>
                   </div>
-                </div>
-                <div class="panelBody" style="display: flex; flex-direction: column; gap: 16px;">
-                  <div id="swimlaneContainer" style="display:flex; flex-direction: column; gap: 12px;"></div>
-                  
-                  <div style="border-top: 1px solid var(--border); padding-top: 16px;">
-                    <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;">
-                        <div class="small" style="opacity:.8; font-weight: 600; text-transform: uppercase;">Insights Globais de Bloqueios</div>
-                        <button class="btn small" type="button" onclick="refreshBlockersInsights()">Atualizar insights</button>
+                  <div class="stack">
+                    <div id="focusProgressWrap" style="display:none; align-items:center; gap:6px; font-size:11px; color:var(--muted);">
+                      <div style="width:80px; height:5px; background:var(--border); border-radius:3px; overflow:hidden;">
+                        <div id="focusProgressBar" style="height:100%; background:var(--accent); border-radius:3px; transition:width 0.4s; width:0%"></div>
+                      </div>
+                      <span id="focusProgressLabel"></span>
                     </div>
-                    <div id="blockersInsights" class="help"></div>
+                    <button class="btn small" type="button" onclick="refreshToday()">
+                      <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="display:inline;vertical-align:-2px;margin-right:4px"><polyline points="23 4 23 10 17 10"></polyline><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"></path></svg>
+                      Atualizar
+                    </button>
                   </div>
                 </div>
-              </section>
 
-              <section class="panel">
-                <div class="panelHead">
-                  <b>Relatórios Recentes</b>
-                  <div class="stack">
-                    <button class="btn small" type="button" onclick="refreshReports()">Atualizar</button>
-                    <button class="btn small" type="button" onclick="window.location.href='/reports'">Ver todos →</button>
-                  </div>
+                <!-- Scrollable swimlanes body -->
+                <div class="panelBody" style="flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:0; padding:0; min-height:0;">
+                  <div id="swimlaneContainer" style="display:flex; flex-direction: column; gap: 0; flex:1;"></div>
                 </div>
-                <div class="panelBody panelScroll" style="max-height: 300px;">
-                  <input id="reportsFilter" placeholder="Filtrar relatórios..." style="width:100%; margin-bottom:10px" oninput="renderReportsList()" />
-                  <div id="reportsList" style="display:grid; gap:8px"></div>
-                </div>
-              </section>
-            </div>
-                  <div class="panel">
-                    <div class="panelHead"><b>Configurações de publicação</b></div>
-                    <div class="panelBody">
-                      <label>Discord webhook URL</label>
-                      <input id="discord" placeholder="https://discord.com/api/webhooks/..." />
-                      <div style="height:10px"></div>
-
-                      <label>Teams webhook URL</label>
-                      <input id="teams" placeholder="https://..." />
-                      <div class="help">Os webhooks ficam salvos na workspace em <code>data/settings/settings.json</code>.</div>
-
-                      <div style="height:10px"></div>
-                      <label style="display:flex; align-items:center; gap:10px; user-select:none; margin: 6px 0 12px 0">
-                        <input id="prettyPublish" type="checkbox" checked style="width:auto" onchange="togglePrettyPublish()" />
-                        Publicação bonita (cards/embeds)
-                      </label>
 
+                <!-- Insights strip (collapsed by default, expands when content is available) -->
+                <div id="blockersInsightsWrap" style="flex-shrink:0; border-top: 1px solid var(--border); display:none;">
+                  <div style="display:flex; justify-content:space-between; align-items:center; padding: 8px 16px 4px;">
+                    <div style="font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--muted);">
+                      <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="display:inline;vertical-align:-1px;margin-right:4px"><path d="M12 2a10 10 0 1 0 0 20A10 10 0 0 0 12 2z"/><path d="M12 16v-4"/><path d="M12 8h.01"/></svg>
+                      Insights de Bloqueios
                     </div>
+                    <button class="btn small" type="button" onclick="refreshBlockersInsights()" style="font-size:10px; padding:2px 6px;">↻</button>
                   </div>
+                  <div id="blockersInsights" style="padding: 4px 16px 12px; font-size:12px; color:var(--muted);"></div>
                 </div>
+            </section>
+
+            <div class="panel">
+              <div class="panelHead"><b>Configurações de publicação</b></div>
+              <div class="panelBody">
+                <label>Discord webhook URL</label>
+                <input id="discord" placeholder="https://discord.com/api/webhooks/..." />
+                <div style="height:10px"></div>
+
+                <label>Teams webhook URL</label>
+                <input id="teams" placeholder="https://..." />
+                <div class="help">Os webhooks ficam salvos na workspace em <code>data/settings/settings.json</code>.</div>
+
+                <div style="height:10px"></div>
+                <label style="display:flex; align-items:center; gap:10px; user-select:none; margin: 6px 0 12px 0">
+                  <input id="prettyPublish" type="checkbox" checked style="width:auto" onchange="togglePrettyPublish()" />
+                  Publicação bonita (cards/embeds)
+                </label>
+              </div>
             </div>
           </div>
         </main>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cccarv82/freya",
-  "version": "2.9.0",
+  "version": "2.11.0",
   "description": "Personal AI Assistant with local-first persistence",
   "scripts": {
     "health": "node scripts/validate-data.js && node scripts/validate-structure.js",