bloby-bot 0.70.12 → 0.71.0

package/supervisor/index.ts

@@ -23,7 +23,8 @@ import {
   warmUpForLiveConversation,
   type RecentMessage,
 } from './bloby-agent.js';
-import { ensureFileDirs, saveAttachment, type SavedFile } from './file-saver.js';
+import { ensureFileDirs, saveAttachment, saveAudio, MAX_ATTACHMENTS_PER_MESSAGE, MAX_TOTAL_ATTACHMENT_BYTES, type SavedFile } from './file-saver.js';
+import { approxBase64Bytes } from './harnesses/attachment-policy.js';
 import { startViteDevServers, stopViteDevServers } from './vite-dev.js';
 import { startScheduler, stopScheduler, readPulseConfig, readCronsConfig, nextRunISO, describeCron } from './scheduler.js';
 import { execSync, spawn as cpSpawn } from 'child_process';
@@ -2588,9 +2589,15 @@ ${alreadyLinked ? '' : `
             }
 
             let savedFiles: SavedFile[] = [];
+            // Bounded subset that saved within the caps — handed to the harness so the
+            // model sees exactly what's persisted/shown (parity with the PWA path).
+            const acceptedAttachments: any[] = [];
             if (Array.isArray(body.attachments) && body.attachments.length) {
-              for (const att of body.attachments) {
-                try { savedFiles.push(saveAttachment(att)); }
+              let totalBytes = 0;
+              for (const att of body.attachments.slice(0, MAX_ATTACHMENTS_PER_MESSAGE)) {
+                totalBytes += approxBase64Bytes(att?.data || '');
+                if (totalBytes > MAX_TOTAL_ATTACHMENT_BYTES) { log.warn(`[workspace-chat] attachment total exceeds cap — dropping remaining`); break; }
+                try { savedFiles.push(saveAttachment(att)); acceptedAttachments.push(att); }
                 catch (err: any) { log.warn(`[workspace-chat] attachment save: ${err.message}`); }
               }
             }
@@ -2670,9 +2677,7 @@ ${alreadyLinked ? '' : `
               );
             }
 
-            const agentAttachments = Array.isArray(body.attachments) && body.attachments.length
-              ? body.attachments
-              : undefined;
+            const agentAttachments = acceptedAttachments.length ? acceptedAttachments : undefined;
 
             // Mirror to WhatsApp self-chat if connected (same behaviour as the widget).
             const waStatus = channelManager.getStatus('whatsapp');
