@dollhousemcp/mcp-server 2.0.3 → 2.0.4

package/dist/web/public/fonts.css

@@ -0,0 +1,270 @@
+/* cyrillic-ext */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F63fjptAgt5VM-kVkqdyU8n1iIq131nj-otFQ.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F63fjptAgt5VM-kVkqdyU8n1isq131nj-otFQ.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F63fjptAgt5VM-kVkqdyU8n1iAq131nj-otFQ.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F63fjptAgt5VM-kVkqdyU8n1iEq131nj-otFQ.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F63fjptAgt5VM-kVkqdyU8n1i8q131nj-o.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* cyrillic-ext */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F6qfjptAgt5VM-kVkqdyU8n3twJwl1FgsAXHNlYzg.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F6qfjptAgt5VM-kVkqdyU8n3twJwlRFgsAXHNlYzg.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F6qfjptAgt5VM-kVkqdyU8n3twJwl9FgsAXHNlYzg.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F6qfjptAgt5VM-kVkqdyU8n3twJwl5FgsAXHNlYzg.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url(./fonts/ibmplexmono--F6qfjptAgt5VM-kVkqdyU8n3twJwlBFgsAXHNk.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggqxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggOxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* greek */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggSxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggixSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggmxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggexSvfedN4.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggqxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggOxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* greek */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggSxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggixSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggmxSvfedN62Zw.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Manrope';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/manrope-xn7gYHE41ni1AdIRggexSvfedN4.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko70yygg_vbd-E.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko50yygg_vbd-E.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko40yygg_vbd-E.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko20yygg_vb.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 800;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko70yygg_vbd-E.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 800;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko50yygg_vbd-E.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 800;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko40yygg_vbd-E.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Plus Jakarta Sans';
+  font-style: normal;
+  font-weight: 800;
+  font-display: swap;
+  src: url(./fonts/plusjakartasans-LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko20yygg_vb.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

package/dist/web/public/index.html

@@ -0,0 +1,365 @@
+<!DOCTYPE html>
+<html lang="en" data-theme="light">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>DollhouseMCP Console</title>
+  <meta name="description" content="DollhouseMCP management console — portfolio, logs, metrics">
+  <meta http-equiv="X-Content-Type-Options" content="nosniff">
+  <meta http-equiv="X-Frame-Options" content="DENY">
+  <link rel="stylesheet" href="fonts.css">
+  <link rel="stylesheet" href="styles.css">
+  <link rel="stylesheet" href="logs.css">
+  <link rel="stylesheet" href="metrics.css">
+  <link rel="stylesheet" href="permissions.css">
+  <link rel="stylesheet" href="sessions.css">
+  <link rel="stylesheet" href="setup.css">
+  <!-- uPlot for metrics time-series charts -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uplot@1.6.30/dist/uPlot.min.css" integrity="sha384-IfV0B7MIOYuO95kO9G5ySKPz/85zqFNOAs8iy4tkK5zd9izhJAB8b7lHrwYqqmYE" crossorigin="anonymous">
+</head>
+<body>
+
+  <div class="page-noise" aria-hidden="true"></div>
+
+  <header class="site-header">
+    <div class="header-brand">
+      <h1 class="site-title">DollhouseMCP Console</h1>
+      <p class="site-tagline">Management console</p>
+    </div>
+    <div class="header-right">
+      <nav class="console-tabs" id="console-tabs" aria-label="Console tabs">
+        <button class="console-tab" data-tab="setup">Setup</button>
+        <button class="console-tab active" data-tab="portfolio">Portfolio</button>
+        <button class="console-tab" data-tab="logs">Logs</button>
+        <button class="console-tab" data-tab="metrics">Metrics</button>
+        <button class="console-tab" data-tab="permissions">Permissions</button>
+      </nav>
+      <div class="session-indicator" id="session-indicator" title="Active sessions"></div>
+      <div class="site-stats" id="stats" aria-live="polite"></div>
+      <button class="theme-toggle" id="theme-toggle" type="button" aria-label="Switch to dark mode" title="Switch to dark mode">
+        <span class="theme-toggle-icon" id="theme-toggle-icon" aria-hidden="true">&#9790;</span>
+        <span class="sr-only" id="theme-toggle-label">Switch to dark mode</span>
+      </button>
+    </div>
+  </header>
+
+  <!-- Tab: Setup -->
+  <div id="tab-setup" class="tab-panel" hidden>
+    <div class="setup-page">
+      <div class="setup-hero">
+        <div class="setup-hero-status">
+          <span class="setup-status-dot"></span>
+          <span>DollhouseMCP is running on your machine</span>
+        </div>
+        <h2 class="setup-hero-title">Connect your AI client</h2>
+        <p class="setup-hero-sub">Pick your platform below. Click <strong>Install Now</strong> to auto-configure, or copy the config manually.</p>
+      </div>
+
+      <fieldset class="setup-method-toggle" id="setup-method-toggle">
+        <legend class="sr-only">Installation method</legend>
+        <button class="setup-method-btn is-active" data-method="npx" aria-pressed="true">
+          <strong>Auto-updating</strong>
+          <span>Always pulls the latest version on startup</span>
+        </button>
+        <button class="setup-method-btn" data-method="global" aria-pressed="false">
+          <strong>Pinned version</strong>
+          <span>Lock to a specific version, update when you choose</span>
+        </button>
+      </fieldset>
+
+      <!-- Pinned install prereq (hidden by default, shown when pinned selected) -->
+      <div class="setup-pinned-prereq" id="setup-pinned-prereq" hidden>
+        <div class="setup-method">
+          <h3>Pinned version: <code id="pinned-version-label">loading...</code></h3>
+          <p>The platform configs below will use this exact version. Choose how you want it installed:</p>
+
+          <h4>npx with pinned version <span class="setup-badge">no install needed</span></h4>
+          <p>Same as auto-updating but locked to a specific version. No extra install step.</p>
+          <p class="setup-hint">The platform configs below already use the pinned version &mdash; just copy and go.</p>
+
+          <h4>Global install</h4>
+          <p>Puts the <code>dollhousemcp</code> command on your PATH. Faster startup.</p>
+          <div class="setup-code-block">
+            <button class="setup-copy-btn" type="button" id="pinned-global-copy" data-copy-text="npm install -g @dollhousemcp/mcp-server" aria-label="Copy global install command">Copy</button>
+            <pre><code id="pinned-global-cmd">npm install -g @dollhousemcp/mcp-server</code></pre>
+          </div>
+          <p class="setup-hint">Update later by re-running with the new version number.</p>
+
+          <h4>Project-local install</h4>
+          <p>Installs into a directory you choose. Good for running multiple versions side by side.</p>
+          <div class="setup-code-block">
+            <button class="setup-copy-btn" type="button" id="pinned-local-copy" data-copy-text="mkdir -p ~/mcp-servers && cd ~/mcp-servers && npm install @dollhousemcp/mcp-server" aria-label="Copy local install command">Copy</button>
+            <pre><code id="pinned-local-cmd">mkdir -p ~/mcp-servers && cd ~/mcp-servers
+npm install @dollhousemcp/mcp-server</code></pre>
+          </div>
+          <p class="setup-hint">Then point your client config at: <code>node ~/mcp-servers/node_modules/@dollhousemcp/mcp-server/dist/index.js</code></p>
+
+        </div>
+      </div>
+
+      <div class="setup-platforms" id="setup-platforms" role="tablist" aria-label="Platform install instructions">
+        <button class="setup-platform-tab is-active" role="tab" aria-selected="true"  aria-controls="setup-panel-claude-desktop" id="setup-tab-claude-desktop">Claude Desktop</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-claude-code"    id="setup-tab-claude-code">Claude Code</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-cursor"         id="setup-tab-cursor">Cursor</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-vscode"         id="setup-tab-vscode">VS Code</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-codex"          id="setup-tab-codex">Codex</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-gemini"         id="setup-tab-gemini">Gemini CLI</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-windsurf"       id="setup-tab-windsurf">Windsurf</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-cline"          id="setup-tab-cline">Cline</button>
+        <button class="setup-platform-tab"           role="tab" aria-selected="false" aria-controls="setup-panel-lmstudio"       id="setup-tab-lmstudio">LM Studio</button>
+      </div>
+
+      <!-- Claude Desktop -->
+      <section class="setup-panel is-active" role="tabpanel" id="setup-panel-claude-desktop" aria-labelledby="setup-tab-claude-desktop">
+        <div class="setup-method setup-method-primary">
+          <h3>Auto-install <span class="setup-method-badge setup-badge">auto-updating</span></h3>
+          <p class="setup-method-desc">Pulls the latest version of DollhouseMCP on every startup. Uses <code>npx @latest</code> under the hood. Restart Claude Desktop after.</p>
+          <div class="setup-install-row">
+            <button class="setup-btn setup-btn-primary setup-install-btn" type="button" data-install-client="claude">Install Now</button>
+            <span class="setup-install-status" data-install-status="claude"></span>
+          </div>
+        </div>
+        <div class="setup-method setup-mcpb-option" id="setup-mcpb-section" hidden>
+          <h3>Or install via Desktop Extension <span class="setup-badge">pinned version</span></h3>
+          <p>Download the <code>.mcpb</code> bundle and double-click it to install. Claude Desktop handles everything automatically &mdash; no terminal, no config editing. This installs a pinned copy that won't auto-update.</p>
+          <a class="setup-btn setup-btn-secondary" href="/api/setup/mcpb" id="pinned-mcpb-btn">Download .mcpb <span id="pinned-mcpb-version"></span></a>
+        </div>
+        <div class="setup-method">
+          <h3>Or add manually
+            <button class="setup-open-btn" type="button" data-open-client="claude">Open config file</button>
+          </h3>
+          <p>Add to your config file:</p>
+          <ul class="setup-paths" id="claude-desktop-paths">
+            <li><strong>macOS:</strong> <code>~/Library/Application Support/Claude/claude_desktop_config.json</code></li>
+            <li><strong>Windows:</strong> <code>%APPDATA%\Claude\claude_desktop_config.json</code></li>
+            <li><strong>Linux:</strong> <code>~/.config/Claude/claude_desktop_config.json</code></li>
+          </ul>
+          <div class="setup-code-block">
+            <button class="setup-copy-btn" type="button" data-copy-text='{"mcpServers":{"dollhousemcp":{"command":"npx","args":["-y","@dollhousemcp/mcp-server@latest"]}}}' aria-label="Copy config">Copy</button>
+            <pre><code>{
+  "mcpServers": {
+    "dollhousemcp": {
+      "command": "npx",
+      "args": ["-y", "@dollhousemcp/mcp-server@latest"]
+    }
+  }
+}</code></pre>
+          </div>
+          <p class="setup-hint">Restart Claude Desktop after saving.</p>
+        </div>
+      </section>
+
+      <!-- Claude Code -->
+      <section class="setup-panel" role="tabpanel" id="setup-panel-claude-code" aria-labelledby="setup-tab-claude-code" hidden>
+        <div class="setup-method setup-method-primary">
+          <h3>Auto-install <span class="setup-method-badge setup-badge">auto-updating</span></h3>
+          <p class="setup-method-desc">Adds DollhouseMCP to Claude Code, pulling the latest version on every startup.</p>
+          <div class="setup-install-row">
+            <button class="setup-btn setup-btn-primary setup-install-btn" type="button" data-install-client="claude-code">Install Now</button>
+            <span class="setup-install-status" data-install-status="claude-code"></span>
+          </div>
+        </div>
+        <div class="setup-method">
+          <h3>Or run in your terminal</h3>
+          <p>Start a new conversation and you're ready.</p>
+          <div class="setup-code-block">
+            <button class="setup-copy-btn" type="button" data-copy-text="claude mcp add dollhousemcp -- npx -y @dollhousemcp/mcp-server@latest" aria-label="Copy command">Copy</button>
+            <pre><code>claude mcp add dollhousemcp -- npx -y @dollhousemcp/mcp-server@latest</code></pre>
+          </div>
+        </div>
+        <div class="setup-method">
+          <h3>Or add manually
+            <button class="setup-open-btn" type="button" data-open-client="claude-code">Open config file</button>
+          </h3>
+          <p>Add to <code>~/.claude.json</code>:</p>
+          <div class="setup-code-block">
+            <button class="setup-copy-btn" type="button" data-copy-text='{"mcpServers":{"dollhousemcp":{"command":"npx","args":["-y","@dollhousemcp/mcp-server@latest"]}}}' aria-label="Copy config">Copy</button>
+            <pre><code>{
+  "mcpServers": {
+    "dollhousemcp": {
+      "command": "npx",
+      "args": ["-y", "@dollhousemcp/mcp-server@latest"]
+    }
+  }
+}</code></pre>
+          </div>
+        </div>
+      </section>
+
+      <!-- Panels for Cursor, VS Code, Codex, Gemini CLI, Windsurf, Cline, LM Studio -->
+      <!-- Generated by setup.js from PLATFORMS registry to eliminate HTML duplication -->
+      <div id="setup-generated-panels"></div>
+
+      <!-- Verify section -->
+      <div class="setup-verify">
+        <h3>Verify it's working</h3>
+        <p>After connecting, start a conversation and ask:</p>
+        <div class="setup-code-block setup-code-block-sm">
+          <button class="setup-copy-btn" type="button" data-copy-text="What DollhouseMCP tools do you have available?" aria-label="Copy prompt">Copy</button>
+          <pre><code>What DollhouseMCP tools do you have available?</code></pre>
+        </div>
+        <p>You should see MCP-AQL endpoints. Then try:</p>
+        <div class="setup-try-prompts">
+          <code>List all available Dollhouse personas</code>
+          <code>Activate the debug detective persona</code>
+          <code>Open the portfolio browser</code>
+        </div>
+      </div>
+
+      <div class="setup-footer">
+        <p>Full documentation for all platforms (Continue, Docker, local LLMs) in the
+          <a href="https://github.com/DollhouseMCP/mcp-server/blob/main/docs/guides/quick-start.md" target="_blank" rel="noopener">quick start guide</a>.
+        </p>
+        <p>Auto-install powered by <a href="https://github.com/supermemoryai/install-mcp" target="_blank" rel="noopener">install-mcp</a> by <a href="https://github.com/dhravyashah" target="_blank" rel="noopener">Dhravya Shah</a>.</p>
+      </div>
+    </div>
+  </div>
+
+  <!-- Tab: Portfolio -->
+  <div id="tab-portfolio" class="tab-panel active">
+    <main class="site-main">
+
+      <div class="browse-controls">
+        <div class="search-wrapper">
+          <label for="search-input" class="sr-only">Search elements</label>
+          <input
+            type="search"
+            id="search-input"
+            class="search-input"
+            placeholder="Search by name, description, author, or tag... (press / to focus)"
+            autocomplete="off"
+            spellcheck="false"
+          >
+        </div>
+        <div class="type-filter-row">
+          <fieldset class="type-filters" id="type-filters"><legend class="sr-only">Filter by element type</legend></fieldset>
+          <!-- Portfolio is the default view — no collection toggle needed -->
+        </div>
+        <fieldset class="topic-filters" id="topic-filters" hidden><legend class="sr-only">Filter by topic</legend></fieldset>
+      </div>
+
+      <div class="results-bar">
+        <span class="results-count" id="results-count" aria-live="polite"></span>
+        <output class="sr-only" id="results-announcer" aria-live="polite" aria-atomic="true"></output>
+        <fieldset class="source-toggle" id="source-toggle">
+          <legend class="sr-only">Filter by source</legend>
+          <button class="source-btn active" data-source="all"        aria-pressed="true">All</button>
+          <button class="source-btn"        data-source="collection" aria-pressed="false">Collection</button>
+          <button class="source-btn"        data-source="portfolio"  aria-pressed="false">Portfolio</button>
+        </fieldset>
+        <label for="sort-select" class="sr-only">Sort by</label>
+        <select id="sort-select" class="sort-select" aria-label="Sort elements">
+          <option value="name-asc">Name A-Z</option>
+          <option value="name-desc">Name Z-A</option>
+          <option value="date-desc" selected>Newest first</option>
+          <option value="date-asc">Oldest first</option>
+          <option value="type-asc">By type</option>
+        </select>
+        <fieldset class="view-toggle" id="view-toggle">
+          <legend class="sr-only">View mode</legend>
+          <button class="view-btn active" data-view="grid"   aria-pressed="true">Cards</button>
+          <button class="view-btn"        data-view="list"   aria-pressed="false">List</button>
+          <button class="view-btn"        data-view="detail" aria-pressed="false">Detail</button>
+        </fieldset>
+      </div>
+
+      <ul class="elements-grid" id="elements-grid"></ul>
+
+      <nav class="pagination" id="pagination" hidden aria-label="Page navigation">
+        <button class="pagination-btn" id="btn-prev-page">&#8249; Prev</button>
+        <span class="pagination-info" id="page-info"></span>
+        <button class="pagination-btn" id="btn-next-page">Next &#8250;</button>
+      </nav>
+
+    </main>
+  </div>
+
+  <!-- Tab: Logs -->
+  <div id="tab-logs" class="tab-panel" hidden>
+    <div id="log-viewer-root"></div>
+  </div>
+
+  <!-- Tab: Metrics -->
+  <div id="tab-metrics" class="tab-panel" hidden>
+    <div id="metrics-dashboard-root"></div>
+  </div>
+
+  <!-- Tab: Permissions -->
+  <div id="tab-permissions" class="tab-panel" hidden>
+    <div id="permissions-dashboard-root"></div>
+  </div>
+
+  <dialog id="element-modal" class="modal" aria-labelledby="modal-title">
+    <div class="modal-overlay" id="modal-overlay"></div>
+    <div class="modal-dialog">
+      <header class="modal-header">
+        <div class="modal-heading">
+          <h2 class="modal-title" id="modal-title">Loading...</h2>
+          <span class="modal-type"></span>
+        </div>
+        <div class="modal-meta">
+          <span class="modal-author"></span>
+          <span class="modal-version"></span>
+          <span class="modal-date"></span>
+          <span class="modal-source source-badge"></span>
+        </div>
+        <button class="modal-close" id="modal-close" aria-label="Close element detail">&#x2715;</button>
+      </header>
+      <div class="modal-toolbar" id="modal-toolbar">
+        <button class="modal-action-btn" id="btn-render">&#8644; Raw</button>
+        <button class="modal-action-btn" id="btn-copy">&#9112; Copy</button>
+        <button class="modal-action-btn" id="btn-download">&#10515; Download</button>
+        <a class="modal-action-btn" id="btn-github" target="_blank" rel="noopener noreferrer">&#8599; GitHub</a>
+        <a class="modal-action-btn modal-action-btn--submit" id="btn-submit" target="_blank" rel="noopener noreferrer" style="display:none">&#8593; Submit</a>
+        <div class="modal-nav" id="modal-nav">
+          <button class="modal-nav-btn" id="btn-prev-element">&#8249;<span class="sr-only"> Previous element</span></button>
+          <span class="modal-nav-count" id="modal-nav-count"></span>
+          <button class="modal-nav-btn" id="btn-next-element">&#8250;<span class="sr-only"> Next element</span></button>
+        </div>
+      </div>
+      <div class="modal-body" id="modal-body"></div>
+    </div>
+  </dialog>
+
+  <footer class="site-footer">
+    <div class="footer-inner">
+      <a href="https://github.com/DollhouseMCP/collection" class="footer-link">GitHub Repository</a>
+      <a href="./collection-index.json" class="footer-link">JSON API</a>
+      <a href="https://dollhousemcp.com" class="footer-link">DollhouseMCP</a>
+      <span class="footer-updated" id="footer-updated"></span>
+    </div>
+  </footer>
+
+  <!-- Markdown rendering (same libs as Merview) -->
+  <script src="https://cdn.jsdelivr.net/npm/marked@11.1.1/marked.min.js"
+          integrity="sha384-zbcZAIxlvJtNE3Dp5nxLXdXtXyxwOdnILY1TDPVmKFhl4r4nSUG1r8bcFXGVa4Te"
+          crossorigin="anonymous"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"
+          integrity="sha384-F/bZzf7p3Joyp5psL90p/p89AZJsndkSoGwRpXcZhleCWhd8SnRuoYo4d0yirjJp"
+          crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/js-yaml@4.1.0/dist/js-yaml.min.js"
+          integrity="sha384-+pxiN6T7yvpryuJmE1gM9PX7yQit15auDb+ZwwvJOd/4be2Cie5/IuVXgQb/S9du"
+          crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/dompurify@3.2.4/dist/purify.min.js"
+          integrity="sha384-eEu5CTj3qGvu9PdJuS+YlkNi7d2XxQROAFYOr59zgObtlcux1ae1Il3u7jvdCSWu"
+          crossorigin="anonymous"></script>
+  <link rel="stylesheet"
+        href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css"
+        integrity="sha512-0aPQyyeZrWj9sCA46UlmWgKOP0mUipLQ6OZXu8l4IcAmD2u31EPEy9VcIMvl7SoAaKe8bLXZhYoMaE/in+gcgA=="
+        crossorigin="anonymous"
+        id="hljs-theme-light">
+  <link rel="stylesheet"
+        href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css"
+        integrity="sha512-rO+olRTkcf304DQBxSWxln8JXCzTHlKnIdnMUwYvQa9/Jd4cQaNkItIUj6Z4nvW1dqK0SKXLbn9h4KwZTNtAyw=="
+        crossorigin="anonymous"
+        id="hljs-theme-dark" disabled>
+  <!-- uPlot for metrics charts -->
+  <script src="https://cdn.jsdelivr.net/npm/uplot@1.6.30/dist/uPlot.iife.min.js" integrity="sha384-1NEYi76CBpge3gahk4+X4M4JzdOV3WYq84RnByqYdAd5SdvJBTNCPFh/nsoHfN6i" crossorigin="anonymous"></script>
+  <script src="setup.js"></script>
+  <script src="app.js"></script>
+  <script src="logs.js"></script>
+  <script src="metrics.js"></script>
+  <script src="permissions.js"></script>
+  <script src="sessions.js"></script>
+</body>
+</html>