npm - mindcraft - Versions diffs - 0.1.4-0 - Mend

mindcraft 0.1.4-0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (116) hide show

package/FAQ.md +38 -0
package/LICENSE +21 -0
package/README.md +255 -0
package/andy.json +6 -0
package/bin/mindcraft.js +80 -0
package/keys.example.json +19 -0
package/main.js +80 -0
package/package.json +78 -0
package/patches/minecraft-data+3.97.0.patch +13 -0
package/patches/mineflayer+4.33.0.patch +54 -0
package/patches/mineflayer-pathfinder+2.4.5.patch +265 -0
package/patches/mineflayer-pvp+1.3.2.patch +13 -0
package/patches/prismarine-viewer+1.33.0.patch +13 -0
package/patches/protodef+1.19.0.patch +15 -0
package/profiles/andy-4-reasoning.json +14 -0
package/profiles/andy-4.json +7 -0
package/profiles/azure.json +19 -0
package/profiles/claude.json +7 -0
package/profiles/claude_thinker.json +15 -0
package/profiles/deepseek.json +7 -0
package/profiles/defaults/_default.json +256 -0
package/profiles/defaults/assistant.json +14 -0
package/profiles/defaults/creative.json +14 -0
package/profiles/defaults/god_mode.json +14 -0
package/profiles/defaults/survival.json +14 -0
package/profiles/freeguy.json +7 -0
package/profiles/gemini.json +9 -0
package/profiles/gpt.json +12 -0
package/profiles/grok.json +7 -0
package/profiles/llama.json +10 -0
package/profiles/mercury.json +9 -0
package/profiles/mistral.json +5 -0
package/profiles/qwen.json +17 -0
package/profiles/tasks/construction_profile.json +42 -0
package/profiles/tasks/cooking_profile.json +11 -0
package/profiles/tasks/crafting_profile.json +71 -0
package/profiles/vllm.json +10 -0
package/settings.js +64 -0
package/src/agent/action_manager.js +177 -0
package/src/agent/agent.js +561 -0
package/src/agent/coder.js +229 -0
package/src/agent/commands/actions.js +504 -0
package/src/agent/commands/index.js +259 -0
package/src/agent/commands/queries.js +347 -0
package/src/agent/connection_handler.js +96 -0
package/src/agent/conversation.js +353 -0
package/src/agent/history.js +122 -0
package/src/agent/library/full_state.js +89 -0
package/src/agent/library/index.js +23 -0
package/src/agent/library/lockdown.js +32 -0
package/src/agent/library/skill_library.js +93 -0
package/src/agent/library/skills.js +2093 -0
package/src/agent/library/world.js +431 -0
package/src/agent/memory_bank.js +25 -0
package/src/agent/mindserver_proxy.js +136 -0
package/src/agent/modes.js +446 -0
package/src/agent/npc/build_goal.js +80 -0
package/src/agent/npc/construction/dirt_shelter.json +38 -0
package/src/agent/npc/construction/large_house.json +230 -0
package/src/agent/npc/construction/small_stone_house.json +42 -0
package/src/agent/npc/construction/small_wood_house.json +42 -0
package/src/agent/npc/controller.js +261 -0
package/src/agent/npc/data.js +50 -0
package/src/agent/npc/item_goal.js +355 -0
package/src/agent/npc/utils.js +126 -0
package/src/agent/self_prompter.js +146 -0
package/src/agent/settings.js +7 -0
package/src/agent/speak.js +150 -0
package/src/agent/tasks/construction_tasks.js +1104 -0
package/src/agent/tasks/cooking_tasks.js +358 -0
package/src/agent/tasks/tasks.js +594 -0
package/src/agent/templates/execTemplate.js +6 -0
package/src/agent/templates/lintTemplate.js +10 -0
package/src/agent/vision/browser_viewer.js +8 -0
package/src/agent/vision/camera.js +78 -0
package/src/agent/vision/vision_interpreter.js +82 -0
package/src/mindcraft/index.js +28 -0
package/src/mindcraft/mcserver.js +154 -0
package/src/mindcraft/mindcraft.js +111 -0
package/src/mindcraft/mindserver.js +328 -0
package/src/mindcraft/public/index.html +1253 -0
package/src/mindcraft/public/settings_spec.json +145 -0
package/src/mindcraft/userconfig.js +72 -0
package/src/mindcraft-py/example.py +27 -0
package/src/mindcraft-py/init-mindcraft.js +24 -0
package/src/mindcraft-py/mindcraft.py +99 -0
package/src/models/_model_map.js +89 -0
package/src/models/azure.js +32 -0
package/src/models/cerebras.js +61 -0
package/src/models/claude.js +87 -0
package/src/models/deepseek.js +59 -0
package/src/models/gemini.js +176 -0
package/src/models/glhf.js +71 -0
package/src/models/gpt.js +147 -0
package/src/models/grok.js +82 -0
package/src/models/groq.js +95 -0
package/src/models/huggingface.js +86 -0
package/src/models/hyperbolic.js +114 -0
package/src/models/lmstudio.js +74 -0
package/src/models/mercury.js +95 -0
package/src/models/mistral.js +94 -0
package/src/models/novita.js +71 -0
package/src/models/ollama.js +115 -0
package/src/models/openrouter.js +77 -0
package/src/models/prompter.js +366 -0
package/src/models/qwen.js +80 -0
package/src/models/replicate.js +60 -0
package/src/models/vllm.js +81 -0
package/src/process/agent_process.js +84 -0
package/src/process/init_agent.js +54 -0
package/src/utils/examples.js +83 -0
package/src/utils/keys.js +34 -0
package/src/utils/math.js +13 -0
package/src/utils/mcdata.js +572 -0
package/src/utils/text.js +78 -0
package/src/utils/translator.js +30 -0

package/src/mindcraft/public/index.html ADDED Viewed