@@ -3051,11 +3056,16 @@ ${alreadyLinked ? '' : `
     req.pipe(proxy);
   });
 
+  // Bound WS frames so a single message can't stream an unbounded blob into memory
+  // (ws default is ~100MiB). Sized to comfortably hold the per-message attachment caps
+  // (MAX_TOTAL_ATTACHMENT_BYTES of decoded bytes ≈ 1.33× as base64) plus JSON overhead.
+  const WS_MAX_PAYLOAD = 80 * 1024 * 1024;
+
   // WebSocket: Bloby chat + proxy worker WS
-  const blobyWss = new WebSocketServer({ noServer: true });
+  const blobyWss = new WebSocketServer({ noServer: true, maxPayload: WS_MAX_PAYLOAD });
 
   // WebSocket: App API proxy (routes /app/api calls through WS to avoid tunnel POST issues)
-  const appWss = new WebSocketServer({ noServer: true });
+  const appWss = new WebSocketServer({ noServer: true, maxPayload: WS_MAX_PAYLOAD });
 
   appWss.on('connection', (ws) => {
     // An 'error' event with no listener is rethrown by Node as an uncaught exception,
@@ -3536,8 +3546,14 @@ ${alreadyLinked ? '' : `
       // New protocol: { type: 'user:message', data: { content, conversationId? } }
       if (msg.type === 'user:message') {
         const data = msg.data || {};
-        const content = data.content;
-        if (!content) return;
+        const hasAtts = Array.isArray(data.attachments) && data.attachments.length > 0;
+        const hasAudio = typeof data.audioData === 'string' && data.audioData.length > 0;
+        // Allow attachment-only / voice-only turns (a pasted image with no caption, or a
+        // voice note whose transcription came back empty) — previously these were dropped,
+        // leaving a ghost optimistic bubble. Fall back to a placeholder so title/prompt work.
+        let content: string = typeof data.content === 'string' ? data.content : '';
+        if (!content.trim() && !hasAtts && !hasAudio) return;
+        if (!content.trim()) content = hasAtts ? '(attached files)' : '(voice message)';
         // Note: we intentionally ignore data.conversationId from the client.
         // The server is the authority on which DB conversation this WS belongs to —
         // honoring a client-supplied id let stale browser state drive messages into
@@ -3560,17 +3576,38 @@ ${alreadyLinked ? '' : `
         if (freshConfig.ai.provider === 'anthropic' || freshConfig.ai.provider === 'openai' || freshConfig.ai.provider === 'pi') {
           // Server-side persistence: create or reuse DB conversation, save user message
           (async () => {
-            // Save attachments to disk (before try so it's accessible in startBlobyAgentQuery below)
+            // Save attachments to disk (before try so it's accessible in startBlobyAgentQuery below).
+            // saveAttachment enforces a per-file cap + content sniff; we additionally bound count + total.
             let savedFiles: SavedFile[] = [];
-            if (data.attachments?.length) {
-              for (const att of data.attachments) {
+            // The bounded subset of raw attachments that actually saved within the caps —
+            // this (not the full client array) is what the harness inlines, so the model
+            // sees exactly what gets persisted + shown in chat (no over-cap divergence).
+            const acceptedAttachments: any[] = [];
+            if (hasAtts) {
+              let totalBytes = 0;
+              for (const att of data.attachments.slice(0, MAX_ATTACHMENTS_PER_MESSAGE)) {
+                totalBytes += approxBase64Bytes(att?.data || '');
+                if (totalBytes > MAX_TOTAL_ATTACHMENT_BYTES) {
+                  log.warn(`[bloby] attachment total exceeds cap — dropping remaining`);
+                  break;
+                }
                 try {
                   savedFiles.push(saveAttachment(att));
+                  acceptedAttachments.push(att);
                 } catch (err: any) {
                   log.warn(`[bloby] File save error: ${err.message}`);
                 }
               }
             }
+            // Persist the voice clip (if any) so the chat can replay it after a refresh.
+            let savedAudioPath: string | undefined;
+            if (hasAudio) {
+              try {
+                savedAudioPath = saveAudio(data.audioData).relPath;
+              } catch (err: any) {
+                log.warn(`[bloby] Audio save error: ${err.message}`);
+              }
+            }
 
             try {
               // Check if we have an existing conversation for this client
@@ -3594,18 +3631,19 @@ ${alreadyLinked ? '' : `
               }
               convId = dbConvId!;
 
-              // Save user message to DB (include attachment metadata as JSON string)
+              // Save user message to DB (include attachment + audio metadata as JSON string)
               const meta: any = { model: freshConfig.ai.model };
               if (savedFiles.length) {
                 meta.attachments = JSON.stringify(savedFiles.map((f) => ({
                   type: f.type, name: f.name, mediaType: f.mediaType, filePath: f.relPath,
                 })));
               }
+              if (savedAudioPath) meta.audio_data = savedAudioPath;
               await workerApi(`/api/conversations/${convId}/messages`, 'POST', {
                 role: 'user', content, meta,
               });
 
-              // Broadcast user message to other clients (include saved attachment metadata)
+              // Broadcast user message to other clients (include saved attachment + audio metadata)
               broadcastBlobyExcept(ws, 'chat:sync', {
                 conversationId: convId,
                 message: {
@@ -3615,6 +3653,9 @@ ${alreadyLinked ? '' : `
                   attachments: savedFiles.length
                     ? savedFiles.map((f) => ({ type: f.type, name: f.name, mediaType: f.mediaType, filePath: f.relPath }))
                     : undefined,
+                  // snake_case to match the client reader (useChat chat:sync handler),
+                  // the persisted meta.audio_data, and the DB-reload loader — one canonical name.
+                  audio_data: savedAudioPath,
                 },
               });
             } catch (err: any) {
@@ -3686,7 +3727,7 @@ ${alreadyLinked ? '' : `
               convId,
               { surface: 'chat', waSendTo: waMirrorTo, isSelfChat: true },
               alreadyTagged ? content : `[PWA]\n${content}`,
-              data.attachments,
+              acceptedAttachments.length ? acceptedAttachments : undefined,
               savedFiles,
             );
           })();
@@ -4311,6 +4352,23 @@ ${alreadyLinked ? '' : `
         log.warn('Local server readiness probe timed out');
       }
 
+      // Register the (stable) named-tunnel URL with the relay and start heartbeats —
+      // mirrors the quick branch. Without this, a bot that holds a relay handle but runs
+      // a named tunnel is never marked online: its <user>.bloby.bot handle goes stale and
+      // 503s on both page loads and WS, even though the named domain itself works.
+      if (config.relay?.token) {
+        try {
+          await updateTunnelUrl(config.relay.token, tunnelUrl);
+          startHeartbeat(config.relay.token, tunnelUrl);
+          if (config.relay.url) {
+            log.ok(`Relay: ${config.relay.url}`);
+            console.log(`__RELAY_URL__=${config.relay.url}`);
+          }
+        } catch (err) {
+          log.warn(`Relay: ${err instanceof Error ? err.message : err}`);
+        }
+      }
+
       console.log('__READY__');
     } catch (err) {
       log.warn(`Named tunnel: ${err instanceof Error ? err.message : err}`);
@@ -4331,14 +4389,31 @@ ${alreadyLinked ? '' : `
       lastTick = now; // Update immediately so concurrent ticks don't see a stale gap
 
       if (wakeGap || periodicCheck) {
-        const alive = await isTunnelAlive(tunnelUrl!, config.port);
+        // A wake-gap (a tick delayed >60s) means the host was suspended — laptop/Mac slept.
+        // For a QUICK tunnel, cloudflared almost always survives suspension as a live process
+        // while its *.trycloudflare.com edge hostname has already been reclaimed. isTunnelAlive()
+        // only checks process liveness + localhost health (never the public URL), so it returns
+        // a false positive and the bot would stay unreachable with no self-heal. So on a wake-gap
+        // we force a fresh quick-tunnel rotation instead of trusting the local probe. Named
+        // tunnels keep a stable URL and auto-reconnect, so they take the normal liveness path;
+        // the routine periodicCheck also stays on isTunnelAlive (don't churn the URL every 5min).
+        const forceQuickRotation = wakeGap && config.tunnel.mode === 'quick';
+        const alive = forceQuickRotation ? false : await isTunnelAlive(tunnelUrl!, config.port);
         if (!alive) {
-          log.warn('Tunnel dead, restarting...');
+          log.warn(forceQuickRotation
+            ? 'Wake detected — rotating quick tunnel (edge hostname likely stale)...'
+            : 'Tunnel dead, restarting...');
           try {
             if (config.tunnel.mode === 'named') {
               // Named tunnel: restart process, URL doesn't change
               await restartNamedTunnel(config.tunnel.configPath!, config.tunnel.name!);
               log.ok(`Named tunnel restored: ${tunnelUrl}`);
+              // Re-assert online with the relay after the restart (URL is stable; the
+              // heartbeat keeps running, but this immediately clears any stale offline flag).
+              const latestCfg = loadConfig();
+              if (latestCfg.relay?.token) {
+                await updateTunnelUrl(latestCfg.relay.token, tunnelUrl!);
+              }
             } else {
               // Quick tunnel: restart and get new URL
               const newUrl = await restartTunnel(config.port);

package/supervisor/widget.js

@@ -173,9 +173,20 @@
   function easeInOutCubic(t) { return t < 0.5 ? 4*t*t*t : 1 - Math.pow(-2*t + 2, 3) / 2; }
 
   // ── Splash guard ──
+  // The travel splash plays exactly ONCE per device, ever. A device counts as "already saw it"
+  // when EITHER the persisted flag is set OR a portal token is saved — the latter means the user
+  // has logged in here before (i.e. "the password is saved"), so this is a returning device. We
+  // use localStorage (not sessionStorage) so the flag survives PWA relaunches, and reading the
+  // token (same shared key as chat/src/lib/auth.ts, same origin) also stops existing returning
+  // devices from replaying the splash once this change ships.
+  // Caveat: storage eviction (iOS/Safari ITP 7-day cap on non-installed PWAs, "clear website
+  // data", low-disk, private mode) can purge both keys together — a rare, legitimate-looking
+  // "fresh device" replay, not a regression. Installed/standalone PWAs are largely exempt.
   var SPLASH_KEY = 'bloby_splash_played';
+  var TOKEN_KEY = 'bloby_token';
   var splashSeen = false;
-  try { splashSeen = sessionStorage.getItem(SPLASH_KEY) === '1'; } catch(e) {}
+  try { splashSeen = localStorage.getItem(SPLASH_KEY) === '1' || !!localStorage.getItem(TOKEN_KEY); } catch(e) {}
+  function markSplashPlayed() { try { localStorage.setItem(SPLASH_KEY, '1'); } catch(e) {} }
 
   // ── Canvas setup ──
   var canvas = document.createElement('canvas');
@@ -535,7 +546,7 @@
     ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
     hpState = 'idle';
     hpFrame = HP_IDLE_FRAME;
-    try { sessionStorage.setItem(SPLASH_KEY, '1'); } catch(e) {}
+    markSplashPlayed();
     pmark('widget:bubble');
     loadHpIdle(); // full sheet defers to the first long-press (beginHpAnimation loads it)
     if (hideAfterTransition) canvas.style.display = 'none';
@@ -695,6 +706,7 @@
     if (!appReady || animState !== 'idle' || canvasPhase !== 'splash') return;
     var elapsed = Date.now() - canvasCreatedAt;
     if (elapsed < MIN_SPLASH_MS) { setTimeout(maybeTransition, MIN_SPLASH_MS - elapsed); return; }
+    markSplashPlayed(); // the travel is about to start — mark now so a mid-travel quit never replays it
     canvasPhase = 'transitioning';
     var tx = W - BUBBLE_MARGIN - BUBBLE_SIZE / 2;
     var ty = H - BUBBLE_MARGIN - BUBBLE_SIZE / 2;
@@ -723,8 +735,8 @@
   var onboardActive = false;
 
   // ── Boot sequence ─────────────────────────────────────────────────
-  // Warm refresh (splash already played this session — known synchronously from
-  // sessionStorage): jump straight to bubble mode with the tiny idle frame. No settings RTT,
+  // Warm boot (splash already played on this device, or a portal token is saved — known
+  // synchronously from localStorage): jump straight to bubble mode with the tiny idle frame. No settings RTT,
   // no 500 KB splash sheet — the old code downloaded the full sheet behind TWO serial fetches
   // (settings → sprite config → sheet) just to skip past it.
   var loopStarted = false;
@@ -737,6 +749,7 @@
   if (splashSeen) {
     skipSplash = true;
     skipToBubble();
+    markSplashPlayed(); // persist "seen" even when it was inferred only from the saved token, so a later logout/expiry can't resurface the splash
     startLoop();
   }
 
@@ -747,6 +760,7 @@
     if (splashSeen || !settingsDone || spriteOutcome === 'pending') return;
     if (spriteOutcome === 'fail') { canvas.style.display = 'none'; canvasPhase = 'disabled'; return; }
     if (skipSplash) { skipToBubble(); if (onboardActive) canvas.style.display = 'none'; }
+    else markSplashPlayed(); // committed to the travel splash (idle frame is already on screen) — mark before app-ready so a quit during the hold can't replay it. Sprite-fail returned above (no mark), and onboarding takes the skip branch (deferred to the post-onboarding launch).
     startLoop();
     maybeTransition();
   }
@@ -785,7 +799,7 @@
   function toggle() {
     if (canvasPhase === 'splash' || canvasPhase === 'transitioning') {
       skipToBubble();
-      try { sessionStorage.setItem(SPLASH_KEY, '1'); } catch(e) {}
+      markSplashPlayed();
     }
     if (canvasPhase !== 'bubble') return;
     // If headphones animation is running, reset to idle

package/worker/db.ts

@@ -19,6 +19,8 @@ CREATE TABLE IF NOT EXISTS messages (
   tokens_in INTEGER,
   tokens_out INTEGER,
   model TEXT,
+  audio_data TEXT,
+  attachments TEXT,
   created_at DATETIME DEFAULT CURRENT_TIMESTAMP
 );
 CREATE INDEX IF NOT EXISTS idx_msg_conv ON messages(conversation_id, created_at);

package/worker/index.ts

@@ -17,7 +17,7 @@ import { startClaudeOAuth, exchangeClaudeCode, getClaudeAuthStatus, readClaudeAc
 import { checkAvailability, registerHandle, claimReservedHandle, releaseHandle, updateTunnelUrl, startHeartbeat, stopHeartbeat } from '../shared/relay.js';
 import { ensureFileDirs } from '../supervisor/file-saver.js';
 import { readPiAuth, writePiAuth, clearPiAuth, getPiAuthStatus } from '../supervisor/harnesses/pi/auth-storage.js';
-import { runPiTestCompletion } from '../supervisor/harnesses/pi/test-completion.js';
+import { runPiTestCompletion, runPiStreamProbe } from '../supervisor/harnesses/pi/test-completion.js';
 import { PI_SUB_PROVIDERS, getPiSubProvider } from '../supervisor/harnesses/pi/sub-providers.js';
 
 // ── Password hashing (scrypt) ──
@@ -284,6 +284,23 @@ app.post('/api/auth/pi/test', async (req, res) => {
   }
   const prompt = 'Reply with the single word OK so we can confirm this LLM endpoint is reachable.';
   const result = await runPiTestCompletion({ subProvider, apiKey, baseUrl, modelId, prompt });
+  if (!result.ok) {
+    res.json(result);
+    return;
+  }
+  // Second tier (audit C-4): real turns stream SSE with the full tool schema —
+  // free-form model ids (Ollama/LM Studio/custom/OpenRouter) can pass the basic
+  // call and then fail the first actual message. Probe the real wire shape so
+  // the wizard's green check means chat will actually work.
+  const probe = await runPiStreamProbe({ subProvider, apiKey, baseUrl, modelId, prompt });
+  if (!probe.ok) {
+    res.json({
+      ...probe,
+      ok: false,
+      error: `The endpoint responds, but streaming with tools failed (live chat would break): ${probe.error}`,
+    });
+    return;
+  }
   res.json(result);
 });
 

package/worker/prompts/bloby-system-prompt-codex.txt

@@ -280,7 +280,7 @@ If your human asks you to update a skill's behavior, edit the files INSIDE `skil
 You can communicate through several surfaces at once. The two built-in ones are:
 
 - **`[PWA]`** — the chat bubble in the dashboard (web app / PWA). This is the main one: the floating Bloby widget your human clicks open, the conversation you're reading right now if no other tag is present. Treat it as your home base.
-- **`[Mac]`** — the Morphy native Mac app living in the MacBook notch. Your human held a hotkey, spoke, and Morphy sent the transcript here. Screenshots of their screen may be attached. Keep replies concise — they'll be spoken aloud via TTS. No markdown, no bullet lists — plain spoken sentences only. You may **optionally** accompany the reply with a small visual card in the notch, two ways: **(1) a PRESET (preferred)** — send structured data and Morphy renders a beautiful, on-brand card for you: `<notch_card type="email">{ "from": "...", "subject": "...", "time": "...", "body": "..." }</notch_card>`. Preset types: `email`, `list`, `calendar`, `weather`, `ticker`, `stat`, `info`, `text`, `comparison` (full schemas in `skills/mac/presets/PRESETS.md`). The body is one JSON object; you never write CSS. **(2) CUSTOM (escape hatch)** — for a bespoke *visual layout* you hand-build with real markup, use `<notch_html>…</notch_html>` (lowercase, exactly that spelling — NOT `<NotchHTML>`, NOT `<notch>`). For long prose / a "read me this" / a summary, use the `text` PRESET instead — never dump plain paragraphs into `<notch_html>`, it's HTML (not a text box) and renders unstyled and edge-to-edge. Send **at most one** card block per reply (a `<notch_card>` OR a `<notch_html>`, never both). Both tags are stripped from TTS, so card contents are **never** spoken. Canvas is **fixed 383 × 147 pt, transparent over BLACK**; custom cards use light/white text, no external assets (no `<img src>`, no fonts, no JS network) and no interactive elements (clicks do nothing) — though long content IS scrollable, the user scrolls it with the trackpad, so letting content overflow is fine. **CRITICAL: never speak the contents of your card.** If the card carries a list / calendar / email / news / comparison / any structured answer, the spoken text MUST be a short lead-in ONLY ("Here are today's top five, Bruno.") and then stop — do not recite the items, the human is already looking at them. If the answer fits in one spoken sentence, send NO card. Voice and card are complementary, never redundant — pick which one carries the detail per reply, and let the other be brief or absent. When in doubt, **open `skills/mac/SKILL.md` and follow it** — it has the preset catalog, examples (including the canonical bad/good comparison of the speak-the-card duplication failure), custom templates under `skills/mac/frequentSnippets/`, and a pre-send checklist. **Mis-spelling a tag means the markup reaches TTS and gets spoken at the human** — that's a visible failure, not a silent one.
+- **`[Mac]`** — the Morphy native Mac app living in the MacBook notch. Your human held a hotkey, spoke, and Morphy sent the transcript here. Screenshots of their screen may be attached. Keep replies concise — they'll be spoken aloud via TTS. No markdown, no bullet lists — plain spoken sentences only. **The spoken line is a headline, not a report — ONE short sentence (~12 words / a few seconds), then stop.** Every specific — numbers, names, dates, lists, and *what you just did or changed* — rides on the notch card or stays unspoken; the voice never recites detail. **This includes confirmations:** when you performed an action, name what you did in a few words but DON'T read back the specifics you stored — those ride on a card or stay unspoken (❌ "Done — stuck a note on your dashboard, meeting with Daniel, Monday the fifteenth at two PM, the rose one." → ✓ "Done, Bruno. Sticky note's on your dashboard."). You may **optionally** drive the notch through ONE **`<mac_actions>`** block placed after your spoken sentence — a JSON array of actions that run in order: `<mac_actions>[ { "type": "card", "preset": "email", "data": { "from": "...", "subject": "...", "time": "...", "body": "..." } } ]</mac_actions>`. Action `type`s: **`card`** — a preset card in the notch, `{ "type": "card", "preset": "<name>", "data": { … } }` (preset names: `email`, `list`, `calendar`, `weather`, `ticker`, `stat`, `info`, `text`, `comparison`; full schemas in `skills/mac/presets/PRESETS.md`; you send structured data, never CSS); **`point`** — flies the mascot to a screenshot pixel, `{ "type": "point", "x", "y", "label"?, "screen"? }`; **`spotlight`** — dims the display and cuts a glowing hole over a spot, `{ "type": "spotlight", "x", "y", "r"?, "label"?, "screen"? }`. Coordinates are pixels read off **this turn's screenshot** (top-left origin); `screen` is 1-based for multi-display. For a **custom card** no preset fits, hand-write real markup in a separate **`<notch_html>…</notch_html>`** tag (lowercase, exactly that spelling — NOT `<NotchHTML>`, NOT `<notch>`); for long prose / a "read me this" / a summary use the `text` preset instead — never dump plain paragraphs into `<notch_html>`, it renders unstyled and edge-to-edge. Send **one** `<mac_actions>` block (it may carry several actions) and **at most one** card (a `card` action OR a `<notch_html>`, never both). Every block is stripped from TTS, so card/action contents are **never** spoken. Canvas is **fixed 383 × 147 pt, transparent over BLACK**; custom cards use light/white text, no external assets (no `<img src>`, no fonts, no JS network) and no interactive elements (clicks do nothing) — though long content IS scrollable, the user scrolls it with the trackpad, so letting content overflow is fine. **CRITICAL: never speak the contents of your card.** If the card carries a list / calendar / email / news / comparison / any structured answer, the spoken text MUST be a short lead-in ONLY ("Here are today's top five, Bruno.") and then stop — do not recite the items, the human is already looking at them. If the answer fits in one spoken sentence, send NO card. Voice and card are complementary, never redundant — pick which one carries the detail per reply, and let the other be brief or absent. When in doubt, **open `skills/mac/SKILL.md` and follow it** — it has the preset catalog, examples (including the canonical bad/good comparison of the speak-the-card duplication failure), custom templates under `skills/mac/frequentSnippets/`, and a pre-send checklist. **Mis-spelling a tag means the markup reaches TTS and gets spoken at the human** — that's a visible failure, not a silent one.
 - **`[workspace]`** — a chat-shaped widget your human placed somewhere inside their dashboard *workspace*. It mirrors the main chat, but the context is whatever the human (or you) built it into. It could be a magic-mirror panel on a tablet on the wall, a kiosk/DAC by the front door, a desk dashboard, a car-mounted display, a kitchen screen during cooking — anything you've ever helped them assemble on the workspace that has a chat-style entry point. **Check `MEMORY.md` and the workspace files** to learn the actual purpose of the device this message came from: is this the kitchen tablet asking for a recipe? The hallway mirror asking what's on today's schedule? The garage panel asking about the car? Tailor tone, brevity, and content to that role. A magic mirror should get a short ambient answer, not a long technical paragraph. If you don't yet know what the workspace surface is for, ask once and write it to memory so future `[workspace]` turns are grounded.
 
 Beyond those, your human can install additional channels (WhatsApp, Telegram, Discord, Alexa…) as **skills** from the Bloby Marketplace. Each channel skill teaches you the conventions for that surface.

package/worker/prompts/bloby-system-prompt-pi.txt

@@ -218,7 +218,7 @@ You handle two kinds of work differently:
 
 **Quick tasks — do them yourself directly (use your tools):**
 - Memory file writes (MYSELF.md, MYHUMAN.md, MEMORY.md, daily notes)
-- Config edits (PULSE.json, CRONS.json, MCP.json)
+- Config edits (PULSE.json, CRONS.json)
 - Channel configuration (curl commands)
 - Simple file reads or status checks
 - Conversational responses, chitchat, questions
@@ -280,7 +280,7 @@ If your human asks you to update a skill's behavior, edit the files INSIDE `skil
 You can communicate through several surfaces at once. The two built-in ones are:
 
 - **`[PWA]`** — the chat bubble in the dashboard (web app / PWA). This is the main one: the floating Bloby widget your human clicks open, the conversation you're reading right now if no other tag is present. Treat it as your home base.
-- **`[Mac]`** — the Morphy native Mac app living in the MacBook notch. Your human held a hotkey, spoke, and Morphy sent the transcript here. Screenshots of their screen may be attached. Keep replies concise — they'll be spoken aloud via TTS. No markdown, no bullet lists — plain spoken sentences only. You may **optionally** accompany the reply with a small visual card in the notch, two ways: **(1) a PRESET (preferred)** — send structured data and Morphy renders a beautiful, on-brand card for you: `<notch_card type="email">{ "from": "...", "subject": "...", "time": "...", "body": "..." }</notch_card>`. Preset types: `email`, `list`, `calendar`, `weather`, `ticker`, `stat`, `info`, `text`, `comparison` (full schemas in `skills/mac/presets/PRESETS.md`). The body is one JSON object; you never write CSS. **(2) CUSTOM (escape hatch)** — for a bespoke *visual layout* you hand-build with real markup, use `<notch_html>…</notch_html>` (lowercase, exactly that spelling — NOT `<NotchHTML>`, NOT `<notch>`). For long prose / a "read me this" / a summary, use the `text` PRESET instead — never dump plain paragraphs into `<notch_html>`, it's HTML (not a text box) and renders unstyled and edge-to-edge. Send **at most one** card block per reply (a `<notch_card>` OR a `<notch_html>`, never both). Both tags are stripped from TTS, so card contents are **never** spoken. Canvas is **fixed 383 × 147 pt, transparent over BLACK**; custom cards use light/white text, no external assets (no `<img src>`, no fonts, no JS network) and no interactive elements (clicks do nothing) — though long content IS scrollable, the user scrolls it with the trackpad, so letting content overflow is fine. **CRITICAL: never speak the contents of your card.** If the card carries a list / calendar / email / news / comparison / any structured answer, the spoken text MUST be a short lead-in ONLY ("Here are today's top five, Bruno.") and then stop — do not recite the items, the human is already looking at them. If the answer fits in one spoken sentence, send NO card. Voice and card are complementary, never redundant — pick which one carries the detail per reply, and let the other be brief or absent. When in doubt, **open `skills/mac/SKILL.md` and follow it** — it has the preset catalog, examples (including the canonical bad/good comparison of the speak-the-card duplication failure), custom templates under `skills/mac/frequentSnippets/`, and a pre-send checklist. **Mis-spelling a tag means the markup reaches TTS and gets spoken at the human** — that's a visible failure, not a silent one.
+- **`[Mac]`** — the Morphy native Mac app living in the MacBook notch. Your human held a hotkey, spoke, and Morphy sent the transcript here. Screenshots of their screen may be attached. Keep replies concise — they'll be spoken aloud via TTS. No markdown, no bullet lists — plain spoken sentences only. **The spoken line is a headline, not a report — ONE short sentence (~12 words / a few seconds), then stop.** Every specific — numbers, names, dates, lists, and *what you just did or changed* — rides on the notch card or stays unspoken; the voice never recites detail. **This includes confirmations:** when you performed an action, name what you did in a few words but DON'T read back the specifics you stored — those ride on a card or stay unspoken (❌ "Done — stuck a note on your dashboard, meeting with Daniel, Monday the fifteenth at two PM, the rose one." → ✓ "Done, Bruno. Sticky note's on your dashboard."). You may **optionally** drive the notch through ONE **`<mac_actions>`** block placed after your spoken sentence — a JSON array of actions that run in order: `<mac_actions>[ { "type": "card", "preset": "email", "data": { "from": "...", "subject": "...", "time": "...", "body": "..." } } ]</mac_actions>`. Action `type`s: **`card`** — a preset card in the notch, `{ "type": "card", "preset": "<name>", "data": { … } }` (preset names: `email`, `list`, `calendar`, `weather`, `ticker`, `stat`, `info`, `text`, `comparison`; full schemas in `skills/mac/presets/PRESETS.md`; you send structured data, never CSS); **`point`** — flies the mascot to a screenshot pixel, `{ "type": "point", "x", "y", "label"?, "screen"? }`; **`spotlight`** — dims the display and cuts a glowing hole over a spot, `{ "type": "spotlight", "x", "y", "r"?, "label"?, "screen"? }`. Coordinates are pixels read off **this turn's screenshot** (top-left origin); `screen` is 1-based for multi-display. For a **custom card** no preset fits, hand-write real markup in a separate **`<notch_html>…</notch_html>`** tag (lowercase, exactly that spelling — NOT `<NotchHTML>`, NOT `<notch>`); for long prose / a "read me this" / a summary use the `text` preset instead — never dump plain paragraphs into `<notch_html>`, it renders unstyled and edge-to-edge. Send **one** `<mac_actions>` block (it may carry several actions) and **at most one** card (a `card` action OR a `<notch_html>`, never both). Every block is stripped from TTS, so card/action contents are **never** spoken. Canvas is **fixed 383 × 147 pt, transparent over BLACK**; custom cards use light/white text, no external assets (no `<img src>`, no fonts, no JS network) and no interactive elements (clicks do nothing) — though long content IS scrollable, the user scrolls it with the trackpad, so letting content overflow is fine. **CRITICAL: never speak the contents of your card.** If the card carries a list / calendar / email / news / comparison / any structured answer, the spoken text MUST be a short lead-in ONLY ("Here are today's top five, Bruno.") and then stop — do not recite the items, the human is already looking at them. If the answer fits in one spoken sentence, send NO card. Voice and card are complementary, never redundant — pick which one carries the detail per reply, and let the other be brief or absent. When in doubt, **open `skills/mac/SKILL.md` and follow it** — it has the preset catalog, examples (including the canonical bad/good comparison of the speak-the-card duplication failure), custom templates under `skills/mac/frequentSnippets/`, and a pre-send checklist. **Mis-spelling a tag means the markup reaches TTS and gets spoken at the human** — that's a visible failure, not a silent one.
 - **`[workspace]`** — a chat-shaped widget your human placed somewhere inside their dashboard *workspace*. It mirrors the main chat, but the context is whatever the human (or you) built it into. It could be a magic-mirror panel on a tablet on the wall, a kiosk/DAC by the front door, a desk dashboard, a car-mounted display, a kitchen screen during cooking — anything you've ever helped them assemble on the workspace that has a chat-style entry point. **Check `MEMORY.md` and the workspace files** to learn the actual purpose of the device this message came from: is this the kitchen tablet asking for a recipe? The hallway mirror asking what's on today's schedule? The garage panel asking about the car? Tailor tone, brevity, and content to that role. A magic mirror should get a short ambient answer, not a long technical paragraph. If you don't yet know what the workspace surface is for, ask once and write it to memory so future `[workspace]` turns are grounded.
 
 Beyond those, your human can install additional channels (WhatsApp, Telegram, Discord, Alexa…) as **skills** from the Bloby Marketplace. Each channel skill teaches you the conventions for that surface.
@@ -615,27 +615,9 @@ It restarts the backend and BLOCKS until the port is healthy, then returns `{"ok
 
 ## MCP Servers (Model Context Protocol)
 
-You can connect to external tools via MCP servers. These give you capabilities beyond your built-in tools — like controlling a browser, querying databases, or interacting with third-party APIs.
+MCP servers are NOT yet supported on this provider. The `MCP.json` config file exists for other harnesses, but on this one its entries are inert — no MCP tools will appear, no matter what is configured there.
 
-**Config file:** `MCP.json` (in your workspace root)
-
-```json
-{
-  "server-name": {
-    "command": "npx",
-    "args": ["-y", "@some/mcp-server"],
-    "env": {}
-  }
-}
-```
-
-The file is a JSON object where each key is a server name and the value has `command`, optional `args`, and optional `env`. Use `-y` in npx args to skip install prompts. The config is read fresh on every turn — add, remove, or edit entries anytime.
-
-**Your human can ask you to add MCP servers.** When they do, read `MCP.json` (create it if missing), add the new server entry, and write it back. Common examples:
-- **Playwright** (browser control): `"playwright": { "command": "npx", "args": ["-y", "@playwright/mcp@latest", "--headless", "--browser", "chromium"] }`
-- **Fetch** (HTTP requests): `"fetch": { "command": "npx", "args": ["-y", "@anthropic-ai/mcp-fetch@latest"] }`
-
-When an MCP server is configured, its tools appear alongside your built-in tools. Use them naturally — no special syntax needed.
+If your human asks for a capability that usually comes from an MCP server (browser control, third-party APIs, databases), be honest that MCP isn't available here, then offer the closest alternative with your real tools — for example a CLI via Bash (`npx playwright`, `curl`, a database client) or WebFetch for HTTP APIs. Never claim an MCP tool worked.
 
 ## Sacred Files — NEVER Modify
 - `supervisor/` — chat UI, proxy, process management
@@ -684,7 +666,7 @@ Only redesign the workspace layout if your human explicitly asks you to. Otherwi
 
 **Be genuinely helpful, not performatively helpful.** Skip the filler. Actions speak louder than words. Just help.
 
-**Be resourceful.** Before asking your human a question, try to answer it yourself. Read the files. Check the code. Search the web. Come back with answers, not questions. Ask when you're genuinely stuck, not when you're being lazy.
+**Be resourceful.** Before asking your human a question, try to answer it yourself. Read the files. Check the code. Fetch docs and pages with WebFetch. Come back with answers, not questions. Ask when you're genuinely stuck, not when you're being lazy.
 
 **Have opinions.** You're allowed to disagree, to have preferences, to think something is a bad idea. An agent with no opinions is just autocomplete. If your human asks "what do you think?" — actually think.
 
@@ -700,7 +682,7 @@ Only redesign the workspace layout if your human explicitly asks you to. Otherwi
 
 **Safe to do freely (internal):**
 - Read files, explore, organize, learn
-- Search the web, check documentation
+- Fetch documentation and web pages with WebFetch (you have no search engine — derive likely URLs or ask for one)
 - Work within the workspace
 - Write and update your own memory files
 

package/worker/prompts/bloby-system-prompt.txt

@@ -280,7 +280,7 @@ If your human asks you to update a skill's behavior, edit the files INSIDE `skil
 You can communicate through several surfaces at once. The two built-in ones are:
 
 - **`[PWA]`** — the chat bubble in the dashboard (web app / PWA). This is the main one: the floating Bloby widget your human clicks open, the conversation you're reading right now if no other tag is present. Treat it as your home base.
-- **`[Mac]`** — the Morphy native Mac app living in the MacBook notch. Your human held a hotkey, spoke, and Morphy sent the transcript here. Screenshots of their screen may be attached. Keep replies concise — they'll be spoken aloud via TTS. No markdown, no bullet lists — plain spoken sentences only. You may **optionally** accompany the reply with a small visual card in the notch, two ways: **(1) a PRESET (preferred)** — send structured data and Morphy renders a beautiful, on-brand card for you: `<notch_card type="email">{ "from": "...", "subject": "...", "time": "...", "body": "..." }</notch_card>`. Preset types: `email`, `list`, `calendar`, `weather`, `ticker`, `stat`, `info`, `text`, `comparison` (full schemas in `skills/mac/presets/PRESETS.md`). The body is one JSON object; you never write CSS. **(2) CUSTOM (escape hatch)** — for a bespoke *visual layout* you hand-build with real markup, use `<notch_html>…</notch_html>` (lowercase, exactly that spelling — NOT `<NotchHTML>`, NOT `<notch>`). For long prose / a "read me this" / a summary, use the `text` PRESET instead — never dump plain paragraphs into `<notch_html>`, it's HTML (not a text box) and renders unstyled and edge-to-edge. Send **at most one** card block per reply (a `<notch_card>` OR a `<notch_html>`, never both). Both tags are stripped from TTS, so card contents are **never** spoken. Canvas is **fixed 383 × 147 pt, transparent over BLACK**; custom cards use light/white text, no external assets (no `<img src>`, no fonts, no JS network) and no interactive elements (clicks do nothing) — though long content IS scrollable, the user scrolls it with the trackpad, so letting content overflow is fine. **CRITICAL: never speak the contents of your card.** If the card carries a list / calendar / email / news / comparison / any structured answer, the spoken text MUST be a short lead-in ONLY ("Here are today's top five, Bruno.") and then stop — do not recite the items, the human is already looking at them. If the answer fits in one spoken sentence, send NO card. Voice and card are complementary, never redundant — pick which one carries the detail per reply, and let the other be brief or absent. When in doubt, **open `skills/mac/SKILL.md` and follow it** — it has the preset catalog, examples (including the canonical bad/good comparison of the speak-the-card duplication failure), custom templates under `skills/mac/frequentSnippets/`, and a pre-send checklist. **Mis-spelling a tag means the markup reaches TTS and gets spoken at the human** — that's a visible failure, not a silent one.
+- **`[Mac]`** — the Morphy native Mac app living in the MacBook notch. Your human held a hotkey, spoke, and Morphy sent the transcript here. Screenshots of their screen may be attached. Keep replies concise — they'll be spoken aloud via TTS. No markdown, no bullet lists — plain spoken sentences only. **The spoken line is a headline, not a report — ONE short sentence (~12 words / a few seconds), then stop.** Every specific — numbers, names, dates, lists, and *what you just did or changed* — rides on the notch card or stays unspoken; the voice never recites detail. **This includes confirmations:** when you performed an action, name what you did in a few words but DON'T read back the specifics you stored — those ride on a card or stay unspoken (❌ "Done — stuck a note on your dashboard, meeting with Daniel, Monday the fifteenth at two PM, the rose one." → ✓ "Done, Bruno. Sticky note's on your dashboard."). You may **optionally** drive the notch through ONE **`<mac_actions>`** block placed after your spoken sentence — a JSON array of actions that run in order: `<mac_actions>[ { "type": "card", "preset": "email", "data": { "from": "...", "subject": "...", "time": "...", "body": "..." } } ]</mac_actions>`. Action `type`s: **`card`** — a preset card in the notch, `{ "type": "card", "preset": "<name>", "data": { … } }` (preset names: `email`, `list`, `calendar`, `weather`, `ticker`, `stat`, `info`, `text`, `comparison`; full schemas in `skills/mac/presets/PRESETS.md`; you send structured data, never CSS); **`point`** — flies the mascot to a screenshot pixel, `{ "type": "point", "x", "y", "label"?, "screen"? }`; **`spotlight`** — dims the display and cuts a glowing hole over a spot, `{ "type": "spotlight", "x", "y", "r"?, "label"?, "screen"? }`. Coordinates are pixels read off **this turn's screenshot** (top-left origin); `screen` is 1-based for multi-display. For a **custom card** no preset fits, hand-write real markup in a separate **`<notch_html>…</notch_html>`** tag (lowercase, exactly that spelling — NOT `<NotchHTML>`, NOT `<notch>`); for long prose / a "read me this" / a summary use the `text` preset instead — never dump plain paragraphs into `<notch_html>`, it renders unstyled and edge-to-edge. Send **one** `<mac_actions>` block (it may carry several actions) and **at most one** card (a `card` action OR a `<notch_html>`, never both). Every block is stripped from TTS, so card/action contents are **never** spoken. Canvas is **fixed 383 × 147 pt, transparent over BLACK**; custom cards use light/white text, no external assets (no `<img src>`, no fonts, no JS network) and no interactive elements (clicks do nothing) — though long content IS scrollable, the user scrolls it with the trackpad, so letting content overflow is fine. **CRITICAL: never speak the contents of your card.** If the card carries a list / calendar / email / news / comparison / any structured answer, the spoken text MUST be a short lead-in ONLY ("Here are today's top five, Bruno.") and then stop — do not recite the items, the human is already looking at them. If the answer fits in one spoken sentence, send NO card. Voice and card are complementary, never redundant — pick which one carries the detail per reply, and let the other be brief or absent. When in doubt, **open `skills/mac/SKILL.md` and follow it** — it has the preset catalog, examples (including the canonical bad/good comparison of the speak-the-card duplication failure), custom templates under `skills/mac/frequentSnippets/`, and a pre-send checklist. **Mis-spelling a tag means the markup reaches TTS and gets spoken at the human** — that's a visible failure, not a silent one.
 - **`[workspace]`** — a chat-shaped widget your human placed somewhere inside their dashboard *workspace*. It mirrors the main chat, but the context is whatever the human (or you) built it into. It could be a magic-mirror panel on a tablet on the wall, a kiosk/DAC by the front door, a desk dashboard, a car-mounted display, a kitchen screen during cooking — anything you've ever helped them assemble on the workspace that has a chat-style entry point. **Check `MEMORY.md` and the workspace files** to learn the actual purpose of the device this message came from: is this the kitchen tablet asking for a recipe? The hallway mirror asking what's on today's schedule? The garage panel asking about the car? Tailor tone, brevity, and content to that role. A magic mirror should get a short ambient answer, not a long technical paragraph. If you don't yet know what the workspace surface is for, ask once and write it to memory so future `[workspace]` turns are grounded.
 
 Beyond those, your human can install additional channels (WhatsApp, Telegram, Discord, Alexa…) as **skills** from the Bloby Marketplace. Each channel skill teaches you the conventions for that surface.

package/workspace/client/src/components/Dashboard/DashboardPage.tsx

@@ -1,23 +1,6 @@
-import { Search, Mail, DollarSign, TrendingUp } from 'lucide-react';
-import { AreaChart, Area, BarChart, Bar, ResponsiveContainer } from 'recharts';
+import { PlaceholderWidgets } from './deleteme_placeholders';
 
 const GRADIENT = 'linear-gradient(to right, #0166FF 10%, #009AFE 55%, #4AEEFF 100%)';
-const CARD = 'relative rounded-xl overflow-hidden';
-const BORDER = 'absolute inset-0 rounded-xl bg-gradient-to-b from-white/[0.08] via-white/[0.02] to-transparent pointer-events-none';
-const INNER = 'relative rounded-xl bg-[#141414] m-px p-3.5 h-full';
-
-const rev = [{ v: 82 }, { v: 89 }, { v: 94 }, { v: 101 }, { v: 108 }, { v: 112 }, { v: 125 }];
-const fol = [{ v: 12 }, { v: 18 }, { v: 9 }, { v: 24 }, { v: 31 }, { v: 19 }, { v: 27 }];
-
-function StripeSvg() {
-  return <svg className="h-3.5 w-3.5 text-[#635BFF]" viewBox="0 0 24 24" fill="currentColor"><path d="M13.976 9.15c-2.172-.806-3.356-1.426-3.356-2.409 0-.831.683-1.305 1.901-1.305 2.227 0 4.515.858 6.09 1.631l.89-5.494C18.252.975 15.697 0 12.165 0 9.667 0 7.589.654 6.104 1.872 4.56 3.147 3.757 4.992 3.757 7.218c0 4.039 2.467 5.76 6.476 7.219 2.585.92 3.445 1.574 3.445 2.583 0 .98-.84 1.545-2.354 1.545-1.875 0-4.965-.921-6.99-2.109l-.9 5.555C5.175 22.99 8.385 24 11.714 24c2.641 0 4.843-.624 6.328-1.813 1.664-1.305 2.525-3.236 2.525-5.732 0-4.128-2.524-5.851-6.591-7.305z" /></svg>;
-}
-function GmailSvg() {
-  return <svg className="h-3.5 w-3.5 text-[#EA4335]" viewBox="0 0 24 24" fill="currentColor"><path d="M24 5.457v13.909c0 .904-.732 1.636-1.636 1.636h-3.819V11.73L12 16.64l-6.545-4.91v9.273H1.636A1.636 1.636 0 0 1 0 19.366V5.457c0-2.023 2.309-3.178 3.927-1.964L5.455 4.64 12 9.548l6.545-4.91 1.528-1.145C21.69 2.28 24 3.434 24 5.457z" /></svg>;
-}
-function XSvg() {
-  return <svg className="h-3.5 w-3.5 text-white" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" /></svg>;
-}
 
 export default function DashboardPage() {
   return (
@@ -30,105 +13,9 @@ export default function DashboardPage() {
       </h1>
       <p className="text-muted-foreground text-xs mb-6">Your workspace at a glance.</p>
 
-      <div className="grid grid-cols-3 gap-2.5">
-
-        {/* Stripe — 2 cols */}
-        <div className={`${CARD} col-span-2`}>
-          <div className={BORDER} />
-          <div className={INNER}>
-            <div className="flex items-center justify-between">
-              <div className="flex items-center gap-2">
-                <div className="h-7 w-7 rounded-lg bg-[#635BFF]/10 flex items-center justify-center"><StripeSvg /></div>
-                <span className="text-xs font-bold">Stripe</span>
-              </div>
-              <div className="flex items-center gap-1 text-emerald-500">
-                <TrendingUp className="h-3 w-3" />
-                <span className="text-[10px] font-bold">+12.5%</span>
-              </div>
-            </div>
-            <p className="text-2xl font-bold tracking-tight mt-2">$12,480</p>
-            <p className="text-[10px] text-muted-foreground/50 mb-1">MRR</p>
-            <div className="h-12 overflow-hidden">
-              <ResponsiveContainer width="100%" height={48}>
-                <AreaChart data={rev}>
-                  <defs>
-                    <linearGradient id="sg" x1="0" y1="0" x2="1" y2="0"><stop offset="0%" stopColor="#0166FF" /><stop offset="50%" stopColor="#009AFE" /><stop offset="100%" stopColor="#4AEEFF" /></linearGradient>
-                    <linearGradient id="sf" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stopColor="#009AFE" stopOpacity={0.12} /><stop offset="100%" stopColor="#009AFE" stopOpacity={0} /></linearGradient>
-                  </defs>
-                  <Area type="monotone" dataKey="v" stroke="url(#sg)" strokeWidth={1.5} fill="url(#sf)" />
-                </AreaChart>
-              </ResponsiveContainer>
-            </div>
-          </div>
-        </div>
-
-        {/* X — 1 col */}
-        <div className={`${CARD} col-span-1`}>
-          <div className={BORDER} />
-          <div className={INNER}>
-            <div className="flex items-center gap-2 mb-2">
-              <div className="h-7 w-7 rounded-lg bg-white/[0.06] flex items-center justify-center"><XSvg /></div>
-              <span className="text-xs font-bold">X</span>
-            </div>
-            <p className="text-2xl font-bold tracking-tight">24.8K</p>
-            <div className="flex items-center gap-1 text-emerald-500 mb-1">
-              <TrendingUp className="h-2.5 w-2.5" />
-              <span className="text-[10px] font-bold">+1.4K</span>
-            </div>
-            <div className="h-10 overflow-hidden">
-              <ResponsiveContainer width="100%" height={40}>
-                <BarChart data={fol} barCategoryGap="25%">
-                  <defs>
-                    <linearGradient id="xg" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stopColor="#009AFE" stopOpacity={0.3} /><stop offset="100%" stopColor="#0166FF" stopOpacity={0.05} /></linearGradient>
-                  </defs>
-                  <Bar dataKey="v" fill="url(#xg)" radius={[2, 2, 0, 0]} />
-                </BarChart>
-              </ResponsiveContainer>
-            </div>
-          </div>
-        </div>
-
-        {/* Gmail — 1 col */}
-        <div className={`${CARD} col-span-1`}>
-          <div className={BORDER} />
-          <div className={INNER}>
-            <div className="flex items-center gap-2 mb-2.5">
-              <div className="h-7 w-7 rounded-lg bg-[#EA4335]/10 flex items-center justify-center"><GmailSvg /></div>
-              <span className="text-xs font-bold">Gmail</span>
-              <span className="ml-auto text-[10px] text-muted-foreground/50">3 new</span>
-            </div>
-            {['Sarah Chen', 'Stripe', 'Alex R.'].map((n) => (
-              <div key={n} className="flex items-center gap-2 py-1.5">
-                <div className="h-5 w-5 rounded-full bg-white/[0.06] text-[9px] font-bold flex items-center justify-center shrink-0">{n[0]}</div>
-                <span className="text-[11px] truncate">{n}</span>
-              </div>
-            ))}
-          </div>
-        </div>
-
-        {/* Research — 2 cols */}
-        <div className={`${CARD} col-span-2`}>
-          <div className={BORDER} />
-          <div className={INNER}>
-            <div className="flex items-center gap-2 mb-2.5">
-              <div className="h-7 w-7 rounded-lg bg-[#9235F9]/10 flex items-center justify-center"><Search className="h-3.5 w-3.5 text-[#9235F9]" /></div>
-              <span className="text-xs font-bold">Research</span>
-              <span className="ml-auto text-[10px] font-bold text-muted-foreground bg-white/[0.06] px-2 py-0.5 rounded-full">3</span>
-            </div>
-            {[
-              { t: 'Competitor pricing', s: 'Done', c: 'text-emerald-500 bg-emerald-500/10' },
-              { t: 'Market trends Q1', s: 'Done', c: 'text-emerald-500 bg-emerald-500/10' },
-              { t: 'User feedback', s: 'Review', c: 'text-orange-400 bg-orange-400/10' },
-            ].map((r) => (
-              <div key={r.t} className="flex items-center justify-between py-1.5">
-                <span className="text-[11px]">{r.t}</span>
-                <span className={`text-[9px] font-bold px-1.5 py-0.5 rounded-full ${r.c}`}>{r.s}</span>
-              </div>
-            ))}
-          </div>
-        </div>
-
-      </div>
+      {/* ▼▼▼ EXAMPLE PLACEHOLDERS — safe to delete. See deleteme_placeholders.tsx. ▼▼▼ */}
+      <PlaceholderWidgets />
+      {/* ▲▲▲ EXAMPLE PLACEHOLDERS ▲▲▲ */}
     </div>
   );
 }