nothumanallowed 13.5.10 → 13.5.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nothumanallowed",
-  "version": "13.5.10",
+  "version": "13.5.11",
   "description": "NotHumanAllowed — 38 AI agents, 80 tools, Studio (visual agentic workflows). Email, calendar, browser automation, screen capture, canvas, cron/heartbeat, Alexandria E2E messaging, GitHub, Notion, Slack, voice chat, free AI (Liara), 28 languages. Zero-dependency CLI.",
   "type": "module",
   "bin": {

package/src/constants.mjs

@@ -5,7 +5,7 @@ import { fileURLToPath } from 'url';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-export const VERSION = '13.5.10';
+export const VERSION = '13.5.11';
 export const BASE_URL = 'https://nothumanallowed.com/cli';
 export const API_BASE = 'https://nothumanallowed.com/api/v1';
 

package/src/services/web-ui.mjs

@@ -3798,8 +3798,11 @@ function isoCharSvg(opts) {
   var isDone = opts.isDone;
   var scale = opts.scale || 1;
   var accentColor = opts.accentColor || \x27#6366f1\x27;
-  var idx = opts.emojiIdx || 0;
-  var emoji = AGENT_EMOJIS[idx % AGENT_EMOJIS.length];
+  var idx = opts.emojiIdx;
+  // idx === 99 means orchestrator — use crown+suit combo
+  var emoji = (idx === 99)
+    ? (String.fromCodePoint(0x1F451) + String.fromCodePoint(0x1F9D1,0x200D,0x1F4BC))
+    : AGENT_EMOJIS[(idx || 0) % AGENT_EMOJIS.length];
   var sz = Math.round(52 * scale);
   var glowColor = isActive ? accentColor : (isDone ? \x27#22c55e\x27 : \x27transparent\x27);
   var glowFilter = (isActive || isDone) ? (\x27filter:drop-shadow(0 0 8px \x27+glowColor+\x27aa)\x27) : \x27\x27;
@@ -3841,6 +3844,61 @@ function agentPalette(lbl) {
   return {skin: skins[i], shirt: shirts[i], hair: hairs[i]};
 }
 
+// Tool emoji map — specific icon per agent/tool type, fallback to default
+var TOOL_EMOJI_MAP = {
+  websearch: String.fromCodePoint(0x1F50D),
+  search: String.fromCodePoint(0x1F50D),
+  browser: String.fromCodePoint(0x1F310),
+  email: String.fromCodePoint(0x1F4E7),
+  gmail: String.fromCodePoint(0x1F4E7),
+  calendar: String.fromCodePoint(0x1F4C5),
+  github: String.fromCodePoint(0x1F431),
+  notion: String.fromCodePoint(0x1F4D3),
+  slack: String.fromCodePoint(0x1F4AC),
+  data: String.fromCodePoint(0x1F4CA),
+  analyst: String.fromCodePoint(0x1F4CA),
+  writer: String.fromCodePoint(0x270F,0xFE0F),
+  summary: String.fromCodePoint(0x1F4CB),
+  research: String.fromCodePoint(0x1F52C),
+  canvas: String.fromCodePoint(0x1F3A8),
+  security: String.fromCodePoint(0x1F6E1,0xFE0F),
+  devops: String.fromCodePoint(0x2699,0xFE0F),
+  code: String.fromCodePoint(0x1F4BB),
+  file: String.fromCodePoint(0x1F4C2),
+  drive: String.fromCodePoint(0x1F4BE),
+  maps: String.fromCodePoint(0x1F5FA,0xFE0F),
+  voice: String.fromCodePoint(0x1F3A4),
+  pdf: String.fromCodePoint(0x1F4DC),
+  document: String.fromCodePoint(0x1F4DC),
+  task: String.fromCodePoint(0x2705),
+  contacts: String.fromCodePoint(0x1F4F1),
+  reminder: String.fromCodePoint(0x23F0),
+  news: String.fromCodePoint(0x1F4F0),
+  image: String.fromCodePoint(0x1F5BC,0xFE0F),
+  video: String.fromCodePoint(0x1F3AC),
+  music: String.fromCodePoint(0x1F3B5),
+  translate: String.fromCodePoint(0x1F30D),
+  math: String.fromCodePoint(0x1F9EE),
+  sql: String.fromCodePoint(0x1F5C4,0xFE0F),
+  api: String.fromCodePoint(0x1F517),
+  test: String.fromCodePoint(0x1F9EA),
+  monitor: String.fromCodePoint(0x1F4F6),
+  _default: String.fromCodePoint(0x1F527) // wrench as fallback
+};
+
+function getNodeEmoji(n) {
+  var lbl = (n.label || n.agent || '').toLowerCase();
+  var icon = n.icon || '';
+  // Check by label keywords
+  var keys = Object.keys(TOOL_EMOJI_MAP);
+  for (var ki = 0; ki < keys.length; ki++) {
+    if (keys[ki] !== '_default' && lbl.indexOf(keys[ki]) >= 0) return TOOL_EMOJI_MAP[keys[ki]];
+  }
+  // If icon looks like an emoji code point (not HTML entity), use it
+  if (icon && icon.length > 0 && icon.charCodeAt(0) > 127) return icon;
+  return TOOL_EMOJI_MAP._default;
+}
+
 function renderStudioNodes() {
   var el = document.getElementById('studioNodes');
   if (!el) return;
@@ -3855,78 +3913,170 @@ function renderStudioNodes() {
   var totalCount = nodes.length;
   var showMaster = hasActive || doneCount > 0;
 
-  // ── ISO scene dimensions ───────────────────────────────────────────────────
-  var ISO_COLS = Math.max(nodes.length, 1);
-  var SCENE_W = 640; var SCENE_H = 420;
+  var phaseLabel2 = hasActive
+    ? (\x27Workflow in esecuzione \u2014 \x27+doneCount+\x27/\x27+totalCount)
+    : (doneCount===totalCount && totalCount>0 ? \x27Workflow completato\x27 : \x27Workflow pianificato\x27);
+  var phaseColor2 = hasActive ? \x27#6366f1\x27 : (doneCount===totalCount && totalCount>0 ? \x27#22c55e\x27 : \x27#6b7280\x27);
+
+  // ── Layout: all nodes + orchestrator on a grid ────────────────────────────
+  // Include orchestrator as first "station" (desk 0), then all agents
+  // Total stations = nodes.length + 1 (orchestrator)
+  var totalStations = totalCount + 1;
+  // Grid: up to 3 per row, rows fill downward
+  var cols = Math.min(totalStations, 3);
+  var rows = Math.ceil(totalStations / cols);
+
+  // Scene: square, 100% width of parent, dynamic height based on grid rows
+  // Each cell = 160px wide, 180px tall
+  var CELL_W = 160; var CELL_H = 180;
+  var SCENE_W = cols * CELL_W + 40; // +padding
+  var SCENE_H = Math.max(rows * CELL_H + 80, 400);
+
+  // Plant emoji for decoration corners
+  var plantEmoji = String.fromCodePoint(0x1F331); // seedling
+  var bigPlant = String.fromCodePoint(0x1FAB4);   // potted plant
+
+  // ── Build station HTML ───────────────────────────────────────────────────
+  var stationsHtml = \x27\x27;
+
+  // Station builder — shared for orchestrator and agents
+  function buildStation(stationIdx, label, emoji, toolEmoji, isOrch, isActive, isDone, isErr, idx) {
+    var col = stationIdx % cols;
+    var row2 = Math.floor(stationIdx / cols);
+    var left = 20 + col * CELL_W + CELL_W/2;
+    var top = 30 + row2 * CELL_H;
+    var zIdx = 100 + row2 * 10 + col;
+    var accentColor = isOrch ? \x27#818cf8\x27 : (isActive ? \x27#6366f1\x27 : (isDone ? \x27#22c55e\x27 : (isErr ? \x27#ef4444\x27 : \x27#aaa\x27)));
+
+    // Desk — isometric CSS box using borders
+    var deskHtml = \x27<div class="iso-desk" style="--dc:\x27+accentColor+\x27"></div>\x27;
+
+    // Monitor — small box on desk
+    var monHtml = \x27<div class="iso-monitor" style="border-color:\x27+accentColor+\x2788">\x27+
+      \x27<div class="iso-monitor-screen">\x27+(isOrch?\x27<span style="font-size:10px">&#128269;</span>\x27:(isDone?\x27<span style="color:#22c55e;font-size:10px">&#10003;</span>\x27:(isActive?\x27<span class="iso-monitor-blink"></span>\x27:\x27<span style="font-size:9px;opacity:.4">&#9632;</span>\x27)))+\x27</div>\x27+
+      \x27</div>\x27;
 
-  var agentsHtml = \x27\x27;
+    // Tool badge — the emoji representing what this node does
+    var toolBadge = \x27<div class="iso-tool-badge" title="\x27+esc(label)+\x27">\x27+toolEmoji+\x27</div>\x27;
+
+    // Agent/tool character emoji
+    var charEmojiHtml = isoCharSvg({emojiIdx: isOrch ? 99 : idx, isActive: isActive, isDone: isDone, scale: 1, accentColor: accentColor});
+
+    // Status bubble
+    var bubbleText = isOrch
+      ? (hasActive ? (\x27Step \x27+doneCount+\x27/\x27+totalCount) : ((!hasActive && doneCount===totalCount && totalCount>0) ? \x27Completato!\x27 : \x27In attesa\x27))
+      : (isActive ? \x27...lavora\x27 : (isDone ? \x27\u2714 fatto\x27 : (isErr ? \x27\u2715 errore\x27 : \x27\x27)));
+    var bubbleColor = isOrch ? \x27#818cf8\x27 : (isActive ? \x27#6366f1\x27 : (isDone ? \x27#22c55e\x27 : \x27#ef4444\x27));
+    var bubbleHtml = (bubbleText || isOrch)
+      ? \x27<div class="iso-bubble\x27+(isActive?\x27 iso-bubble--active\x27:\x27\x27)+\x27" id="isobubble_\x27+(isOrch?\x27orch\x27:idx)+\x27" style="border-color:\x27+bubbleColor+\x27;color:\x27+bubbleColor+\x27">\x27+esc(bubbleText)+\x27</div>\x27
+      : \x27<div style="height:22px"></div>\x27;
+
+    // Name badge
+    var nameColor = isDone ? \x27#16a34a\x27 : (isActive ? \x27#6366f1\x27 : (isOrch ? \x27#818cf8\x27 : (isErr ? \x27#dc2626\x27 : \x27#374151\x27)));
+    var nameBg = isDone ? \x27#dcfce7\x27 : (isActive ? \x27#ede9fe\x27 : (isOrch ? \x27#e0e7ff\x27 : \x27#f3f4f6\x27));
+    var nameHtml = \x27<div class="iso-name" style="color:\x27+nameColor+\x27;background:\x27+nameBg+\x27">\x27+(isOrch?\x27\u2666 \x27:\x27\x27)+esc(label.slice(0,18))+\x27</div>\x27;
+
+    // Orchestrator walk animation — walks between desks horizontally
+    var orchWalkStyle = \x27\x27;
+    if (isOrch && hasActive) {
+      var activeIdx = nodes.findIndex(function(nd){return nd.status===\x27running\x27;});
+      if (activeIdx >= 0) {
+        var targetStation = activeIdx + 1; // station index of active agent (orch is 0)
+        var targetCol = targetStation % cols;
+        var targetRow = Math.floor(targetStation / cols);
+        var targetLeft = 20 + targetCol * CELL_W + CELL_W/2;
+        var targetTop = 30 + targetRow * CELL_H;
+        orchWalkStyle = \x27--orch-tx:\x27+(targetLeft - left)+\x27px;--orch-ty:\x27+(targetTop - top)+\x27px\x27;
+      }
+    }
+    var orchClass = (isOrch && hasActive) ? \x27 iso-orch-walking\x27 : (isOrch && !hasActive && doneCount===totalCount && totalCount>0 ? \x27 iso-orch-done\x27 : \x27\x27);
+
+    var clickHandler = isOrch ? \x27\x27 : \x27onclick="studioScrollToAgent(this.getAttribute(String.fromCharCode(100,97,116,97,45,97,103,101,110,116,45,108,97,98,101,108)))"\x27;
+    var dataAttr = isOrch ? \x27\x27 : \x27data-agent-label="\x27+esc(label)+\x27"\x27;
+
+    return \x27<div class="iso-station\x27+orchClass+\x27" \x27+dataAttr+\x27 style="position:absolute;left:\x27+left+\x27px;top:\x27+top+\x27px;z-index:\x27+zIdx+\x27;transform:translateX(-50%);\x27+orchWalkStyle+\x27" \x27+clickHandler+\x27>\x27+
+      bubbleHtml+
+      toolBadge+
+      charEmojiHtml+
+      deskHtml+
+      monHtml+
+      nameHtml+
+      \x27</div>\x27;
+  }
+
+  // Orchestrator station (index 0)
+  var orchIsActive2 = hasActive;
+  var orchDone2 = !hasActive && doneCount === totalCount && totalCount > 0;
+  stationsHtml += buildStation(0, \x27Orchestratore\x27, String.fromCodePoint(0x1F451), String.fromCodePoint(0x1F4CB), true, orchIsActive2, orchDone2, false, -1);
+
+  // Agent/tool stations (index 1..N)
   nodes.forEach(function(n, idx) {
     var isActive = n.status === \x27running\x27;
     var isDone = n.status === \x27done\x27;
     var isErr = n.status === \x27error\x27;
     var lbl = n.label || n.agent;
-    var pal = agentPalette(lbl);
-    var accentColor = isActive ? \x27#6366f1\x27 : (isDone ? \x27#22c55e\x27 : (isErr ? \x27#ef4444\x27 : \x27#999\x27));
-
-    // Spread agents evenly across front rows
-    var colStep = ISO_COLS > 1 ? 5 / (ISO_COLS - 1) : 2;
-    var col = (ISO_COLS === 1) ? 2.5 : idx * colStep;
-    var row = 3.5;
-    var pos = isoProject(col, row);
-    var px = pos.x; var py = pos.y + 80;
-    var charScale = 1.1;
-    var zIdx = Math.round(py + 100);
-
-    // Bubble: only show when active (live text) or done (checkmark)
-    var bubbleText = isActive ? \x27...lavora\x27 : (isDone ? \x27\u2714 fatto\x27 : (isErr ? \x27\u2715 errore\x27 : \x27\x27));
-    var bubbleColor = isActive ? \x27#6366f1\x27 : (isDone ? \x27#22c55e\x27 : \x27#ef4444\x27);
-    void pal; // palette no longer used for character rendering
-    var charSvg = isoCharSvg({emojiIdx: idx, isActive: isActive, isDone: isDone, scale: charScale, accentColor: accentColor});
-    var charW = Math.round(52 * charScale); var charH = Math.round(52 * charScale);
-
-    agentsHtml += \x27<div class="iso-agent" data-agent-label="\x27+esc(lbl)+\x27" style="position:absolute;left:\x27+(px-charW/2)+\x27px;top:\x27+(py-charH)+\x27px;z-index:\x27+zIdx+\x27;display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer" onclick="studioScrollToAgent(this.getAttribute(String.fromCharCode(100,97,116,97,45,97,103,101,110,116,45,108,97,98,101,108)))">\x27;
-    // Bubble — bigger, left-aligned (no mirror issue)
-    if (bubbleText || isActive) {
-      agentsHtml += \x27<div class="iso-bubble\x27+(isActive?\x27 iso-bubble--active\x27:\x27\x27)+\x27" id="isobubble_\x27+idx+\x27" style="border-color:\x27+bubbleColor+\x27;color:\x27+bubbleColor+\x27;min-width:80px;max-width:140px;font-size:10px;padding:4px 10px;text-align:left">\x27+esc(bubbleText)+\x27</div>\x27;
-    } else {
-      agentsHtml += \x27<div class="iso-bubble" id="isobubble_\x27+idx+\x27" style="visibility:hidden;min-width:80px"></div>\x27;
-    }
-    agentsHtml += charSvg;
-    agentsHtml += \x27<div class="iso-name" style="font-size:10px;font-weight:700;color:\x27+(isDone?\x27#22c55e\x27:(isActive?\x27#818cf8\x27:(isErr?\x27#ef4444\x27:\x27#555\x27)))+\x27;text-shadow:0 1px 3px rgba(255,255,255,.8)">\x27+esc(lbl)+\x27</div>\x27;
-    // Desk — lighter wood color for bright office
-    agentsHtml += isoDeskSvg(px, py - charH/2, accentColor);
-    agentsHtml += \x27</div>\x27;
+    var toolEmoji = getNodeEmoji(n);
+    stationsHtml += buildStation(idx + 1, lbl, AGENT_EMOJIS[idx % AGENT_EMOJIS.length], toolEmoji, false, isActive, isDone, isErr, idx);
   });
 
-  // ── Orchestrator ──────────────────────────────────────────────────────────
-  var orchHtml = \x27\x27;
-  if (showMaster) {
-    var oPh = isoProject(ISO_COLS / 2 + 0.5, 1.2);
-    var orchDone = !hasActive && doneCount === totalCount;
-    var orchAnim = hasActive ? \x27prl-master-walk\x27 : (orchDone ? \x27prl-master-done\x27 : \x27\x27);
-    var orchStatus = hasActive
-      ? (\x27Step \x27+doneCount+\x27/\x27+totalCount)
-      : (orchDone ? \x27Completato!\x27 : \x27Pianificazione\x27);
-    orchHtml = \x27<div class="prl-master \x27+orchAnim+\x27" id="wfOrch" style="position:absolute;left:\x27+(oPh.x-28)+\x27px;top:\x27+(oPh.y+60)+\x27px;z-index:50;display:flex;flex-direction:column;align-items:center;gap:3px">\x27+
-      \x27<div class="iso-bubble iso-bubble--orch" id="wfOrchBubble" style="border-color:#6366f1;color:#6366f1;max-width:140px;font-size:10px;padding:4px 10px">\x27+esc(orchStatus)+\x27</div>\x27+
-      isoOrchSvg(hasActive, doneCount / Math.max(totalCount,1))+
-      \x27<div class="prl-master-label" style="color:#6366f1;font-size:9px;font-weight:700;text-shadow:0 1px 3px rgba(255,255,255,.8)">Orchestratore</div>\x27+
-      \x27</div>\x27;
-  }
+  // ── Decorations: plants + door ───────────────────────────────────────────
+  var decoHtml =
+    \x27<div style="position:absolute;bottom:8px;left:8px;font-size:32px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))">\x27+bigPlant+\x27</div>\x27+
+    \x27<div style="position:absolute;bottom:8px;right:8px;font-size:32px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))">\x27+bigPlant+\x27</div>\x27+
+    \x27<div style="position:absolute;top:8px;right:14px;font-size:22px;line-height:1">\x27+plantEmoji+\x27</div>\x27+
+    // Door on back wall
+    \x27<div style="position:absolute;top:0;left:50%;transform:translateX(-50%);width:38px;height:54px;background:#c8a87a;border:2px solid #a07848;border-radius:4px 4px 0 0;z-index:1">\x27+
+      \x27<div style="position:absolute;right:5px;top:50%;width:6px;height:6px;border-radius:50%;background:#7a5a2a;transform:translateY(-50%)"></div>\x27+
+      \x27<div style="position:absolute;top:4px;left:4px;right:4px;height:16px;background:rgba(255,255,255,.15);border-radius:2px"></div>\x27+
+    \x27</div>\x27;
 
-  var phaseLabel2 = hasActive
-    ? (\x27Workflow in esecuzione \u2014 \x27+doneCount+\x27/\x27+totalCount)
-    : (doneCount===totalCount && totalCount>0 ? \x27Workflow completato\x27 : \x27Workflow pianificato\x27);
-  var phaseColor2 = hasActive ? \x27#6366f1\x27 : (doneCount===totalCount && totalCount>0 ? \x27#22c55e\x27 : \x27#6b7280\x27);
+  // ── Floor SVG (fills the whole scene) ────────────────────────────────────
+  var floorSvg = \x27<svg viewBox="0 0 \x27+SCENE_W+\x27 \x27+SCENE_H+\x27" width="\x27+SCENE_W+\x27" height="\x27+SCENE_H+\x27" xmlns="http://www.w3.org/2000/svg" style="position:absolute;top:0;left:0;z-index:0;pointer-events:none">\x27;
+  // Back wall
+  floorSvg += \x27<rect x="0" y="0" width="\x27+SCENE_W+\x27" height="\x27+Math.round(SCENE_H*0.38)+\x27" fill="#f5f0ea"/>\x27;
+  // Baseboard
+  floorSvg += \x27<rect x="0" y="\x27+Math.round(SCENE_H*0.38-4)+\x27" width="\x27+SCENE_W+\x27" height="6" fill="#d4c4a8" rx="1"/>\x27;
+  // Floor — parquet planks
+  var floorY = Math.round(SCENE_H*0.38);
+  var plankColors = [\x27#c8a06a\x27,\x27#bf9860\x27,\x27#d4aa72\x27,\x27#ba9458\x27,\x27#c4a068\x27];
+  var plankH = 28; var plankW = 80;
+  for (var fy = floorY; fy < SCENE_H; fy += plankH) {
+    var rowOff = (Math.floor((fy-floorY)/plankH) % 2) * (plankW/2);
+    for (var fx = -plankW + rowOff; fx < SCENE_W + plankW; fx += plankW) {
+      var pc = plankColors[Math.abs(Math.round(fx/plankW + fy/plankH)) % plankColors.length];
+      floorSvg += \x27<rect x="\x27+fx+\x27" y="\x27+fy+\x27" width="\x27+(plankW-1)+\x27" height="\x27+(plankH-1)+\x27" fill="\x27+pc+\x27" rx="1"/>\x27;
+      // Grain line
+      floorSvg += \x27<line x1="\x27+(fx+plankW*0.35)+\x27" y1="\x27+fy+\x27" x2="\x27+(fx+plankW*0.35)+\x27" y2="\x27+(fy+plankH-1)+\x27" stroke="rgba(0,0,0,.05)" stroke-width="1"/>\x27;
+    }
+  }
+  // Window on back wall
+  floorSvg += \x27<rect x="20" y="18" width="60" height="50" rx="3" fill="#bbd8f5" stroke="#a8c4dc" stroke-width="2"/>\x27;
+  floorSvg += \x27<line x1="50" y1="18" x2="50" y2="68" stroke="#a8c4dc" stroke-width="1.5"/>\x27;
+  floorSvg += \x27<line x1="20" y1="43" x2="80" y2="43" stroke="#a8c4dc" stroke-width="1.5"/>\x27;
+  floorSvg += \x27<rect x="20" y="18" width="60" height="50" rx="3" fill="rgba(255,255,255,.15)"/>\x27;
+  if (SCENE_W > 350) {
+    floorSvg += \x27<rect x="\x27+(SCENE_W-100)+\x27" y="18" width="60" height="50" rx="3" fill="#bbd8f5" stroke="#a8c4dc" stroke-width="2"/>\x27;
+    floorSvg += \x27<line x1="\x27+(SCENE_W-70)+\x27" y1="18" x2="\x27+(SCENE_W-70)+\x27" y2="68" stroke="#a8c4dc" stroke-width="1.5"/>\x27;
+    floorSvg += \x27<line x1="\x27+(SCENE_W-100)+\x27" y1="43" x2="\x27+(SCENE_W-40)+\x27" y2="43" stroke="#a8c4dc" stroke-width="1.5"/>\x27;
+  }
+  // Chandelier
+  var chandX = Math.round(SCENE_W/2);
+  floorSvg += \x27<line x1="\x27+chandX+\x27" y1="0" x2="\x27+chandX+\x27" y2="24" stroke="#999" stroke-width="2"/>\x27;
+  floorSvg += \x27<ellipse cx="\x27+chandX+\x27" cy="28" rx="28" ry="8" fill="#e8d980" stroke="#c8b840" stroke-width="1.5"/>\x27;
+  floorSvg += \x27<circle cx="\x27+(chandX-18)+\x27" cy="32" r="5" fill="#fff8c0" filter="url(#bGlow)"/>\x27;
+  floorSvg += \x27<circle cx="\x27+chandX+\x27" cy="34" r="5" fill="#fff8c0" filter="url(#bGlow)"/>\x27;
+  floorSvg += \x27<circle cx="\x27+(chandX+18)+\x27" cy="32" r="5" fill="#fff8c0" filter="url(#bGlow)"/>\x27;
+  floorSvg += \x27<defs><filter id="bGlow" x="-100%" y="-100%" width="300%" height="300%"><feGaussianBlur stdDeviation="4" result="b"/><feMerge><feMergeNode in="b"/><feMergeNode in="SourceGraphic"/></feMerge></filter></defs>\x27;
+  floorSvg += \x27</svg>\x27;
 
   el.innerHTML =
     \x27<div class="prl-wrap" style="border-color:\x27+phaseColor2+\x2744;padding-bottom:8px">\x27+
     \x27<div class="prl-header"><span class="prl-phase-chip" style="--pc:\x27+phaseColor2+\x27">\x27+phaseLabel2+\x27</span></div>\x27+
-    \x27<div style="display:flex;justify-content:center;width:100%;overflow-x:auto">\x27+
-    \x27<div class="iso-scene" style="position:relative;width:\x27+SCENE_W+\x27px;min-width:\x27+SCENE_W+\x27px;height:\x27+SCENE_H+\x27px;overflow:hidden;border-radius:12px;background:#f0ede6">\x27+
-    isoFloorSvg(ISO_COLS + 2, 5)+
-    agentsHtml+
-    orchHtml+
+    \x27<div class="iso-scene-wrap">\x27+
+    \x27<div class="iso-scene" style="position:relative;width:\x27+SCENE_W+\x27px;min-width:\x27+SCENE_W+\x27px;height:\x27+SCENE_H+\x27px">\x27+
+    floorSvg+
+    decoHtml+
+    stationsHtml+
     \x27</div>\x27+
     \x27</div>\x27+
     \x27</div>\x27;
@@ -6533,7 +6683,26 @@ input:focus,textarea:focus{border-color:var(--green3)}
 /* Plant right */
 .prl-office-plant2{position:absolute;bottom:14px;right:8px;width:22px;height:42px;z-index:2;pointer-events:none}
 /* ── ISOMETRIC JRPG SCENE ── */
-.iso-scene{background:#f0ede6;cursor:default;max-width:100%;overflow-x:auto;box-shadow:0 4px 24px rgba(0,0,0,.18)}
+.iso-scene-wrap{width:100%;overflow-x:auto;display:flex;justify-content:center}
+.iso-scene{background:#f0ede6;cursor:default;overflow:hidden;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,.18)}
+/* ── Station layout (new grid-based office) ── */
+.iso-station{display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;transition:filter .2s}
+.iso-station:hover{filter:brightness(1.08)}
+.iso-station.iso-orch-walking{animation:orchWalk 2.2s ease-in-out infinite alternate}
+@keyframes orchWalk{0%{transform:translateX(-50%)}100%{transform:translateX(calc(-50% + var(--orch-tx,0px))) translateY(var(--orch-ty,0px))}}
+.iso-station.iso-orch-done{animation:orchDone .6s ease forwards}
+@keyframes orchDone{0%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.15)}100%{transform:translateX(-50%) scale(1)}}
+/* Desk */
+.iso-desk{width:90px;height:18px;background:linear-gradient(180deg,#d4a448 0%,#b8832a 100%);border-radius:4px 4px 2px 2px;box-shadow:0 4px 0 #8a5e18,0 6px 8px rgba(0,0,0,.25);border:1px solid #c49038;position:relative;margin-top:2px}
+.iso-desk::after{content:'';position:absolute;bottom:-4px;left:6px;right:6px;height:4px;background:#8a5e18;border-radius:0 0 3px 3px}
+/* Monitor on desk */
+.iso-monitor{width:52px;height:38px;background:#1a1a2c;border:2px solid #3a3070;border-radius:4px;position:absolute;top:-44px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center}
+.iso-monitor::before{content:'';position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);width:8px;height:6px;background:#252436;border-radius:0 0 2px 2px}
+.iso-monitor-screen{width:42px;height:28px;background:rgba(80,60,180,.3);border-radius:2px;display:flex;align-items:center;justify-content:center}
+.iso-monitor-blink{width:6px;height:6px;border-radius:50%;background:#6366f1;animation:monBlink .8s ease-in-out infinite}
+@keyframes monBlink{0%,100%{opacity:1;box-shadow:0 0 6px #6366f1}50%{opacity:.3;box-shadow:none}}
+/* Tool badge emoji floating above desk */
+.iso-tool-badge{font-size:18px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));margin-bottom:-2px;user-select:none}
 /* Animated status chip for [bracket tokens] */
 .iso-status-chip{display:inline-flex;align-items:center;gap:6px;background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.3);border-radius:20px;padding:3px 10px;font-size:11px;font-family:var(--mono);color:#818cf8;animation:statusPulse 2s ease-in-out infinite}
 @keyframes statusPulse{0%,100%{opacity:.7;border-color:rgba(99,102,241,.3)}50%{opacity:1;border-color:rgba(99,102,241,.7);box-shadow:0 0 8px rgba(99,102,241,.3)}}