@@ -0,0 +1,1253 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Mindcraft</title>
+    <script src="/socket.io/socket.io.js"></script>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            margin: 20px;
+            background: #1a1a1a;
+            color: #e0e0e0;
+        }
+        #agents {
+            background: #2d2d2d;
+            padding: 20px;
+            border-radius: 8px;
+            box-shadow: 0 2px 4px rgba(0,0,0,0.2);
+        }
+        h1 {
+            color: #ffffff;
+        }
+        .agent {
+            margin: 10px 0;
+            padding: 10px;
+            background: #363636;
+            border-radius: 4px;
+            display: flex;
+            flex-direction: column;
+            align-items: stretch;
+        }
+        .restart-btn, .start-btn, .stop-btn {
+            color: white;
+            border: none;
+            padding: 5px 10px;
+            border-radius: 4px;
+            cursor: pointer;
+            margin-left: 5px;
+        }
+        .restart-btn {
+            background: #4CAF50;
+        }
+        .start-btn {
+            background: #2196F3;
+        }
+        .stop-btn {
+            background: #f44336;
+        }
+        .restart-btn:hover { background: #45a049; }
+        .start-btn:hover { background: #1976D2; }
+        .stop-btn:hover { background: #d32f2f; }
+        .gear-btn {
+            background: #505050;
+            color: #fff;
+            border: none;
+            border-radius: 4px;
+            padding: 2px 6px;
+            cursor: pointer;
+            margin-left: 6px;
+            font-size: 0.9em;
+        }
+        .gear-btn:hover { background: #5a5a5a; }
+        .status-icon {
+            font-size: 12px;
+            margin-right: 8px;
+        }
+        .status-icon.online {
+            color: #4CAF50;
+        }
+        .status-icon.offline {
+            color: #f44336;
+        }
+        #settingsForm {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
+            gap: 8px;
+            margin-top: 10px;
+        }
+        .setting-wrapper {
+            display: flex;
+            align-items: center;
+            gap: 6px;
+            background: #3a3a3a;
+            padding: 6px 8px;
+            border-radius: 4px;
+            width: 100%;
+            box-sizing: border-box;
+            min-width: 0;
+        }
+        .setting-wrapper label {
+            flex: 0 0 50%;
+            font-size: 0.9em;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+        .setting-wrapper input[type="text"],
+        .setting-wrapper input[type="number"] {
+            flex: 1 1 0;
+            background: #262626;
+            border: 1px solid #555;
+            color: #e0e0e0;
+            border-radius: 4px;
+            padding: 4px 6px;
+            max-width: 100%;
+            min-width: 0;
+        }
+        .setting-wrapper input[type="checkbox"] {
+            transform: scale(1.2);
+        }
+        .agent-view-container {
+            width: 100%;
+            height: 100%;
+            aspect-ratio: 4/3;
+            overflow: hidden;
+        }
+        .agent-viewer {
+            width: 100%;
+            height: 100%;
+            border: none;
+            display: block;
+        }
+        .last-message {
+            font-style: italic;
+            color: #aaa;
+            margin-top: 5px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            width: 100%;
+        }
+        .start-btn:disabled {
+            opacity: 0.4;
+            cursor: not-allowed;
+        }
+        .agent-view-container {
+            margin-top: 6px;
+            display: flex;
+            justify-content: flex-start;
+        }
+        .agent-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+            gap: 8px;
+            width: 100%;
+            align-items: start;
+        }
+        .agent-grid .cell {
+            background: #3a3a3a;
+            padding: 6px 8px;
+            border-radius: 4px;
+        }
+        .agent-grid .cell.title {
+            background: transparent;
+            padding: 0;
+        }
+        .agent-inventory {
+            margin-top: 8px;
+            background: #2f2f2f;
+            border-radius: 6px;
+            padding: 8px;
+        }
+        .agent-inventory h3 { margin: 0 0 6px 0; font-size: 1em; }
+        .inventory-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+            gap: 6px;
+        }
+        .agent-details-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+            gap: 6px;
+            width: 100%;
+        }
+        .controls-row {
+            margin-top: 8px;
+            display: grid;
+            grid-template-columns: auto minmax(100px, 1fr) repeat(5, auto);
+            gap: 8px;
+            align-items: center;
+        }
+        .msg-input {
+            width: calc(100% - 8px);
+            background: #262626;
+            border: 1px solid #555;
+            color: #e0e0e0;
+            border-radius: 4px;
+            padding: 4px 6px;
+        }
+        .neutral-btn {
+            color: white;
+            border: none;
+            padding: 5px 10px;
+            border-radius: 4px;
+            cursor: pointer;
+            margin-left: 5px;
+            background: #505050;
+        }
+        .neutral-btn:hover { background: #5a5a5a; }
+        .neutral-btn:disabled {
+            background: #383838;
+            color: #666;
+            cursor: not-allowed;
+        }
+        .msg-input:disabled {
+            background: #1a1a1a;
+            color: #666;
+            cursor: not-allowed;
+        }
+        .page-footer {
+            position: fixed;
+            bottom: 0;
+            left: 0;
+            right: 0;
+            background: #2d2d2d;
+            padding: 16px;
+            display: flex;
+            gap: 12px;
+            justify-content: space-between;
+            box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
+        }
+        body {
+            padding-bottom: 80px;  /* Make room for footer */
+        }
+        .agent-stats-row {
+            display: grid;
+            grid-template-columns: repeat(5, 1fr);
+            gap: 8px;
+            margin: 6px 0;
+            font-size: 0.9em;
+            color: #cccccc;
+            width: 100%;
+            box-sizing: border-box;
+        }
+        .agent-stats-row .stat {
+            background: #3a3a3a;
+            padding: 6px 8px;
+            border-radius: 4px;
+        }
+        .status-badge {
+            font-size: 0.75em;
+            margin-left: 8px;
+            padding: 2px 6px;
+            border-radius: 4px;
+            background: #3a3a3a;
+            color: #cccccc;
+            text-transform: lowercase;
+        }
+        .status-badge.online { color: #4CAF50; }
+        .status-badge.offline { color: #f44336; }
+        .title-row {
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+        .title-left {
+            display: flex;
+            align-items: center;
+            gap: 8px;
+        }
+        .title-spacer { flex: 1; }
+        /* Modal styles */
+        .modal-backdrop {
+            position: fixed;
+            top: 0; left: 0; right: 0; bottom: 0;
+            background: rgba(0,0,0,0.5);
+            display: none;
+            align-items: center;
+            justify-content: center;
+            z-index: 1000;
+        }
+        .modal {
+            background: #2d2d2d;
+            border-radius: 8px;
+            width: 80vw;
+            height: 80vh;
+            display: flex;
+            flex-direction: column;
+            overflow: hidden;
+            box-shadow: 0 4px 12px rgba(0,0,0,0.4);
+        }
+        .modal-header {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding: 12px 16px;
+            border-bottom: 1px solid #3a3a3a;
+        }
+        .modal-close-btn {
+            background: #f44336;
+            color: #fff;
+            border: none;
+            border-radius: 4px;
+            padding: 4px 8px;
+            cursor: pointer;
+        }
+        .modal-body {
+            flex: 1 1 auto;
+            overflow: auto;
+            padding: 12px 16px;
+        }
+        .modal-footer {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding: 12px 16px;
+            border-top: 1px solid #3a3a3a;
+        }
+        .footer-left { color: #cccccc; font-style: italic; }
+        /* Setup wizard */
+        .wizard-steps {
+            display: flex;
+            gap: 8px;
+            margin-bottom: 16px;
+            font-size: 0.85em;
+        }
+        .wizard-steps .step {
+            flex: 1;
+            padding: 6px 8px;
+            background: #3a3a3a;
+            border-radius: 4px;
+            text-align: center;
+            color: #888;
+        }
+        .wizard-steps .step.active { background: #2196F3; color: #fff; }
+        .wizard-steps .step.done { background: #4CAF50; color: #fff; }
+        .wizard-screen { display: none; }
+        .wizard-screen.active { display: block; }
+        .wizard-field {
+            display: flex;
+            flex-direction: column;
+            gap: 4px;
+            margin-bottom: 14px;
+        }
+        .wizard-field label { font-size: 0.9em; color: #ccc; }
+        .wizard-field input, .wizard-field select, .wizard-field textarea {
+            background: #262626;
+            border: 1px solid #555;
+            color: #e0e0e0;
+            border-radius: 4px;
+            padding: 8px 10px;
+            font-size: 1em;
+            font-family: inherit;
+        }
+        .wizard-field .hint { font-size: 0.8em; color: #888; }
+        .wizard-row { display: flex; gap: 12px; }
+        .wizard-row .wizard-field { flex: 1; }
+        .wizard-intro { color: #ccc; line-height: 1.5; margin-bottom: 20px; }
+    </style>
+</head>
+<body>
+    <div class="title-row">
+        <div class="title-left">
+            <h1 style="margin: 0;">Mindcraft</h1>
+            <span id="msStatus" class="status-badge offline">mindserver offline</span>
+        </div>
+        <div class="title-spacer"></div>
+        <button id="openSetupBtn" class="neutral-btn">⚙ Setup</button>
+    </div>
+    <div id="agents"></div>
+    <div class="page-footer">
+        <div>
+            <button id="openCreateAgentBtn" class="start-btn">New Agent</button>
+        </div>
+        <div style="display:flex; gap:12px;">
+            <button class="stop-btn" onclick="disconnectAllAgents()">Disconnect All Agents</button>
+            <button class="stop-btn" onclick="confirmShutdown()">Full Shutdown</button>
+        </div>
+    </div>
+    <!-- Modal -->
+    <div id="createAgentModal" class="modal-backdrop">
+        <div class="modal">
+            <div class="modal-header">
+                <h2 style="margin:0;">Create Agent</h2>
+                <button id="closeCreateAgentBtn" class="modal-close-btn">Close</button>
+            </div>
+            <div class="modal-body">
+                <div id="createAgentSection">
+                    <div id="profileStatus" style="margin:6px 0;">Profile: Not uploaded</div>
+                    <div id="settingsForm"></div>
+                    <div id="createError" style="color:#f44336;margin-top:10px;"></div>
+                    <input type="file" id="profileFileInput" accept=".json,application/json" style="display:none">
+                </div>
+            </div>
+            <div class="modal-footer">
+                <div class="footer-left" id="footerStatus">Configure settings, then upload a profile and create the agent.</div>
+                <div class="footer-actions">
+                    <button id="uploadProfileBtn" class="start-btn">Upload Profile</button>
+                    <button id="submitCreateAgentBtn" class="start-btn" disabled>Create Agent</button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- Agent Settings Modal -->
+    <div id="agentSettingsModal" class="modal-backdrop">
+        <div class="modal">
+            <div class="modal-header">
+                <h2 id="agentSettingsTitle" style="margin:0;">Agent Settings</h2>
+                <button id="closeAgentSettingsBtn" class="modal-close-btn">Close</button>
+            </div>
+            <div class="modal-body">
+                <div id="agentSettingsSection">
+                    <div id="agentSettingsForm"></div>
+                    <div id="agentSettingsError" style="color:#f44336;margin-top:10px;"></div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <div class="footer-left" id="agentSettingsFooter">Modify settings then apply to restart the agent.</div>
+                <div class="footer-actions">
+                    <button id="discardAgentSettingsBtn" class="stop-btn" style="background:#777;">Discard Changes</button>
+                    <button id="applyAgentSettingsBtn" class="start-btn" disabled>Apply & Restart</button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- Setup wizard -->
+    <div id="setupWizardModal" class="modal-backdrop">
+        <div class="modal" style="max-width: 720px; height: auto; max-height: 80vh;">
+            <div class="modal-header">
+                <h2 style="margin:0;">Setup</h2>
+                <button id="closeSetupBtn" class="modal-close-btn">Close</button>
+            </div>
+            <div class="modal-body">
+                <div class="wizard-steps">
+                    <div class="step" data-step="0">Welcome</div>
+                    <div class="step" data-step="1">API key</div>
+                    <div class="step" data-step="2">Server</div>
+                    <div class="step" data-step="3">Bot</div>
+                    <div class="step" data-step="4">Launch</div>
+                </div>
+                <div class="wizard-screen" data-screen="0">
+                    <p class="wizard-intro">
+                        Mindcraft connects an LLM-powered agent to your Minecraft server.
+                        This wizard will collect your API key, server address, and bot
+                        settings, save them to <code>~/.config/mindcraft/</code>, and launch the bot.
+                    </p>
+                    <div class="wizard-field">
+                        <label>LLM provider</label>
+                        <select id="wizProvider">
+                            <option value="ANTHROPIC_API_KEY" selected>Anthropic (Claude)</option>
+                            <option value="OPENAI_API_KEY">OpenAI</option>
+                            <option value="GEMINI_API_KEY">Google Gemini</option>
+                            <option value="GROQCLOUD_API_KEY">Groq</option>
+                            <option value="REPLICATE_API_KEY">Replicate</option>
+                            <option value="OPENROUTER_API_KEY">OpenRouter</option>
+                        </select>
+                        <span class="hint">Determines which API key you'll enter next, and the model list.</span>
+                    </div>
+                </div>
+                <div class="wizard-screen" data-screen="1">
+                    <div class="wizard-field">
+                        <label id="wizKeyLabel">ANTHROPIC_API_KEY</label>
+                        <input id="wizApiKey" type="password" placeholder="sk-ant-..." autocomplete="off">
+                        <span class="hint">Stored to <code>~/.config/mindcraft/keys.json</code> (mode 0600). Never sent anywhere except your chosen provider.</span>
+                    </div>
+                </div>
+                <div class="wizard-screen" data-screen="2">
+                    <div class="wizard-row">
+                        <div class="wizard-field">
+                            <label>Host</label>
+                            <input id="wizHost" type="text" value="localhost">
+                        </div>
+                        <div class="wizard-field" style="max-width:140px;">
+                            <label>Port</label>
+                            <input id="wizPort" type="number" value="25565">
+                        </div>
+                    </div>
+                    <div class="wizard-row">
+                        <div class="wizard-field">
+                            <label>Auth</label>
+                            <select id="wizAuth">
+                                <option value="offline" selected>offline</option>
+                                <option value="microsoft">microsoft</option>
+                            </select>
+                        </div>
+                        <div class="wizard-field">
+                            <label>Minecraft version</label>
+                            <input id="wizVersion" type="text" value="auto">
+                            <span class="hint">"auto" detects from the server.</span>
+                        </div>
+                    </div>
+                </div>
+                <div class="wizard-screen" data-screen="3">
+                    <div class="wizard-row">
+                        <div class="wizard-field">
+                            <label>Bot name</label>
+                            <input id="wizBotName" type="text" value="Claude">
+                            <span class="hint">Also the bot's Minecraft username.</span>
+                        </div>
+                        <div class="wizard-field">
+                            <label>Model</label>
+                            <select id="wizModel"></select>
+                        </div>
+                    </div>
+                    <div class="wizard-field">
+                        <label>Base profile</label>
+                        <select id="wizBaseProfile">
+                            <option value="assistant" selected>assistant</option>
+                            <option value="survival">survival</option>
+                            <option value="creative">creative</option>
+                            <option value="god_mode">god_mode</option>
+                        </select>
+                    </div>
+                    <div class="wizard-field">
+                        <label>Personality (optional)</label>
+                        <textarea id="wizPersonality" rows="3" placeholder="e.g. You are a cheerful builder who loves redstone."></textarea>
+                        <span class="hint">Prepended to the bot's system prompt.</span>
+                    </div>
+                </div>
+                <div class="wizard-screen" data-screen="4">
+                    <p class="wizard-intro">Ready to launch.</p>
+                    <pre id="wizSummary" style="background:#262626;padding:12px;border-radius:4px;overflow:auto;"></pre>
+                </div>
+                <div id="wizError" style="color:#f44336;margin-top:10px;"></div>
+            </div>
+            <div class="modal-footer">
+                <button id="wizBackBtn" class="neutral-btn">Back</button>
+                <button id="wizNextBtn" class="start-btn">Next</button>
+            </div>
+        </div>
+    </div>
+    <script>
+        const socket = io({ path: window.location.pathname + 'socket.io' })
+        const agentsDiv = document.getElementById('agents');
+        let settingsSpec = {};
+        let profileData = null;
+        const agentSettings = {};
+        const agentLastMessage = {};
+        const inventoryOpen = {};
+        let currentAgents = [];
+        const statusEl = document.getElementById('msStatus');
+        function updateStatus(connected) {
+            if (!statusEl) return;
+            if (connected) {
+                statusEl.textContent = 'MindServer online';
+                statusEl.classList.remove('offline');
+                statusEl.classList.add('online');
+            } else {
+                statusEl.textContent = 'MindServer offline';
+                statusEl.classList.remove('online');
+                statusEl.classList.add('offline');
+            }
+        }
+        function subscribeToState() {
+            socket.emit('listen-to-agents');
+        }
+        // Initial status
+        updateStatus(false);
+        socket.on('connect', () => {
+            updateStatus(true);
+            subscribeToState();
+            // Clear all cached settings on reconnect
+            Object.keys(agentSettings).forEach(name => delete agentSettings[name]);
+        });
+        socket.on('disconnect', () => {
+            updateStatus(false);
+        });
+        socket.on('connect_error', () => {
+            updateStatus(false);
+        });
+        // ---- Setup wizard ----
+        const wizard = (() => {
+            const MODELS = {
+                ANTHROPIC_API_KEY: ['claude-sonnet-4-6', 'claude-opus-4-6', 'claude-3-5-haiku-latest'],
+                OPENAI_API_KEY:    ['gpt-4o', 'gpt-4o-mini', 'o1-mini'],
+                GEMINI_API_KEY:    ['gemini-1.5-pro', 'gemini-1.5-flash'],
+                GROQCLOUD_API_KEY: ['groq/llama-3.1-70b-versatile', 'groq/mixtral-8x7b-32768'],
+                REPLICATE_API_KEY: ['meta/meta-llama-3-70b-instruct'],
+                OPENROUTER_API_KEY:['openrouter/anthropic/claude-sonnet-4-6'],
+            };
+            const modal = document.getElementById('setupWizardModal');
+            const screens = [...modal.querySelectorAll('.wizard-screen')];
+            const stepEls = [...modal.querySelectorAll('.wizard-steps .step')];
+            const nextBtn = document.getElementById('wizNextBtn');
+            const backBtn = document.getElementById('wizBackBtn');
+            const errEl = document.getElementById('wizError');
+            let step = 0;
+            let serverConfig = null;
+            function setStep(n) {
+                step = n;
+                screens.forEach((s, i) => s.classList.toggle('active', i === n));
+                stepEls.forEach((s, i) => {
+                    s.classList.toggle('active', i === n);
+                    s.classList.toggle('done', i < n);
+                });
+                backBtn.style.visibility = n === 0 ? 'hidden' : 'visible';
+                nextBtn.textContent = n === screens.length - 1 ? 'Launch' : 'Next';
+                errEl.textContent = '';
+                if (n === 1) document.getElementById('wizKeyLabel').textContent = providerKey();
+                if (n === 3) populateModels();
+                if (n === 4) renderSummary();
+            }
+            function providerKey() { return document.getElementById('wizProvider').value; }
+            function populateModels() {
+                const sel = document.getElementById('wizModel');
+                sel.replaceChildren();
+                for (const m of MODELS[providerKey()] || []) {
+                    const opt = document.createElement('option');
+                    opt.value = m; opt.textContent = m;
+                    sel.appendChild(opt);
+                }
+            }
+            function readServer() {
+                return {
+                    host: document.getElementById('wizHost').value.trim(),
+                    port: Number(document.getElementById('wizPort').value),
+                    auth: document.getElementById('wizAuth').value,
+                    minecraft_version: document.getElementById('wizVersion').value.trim() || 'auto',
+                };
+            }
+            function readProfile() {
+                const p = {
+                    name: document.getElementById('wizBotName').value.trim(),
+                    model: document.getElementById('wizModel').value,
+                };
+                const personality = document.getElementById('wizPersonality').value.trim();
+                if (personality) p.conversing = personality + '\n\n$ALL';
+                return p;
+            }
+            function renderSummary() {
+                const s = readServer(), p = readProfile();
+                document.getElementById('wizSummary').textContent =
+                    `Provider:  ${providerKey()}\n` +
+                    `Server:    ${s.host}:${s.port} (auth=${s.auth}, mc=${s.minecraft_version})\n` +
+                    `Bot:       ${p.name}\n` +
+                    `Model:     ${p.model}\n` +
+                    `Base:      ${document.getElementById('wizBaseProfile').value}`;
+            }
+            function emit(ev, data) {
+                return new Promise((res, rej) => socket.emit(ev, data, r => r?.success === false ? rej(new Error(r.error)) : res(r)));
+            }
+            async function next() {
+                try {
+                    if (step === 1) {
+                        const key = document.getElementById('wizApiKey').value.trim();
+                        if (!key && !serverConfig?.hasKeys) throw new Error('API key is required');
+                        if (key) await emit('save-keys', { [providerKey()]: key });
+                        document.getElementById('wizApiKey').value = '';
+                    }
+                    if (step === 3) {
+                        const p = readProfile();
+                        if (!p.name) throw new Error('Bot name is required');
+                        await emit('save-profile', p);
+                    }
+                    if (step === screens.length - 1) return launch();
+                    setStep(step + 1);
+                } catch (e) { errEl.textContent = e.message; }
+            }
+            async function launch() {
+                nextBtn.disabled = true;
+                errEl.textContent = '';
+                try {
+                    const server = readServer();
+                    const profile = readProfile();
+                    const base_profile = document.getElementById('wizBaseProfile').value;
+                    await emit('save-config', { server, bots: [{ profile: profile.name, base_profile }] });
+                    await emit('create-agent', { ...server, base_profile, profile });
+                    close();
+                } catch (e) { errEl.textContent = e.message; }
+                finally { nextBtn.disabled = false; }
+            }
+            function open() {
+                socket.emit('get-config', (res) => {
+                    serverConfig = res;
+                    if (res.config?.server) {
+                        document.getElementById('wizHost').value = res.config.server.host || 'localhost';
+                        document.getElementById('wizPort').value = res.config.server.port || 25565;
+                        document.getElementById('wizAuth').value = res.config.server.auth || 'offline';
+                        document.getElementById('wizVersion').value = res.config.server.minecraft_version || 'auto';
+                    }
+                    if (res.hasKeys) {
+                        document.getElementById('wizApiKey').placeholder = '(already saved — leave blank to keep)';
+                    }
+                    setStep(0);
+                    modal.style.display = 'flex';
+                });
+            }
+            function close() { modal.style.display = 'none'; }
+            function maybeAutoOpen() {
+                socket.emit('get-config', (res) => {
+                    serverConfig = res;
+                    if (!res.config && !res.hasKeys) open();
+                });
+            }
+            nextBtn.addEventListener('click', next);
+            backBtn.addEventListener('click', () => setStep(Math.max(0, step - 1)));
+            document.getElementById('openSetupBtn').addEventListener('click', open);
+            document.getElementById('closeSetupBtn').addEventListener('click', close);
+            socket.on('connect', maybeAutoOpen);
+            return { open, close };
+        })();
+        fetch('/settings_spec.json')
+            .then(r => r.json())
+            .then(spec => {
+                settingsSpec = spec;
+                buildSettingsForm();
+            });
+        function buildSettingsForm() {
+            const form = document.getElementById('settingsForm');
+            form.innerHTML = '';
+            // ensure grid for multi-column layout
+            form.style.display = 'grid';
+            form.style.gridTemplateColumns = 'repeat(auto-fit, minmax(320px, 1fr))';
+            form.style.gap = '8px';
+            Object.keys(settingsSpec).forEach(key => {
+                if (key === 'profile') return; // profile handled via upload
+                const cfg = settingsSpec[key];
+                const wrapper = document.createElement('div');
+                wrapper.className = 'setting-wrapper';
+                const label = document.createElement('label');
+                label.textContent = key;
+                label.title = cfg.description || '';
+                let input;
+                switch (cfg.type) {
+                    case 'boolean':
+                        input = document.createElement('input');
+                        input.type = 'checkbox';
+                        input.checked = cfg.default === true;
+                        break;
+                    case 'number':
+                        input = document.createElement('input');
+                        input.type = 'number';
+                        input.value = cfg.default;
+                        break;
+                    default:
+                        input = document.createElement('input');
+                        input.type = 'text';
+                        input.value = typeof cfg.default === 'object' ? JSON.stringify(cfg.default) : cfg.default;
+                }
+                input.title = cfg.description || '';
+                input.id = `setting-${key}`;
+                wrapper.appendChild(label);
+                wrapper.appendChild(input);
+                form.appendChild(wrapper);
+            });
+        }
+        document.getElementById('uploadProfileBtn').addEventListener('click', () => {
+            document.getElementById('profileFileInput').click();
+        });
+        document.getElementById('profileFileInput').addEventListener('change', e => {
+            const file = e.target.files[0];
+            if (!file) return;
+            const reader = new FileReader();
+            reader.onload = ev => {
+                try {
+                    profileData = JSON.parse(ev.target.result);
+                    document.getElementById('submitCreateAgentBtn').disabled = false;
+                    document.getElementById('profileStatus').textContent = `Profile: ${profileData.name || 'Uploaded'}`;
+                    document.getElementById('createError').textContent = '';
+                } catch (err) {
+                    document.getElementById('createError').textContent = 'Invalid profile JSON: ' + err.message;
+                    profileData = null;
+                    document.getElementById('submitCreateAgentBtn').disabled = true;
+                    document.getElementById('profileStatus').textContent = 'Profile: Not uploaded';
+                }
+            };
+            reader.readAsText(file);
+            e.target.value = '';
+        });
+        document.getElementById('submitCreateAgentBtn').addEventListener('click', () => {
+            if (!profileData) return;
+            const settings = { profile: profileData };
+            Object.keys(settingsSpec).forEach(key => {
+                if (key === 'profile') return;
+                const input = document.getElementById(`setting-${key}`);
+                if (!input) return;
+                const type = settingsSpec[key].type;
+                let val;
+                if (type === 'boolean') val = input.checked;
+                else if (type === 'number') val = Number(input.value);
+                else if (type === 'array' || type === 'object') {
+                    try { val = JSON.parse(input.value); }
+                    catch { val = input.value; }
+                } else val = input.value;
+                settings[key] = val;
+            });
+            socket.emit('create-agent', settings, res => {
+                if (!res.success) {
+                    document.getElementById('createError').textContent = res.error || 'Unknown error';
+                } else {
+                    // reset on success
+                    profileData = null;
+                    document.getElementById('submitCreateAgentBtn').disabled = true;
+                    document.getElementById('profileStatus').textContent = 'Profile: Not uploaded';
+                    document.getElementById('createError').textContent = '';
+                    hideCreateAgentModal();
+                }
+            });
+        });
+        // Modal open/close logic
+        const modalBackdrop = document.getElementById('createAgentModal');
+        document.getElementById('openCreateAgentBtn').addEventListener('click', () => {
+            buildSettingsForm();
+            modalBackdrop.style.display = 'flex';
+        });
+        function hideCreateAgentModal() {
+            modalBackdrop.style.display = 'none';
+        }
+        document.getElementById('closeCreateAgentBtn').addEventListener('click', hideCreateAgentModal);
+        socket.on('bot-output', (agentName, message) => {
+            agentLastMessage[agentName] = message;
+            const messageDiv = document.getElementById(`lastMessage-${agentName}`);
+            if (messageDiv) {
+                messageDiv.textContent = message;
+            }
+        });
+        // Subscribe to aggregated state updates (re-sent on each connect)
+        socket.on('state-update', (states) => {
+            window.lastStates = states;
+            Object.keys(states || {}).forEach(name => {
+                const st = states[name];
+                const healthEl = document.getElementById(`health-${name}`);
+                if (st && !st.error) {
+                    const gp = st.gameplay || {};
+                    if (healthEl && typeof gp.health === 'number') {
+                        const hMax = typeof gp.healthMax === 'number' ? gp.healthMax : 20;
+                        healthEl.textContent = `health: ${gp.health}/${hMax}`;
+                    }
+                    const posEl = document.getElementById(`pos-${name}`);
+                    const hunEl = document.getElementById(`hunger-${name}`);
+                    const bioEl = document.getElementById(`biome-${name}`);
+                    const modeEl = document.getElementById(`mode-${name}`);
+                    const itemsEl = document.getElementById(`items-${name}`);
+                    const equippedEl = document.getElementById(`equipped-${name}`);
+                    const invGrid = document.getElementById(`inventory-${name}`);
+                    const actionEl = document.getElementById(`action-${name}`);
+                    if (posEl && gp.position) {
+                        const p = gp.position;
+                        posEl.textContent = `x ${p.x}, y ${p.y}, z ${p.z}`;
+                    }
+                    if (hunEl && typeof gp.hunger === 'number') {
+                        const fMax = typeof gp.hungerMax === 'number' ? gp.hungerMax : 20;
+                        hunEl.textContent = `hunger: ${gp.hunger}/${fMax}`;
+                    }
+                    if (bioEl && gp.biome) bioEl.textContent = `biome: ${gp.biome}`;
+                    if (modeEl && gp.gamemode) modeEl.textContent = `gamemode: ${gp.gamemode}`;
+                    if (itemsEl && st.inventory) {
+                        const used = st.inventory.stacksUsed ?? 0;
+                        const total = st.inventory.totalSlots ?? 0;
+                        itemsEl.textContent = `inventory slots: ${used}/${total}`;
+                    }
+                    if (equippedEl && st.inventory?.equipment) {
+                        const e = st.inventory.equipment;
+                        equippedEl.textContent = `equipped: ${e.mainHand || 'none'}`;
+                    }
+                    const armorEl = document.getElementById(`armor-${name}`);
+                    if (armorEl && st.inventory?.equipment) {
+                        const e = st.inventory.equipment;
+                        const armor = [];
+                        if (e.helmet) armor.push(`head: ${e.helmet}`);
+                        if (e.chestplate) armor.push(`chest: ${e.chestplate}`);
+                        if (e.leggings) armor.push(`legs: ${e.leggings}`);
+                        if (e.boots) armor.push(`feet: ${e.boots}`);
+                        armorEl.textContent = `armor: ${armor.length ? armor.join(', ') : 'none'}`;
+                    }
+                    if (actionEl && st.action) {
+                        actionEl.textContent = `${st.action.current || 'Idle'}`;
+                    }
+                    if (invGrid && st.inventory?.counts) {
+                        const counts = st.inventory.counts;
+                        invGrid.innerHTML = Object.keys(counts).length ?
+                            Object.entries(counts).map(([k, v]) => `<div class="cell">${k}: ${v}</div>`).join('') :
+                            '<div class="cell">(empty)</div>';
+                    }
+                }
+            });
+        });
+        function fetchAgentSettings(name) {
+            return new Promise((resolve) => {
+                if (agentSettings[name]) { resolve(agentSettings[name]); return; }
+                socket.emit('get-settings', name, res => {
+                    if (res.settings) {
+                        agentSettings[name] = res.settings;
+                        resolve(res.settings);
+                    } else resolve(null);
+                });
+            });
+        }
+        // Agent settings modal logic
+        const agentSettingsModal = document.getElementById('agentSettingsModal');
+        const agentSettingsForm = document.getElementById('agentSettingsForm');
+        const applyBtn = document.getElementById('applyAgentSettingsBtn');
+        const discardBtn = document.getElementById('discardAgentSettingsBtn');
+        const closeAgentSettingsBtn = document.getElementById('closeAgentSettingsBtn');
+        const agentSettingsTitle = document.getElementById('agentSettingsTitle');
+        let currentAgentName = null;
+        let originalAgentSettings = null;
+        function buildAgentSettingsForm(settings) {
+            agentSettingsForm.innerHTML = '';
+            agentSettingsForm.style.display = 'grid';
+            agentSettingsForm.style.gridTemplateColumns = 'repeat(auto-fit, minmax(320px, 1fr))';
+            agentSettingsForm.style.gap = '8px';
+            Object.keys(settingsSpec).forEach(key => {
+                if (key === 'profile') return; // profile not edited here
+                const cfg = settingsSpec[key];
+                const wrapper = document.createElement('div');
+                wrapper.className = 'setting-wrapper';
+                const label = document.createElement('label');
+                label.textContent = key;
+                label.title = cfg.description || '';
+                let input;
+                switch (cfg.type) {
+                    case 'boolean':
+                        input = document.createElement('input');
+                        input.type = 'checkbox';
+                        input.checked = Boolean(settings[key]);
+                        break;
+                    case 'number':
+                        input = document.createElement('input');
+                        input.type = 'number';
+                        input.value = settings[key] ?? cfg.default ?? 0;
+                        break;
+                    default:
+                        input = document.createElement('input');
+                        input.type = 'text';
+                        const defVal = settings[key] ?? cfg.default ?? '';
+                        input.value = typeof defVal === 'object' ? JSON.stringify(defVal) : defVal;
+                }
+                input.id = `agent-setting-${key}`;
+                input.addEventListener('input', onAgentSettingsChanged);
+                if (input.type === 'checkbox') input.addEventListener('change', onAgentSettingsChanged);
+                wrapper.appendChild(label);
+                wrapper.appendChild(input);
+                agentSettingsForm.appendChild(wrapper);
+            });
+            onAgentSettingsChanged();
+        }
+        function openAgentSettings(name) {
+            currentAgentName = name;
+            agentSettingsTitle.textContent = `${name} Settings`;
+            fetchAgentSettings(name).then(settings => {
+                originalAgentSettings = JSON.parse(JSON.stringify(settings || {}));
+                buildAgentSettingsForm(settings || {});
+                agentSettingsModal.style.display = 'flex';
+            });
+        }
+        window.openAgentSettings = openAgentSettings;
+        function getEditedAgentSettings() {
+            const newSettings = { profile: (originalAgentSettings && originalAgentSettings.profile) || {} };
+            Object.keys(settingsSpec).forEach(key => {
+                if (key === 'profile') return;
+                const cfg = settingsSpec[key];
+                const input = document.getElementById(`agent-setting-${key}`);
+                if (!input) return;
+                let val;
+                if (cfg.type === 'boolean') val = input.checked;
+                else if (cfg.type === 'number') val = Number(input.value);
+                else if (cfg.type === 'array' || cfg.type === 'object') {
+                    try { val = JSON.parse(input.value); }
+                    catch { val = input.value; }
+                } else val = input.value;
+                newSettings[key] = val;
+            });
+            return newSettings;
+        }
+        function shallowEqual(a, b) {
+            if (!a || !b) return false;
+            const keys = Object.keys(settingsSpec).filter(k => k !== 'profile');
+            for (const k of keys) {
+                const va = a[k];
+                const vb = b[k];
+                if (typeof va === 'object' || typeof vb === 'object') {
+                    if (JSON.stringify(va) !== JSON.stringify(vb)) return false;
+                } else if (va !== vb) return false;
+            }
+            return true;
+        }
+        function onAgentSettingsChanged() {
+            if (!originalAgentSettings) { applyBtn.disabled = true; return; }
+            const edited = getEditedAgentSettings();
+            applyBtn.disabled = shallowEqual(edited, originalAgentSettings);
+        }
+        function closeAgentSettings() {
+            agentSettingsModal.style.display = 'none';
+            currentAgentName = null;
+            originalAgentSettings = null;
+        }
+        function updateAgentViewer(name) {
+            const agentEl = document.getElementById(`agent-${name}`);
+            if (!agentEl) return;
+            const settings = agentSettings[name];
+            const viewerContainer = agentEl.querySelector('.agent-view-container');
+            if (!viewerContainer) return;
+            const agentState = currentAgents.find(a => a.name === name);
+            const shouldShow = agentState?.in_game && settings?.render_bot_view === true;
+            viewerContainer.parentElement.style.display = shouldShow ? '' : 'none';
+        }
+        discardBtn.addEventListener('click', () => {
+            if (!currentAgentName || !originalAgentSettings) return;
+            buildAgentSettingsForm(originalAgentSettings);
+        });
+        applyBtn.addEventListener('click', () => {
+            if (!currentAgentName) return;
+            const edited = getEditedAgentSettings();
+            socket.emit('set-agent-settings', currentAgentName, edited);
+            // Update local settings immediately
+            agentSettings[currentAgentName] = { ...edited, fetched: true };
+            updateAgentViewer(currentAgentName);
+            closeAgentSettings();
+        });
+        closeAgentSettingsBtn.addEventListener('click', closeAgentSettings);
+        function renderAgentCard(agent) {
+            const cfg = agentSettings[agent.name] || {};
+            const showViewer = agent.in_game && cfg.render_bot_view === true;
+            const viewerPort = agent.viewerPort;
+            const viewerHTML = showViewer ? `<div class="agent-view-container"><iframe class="agent-viewer" id="viewer-${agent.name}" src="http://localhost:${viewerPort}"></iframe></div>` : '';
+            const lastMessage = agentLastMessage[agent.name] || '';
+            const invOpen = inventoryOpen[agent.name] === true;
+            const invStyle = invOpen ? '' : 'display:none;';
+            return `
+                    <div class="agent" id="agent-${agent.name}">
+                        <div class="agent-grid">
+                            <div class="cell title" style="grid-column: 1 / -1; display:flex; align-items:center; justify-content:space-between;">
+                                <span><span class="status-icon ${agent.in_game ? 'online' : 'offline'}">●</span>${agent.name}${agent.socket_connected && !agent.in_game ? '<span style="margin-left:6px;color:#f0ad4e;">joining...</span>' : ''}
+                                    <button class="gear-btn" title="Settings" onclick="openAgentSettings('${agent.name}')">⚙</button>
+                                    <button class="gear-btn" title="Inventory" onclick="toggleDetails('${agent.name}')">Inventory</button>
+                                </span>
+                            </div>
+                            ${showViewer ? `<div class="cell" style="grid-row: span 3; padding:0;">${viewerHTML}</div>` : ''}
+                            <div class="cell" id="action-${agent.name}">action: -</div>
+                            <div class="cell" id="mode-${agent.name}">gamemode: -</div>
+                            <div class="cell" id="health-${agent.name}">health: -</div>
+                            <div class="cell" id="hunger-${agent.name}">hunger: -</div>
+                            <div class="cell" id="pos-${agent.name}">pos: -</div>
+                            <div class="cell" id="biome-${agent.name}">biome: -</div>
+                            <div class="cell" id="items-${agent.name}">inventory slots: -</div>
+                            <div class="cell" id="equipped-${agent.name}">equipped: -</div>
+                            <div class="agent-inventory" id="inventorySection-${agent.name}" style="${invStyle} grid-column: 1 / -1;">
+                                <h3>Inventory</h3>
+                                <div class="cell" id="armor-${agent.name}" style="margin-bottom: 8px;">armor: -</div>
+                                <div class="inventory-grid" id="inventory-${agent.name}"></div>
+                            </div>
+                            <div id="lastMessage-${agent.name}" class="last-message" style="grid-column: 1 / -1;"><strong>Last Message:</strong> ${lastMessage}</div>
+                        </div>
+                        <div class="controls-row">
+                            <button class="start-btn" id="sendBtn-${agent.name}" disabled onclick="sendMessage('${agent.name}', document.getElementById('messageInput-${agent.name}').value)">Send</button>
+                            <input class="msg-input" type="text" id="messageInput-${agent.name}" placeholder="Enter message..."
+                                oninput="onMsgInputChange('${agent.name}')"
+                                onkeydown="if(event.key === 'Enter') document.getElementById('sendBtn-${agent.name}').click()"
+                                ${!agent.in_game ? 'disabled' : ''}>
+                            <button class="neutral-btn" onclick="sendMessage('${agent.name}', '!stop')" ${!agent.in_game ? 'disabled' : ''}>Stop Action</button>
+                            <button class="neutral-btn" onclick="sendMessage('${agent.name}', '!stay(-1)')" ${!agent.in_game ? 'disabled' : ''}>Stay Still</button>
+                            <button class="neutral-btn" onclick="restartAgent('${agent.name}')" ${!agent.in_game ? 'disabled' : ''}>Restart</button>
+                            <button class="neutral-btn" ${agent.in_game ? `onclick=\"disconnectAgent('${agent.name}')\"` : (agent.socket_connected ? 'disabled' : `onclick=\"startAgent('${agent.name}')\"`)}>${agent.in_game ? 'Disconnect' : (agent.socket_connected ? 'Connecting...' : 'Connect')}</button>
+                            <button class="stop-btn" onclick="destroyAgent('${agent.name}')">Remove</button>
+                        </div>
+                    </div>`;
+        }
+        async function renderAgents(agents) {
+            if (!agents.length) {
+                agentsDiv.innerHTML = '<div class="agent">No agents connected</div>';
+                return;
+            }
+            // If agentsDiv is empty, do a full render
+            if (!agentsDiv.children.length) {
+                agentsDiv.innerHTML = agents.map(agent => renderAgentCard(agent)).join('');
+                // Update all viewers after initial render
+                setTimeout(() => {
+                    agents.forEach(a => {
+                        if (a.in_game) updateAgentViewer(a.name);
+                    });
+                }, 0);
+                return;
+            }
+            // Compare with current agents to find changes
+            const prevAgents = currentAgents.reduce((acc, a) => ({ ...acc, [a.name]: a }), {});
+            const changedAgents = agents.filter(a => {
+                const prev = prevAgents[a.name];
+                return !prev || prev.in_game !== a.in_game || prev.viewerPort !== a.viewerPort || prev.socket_connected !== a.socket_connected;
+            });
+            // Update only changed agents
+            changedAgents.forEach(agent => {
+                const el = document.getElementById(`agent-${agent.name}`);
+                if (el) {
+                    // Update existing card
+                    el.outerHTML = renderAgentCard(agent);
+                    if (agent.in_game) updateAgentViewer(agent.name);
+                } else {
+                    // Add new card
+                    agentsDiv.insertAdjacentHTML('beforeend', renderAgentCard(agent));
+                    if (agent.in_game) updateAgentViewer(agent.name);
+                }
+            });
+            // Remove cards for agents that no longer exist
+            Array.from(agentsDiv.children).forEach(el => {
+                const name = el.id.replace('agent-', '');
+                if (!agents.find(a => a.name === name)) {
+                    el.remove();
+                    delete inventoryOpen[name];
+                }
+            });
+        }
+        socket.on('agents-status', async (agents) => {
+            // Fetch settings for all agents that don't have current settings
+            const needSettings = agents.filter(a => !agentSettings[a.name]);
+            if (needSettings.length > 0) {
+                await Promise.all(needSettings.map(async (a) => {
+                    const settings = await fetchAgentSettings(a.name);
+                    if (settings) {
+                        agentSettings[a.name] = settings;
+                    }
+                }));
+            }
+            // Compare with current agents to find changes
+            const prevAgents = currentAgents.reduce((acc, a) => ({ ...acc, [a.name]: a }), {});
+            const changedAgents = agents.filter(a => {
+                const prev = prevAgents[a.name];
+                return !prev || prev.in_game !== a.in_game || prev.viewerPort !== a.viewerPort || prev.socket_connected !== a.socket_connected;
+            });
+            // Update current agents list
+            currentAgents = agents;
+            // If agentsDiv is empty, do a full render
+            if (!agentsDiv.children.length) {
+                agentsDiv.innerHTML = agents.map(agent => renderAgentCard(agent)).join('');
+                // Update all viewers after initial render
+                setTimeout(() => {
+                    agents.forEach(a => {
+                        if (a.in_game) updateAgentViewer(a.name);
+                    });
+                }, 0);
+                return;
+            }
+            // Update only changed agents
+            changedAgents.forEach(agent => {
+                const el = document.getElementById(`agent-${agent.name}`);
+                if (el) {
+                    // Update existing card
+                    el.outerHTML = renderAgentCard(agent);
+                    if (agent.in_game) updateAgentViewer(agent.name);
+                } else {
+                    // Add new card
+                    agentsDiv.insertAdjacentHTML('beforeend', renderAgentCard(agent));
+                    if (agent.in_game) updateAgentViewer(agent.name);
+                }
+            });
+            // Remove cards for agents that no longer exist
+            Array.from(agentsDiv.children).forEach(el => {
+                const name = el.id.replace('agent-', '');
+                if (!agents.find(a => a.name === name)) {
+                    el.remove();
+                    delete inventoryOpen[name];
+                }
+            });
+        });
+        function restartAgent(n) { socket.emit('restart-agent', n); }
+        function disconnectAgent(n) { socket.emit('stop-agent', n); }
+        function startAgent(n) {
+            const btn = document.querySelector(`button[onclick="startAgent('${n}')"]`);
+            if (btn) {
+                btn.textContent = 'Connecting...';
+                btn.disabled = true;
+                // Re-enable after 10s if still disabled (agent failed to connect)
+                setTimeout(() => {
+                    const retryBtn = document.querySelector(`button[onclick=\\"startAgent('${n}')\\"]`);
+                    const agentState = (window.currentAgents || []).find(a => a.name === n);
+                    const stillWaiting = agentState ? (!agentState.in_game && !agentState.socket_connected) : true;
+                    if (retryBtn && stillWaiting) {
+                        retryBtn.disabled = false;
+                        retryBtn.textContent = 'Connect';
+                    }
+                }, 10000);
+            }
+            socket.emit('start-agent', n);
+        }
+        function stopAgent(n) { socket.emit('stop-agent', n); }
+        function destroyAgent(n) { socket.emit('destroy-agent', n); }
+        function disconnectAllAgents() {
+            socket.emit('stop-all-agents');
+        }
+        function confirmShutdown() {
+            if (confirm('Are you sure you want to perform a full shutdown?\nThis will stop all agents and close the server.')) {
+                socket.emit('shutdown');
+            }
+        }
+        function sendMessage(n, m) {
+            if (!m || !m.trim()) return;
+            socket.emit('send-message', n, { from: 'ADMIN', message: m });
+            const input = document.getElementById(`messageInput-${n}`);
+            const btn = document.getElementById(`sendBtn-${n}`);
+            if (input) input.value = '';
+            if (btn) btn.disabled = true;
+        }
+        function onMsgInputChange(name) {
+            const input = document.getElementById(`messageInput-${name}`);
+            const btn = document.getElementById(`sendBtn-${name}`);
+            if (btn && input) {
+                btn.disabled = !(input.value && input.value.trim().length > 0);
+            }
+        }
+        function toggleDetails(name) {
+            const invSection = document.getElementById(`inventorySection-${name}`);
+            if (!invSection) return;
+            const visible = invSection.style.display !== 'none';
+            const newVisible = !visible;
+            invSection.style.display = newVisible ? '' : 'none';
+            inventoryOpen[name] = newVisible;
+        }
+        window.toggleDetails = toggleDetails;
+    </script>
+</body>
+</html>