npm - fraim - Versions diffs - 2.0.202 → 2.0.204 - Mend

fraim 2.0.202 → 2.0.204

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 (79) hide show

package/README.md +3 -3
package/bin/fraim.js +8 -18
package/dist/src/cli/commands/first-run.js +2 -37
package/dist/src/cli/doctor/checks/mcp-connectivity-checks.js +1 -1
package/dist/src/cli/fraim.js +0 -2
package/dist/src/cli/setup/ide-invocation-surfaces.js +6 -6
package/dist/src/cli/utils/managed-agent-paths.js +76 -6
package/dist/src/cli/utils/version-utils.js +2 -2
package/dist/src/config/persona-capability-bundles.js +3 -3
package/dist/src/core/job-phases.js +168 -0
package/dist/src/core/utils/ports.js +32 -0
package/dist/src/core/utils/stub-generator.js +24 -2
package/dist/src/first-run/session-service.js +106 -24
package/dist/src/local-mcp-server/learning-context-builder.js +1 -1
package/dist/src/local-mcp-server/stdio-server.js +41 -9
package/dist/src/routes/analytics.js +2 -2
package/dist/src/services/registry-service.js +2 -2
package/index.js +1 -1
package/package.json +61 -181
package/dist/src/ai-hub/catalog.js +0 -406
package/dist/src/ai-hub/cert-store.js +0 -70
package/dist/src/ai-hub/conversation-store.js +0 -359
package/dist/src/ai-hub/desktop-main.js +0 -449
package/dist/src/ai-hub/hosts.js +0 -1664
package/dist/src/ai-hub/hub-latest-version.js +0 -52
package/dist/src/ai-hub/hub-launch-decision.js +0 -57
package/dist/src/ai-hub/hub-runtime-file.js +0 -43
package/dist/src/ai-hub/managed-browser.js +0 -269
package/dist/src/ai-hub/manager-turns.js +0 -64
package/dist/src/ai-hub/office-sideload.js +0 -156
package/dist/src/ai-hub/openclaw-bridge.js +0 -250
package/dist/src/ai-hub/preferences.js +0 -201
package/dist/src/ai-hub/remote-hub-gateway.js +0 -88
package/dist/src/ai-hub/server.js +0 -3827
package/dist/src/ai-hub/types.js +0 -2
package/dist/src/ai-hub/word-sideload.js +0 -95
package/dist/src/cli/commands/hub.js +0 -238
package/dist/src/cli/commands/test-mcp.js +0 -171
package/dist/src/cli/setup/first-run.js +0 -242
package/dist/src/core/config-writer.js +0 -75
package/dist/src/core/utils/job-aliases.js +0 -47
package/dist/src/core/utils/workflow-parser.js +0 -174
package/dist/src/services/email-service-clean.js +0 -782
package/extensions/office-word/favicon.ico +0 -0
package/extensions/office-word/icon-64.png +0 -0
package/extensions/office-word/manifest.xml +0 -33
package/extensions/office-word/taskpane.html +0 -242
package/public/ai-hub/index.html +0 -894
package/public/ai-hub/powerpoint-taskpane/icon-64.png +0 -0
package/public/ai-hub/powerpoint-taskpane/index.html +0 -236
package/public/ai-hub/powerpoint-taskpane/manifest.xml +0 -30
package/public/ai-hub/review.css +0 -381
package/public/ai-hub/script.js +0 -11024
package/public/ai-hub/styles.css +0 -4873
package/public/portfolio/ashley.html +0 -523
package/public/portfolio/auditya.html +0 -83
package/public/portfolio/banke.html +0 -83
package/public/portfolio/beza.html +0 -659
package/public/portfolio/careena.html +0 -632
package/public/portfolio/casey.html +0 -568
package/public/portfolio/celia.html +0 -490
package/public/portfolio/deidre.html +0 -642
package/public/portfolio/gautam.html +0 -597
package/public/portfolio/hari.html +0 -469
package/public/portfolio/huxley.html +0 -1354
package/public/portfolio/index.html +0 -741
package/public/portfolio/maestro.html +0 -518
package/public/portfolio/mandy.html +0 -590
package/public/portfolio/mona.html +0 -597
package/public/portfolio/pam.html +0 -887
package/public/portfolio/procella.html +0 -107
package/public/portfolio/qasm.html +0 -569
package/public/portfolio/ricardo.html +0 -489
package/public/portfolio/sade.html +0 -560
package/public/portfolio/sam.html +0 -654
package/public/portfolio/sechar.html +0 -580
package/public/portfolio/sreya.html +0 -599
package/public/portfolio/swen.html +0 -601
/package/dist/src/{ai-hub → core}/brand-store.js +0 -0

package/public/ai-hub/index.html DELETED Viewed

@@ -1,894 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta name="color-scheme" content="light dark">
-  <title>FRAIM AI Hub</title>
-  <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect width='48' height='48' rx='10' fill='%233d8a6e'/%3E%3Ctext x='24' y='32' text-anchor='middle' font-family='Helvetica,Arial,sans-serif' font-size='22' font-weight='700' fill='white'%3EH%3C/text%3E%3C/svg%3E">
-  <!-- Detect Electron + host platform before CSS paints so html.electron / html.mac /
-       html.win / html.linux rules apply on first render (no flash, correct native chrome). -->
-  <script>(function(){var h=document.documentElement,ua=navigator.userAgent;if(/Electron/.test(ua))h.classList.add('electron');var p=(navigator.userAgentData&&navigator.userAgentData.platform)||navigator.platform||'';if(/mac/i.test(p)||/Mac|iPhone|iPad|iPod/.test(ua))h.classList.add('mac');else if(/win/i.test(p)||/Windows/.test(ua))h.classList.add('win');else if(/linux/i.test(p)||/Linux|X11/.test(ua))h.classList.add('linux');
-    // #700: set the theme pre-paint (no flash). Explicit choice in
-    // localStorage wins; otherwise follow the OS preference.
-    try{var t=localStorage.getItem('fraim-theme');if(t!=='light'&&t!=='dark'){t=(window.matchMedia&&window.matchMedia('(prefers-color-scheme: dark)').matches)?'dark':'light';}h.setAttribute('data-theme',t);}catch(e){h.setAttribute('data-theme','light');}
-    // #744: apply the cached org brand pre-paint (no flash of FRAIM identity
-    // before company branding). script.js refines the per-theme accent on load.
-    try{var b=JSON.parse(localStorage.getItem('fraim-org-brand')||'null');if(b){if(typeof b.color==='string'&&/^#[0-9a-f]{6}$/i.test(b.color)){h.style.setProperty('--accent',b.color);h.style.setProperty('--accent-strong',b.color);}if(typeof b.name==='string'&&b.name){document.title=b.name+' Hub';}}}catch(e){}
-  })();</script>
-  <link rel="stylesheet" href="./styles.css?v=conv-panels-20260611b">
-  <link rel="stylesheet" href="./review.css">
-</head>
-<body>
-  <!-- Issue #512: three-area top nav + account menu (surface=hub only). -->
-  <nav class="hub-tabs" id="hub-tabs" hidden>
-    <!-- #744: company brand lockup (logo + name), populated from bootstrap.orgBrand. -->
-    <span class="hub-brand" id="hub-brand" hidden></span>
-    <span class="hub-brand-divider" id="hub-brand-divider" hidden></span>
-    <button class="hub-tab" type="button" data-area="company">Company</button>
-    <button class="hub-tab" type="button" data-area="manager">Manager</button>
-    <button class="hub-tab on" type="button" data-area="projects">Projects</button>
-    <div class="nav-right">
-      <!-- #744: FRAIM co-mark (co-branding, not white-label) shown when a brand is set. -->
-      <span class="hub-cobrand" id="hub-cobrand" hidden></span>
-      <button class="avatar-btn" id="avatar-btn" type="button" title="Account &amp; settings">SM</button>
-      <div id="account-menu" class="account-menu">
-        <div class="am-header">
-          <div class="am-av" id="am-av">SM</div>
-          <div>
-            <div class="am-name" id="am-name">You</div>
-            <div class="am-email" id="am-email"></div>
-          </div>
-        </div>
-        <button class="am-item" id="am-account" type="button">
-          <span class="am-ico">👤</span>
-          <div><div class="am-label">Account</div><div class="am-sub">API key, sessions, billing</div></div>
-        </button>
-        <button class="am-item" id="am-brain" type="button">
-          <span class="am-ico">🧠</span>
-          <div><div class="am-label">Brain</div><div class="am-sub">Everything your team knows</div></div>
-        </button>
-        <button class="am-item" id="am-analytics" type="button">
-          <span class="am-ico">📊</span>
-          <div><div class="am-label">Analytics</div><div class="am-sub">Usage, cost, and ROI</div></div>
-        </button>
-        <button class="am-item am-theme" id="am-theme-toggle" type="button" role="switch" aria-checked="false">
-          <span class="am-ico" id="am-theme-ico">🌙</span>
-          <div><div class="am-label">Dark mode</div><div class="am-sub" id="am-theme-sub">Off</div></div>
-          <span class="am-switch" aria-hidden="true"><span class="am-switch-knob"></span></span>
-        </button>
-        <div class="am-div"></div>
-        <div class="am-update" id="am-update" hidden>
-          <span class="am-ico">⬆️</span>
-          <div><div class="am-label">Update available</div><div class="am-sub" id="am-update-sub"></div></div>
-        </div>
-        <button class="am-foot" id="am-signout" type="button"><span class="am-ico">⏻</span><span>Sign out</span></button>
-        <div class="am-version" id="am-version" title="Running FRAIM Hub build"></div>
-      </div>
-    </div>
-  </nav>
-  <!-- Issue #512 / #521 R6: Company area — same shell as Projects (jobs rail + collapsible context/learnings) -->
-  <section class="hub-area" id="area-company" hidden>
-    <div class="area-shell">
-      <nav class="area-rail" id="company-rail"></nav>
-      <div class="area-main">
-        <!-- Info view: context/learnings accordions shown when no conv is active -->
-        <div class="area-info-view" id="company-info-view">
-          <div class="hub-area-page">
-            <div class="eyebrow">FRAIM Hub</div>
-            <div class="area-h1">Company</div>
-            <p class="area-lede">Your organization's identity — what you do, how you operate, and the guardrails every employee follows on every job.</p>
-            <div id="company-push-banner"></div>
-            <!-- #744: Brand editor — company identity across the Hub. -->
-            <details class="ctx-acc" id="company-brand-acc">
-              <summary><span class="ca-chev">▸</span> <span>🎨 Brand</span>
-                <span class="ca-note">— your company's identity across the Hub, applied for every teammate</span></summary>
-              <div class="ctx-acc-body"><div class="card area-profile" id="company-brand-editor"></div></div>
-            </details>
-            <details class="ctx-acc" id="company-ctx-acc">
-              <summary><span class="ca-chev">▸</span> <span>🏢 Context &amp; rules</span></summary>
-              <div class="ctx-acc-body"><div class="card area-profile" id="company-profile"></div></div>
-            </details>
-            <details class="ctx-acc" id="company-learn-acc">
-              <summary><span class="ca-chev">▸</span> <span>🧠 Company learnings</span>
-                <span class="ca-note">— org-wide, applied on every project</span></summary>
-              <div class="ctx-acc-body"><div id="company-learnings"></div></div>
-            </details>
-            <!-- Issue #540 R1-R3: AI employee persona grid (collapsed by default) -->
-            <details class="ctx-acc" id="company-emp-acc">
-              <summary><span class="ca-chev">▸</span> <span>Your AI employees</span></summary>
-              <div class="ctx-acc-body"><div id="persona-grid" class="persona-grid"></div></div>
-            </details>
-          </div>
-        </div>
-        <!-- Conversation host: the shared .page conversation panel is moved here when a company job is active -->
-        <div class="area-conv-host workspace-conv" id="company-conv-host" hidden></div>
-      </div>
-    </div>
-  </section>
-  <!-- Issue #512 / #521 R6: Manager area — same shell as Projects -->
-  <section class="hub-area" id="area-manager" hidden>
-    <div class="area-shell">
-      <nav class="area-rail" id="manager-rail"></nav>
-      <div class="area-main">
-        <!-- Info view: context/learnings accordions shown when no conv is active -->
-        <div class="area-info-view" id="manager-info-view">
-          <div class="hub-area-page">
-            <div class="eyebrow">FRAIM Hub</div>
-            <div class="area-h1">Manager</div>
-            <p class="area-lede">How you manage — your working style, preferences, and the standing rules your team follows when working with you.</p>
-            <details class="ctx-acc" id="manager-ctx-acc">
-              <summary><span class="ca-chev">▸</span> <span>🤝 Context &amp; rules</span></summary>
-              <div class="ctx-acc-body"><div class="card area-profile" id="manager-profile"></div></div>
-            </details>
-            <details class="ctx-acc" id="manager-learn-acc">
-              <summary><span class="ca-chev">▸</span> <span>🧠 Manager learnings</span>
-                <span class="ca-note">— how your team adapts to you</span></summary>
-              <div class="ctx-acc-body"><div id="manager-learnings"></div></div>
-            </details>
-            <details class="ctx-acc" id="manager-reverse-acc">
-              <summary><span class="ca-chev">▸</span> <span>🪞 Reverse mentoring</span>
-                <span class="ca-note">— what you can improve on as a manager</span></summary>
-              <div class="ctx-acc-body"><div id="reverse-mentoring"></div></div>
-            </details>
-            <!-- Issue #540 R4-R7: Your team pool (collapsed by default) -->
-            <details class="ctx-acc" id="manager-team-acc">
-              <summary><span class="ca-chev">▸</span> <span>Your team</span></summary>
-              <div class="ctx-acc-body"><div id="manager-team-pool" class="manager-team-pool"></div></div>
-            </details>
-          </div>
-        </div>
-        <!-- Conversation host: the shared .page conversation panel is moved here when a manager job is active -->
-        <div class="area-conv-host workspace-conv" id="manager-conv-host" hidden></div>
-      </div>
-    </div>
-  </section>
-  <!-- Issue #512: Brain area (reached from the account menu) -->
-  <section class="hub-area" id="area-brain" hidden>
-    <div class="hub-area-page">
-      <div class="eyebrow">FRAIM · Brain</div>
-      <div class="area-h1">Brain</div>
-      <p class="area-lede">The full picture of what your team knows — every preserved learning across scopes, plus the skills and rules they draw on.</p>
-      <div class="sec-label" style="margin-top:22px;">Preserved learnings</div>
-      <div class="stat-grid" id="brain-learnings"></div>
-      <div class="sec-label" style="margin-top:22px;">What your team draws on</div>
-      <div class="stat-grid" id="brain-catalog"></div>
-    </div>
-  </section>
-  <section class="hub-area" id="area-connected" hidden>
-    <div class="connected-shell">
-      <div class="connected-toolbar">
-        <div class="connected-title-block">
-          <div class="connected-kicker" id="connected-kicker">Connected FRAIM</div>
-          <div class="connected-title" id="connected-title">Account</div>
-        </div>
-        <div class="connected-origin" id="connected-origin"></div>
-        <button class="connected-close" id="connected-close" type="button">Back</button>
-      </div>
-      <iframe id="connected-frame" class="connected-frame" title="FRAIM connected surface" allow="clipboard-read; clipboard-write"></iframe>
-    </div>
-  </section>
-  <!-- Issue #512: Projects area wraps the existing single-surface Hub. -->
-  <section class="hub-area on" id="area-projects">
-    <div class="proj-tabs" id="proj-tabs">
-      <button class="ptab on" id="ptab-overview" type="button" data-view="overview">Overview</button>
-      <span id="proj-tab-list"></span>
-      <button class="ptab ptab-add" id="ptab-add" type="button">+ Project</button>
-    </div>
-    <!-- Overview sub-view: dashboard project cards -->
-    <div id="proj-overview">
-      <div class="hub-area-page">
-        <!-- Issue #671: Cards / Kanban view toggle -->
-        <div class="kb-view-toggle" id="kb-view-toggle">
-          <button class="kb-vtab on" data-view="cards" type="button">Cards</button>
-          <button class="kb-vtab" data-view="kanban" type="button">Kanban</button>
-        </div>
-        <div id="proj-cards-view">
-          <div class="sec-label" id="proj-cards-label">All projects</div>
-          <div class="proj-grid" id="proj-grid"></div>
-          <div id="kb-runs-grid" hidden></div>
-        </div>
-      </div>
-      <!-- Issue #671: Kanban board — rendered by tfRenderKanban() -->
-      <div id="proj-kanban" hidden>
-        <div id="kb-stats" class="kb-stats"></div>
-      </div>
-    </div>
-    <!-- Project workspace: employee tree + the existing conversation surface. -->
-    <div id="proj-workspace" hidden>
-      <nav class="tree-sidebar" id="tree-sidebar"></nav>
-      <button class="tree-collapse-btn" id="tree-collapse-btn" type="button" aria-label="Collapse project navigation" title="Collapse project navigation"></button>
-      <div class="tree-resizer" id="tree-resizer" role="separator" aria-orientation="vertical" aria-label="Resize project navigation"></div>
-      <div class="workspace-conv">
-        <!-- #521 R5/R6.4: project brief & learnings as collapsible top sections
-             (consistent with Company/Manager), replacing the over-conversation
-             panels. Each sub-area is its own <details> so the manager controls
-             how much text is shown. The editable brief rows (#proj-brief-profile)
-             and the learnings list (#project-learnings) are unchanged. -->
-        <div id="proj-context-top" class="proj-context-top">
-          <!-- Onboarding state banner lives ABOVE the accordions so it shows even
-               when the Brief is collapsed (so the conversation keeps its height). -->
-          <div id="proj-onboarding-banner"></div>
-          <div id="hub-agent-setup-panel" class="hub-agent-setup-panel" data-testid="hub-cli-setup-panel" hidden></div>
-          <details class="ctx-acc" id="proj-brief-acc">
-            <summary><span class="ca-chev">▸</span> <span>📋 Brief</span>
-              <span class="ca-note">— this project's context and rules, captured by Project Onboarding</span></summary>
-            <div class="ctx-acc-body"><div class="card area-profile" id="proj-brief-profile"></div></div>
-          </details>
-          <details class="ctx-acc" id="proj-learnings-acc">
-            <summary><span class="ca-chev">▸</span> <span>🧠 Learnings</span>
-              <span class="ca-note">— from <strong>sleep-on-learnings</strong> · promote to a scope</span></summary>
-            <div class="ctx-acc-body"><div id="project-learnings"></div></div>
-          </details>
-          <!-- Issue #578: Scheduled + Reactive Employees — deployment roster -->
-          <details class="ctx-acc" id="proj-deployments-acc">
-            <summary><span class="ca-chev">▸</span> <span>📋 Assignments</span>
-              <span class="ca-note">— scheduled and triggered assignments for this project</span></summary>
-            <div class="ctx-acc-body">
-              <div id="proj-deployments-list"></div>
-              <div class="dep-actions">
-                <button class="dep-add-btn" id="dep-add-btn" type="button">+ New Assignment</button>
-              </div>
-            </div>
-          </details>
-        </div>
-  <div class="page" id="hub-conv-page">
-    <header class="header" style="-webkit-app-region: drag;">
-      <h1 class="header-title">Manage your FRAIM Employees</h1>
-      <section class="welcome">
-        Hi <strong class="you">there</strong>, remember, you are the
-        <span class="concept">AI Manager<button class="info" data-concept="manager" aria-label="What is AI Manager?">i</button>
-          <span class="popover" id="pop-manager">
-            <span class="pop-title">AI Manager</span>
-            That's you. You decide what outcome matters, pick the right job, and hold the bar on quality. You're not writing the work - you're directing it.
-            <a class="pop-link" href="#" data-target="jobs-manager">See manager jobs</a>
-            <span class="pop-jobs" id="jobs-manager"></span>
-          </span></span>.
-        Delegate jobs to your
-        <span class="concept">AI Employees<button class="info" data-concept="employee" aria-label="What is AI Employee?">i</button>
-          <span class="popover" id="pop-employee">
-            <span class="pop-title">AI Employee</span>
-            The coding agent - Codex, Claude, or another - that actually does the work you assign. AI Hub is where you direct them; the agent itself is the employee.
-            <a class="pop-link" href="#" data-target="jobs-employee">See employee jobs</a>
-            <span class="pop-jobs" id="jobs-employee"></span>
-          </span></span>,
-        <span class="concept">Coach<button class="info" data-concept="coach" aria-label="What is Coach?">i</button>
-          <span class="popover" id="pop-coach">
-            <span class="pop-title">Coach</span>
-            Add context, raise the bar, or correct course mid-flight without abandoning the conversation. Same job, sharper guidance.
-            <a class="pop-link" href="#" data-target="jobs-coach">See coaching jobs</a>
-            <span class="pop-jobs" id="jobs-coach"></span>
-          </span></span>
-        them,
-        <span class="concept">Verify<button class="info" data-concept="verify" aria-label="What is Verify?">i</button>
-          <span class="popover" id="pop-verify">
-            <span class="pop-title">Verify</span>
-            Check that the artifact actually solved the problem before you trust completion. Read the result, not just the logs.
-            <a class="pop-link" href="#" data-target="jobs-verify">See verification jobs</a>
-            <span class="pop-jobs" id="jobs-verify"></span>
-          </span></span>
-        their work, and expect them to
-        <span class="concept">Learn<button class="info" data-concept="learn" aria-label="What is Learn?">i</button>
-          <span class="popover" id="pop-learn">
-            <span class="pop-title">Learn</span>
-            Each run should make the next one better. Your coaching becomes their lasting habit.
-            <a class="pop-link" href="#" data-target="jobs-learn">See learning jobs</a>
-            <span class="pop-jobs" id="jobs-learn"></span>
-          </span></span>
-        and get better. Let your employees make you shine.
-      </section>
-      <button class="project-button" type="button" id="project-button">
-        <span class="folder">Project</span>
-        <strong id="project-name">Choose a folder</strong>
-      </button>
-    </header>
-    <div class="layout">
-      <aside class="rail">
-        <span id="tp-project-label" class="tp-project-label"></span>
-        <button class="new-conv" type="button" id="new-conv-btn">+ New job</button>
-        <div class="rail-note">Alpha: browser shell for directing employees across your project.</div>
-        <section class="rail-section rail-section--employees">
-          <div class="rail-section-label">Hired employees</div>
-          <div class="team-roster" id="team-roster" hidden></div>
-        </section>
-        <section class="rail-section rail-section--runs">
-          <div class="rail-section-label">Employees</div>
-          <div class="conv-list" id="conv-list"></div>
-        </section>
-      </aside>
-      <div id="word-context-bar" class="word-context-bar" hidden>
-        <span class="word-ctx-icon">📄</span>
-        <span class="word-ctx-text" id="word-ctx-text"></span>
-        <button class="word-ctx-refresh" type="button" id="word-ctx-refresh" title="Refresh document context">↻</button>
-      </div>
-      <main class="conversation" id="conversation">
-        <div class="empty-state" id="empty">
-          <h3>No job selected</h3>
-          <p>Pick an existing job from the left, or click <strong>+ New job</strong> to give your employee something to work on.</p>
-        </div>
-        <!-- Issue #540 R10-R14: Non-blocking hire strip. Lives outside #active-conv so it
-             is visible even when no conversation is active. -->
-        <div id="hire-strip" class="hire-strip" hidden>
-          <div class="hs-avatar" id="hs-avatar"></div>
-          <div class="hs-body">
-            <p class="hs-title" id="hs-title">Unlock this employee</p>
-            <p class="hs-sub" id="hs-sub">Add them to your team to run this job with full context and memory.</p>
-          </div>
-          <div class="hs-actions">
-            <button class="hs-btn hs-btn--primary" type="button" id="hs-add-btn">Add to my team</button>
-            <button class="hs-btn hs-btn--primary" type="button" id="hs-get-btn" hidden>Get for your company</button>
-            <button class="hs-btn hs-btn--ghost" type="button" id="hs-skip-btn">Skip — use generic agent</button>
-          </div>
-        </div>
-        <div id="active-conv" hidden>
-          <div class="conv-topline">
-            <div class="employee-identity" id="active-identity"></div>
-            <span id="active-title" class="conv-job-title"></span>
-            <button class="run-stop-btn" id="run-stop-btn" type="button" hidden title="Ask the employee to stop and wait for you">⏹ Stop</button>
-            <div class="run-state-pill" id="run-state-pill"></div>
-          </div>
-          <div class="conversation-status">
-            <div class="tracker tracker-inline" id="tracker" aria-label="Job progress" hidden>
-              <div class="tracker-rows" id="tracker-rows"></div>
-              <div class="tracker-note" id="tracker-note" hidden></div>
-              <div class="totals" id="totals" aria-label="Run totals" hidden></div>
-            </div>
-          </div>
-          <details class="panel-details panel-details--thread" id="thread-panel" open>
-            <summary>
-              <span class="panel-summary-copy">
-                <span class="panel-kicker">Manager and employee thread</span>
-              </span>
-            </summary>
-            <!-- Issue #512 R7: completion card + format-derived artifact strip
-                 render INSIDE #messages (as the employee's review turn) so the
-                 thread panel keeps its existing flex/scroll geometry. -->
-            <div class="messages" id="messages"></div>
-          </details>
-          <div class="support-stack">
-            <details class="panel-details panel-details--coach" id="coach-panel" open>
-              <summary>
-                <span class="panel-summary-copy">
-                  <span class="panel-kicker">Coach the employee</span>
-                  <span class="panel-summary-text" id="coach-summary">Open when you want to steer the next step</span>
-                </span>
-                <span class="active-employee-row" onclick="event.stopPropagation()">
-                  <span class="active-employee-label">Maestro</span>
-                  <select id="active-employee-select" class="employee-select inline" aria-label="Agent Tool"></select>
-                </span>
-              </summary>
-              <div class="panel-body">
-                <div class="coach">
-                  <!-- Issue #512 R7.7: review actions live in the SAME bar as the
-                       coaching chips. Hidden until a deliverable is awaiting review;
-                       the coaching chips below never disappear. -->
-                  <div class="review-actions" id="review-actions" hidden>
-                    <button class="rb-approve" type="button" id="review-approve">✓ Approve</button>
-                    <button class="rb-secondary" type="button" id="review-request-changes">↩ Request changes</button>
-                    <span class="rb-handoff" id="review-handoff">Comment on the doc to leave inline notes, or type below to coach.</span>
-                  </div>
-                  <div class="quick-coach-row" id="quick-coach-btns" hidden>
-                    <button class="ghost quick-coach-btn mark-complete-btn" type="button" id="mark-complete-btn">✓ Mark complete</button>
-                    <button class="ghost quick-coach-btn" type="button" data-job="recognize-good-work" data-prompt="Good job. What went well, and how can we repeat it?">👍 Good job</button>
-                    <button class="ghost quick-coach-btn" type="button" data-job="analyze-why-you-messed-up" data-prompt="Why did you mess up? Explain the root cause, what you should have done differently, and what you will change next time.">🔍 Why did you mess up?</button>
-                    <button class="ghost quick-coach-btn" type="button" data-job="follow-your-mentor" data-prompt="Follow the process. Re-check the workflow instructions and continue from the correct next step.">📋 Follow the process</button>
-                    <button class="ghost quick-coach-btn" type="button" id="other-manager-jobs-btn">Other manager jobs ▾</button>
-                  </div>
-                  <div class="coach-input">
-                    <textarea id="coach-text" placeholder="Tell the employee what to do next..."></textarea>
-                    <button class="send-button" type="button" id="send" disabled>↑</button>
-                  </div>
-                  <div class="template-popover" id="template-popover" role="menu" hidden></div>
-                  <div class="coach-note" id="coach-note"></div>
-                </div>
-              </div>
-            </details>
-            <details class="micro panel-details" id="micro-manage">
-              <summary>
-                <span class="panel-summary-copy">
-                  <span class="panel-kicker">Micro-manage</span>
-                  <span class="panel-summary-text">Raw host events and tool calls</span>
-                </span>
-              </summary>
-              <pre class="micro-log" id="micro-log"></pre>
-            </details>
-          </div>
-        </div>
-        <!-- Issue #442: Direct (B) panel — shown only in A/B mode, mirrors FRAIM panel layout -->
-        <div id="ab-direct-panel" hidden>
-          <div class="conv-topline">
-            <div class="ab-direct-identity">
-              <span class="ab-direct-label">Direct (No FRAIM)</span>
-            </div>
-            <span class="conv-job-title"></span>
-            <div class="run-state-pill" id="ab-direct-pill"></div>
-          </div>
-          <div class="conversation-status">
-            <div class="tracker tracker-inline" id="ab-direct-tracker" aria-label="Direct run progress">
-              <div class="ab-direct-progress" id="ab-direct-progress"></div>
-              <div class="totals" id="ab-direct-totals" aria-label="Direct run totals" hidden></div>
-            </div>
-          </div>
-          <details class="panel-details panel-details--thread" id="ab-direct-thread-panel" open>
-            <summary>
-              <span class="panel-summary-copy">
-                <span class="panel-kicker">Direct output (raw)</span>
-              </span>
-            </summary>
-            <pre class="ab-direct-log" id="ab-direct-log"></pre>
-          </details>
-          <div class="support-stack">
-            <details class="panel-details panel-details--coach" id="ab-direct-reply-panel" open>
-              <summary>
-                <span class="panel-summary-copy">
-                  <span class="panel-kicker">Reply to Direct agent</span>
-                  <span class="panel-summary-text" id="ab-direct-reply-summary">Open to send a follow-up</span>
-                </span>
-              </summary>
-              <div class="panel-body">
-                <div class="coach">
-                  <div class="coach-input">
-                    <textarea id="ab-direct-input" placeholder="Reply to the agent..."></textarea>
-                    <button class="send-button" type="button" id="ab-direct-send" aria-label="Send reply to Direct agent" disabled>↑</button>
-                  </div>
-                </div>
-              </div>
-            </details>
-          </div>
-        </div>
-      </main>
-    </div>
-    <p class="status-line" id="status-line" role="status" aria-live="polite"></p>
-  </div>
-      </div><!-- /.workspace-conv -->
-      <div class="proj-switch-mask" id="proj-switch-mask" role="status" aria-live="polite" aria-hidden="true">
-        <div class="proj-switch-panel">
-          <span class="proj-switch-spinner" aria-hidden="true"></span>
-          <span id="proj-switch-label">Loading project...</span>
-        </div>
-      </div>
-    </div><!-- /#proj-workspace -->
-  </section><!-- /#area-projects -->
-  <div class="modal-backdrop" id="modal" role="dialog" aria-modal="true" hidden>
-    <div class="modal">
-      <div id="step1">
-        <div class="modal-header">
-          <h2>What should the employee work on?</h2>
-          <p>Pick one job. You can always start a new job for different work.</p>
-        </div>
-        <div class="modal-body">
-          <input class="search" type="text" placeholder="Describe the work, or search jobs…  (↵ starts an ad-hoc job)" id="job-search">
-          <div id="job-persona-filter" hidden></div>
-          <div id="job-catalog"></div>
-        </div>
-        <div id="hire-notice" hidden>
-          <p id="hire-notice-text"></p>
-          <div class="hire-notice-actions">
-            <a id="hire-notice-link" href="#" target="_blank" rel="noopener" class="send-button">Go to Pricing</a>
-            <button id="hire-notice-back" type="button" class="ghost">Back to all jobs</button>
-          </div>
-        </div>
-        <div class="modal-footer">
-          <span class="left" id="job-pick-status">Choose a job to continue</span>
-          <div class="right">
-            <button class="ghost" type="button" id="cancel1">Cancel</button>
-            <button class="send-button" type="button" id="next1" disabled>Next</button>
-          </div>
-        </div>
-      </div>
-      <div id="step2" class="step2" hidden>
-        <div class="modal-header">
-          <h2>Tell the employee what you need</h2>
-          <p>A few sentences is enough. The employee will ask if anything is unclear.</p>
-        </div>
-        <div class="modal-body">
-          <div class="assigned-job">
-            <div class="label">Assigned job</div>
-            <div class="name" id="picked-name"></div>
-            <div class="desc" id="picked-desc"></div>
-          </div>
-          <textarea id="instructions" placeholder="What outcome do you want? Any context the employee should know?"></textarea>
-          <div id="word-context-card" class="word-context-card" hidden>
-            <div class="word-ctx-card-header">
-              <span class="word-ctx-card-icon">📄</span>
-              <span class="word-ctx-card-label" id="word-ctx-card-label">Document context</span>
-              <button type="button" class="word-ctx-card-toggle" id="word-ctx-card-toggle" aria-label="Expand document context">▸</button>
-            </div>
-            <div class="word-ctx-card-body" id="word-ctx-card-body" hidden></div>
-          </div>
-          <div class="employee-line">
-            <span class="employee-label">Agent Tool:</span>
-            <select id="employee-select" class="employee-select" aria-label="Agent Tool"></select>
-          </div>
-          <div id="agent-install-panel"></div>
-          <div id="ab-toggle-wrap" hidden>
-            <label class="ab-toggle-label">
-              <input type="checkbox" id="ab-toggle">
-              Compare with Direct mode (no FRAIM)
-            </label>
-            <p id="ab-toggle-explanation" hidden>FRAIM runs the job on the left. A direct session with no FRAIM framework runs on the right. Compare results side by side.</p>
-          </div>
-        </div>
-        <div class="modal-footer">
-          <span class="left">You can coach the employee with more detail after they start.</span>
-          <div class="right">
-            <button class="ghost" type="button" id="back2">Back</button>
-            <button class="send-button" type="button" id="start" disabled>Start</button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <!-- Issue #512: New-project flow (4-step modal) -->
-  <div id="np-modal" class="np-overlay" hidden>
-    <button class="np-close" id="np-close" type="button">×</button>
-    <div class="np-wrap">
-      <div class="np-step-dots" id="np-dots">
-        <div class="np-dot on"></div><div class="np-dot"></div><div class="np-dot"></div><div class="np-dot"></div>
-      </div>
-      <div class="np-step on" id="np1">
-        <div class="np-card">
-          <div class="np-hdr">
-            <div class="step-label">Step 1 of 4</div>
-            <h2>Choose a project folder</h2>
-            <p>Pick the folder where your team will work. They'll read context from it, write artifacts to it, and build up learnings there.</p>
-          </div>
-          <div class="np-body">
-            <div class="np-field">
-              <label>Project folder</label>
-              <div class="np-folder-row">
-                <input type="text" id="np-folder" placeholder="Choose a folder…" readonly>
-                <button type="button" class="np-browse-btn" id="np-browse">Browse…</button>
-              </div>
-              <div class="np-field-hint">Must be an existing folder on your machine.</div>
-            </div>
-            <div class="np-field">
-              <label>What are you trying to accomplish? <span class="np-optional">(optional — your team will ask if unclear)</span></label>
-              <textarea id="np-intent" rows="3" placeholder="e.g. Build a compliance-ready hiring module for mid-market SaaS teams."></textarea>
-            </div>
-          </div>
-          <div class="np-footer"><span></span><button class="np-next" type="button" data-np="2" id="np1-next" disabled>Next →</button></div>
-        </div>
-      </div>
-      <div class="np-step" id="np2">
-        <div class="np-card">
-          <div class="np-hdr"><div class="step-label">Step 2 of 4</div><h2>What does success look like?</h2><p>Your employees will use this to know when they're done and what constraints to work within.</p></div>
-          <div class="np-body">
-            <div class="np-field"><label>Outcome — how will you know this project succeeded?</label><textarea id="np-outcome" rows="3" placeholder="The end state that means done."></textarea></div>
-            <div class="np-field"><label>Rules &amp; guardrails for this project <span class="np-optional">(optional)</span></label><textarea id="np-rules" rows="4" placeholder="Anything the team must always do, or never do?"></textarea></div>
-            <div class="np-source"><span>📎</span><input type="text" id="np-source" placeholder="Or point me to a project doc, ticket, or spec to pull context from…"><button type="button" class="np-source-btn">Add source</button></div>
-            <div class="np-note">Project rules stack on top of your org guardrails — they apply only here.</div>
-          </div>
-          <div class="np-footer"><button class="np-back" type="button" data-np="1">← Back</button><button class="np-next" type="button" data-np="3">Next →</button></div>
-        </div>
-      </div>
-      <div class="np-step" id="np3">
-        <div class="np-card">
-          <div class="np-hdr"><div class="step-label">Step 3 of 4</div><h2>Who's working on this?</h2><p>Select from your hired employees. Each one will be briefed on the project before starting work.</p></div>
-          <div class="np-body">
-            <div class="emp-grid" id="np-emp-grid"></div>
-            <div class="np-note">Greyed-out employees aren't hired yet. <a href="/pricing" class="np-link">Go to pricing →</a></div>
-          </div>
-          <div class="np-footer"><button class="np-back" type="button" data-np="2">← Back</button><button class="np-next" type="button" data-np="4">Review →</button></div>
-        </div>
-      </div>
-      <div class="np-step" id="np4">
-        <div class="np-card">
-          <div class="np-hdr"><div class="step-label">Step 4 of 4</div><h2>Ready to brief the team</h2><p>FRAIM will share this context with each employee before they start any job on this project.</p></div>
-          <div class="np-body" id="np-summary"></div>
-          <div class="np-footer"><button class="np-back" type="button" data-np="3">← Back</button><button class="np-next" type="button" id="np-create-btn">Create project and brief the team →</button></div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <!-- #594: Area onboarding pre-flight context modal (org onboarding, learning synthesis, manager agreements) -->
-  <div id="area-onboard-modal" class="modal-overlay" hidden>
-    <div class="modal-card">
-      <div class="modal-hdr">
-        <div>
-          <h2 id="aom-title">Run onboarding</h2>
-          <p id="aom-desc">Add any specific focus areas or context before starting.</p>
-        </div>
-        <button class="modal-close" id="aom-close" type="button">×</button>
-      </div>
-      <div class="modal-body">
-        <div class="np-field">
-          <label for="aom-context">Any specific direction for this run? <span class="np-optional">(optional — leave blank to start with defaults)</span></label>
-          <textarea id="aom-context" rows="4" placeholder="e.g. Focus on our new remote-work policy and async-first communication norms."></textarea>
-        </div>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="aom-cancel-btn" id="aom-cancel">Cancel</button>
-        <button type="button" class="modal-next" id="aom-start">Start →</button>
-      </div>
-    </div>
-  </div>
-  <!-- Issue #512: Assign-job modal (job-first, with locks + per-employee filter) -->
-  <div id="assign-job-modal" class="modal-overlay" hidden>
-    <div class="modal-card">
-      <div class="modal-hdr">
-        <div><h2 id="aj-title">Assign a job</h2><p>Pick the work — we'll route it to the right specialist. Locked jobs need a teammate you haven't hired yet.</p></div>
-        <button class="modal-close" id="aj-close" type="button">×</button>
-      </div>
-      <div class="modal-body" id="aj-body"></div>
-    </div>
-  </div>
-  <!-- Issue #512: Add-employee modal (preselect-aware) -->
-  <div id="add-emp-modal" class="modal-overlay" hidden>
-    <div class="modal-card">
-      <div class="modal-hdr">
-        <div><h2>Add an employee to this project</h2><p id="ae-sub">Add someone from your team, or hire a new specialist. New hires are onboarded with your company context automatically.</p></div>
-        <button class="modal-close" id="ae-close" type="button">×</button>
-      </div>
-      <div class="modal-body" id="ae-body"></div>
-    </div>
-  </div>
-  <!-- Issue #512: Pricing modal -->
-  <div id="pricing-modal" class="modal-overlay pricing-overlay" hidden>
-    <div class="modal-card pricing-card">
-      <div class="modal-hdr" style="border:none;justify-content:flex-end;padding-bottom:0;">
-        <button class="modal-close" id="pr-close" type="button">×</button>
-      </div>
-      <div class="pricing-body">
-        <div id="pr-av" class="pr-av">CE</div>
-        <h2>Hire <span id="pr-persona">this specialist</span></h2>
-        <p>Onboarded with your company context the moment you hire — and dropped straight onto this project, ready to take the job you picked.</p>
-        <div class="pr-price" id="pr-price">$299<span>/mo</span></div>
-        <a class="pr-cta" id="pr-cta" href="/pricing">Hire and add to project →</a>
-        <div class="pr-foot">Opens checkout · cancel anytime</div>
-      </div>
-    </div>
-  </div>
-  <!-- Issue #538: Hire a human manager modal -->
-  <div id="hm-modal" class="modal-overlay" hidden>
-    <div class="modal-card" style="max-width:560px;">
-      <div class="modal-hdr">
-        <button class="modal-close" id="hm-close" type="button" aria-label="Close">×</button>
-        <h2>Hire a human manager</h2>
-        <p id="hm-sub">Find a great human to manage your AI employee. We pre-fill the search and a job description with the qualities of a strong AI manager.</p>
-      </div>
-      <div class="modal-body">
-        <div class="hm-fieldrow">
-          <div class="hm-field" style="flex:1;">
-            <label for="hm-role">Managing which AI employee</label>
-            <select id="hm-role"></select>
-          </div>
-          <div class="hm-field" style="max-width:200px;">
-            <label for="hm-loc">Location (optional)</label>
-            <input type="text" id="hm-loc" placeholder="e.g. San Francisco, CA" />
-          </div>
-        </div>
-        <div class="hm-field">
-          <label>Search query</label>
-          <div class="hm-query"><code id="hm-query"></code><button class="hm-copy-btn" id="hm-copy-q" type="button">Copy</button></div>
-        </div>
-        <div class="hm-field">
-          <label>Qualities of a strong AI manager (built into the search &amp; job description)</label>
-          <div class="hm-qualities" id="hm-qualities"></div>
-        </div>
-        <details class="hm-jd">
-          <summary><span class="hm-chev">▸</span> Job description <button class="hm-copy-btn" id="hm-copy-jd" type="button" style="margin-left:auto;">Copy JD</button></summary>
-          <div class="hm-jd-body" id="hm-jd-body"></div>
-        </details>
-        <div>
-          <div class="hm-providers-label">Open in a hiring service (search pre-filled)</div>
-          <div class="hm-providers">
-            <a class="hm-provider" id="hm-linkedin" target="_blank" rel="noopener"><span class="hm-logo linkedin">in</span><strong>LinkedIn</strong><small>Open search</small></a>
-            <a class="hm-provider" id="hm-indeed" target="_blank" rel="noopener"><span class="hm-logo indeed">id</span><strong>Indeed</strong><small>Open search</small></a>
-            <a class="hm-provider" id="hm-seekout" target="_blank" rel="noopener"><span class="hm-logo seekout">SO</span><strong>SeekOut</strong><small>Copy + open</small></a>
-          </div>
-        </div>
-        <p class="hm-foot">We don't send your data anywhere. Clicking a service opens it in a new tab with the role keywords in the URL; the job description is copied to your clipboard for you to paste.</p>
-      </div>
-    </div>
-  </div>
-  <!-- Issue #693 R2: single consolidated "New Assignment" modal. Replaces the two
-       separate Schedule / Trigger modals. A segmented control switches between
-       Scheduled and Triggered, revealing only the type-specific fields. Shared
-       fields (Name, Job, AI Agent, Instructions) are common to both. Inner ids
-       (dep-sch-*, dep-wh-inbound-*) are preserved so the cron-preset and inbound-URL
-       helpers keep working. -->
-  <div id="dep-assignment-modal" class="modal-overlay" hidden>
-    <div class="modal-card dep-modal-card">
-      <div class="modal-hdr">
-        <button class="modal-close" id="dep-assign-close" type="button" aria-label="Close">×</button>
-        <h2 id="dep-assign-title">New assignment</h2>
-        <p>Run a job automatically - on a schedule, or when an external system calls in.</p>
-      </div>
-      <div class="modal-body">
-        <div class="dep-type-seg" id="dep-type-seg">
-          <button type="button" class="dep-type-btn on" data-dep-type="scheduled">&#9201; Scheduled</button>
-          <button type="button" class="dep-type-btn" data-dep-type="triggered">&#128279; Triggered</button>
-        </div>
-        <div class="hm-field">
-          <label for="dep-label">Name</label>
-          <input type="text" id="dep-label" placeholder="e.g. Daily standup digest" />
-        </div>
-        <div class="hm-fieldrow">
-          <div class="hm-field">
-            <label for="dep-job">Job</label>
-            <select id="dep-job"></select>
-          </div>
-          <div class="hm-field">
-            <label for="dep-agent">AI Agent</label>
-            <select id="dep-agent"></select>
-          </div>
-        </div>
-        <!-- Scheduled-only fields -->
-        <div id="dep-sched-block">
-          <div class="hm-field">
-            <label>Runs</label>
-            <div class="dep-preset-chips" id="dep-sch-presets">
-              <button type="button" class="dep-preset-chip" data-preset="daily">Daily</button>
-              <button type="button" class="dep-preset-chip" data-preset="weekdays">Weekdays</button>
-              <button type="button" class="dep-preset-chip" data-preset="weekly">Weekly</button>
-              <button type="button" class="dep-preset-chip" data-preset="custom">Custom</button>
-            </div>
-          </div>
-          <div id="dep-sch-time-row" class="hm-fieldrow" hidden>
-            <div class="hm-field" id="dep-sch-day-field" hidden>
-              <label for="dep-sch-day">Day</label>
-              <select id="dep-sch-day">
-                <option value="1">Monday</option>
-                <option value="2">Tuesday</option>
-                <option value="3">Wednesday</option>
-                <option value="4">Thursday</option>
-                <option value="5">Friday</option>
-                <option value="6">Saturday</option>
-                <option value="0">Sunday</option>
-              </select>
-            </div>
-            <div class="hm-field">
-              <label for="dep-sch-time">Time</label>
-              <input type="time" id="dep-sch-time" value="09:00" />
-            </div>
-          </div>
-          <div id="dep-sch-custom-row" hidden>
-            <div class="hm-field">
-              <label for="dep-sch-cron">Cron expression</label>
-              <input type="text" id="dep-sch-cron" placeholder="e.g. 0 9 * * 1-5" />
-              <p id="dep-sch-cron-preview" class="dep-cron-preview"></p>
-            </div>
-          </div>
-          <input type="hidden" id="dep-sch-cron-preset" />
-        </div>
-        <!-- Triggered-only note -->
-        <div id="dep-trig-block" hidden>
-          <p class="dep-trig-note">Runs when an external system POSTs to the inbound URL, generated after you add the assignment.</p>
-        </div>
-        <div class="hm-field">
-          <label for="dep-instructions">Instructions <span class="dep-optional">(optional)</span></label>
-          <textarea id="dep-instructions" rows="2" placeholder="Optional message sent to the agent at the start of each run"></textarea>
-        </div>
-        <div class="dep-modal-actions">
-          <button type="button" id="dep-save-btn" class="send-button">Add assignment</button>
-          <button type="button" id="dep-cancel-btn" class="cancel-button">Cancel</button>
-        </div>
-        <p id="dep-error" class="dep-error" hidden></p>
-        <div id="dep-wh-inbound-row" class="dep-wh-inbound-reveal" hidden>
-          <div class="dep-wh-inbound-header">
-            <span class="dep-wh-inbound-label">Inbound URL</span>
-            <span class="dep-wh-inbound-hint">POST to this URL from any external system to trigger a run</span>
-          </div>
-          <div class="dep-inbound-url-row">
-            <code id="dep-wh-inbound-url" class="dep-inbound-url"></code>
-            <button type="button" id="dep-wh-copy-btn" class="hm-copy-btn">Copy</button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <!-- Issue #539: Command palette overlay — replaces 2-step modal as job-launch surface -->
-  <div id="cp-modal" class="cp-backdrop" role="dialog" aria-modal="true" aria-label="Start a job" hidden>
-    <div class="cp-palette">
-      <div class="cp-search-row">
-        <span class="cp-search-icon">⌕</span>
-        <input id="cp-search" type="text"
-               placeholder="Job name, /huxley, /pam, or describe your task…"
-               autocomplete="off" spellcheck="false">
-      </div>
-      <div id="cp-results" class="cp-results-scroll">
-        <div id="cp-recent-section" class="cp-section" hidden>
-          <div class="cp-section-label">RECENT</div>
-          <div id="cp-recent-list"></div>
-        </div>
-        <div id="cp-catalog-section" class="cp-section">
-          <div class="cp-section-label">CATALOG</div>
-          <div id="cp-catalog-list"></div>
-        </div>
-      </div>
-      <div id="cp-instructions-row" class="cp-instructions-row" hidden>
-        <div id="cp-selected-job-chip" class="cp-job-chip"></div>
-        <textarea id="cp-instructions"
-                  placeholder="What outcome do you want? A few sentences is enough."
-                  rows="3"></textarea>
-        <button type="button" id="cp-start-btn" class="send-button">Start</button>
-      </div>
-      <div class="cp-hints-bar">
-        <span class="cp-hint"><kbd>&#x2191;&#x2193;</kbd> navigate</span>
-        <span class="cp-hint"><kbd>&#x21B5;</kbd> select/start</span>
-        <span class="cp-hint"><kbd>&#x21E7;&#x21B5;</kbd> new line</span>
-        <span class="cp-hint"><kbd>Esc</kbd> close</span>
-        <span class="cp-hint cp-hint--right"><kbd id="cp-rerun-kbd">&#x2318;&#x21E7;R</kbd> re-run last</span>
-      </div>
-      <div class="cp-employee-footer">
-        <span class="cp-agent-label">Run with:</span>
-        <span id="cp-agent-picker" class="cp-agent-pills"></span>
-      </div>
-      <div id="cp-agent-install-panel" class="cp-agent-install-panel" data-testid="cp-cli-setup-panel" hidden></div>
-    </div>
-  </div>
-  <!-- Issue #540: Hire checkout email-capture modal. Opens when "Add to Company" or
-       "Get for your company" is clicked; calls /api/payment/create-session and
-       redirects to Stripe. -->
-  <div class="modal-backdrop" id="hcm" role="dialog" aria-modal="true" aria-labelledby="hcm-title" hidden>
-    <div class="modal" style="max-width:420px">
-      <div class="modal-header">
-        <h2 id="hcm-title">Hire <span id="hcm-persona-name">this employee</span></h2>
-        <p id="hcm-persona-role" style="color:var(--text-secondary);margin-top:2px"></p>
-      </div>
-      <div class="modal-body" style="padding-top:12px">
-        <label style="display:block;font-size:13px;font-weight:500;margin-bottom:6px" for="hcm-email">Work email</label>
-        <input id="hcm-email" type="email" class="search" placeholder="you@company.com" autocomplete="email" style="margin-bottom:0">
-        <p id="hcm-error" style="color:var(--red,#e53935);font-size:12px;margin-top:6px;min-height:16px"></p>
-        <p style="font-size:12px;color:var(--text-secondary);margin-top:4px">
-          You'll be taken to Stripe to complete the purchase. Your seat is activated immediately after payment.
-        </p>
-      </div>
-      <div class="modal-footer">
-        <div class="right">
-          <button class="ghost" type="button" id="hcm-cancel">Cancel</button>
-          <button class="send-button" type="button" id="hcm-submit">Continue to payment →</button>
-        </div>
-      </div>
-    </div>
-  </div>
-  <script src="./script.js?v=persona-mgr-del-20260707"></script>
-</body>
-</html>