@worca/app 1.2.0-rc.1 → 1.2.0-rc.3

package/ui/public/ask-panel.mjs

@@ -829,8 +829,9 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     };
     const list = st.catalog && Array.isArray(st.catalog.models) ? st.catalog.models : [];
     const wantedEntry = catalogEntry(wanted.model);
-    // Unknown stored/default id -> the backend default -> the first model we do have.
-    const entry = wantedEntry || catalogEntry(fallback.model) || list[0] || null;
+    // Unknown stored/default id -> the backend default -> the first model we do
+    // have that is not a hidden built-in (#422; a hidden id is still a valid pick).
+    const entry = wantedEntry || catalogEntry(fallback.model) || list.find((m) => m && !m.hidden) || list[0] || null;
     if (!entry) { updatePickerButton(); return; }  // empty catalog: keep what we have
     const effort = wantedEntry ? wanted.effort : fallback.effort;
     const next = { model: entry.id, effort: coerceEffort(entry, effort) };
@@ -885,6 +886,7 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     const seen = new Set();
     for (const m of st.catalog ? st.catalog.models : []) {
       if (!m || typeof m.id !== 'string') continue;
+      if (m.hidden && m.id !== st.picker.model) continue;         // hidden built-in (#422); the current pick stays
       if (m.custom === 'global') { primary.push(m); continue; }   // user models are never demoted
       const fam = familyKey(m);
       // The picked model always shows up front so its ✓ is visible and it is one click away.

package/ui/public/export-slug.mjs

@@ -0,0 +1,30 @@
+// ui/public/export-slug.mjs
+// Pure, DOM-free slug logic for the Export-to-Claude-Code modal, in its own module so
+// it can be unit-tested (and drift-guarded against src/core/skills.mjs isValidSkillName)
+// without importing the whole browser app. app.js imports exportSlugPreview from here.
+
+// slugifyLocal(s) -> mirrors src/core/artifacts.mjs slugify so the export modal previews
+// the same default slug the server would derive from a workflow name.
+export function slugifyLocal(s) {
+  const out = String(s ?? '')
+    .normalize('NFKD')
+    .replace(/[̀-ͯ]/g, '') // strip combining marks
+    .toLowerCase()
+    .replace(/[^a-z0-9]+/g, '-')
+    .replace(/-{2,}/g, '-')
+    .replace(/^-+|-+$/g, '');
+  return out || 'untitled';
+}
+
+// exportSlugPreview(rawSlug, workflowName) -> { slug, preview, valid }
+// An explicit slug is used verbatim (and must be a valid skill name); otherwise the
+// workflow name is slugified and capped at 48. `preview` is the "/<slug>" the user types.
+export function exportSlugPreview(rawSlug, workflowName) {
+  const explicit = typeof rawSlug === 'string' && rawSlug.trim();
+  const slug = explicit ? rawSlug.trim() : (slugifyLocal(workflowName).slice(0, 48) || 'workflow');
+  // MUST stay in step with isValidSkillName in src/core/skills.mjs — the core's assertName
+  // rejects on Apply what this reports invalid. skills.mjs pulls node:fs so it cannot be
+  // imported in the browser; export-slug.test.mjs guards these two against drift.
+  const valid = /^[A-Za-z0-9._-]+$/.test(slug) && slug !== '.' && slug !== '..';
+  return { slug, preview: `/${slug}`, valid };
+}

package/ui/public/graph/composer.mjs

@@ -175,12 +175,33 @@ export function createComposer(hostEls, { doc = globalThis.document, api, raf =
     paintInspector();
     if (hooks.onRender) hooks.onRender();
   }
+  /** A canvas nobody has touched: the two bookends, no wires, no edits. */
+  function isPristine() {
+    return !dirty && tpl.wires.length === 0 && tpl.nodes.length === 2
+      && tpl.nodes.every((n) => n.kind === 'task' || n.kind === 'end');
+  }
   function paintChrome() {
+    // "Unfinished" (a mandatory port still to wire — validate.mjs flags those
+    // `incomplete`) is not "wrong". Save is gated by BOTH, but only real mistakes
+    // earn the red chip; unfinished wiring gets a quiet to-do chip, and a canvas
+    // nobody has touched yet shows no chip at all — a fresh drawing has nothing
+    // to shout about.
     const n = lastReport.errors.length;
-    if (hostEls.saveBtn) hostEls.saveBtn.disabled = n > 0 || !ready;
+    const real = lastReport.errors.filter((e) => !e.incomplete).length;
+    const todo = n - real;
+    if (hostEls.saveBtn) {
+      hostEls.saveBtn.disabled = n > 0 || !ready;
+      hostEls.saveBtn.title = real
+        ? 'Fix the errors to save'
+        : todo ? 'Wire Task → … → End to save' : '';
+    }
     if (hostEls.errors) {
-      hostEls.errors.hidden = n === 0;
-      hostEls.errors.textContent = n ? `${n} error${n === 1 ? '' : 's'}` : '';
+      const quiet = !real && todo > 0 && !isPristine();
+      hostEls.errors.hidden = !real && !quiet;
+      hostEls.errors.classList.toggle('is-incomplete', quiet);
+      hostEls.errors.textContent = real
+        ? `${real} error${real === 1 ? '' : 's'}`
+        : quiet ? `${todo} port${todo === 1 ? '' : 's'} to wire` : '';
     }
   }
 

package/ui/public/graph/inspector.mjs

@@ -93,8 +93,11 @@ export function renderNodeInspector(node, { template, portsFn, meta = null, mode
 
   if (node.kind === 'agent') {
     root.appendChild(head(doc, (meta && meta.displayName) || node.key || node.id, `${node.key} · ${node.id}`));
+    // Hidden built-ins (#422) leave the list unless one is THIS node's stored
+    // pick — it still resolves at run time and must stay visible here.
+    const offered = models.filter((m) => m && (!m.hidden || m.id === node.config.model));
     body.appendChild(select(doc, 'ins-model', 'model', 'Model',
-      [{ value: '', text: 'inherit' }, ...models.map((m) => ({ value: m.id, text: m.label || m.id }))], node.config.model));
+      [{ value: '', text: 'inherit' }, ...offered.map((m) => ({ value: m.id, text: m.label || m.id }))], node.config.model));
     body.appendChild(select(doc, 'ins-effort', 'effort', 'Effort',
       [{ value: '', text: 'default' }, ...efforts.map((e) => ({ value: e, text: e }))], node.config.effort));
     if (meta && meta.fanOut) {

package/ui/public/index.html

@@ -975,7 +975,17 @@
           <section class="card gv-saved">
             <div class="saved-head">
               <div><b>Saved pipelines</b><span class="cnt" id="gv-saved-count"></span></div>
+              <!-- Import a workflow another Worca user shared as JSON (#421): the
+                   file goes through POST /api/workflows/import-json — the same validator
+                   the composer's Save uses; a taken name gets a " (2)" suffix. -->
+              <div class="saved-head-actions">
+                <button type="button" id="gv-import-btn" class="btn btn-ghost btn-mini" title="Import a pipeline shared as a JSON file">Import…</button>
+                <input id="gv-import-file" type="file" accept=".json,application/json" hidden />
+              </div>
             </div>
+            <!-- One tab per domain; the row itself no longer repeats the domain.
+                 Rendered by gvRenderSaved(); hidden while the library is empty. -->
+            <div class="gv-saved-tabs" id="gv-saved-tabs" role="tablist" aria-label="Pipeline domains" hidden></div>
             <div class="saved-list" id="gv-saved-list"></div>
             <div class="gv-archived" id="gv-archived" hidden></div>
             <!-- A refused DELETE (the built-in, a 404, a 500) has to land
@@ -1146,6 +1156,39 @@
               </div>
             </section>
 
+            <!-- Title generation (#422): which model writes run/chat titles.
+                 Empty = the model of the run or chat itself (title.mjs
+                 resolveTitleModel), so a first-party-free install needs no setup.
+                 The select is built from the project-less catalog; a stored id
+                 that left the catalog paints disabled + "not installed". -->
+            <section class="card settings-card" id="title-model-settings-card">
+              <div class="card-head">
+                <div class="label-row">
+                  <h2>Title generation</h2>
+                  <button type="button" class="info-tip" aria-label="About title generation">i<span class="tip-content hidden">
+                    Every run and chat gets a short LLM-written title. By default it is written by the
+                    model the run or chat itself uses, so an install without a first-party Anthropic
+                    account needs no setup here. Pick a model to write every title with it instead;
+                    the change applies to the next title, no restart. A non-empty
+                    <code>WORCA_TITLE_MODEL</code> in the environment overrides this setting.
+                  </span></button>
+                </div>
+              </div>
+              <div class="field">
+                <div class="label-row">
+                  <label for="titleModel">Model</label>
+                </div>
+                <select id="titleModel" class="select" aria-label="Title model"></select>
+              </div>
+              <small class="hint" id="titleModelEnvNote"></small>
+              <div class="add-project-actions" style="margin-top:14px">
+                <button type="button" id="titleModelTest" class="btn btn-ghost btn-mini" title="Send one tiny prompt to the selected model">Test</button>
+                <button type="button" id="titleModelReset" class="btn btn-ghost btn-mini">Use default</button>
+                <button type="button" id="titleModelSave" class="btn btn-primary btn-mini">Save</button>
+              </div>
+              <small class="hint" id="titleModelMsg"></small>
+            </section>
+
             <!-- Spawn-debug diagnostics: the stored side of WORCA_DEBUG_SPAWN.
                  claude-runner.mjs reads the setting per spawn (UI server AND CLI);
                  a non-empty env var overrides it. This card only flips the gate —
@@ -1243,7 +1286,7 @@
             <p id="plugins-msg" class="form-msg" aria-live="polite"></p>
             <div class="card hidden" id="marketplace-add-row" style="padding:16px 20px;margin-bottom:14px">
               <div class="path-row">
-                <input id="marketplace-url" class="input" type="text" placeholder="https://github.com/owner/repo · owner/repo · /abs/path/to/repo" spellcheck="false" />
+                <input id="marketplace-url" class="input" type="text" placeholder="https://github.com/owner/repo · owner/repo · /abs/path/to/repo · /path/to/a/plugin-folder" spellcheck="false" />
                 <button type="button" id="marketplace-add" class="btn btn-primary btn-mini">Add</button>
               </div>
             </div>
@@ -1311,6 +1354,89 @@
       </div>
     </div>
 
+    <!-- ===== Export workflow → Claude Code skill modal ===== -->
+    <div id="export-modal" class="viewer-modal hidden" role="dialog" aria-modal="true" aria-labelledby="export-title">
+      <div class="card">
+        <div class="card-head">
+          <h2 id="export-title">Export pipeline</h2>
+        </div>
+        <p id="export-subtitle" class="confirm-message"></p>
+        <!-- The form; swapped for #export-done after a successful export. -->
+        <div id="export-form">
+        <!-- ONE Export… entry point per row; the dialog asks for the format first.
+             json = the saved graph as a file another Worca user imports (#421);
+             skill = a runnable Claude Code skill under .claude/ (#403);
+             plugin = a Worca plugin folder bundling agents + skills (#421). -->
+        <div class="export-field">
+          <span class="export-label">Format</span>
+          <div id="export-format" class="seg" role="group" aria-label="Export format">
+            <button type="button" class="seg-btn on" data-format="json">JSON file</button>
+            <button type="button" class="seg-btn" data-format="skill">Claude Code skill</button>
+            <button type="button" class="seg-btn" data-format="plugin">Worca plugin</button>
+          </div>
+          <span id="export-format-hint" class="hint"></span>
+        </div>
+        <div id="export-dest-field" class="export-field hidden">
+          <span class="export-label">Location</span>
+          <div id="export-dest" class="seg" role="group" aria-label="Skill location">
+            <button type="button" class="seg-btn on" data-dest="global">Global (~/.claude)</button>
+            <button type="button" class="seg-btn" data-dest="project">Project folder</button>
+          </div>
+        </div>
+        <div id="export-folder-field" class="export-field hidden">
+          <span class="export-label" id="export-folder-label">Folder</span>
+          <div class="export-folder-row">
+            <input type="text" id="export-folder" class="input" placeholder="/path/to/repo" />
+            <button type="button" id="export-browse" class="btn btn-ghost btn-mini">Browse…</button>
+          </div>
+        </div>
+        <div id="export-plugin-field" class="export-field hidden">
+          <span class="export-label">Plugin name</span>
+          <input type="text" id="export-plugin-name" class="input" placeholder="(defaults to the folder name)" />
+          <!-- Live: what the manifest will actually be called — kebab-case, derived
+               from the typed name or, when blank, from the folder's basename. -->
+          <span id="export-plugin-name-preview" class="hint"></span>
+          <!-- Re-export only: a changed export into an existing plugin folder bumps
+               the manifest's patch version (0.1.0 → 0.1.1) so the recipient's
+               `worca plugin update` sees it. A first export is always 0.1.0. -->
+          <label class="confirm-checkbox">
+            <input type="checkbox" id="export-keep-version" />
+            <span>Don't bump the plugin version when updating an existing plugin folder<br><span class="hint">A changed re-export normally goes 0.1.0 → 0.1.1 so recipients see an update. A first export is always 0.1.0.</span></span>
+          </label>
+        </div>
+        <div class="export-field" id="export-slug-field">
+          <span class="export-label">Slug</span>
+          <input type="text" id="export-slug" class="input" placeholder="(defaults to the workflow name)" />
+          <span id="export-slug-preview" class="hint"></span>
+        </div>
+        <label class="confirm-checkbox" id="export-agents-field">
+          <input type="checkbox" id="export-include-agents" checked />
+          <span>Include referenced agents (recommended)</span>
+        </label>
+        <div id="export-plan" class="export-plan hidden"></div>
+        <p id="export-msg" class="confirm-message"></p>
+        </div>
+        <!-- Result view: what was written, where, and the next step for the format.
+             Replaces the form (not a second dialog) once an export succeeded. -->
+        <div id="export-done" class="export-done hidden" role="status" aria-live="polite">
+          <div class="export-done-head">
+            <span class="export-done-check" aria-hidden="true">✓</span>
+            <b id="export-done-title"></b>
+          </div>
+          <dl id="export-done-lines" class="export-done-lines"></dl>
+          <p id="export-done-next" class="export-done-next"></p>
+        </div>
+        <div class="confirm-actions">
+          <button type="button" id="export-cancel" class="btn btn-ghost btn-mini">Cancel</button>
+          <!-- Preview = dry run (optional). Export runs the dry run itself and writes
+               unless it hits a conflict, which it then shows for per-file resolution. -->
+          <button type="button" id="export-plan-btn" class="btn btn-ghost btn-mini">Preview</button>
+          <button type="button" id="export-apply-btn" class="btn btn-primary btn-mini">Export</button>
+          <button type="button" id="export-done-close" class="btn btn-primary btn-mini hidden">Done</button>
+        </div>
+      </div>
+    </div>
+
     <!-- ===== "Ship it?" PR confirm modal (History detail) ===== -->
     <!-- No z-index of its own: #confirm-modal.viewer-modal{z-index:60} (style.css:781)
          exists because #confirm-modal precedes #plugin-modal in the DOM, and this

package/ui/public/models-view.mjs

@@ -77,7 +77,7 @@ export function suggestDuplicateId(id, takenIds = []) {
  * `globals` come MASKED from GET /api/models. `predefinedShadowedIds` marks
  * built-ins currently overridden by a global entry.
  */
-export function renderModelsList({ globals = [], legacy = [], plugins = [], predefined = [], efforts = [], projectName = '' } = {}, { doc = globalThis.document } = {}) {
+export function renderModelsList({ globals = [], legacy = [], plugins = [], predefined = [], efforts = [], hideBuiltin = false, projectName = '' } = {}, { doc = globalThis.document } = {}) {
   const root = h(doc, 'div', 'mv-list');
   const predefLc = new Set(predefined.map((m) => m.id.toLowerCase()));
   const pluginLc = new Set(plugins.map((m) => m.id.toLowerCase()));
@@ -89,6 +89,30 @@ export function renderModelsList({ globals = [], legacy = [], plugins = [], pred
     return s;
   };
 
+  // The endpoint-routed badge (#422): honest disclosure that worca points the
+  // CLI's internal haiku/sonnet/opus/fable lookups at this model's own id
+  // (config.mjs#resolveModelEnv), so nothing falls back to the Anthropic API.
+  // The masked env still carries its KEYS, so presence is decidable here.
+  const routedBadge = (m) => {
+    if (!m.env || !Object.prototype.hasOwnProperty.call(m.env, 'ANTHROPIC_BASE_URL')) return null;
+    const b = h(doc, 'span', 'badge waiting mv-routed', 'endpoint-routed');
+    b.title = "worca points Claude Code's internal haiku/sonnet/opus/fable lookups at this model, so it never falls back to the Anthropic API.";
+    return b;
+  };
+
+  // ── Hide built-in models (#422) — one checkbox, top of the pane ──
+  const hideRow = h(doc, 'div', 'mv-hide-builtin-row');
+  const hideLabel = h(doc, 'label', 'check-row');
+  const hideCb = h(doc, 'input', 'mv-hide-builtin');
+  hideCb.type = 'checkbox';
+  hideCb.checked = !!hideBuiltin;
+  hideLabel.appendChild(hideCb);
+  hideLabel.appendChild(doc.createTextNode(" Hide built-in models (you don't use a first-party Anthropic account)"));
+  hideRow.appendChild(hideLabel);
+  hideRow.appendChild(h(doc, 'small', 'hint',
+    'Drops the built-ins from every model picker — new pipelines, the composer, Ask Worca, title generation. Cosmetic only: a run or reference that already names one keeps working.'));
+  root.appendChild(hideRow);
+
   // ── Your models (global) ──
   const yours = section('Your models', 'Defined once, available in every project. An entry with a built-in id overrides that built-in.');
   if (!globals.length) {
@@ -102,6 +126,8 @@ export function renderModelsList({ globals = [], legacy = [], plugins = [], pred
     head.appendChild(h(doc, 'b', 'mv-name', m.label || m.id));
     if (predefLc.has(m.id.toLowerCase())) head.appendChild(h(doc, 'span', 'badge violet mv-shadow', 'overrides built-in'));
     else if (pluginLc.has(m.id.toLowerCase())) head.appendChild(h(doc, 'span', 'badge violet mv-shadow', 'overrides plugin'));
+    const rb = routedBadge(m);
+    if (rb) head.appendChild(rb);
     // The §4.6 "unreliable" badge is meaningless once an override GOVERNS this
     // model's spend — and the backend only lifts the stored flag on the model's
     // next result event, so suppress it here the moment pricing is pinned.
@@ -169,6 +195,8 @@ export function renderModelsList({ globals = [], legacy = [], plugins = [], pred
       head.appendChild(h(doc, 'b', 'mv-name', m.label || m.id));
       head.appendChild(h(doc, 'span', 'badge waiting mv-origin', `plugin: ${m.plugin}`));
       if (globalLc.has(m.id.toLowerCase())) head.appendChild(h(doc, 'span', 'badge violet mv-shadowed', 'overridden by your copy'));
+      const prb = routedBadge(m);
+      if (prb) head.appendChild(prb);
       // Same rule as a global card: a manifest-pinned price governs the spend,
       // so the §4.6 "unreliable" flag says nothing about it.
       if (m.costUnreliable && !m.cost) head.appendChild(h(doc, 'span', 'badge waiting mv-cost', 'cost not verified'));
@@ -199,8 +227,11 @@ export function renderModelsList({ globals = [], legacy = [], plugins = [], pred
   }
 
   // ── Built-ins (read-only) ──
-  const builtins = section('Built-in models', 'Shipped with worca. Add a model with the same id to override its label, efforts, or routing.');
-  for (const m of predefined) {
+  const builtins = section('Built-in models', hideBuiltin
+    ? `Hidden from every picker (${predefined.length} built-in${predefined.length === 1 ? '' : 's'}) — untick the box above to show them.`
+    : 'Shipped with worca. Add a model with the same id to override its label, efforts, or routing.');
+  builtins.classList.add(hideBuiltin ? 'mv-builtins-hidden' : 'mv-builtins-shown');
+  for (const m of hideBuiltin ? [] : predefined) {
     const row = h(doc, 'div', 'mv-builtin');
     row.dataset.id = m.id;
     row.appendChild(h(doc, 'b', 'mv-name', m.label));

package/ui/public/style.css

@@ -959,6 +959,11 @@ fieldset.source legend{font-weight:600;font-size:13px;padding:0 6px;color:var(--
 /* Confirm dialog must stack ABOVE the plugin/wizard modal (equal .viewer-modal z-index,
    but #confirm-modal precedes #plugin-modal in the DOM). */
 #confirm-modal.viewer-modal{z-index:60;}
+/* The folder browser is a leaf picker opened FROM other modals (add-project,
+   export). It precedes #export-modal in the DOM, so at equal .viewer-modal
+   z-index the export modal would paint over it, hiding the Browse… picker.
+   Elevate it above every other modal so it is always usable when open. */
+#folder-browser.viewer-modal{z-index:70;}
 .viewer-modal .card{width:min(860px,100%);max-height:86vh;overflow:auto;}
 /* folder browser modal (native-dialog fallback). Must come AFTER the
    .viewer-modal rules: `.folder-modal .card` ties with `.viewer-modal .card`
@@ -1056,6 +1061,39 @@ fieldset.source legend{font-weight:600;font-size:13px;padding:0 6px;color:var(--
 .pl-remove:disabled{opacity:.6;cursor:default;}
 .pl-remove svg{display:block;}
 
+/* Export dialog (JSON file / Claude Code skill / Worca plugin). The row's
+   Export… button itself is a .btn-ghost (see .gv-saved .pl-export). */
+.export-field{margin:12px 0;}
+.export-field .hint{display:block;margin-top:6px;}
+/* A checkbox row directly under a text input needs its own breathing room:
+   .confirm-checkbox ships margin:0 (it is built for the confirm dialog's stack). */
+.export-field .confirm-checkbox{margin-top:10px;}
+/* Result view after a successful export (replaces #export-form in the same card). */
+.export-done{margin:12px 0 4px;}
+.export-done.hidden{display:none;}
+.export-done-head{display:flex;align-items:center;gap:10px;font-size:14px;margin-bottom:12px;}
+.export-done-check{display:grid;place-items:center;width:26px;height:26px;border-radius:999px;
+  background:var(--green-bg,#e6f4ea);color:var(--green-ink,#1e6b3a);font-weight:700;font-size:14px;}
+.export-done-lines{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:0;font-size:12.5px;}
+.export-done-lines dt{color:var(--ink-3);font-weight:600;}
+.export-done-lines dd{margin:0;color:var(--ink);word-break:break-all;}
+.export-done-lines code{font:12px var(--mono);background:var(--field);border-radius:6px;padding:1px 6px;}
+.export-done-next{margin:14px 0 0;padding:10px 12px;border-radius:10px;background:var(--field);font-size:12.5px;color:var(--ink-2);}
+.export-done-next code{font:12px var(--mono);}
+.export-label{display:block;font-weight:600;font-size:12.5px;color:var(--ink-2);margin-bottom:6px;}
+.export-folder-row{display:flex;gap:8px;align-items:center;}
+.export-folder-row .input{flex:1 1 auto;}
+.export-plan{margin:12px 0;max-height:240px;overflow:auto;border:1px solid var(--line-2);border-radius:10px;padding:8px;font-size:12.5px;}
+.export-row{padding:4px 2px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
+.export-conflict-row{flex-direction:column;align-items:flex-start;}
+.export-tag{display:inline-block;min-width:58px;text-align:center;border-radius:6px;padding:1px 6px;font-weight:700;font-size:11px;}
+.export-create{background:var(--green-bg,#e6f7ec);color:var(--green-ink,#137a3b);}
+.export-update{background:var(--field);color:var(--ink);}
+.export-no-op{background:var(--field);color:var(--ink-3);}
+.export-warn,.export-conflict{background:var(--red-bg,#fde8e8);color:var(--red-ink,#b42323);}
+.export-orphan{background:var(--field);color:var(--ink-3);}
+.export-choices{display:flex;gap:12px;margin:4px 0 2px 64px;}
+.export-choice{font-size:12.5px;color:var(--ink-2);cursor:pointer;}
 /* Per-agent fan-out toggle in the New Pipeline rows. */
 .fanout-toggle {
   display: inline-flex;
@@ -1586,6 +1624,8 @@ fieldset.source legend{font-weight:600;font-size:13px;padding:0 6px;color:var(--
 /* ---- Models view (configurable-models-design.md §4.10) ---- */
 .mv-list{display:grid;gap:18px;}
 .mv-section{display:grid;gap:10px;}
+.mv-hide-builtin-row{display:grid;gap:6px;padding:10px 12px;border:1px solid var(--line-2,#e6e6ec);border-radius:10px;}
+.mv-hide-builtin-row .hint{margin:0;}
 .mv-section-title{margin:4px 0 0;font-size:13px;text-transform:uppercase;letter-spacing:.04em;opacity:.75;}
 .mv-card{padding:16px 20px;display:flex;align-items:center;gap:14px;}
 .mv-body{flex:1 1 auto;min-width:0;}
@@ -3459,6 +3499,8 @@ input.gv-name:focus-visible{outline:none;}
   padding:4px 11px;font:600 11.5px var(--sans);cursor:pointer;flex:0 0 auto;white-space:nowrap;}
 .gv-errchip:hover{filter:brightness(.97);}
 .gv-errchip[hidden]{display:none;}
+/* Unfinished wiring is a to-do, not a mistake: the same chip in a quiet dress. */
+.gv-errchip.is-incomplete{background:var(--field);color:var(--ink-2);border-color:var(--line-2);}
 /* Toolbar density: .btn-ghost/.btn-go are PAGE-level pills (13–14px of vertical
    padding, 20–28px horizontal). In a 52px bar they wrap their own labels, so
    the bar re-states them at .btn-mini metrics — same skin, toolbar size. */
@@ -3637,11 +3679,27 @@ input.gv-name:focus-visible{outline:none;}
   padding:16px 20px;border-bottom:1px solid var(--line);}
 .saved-head b{font-size:15px;font-weight:600;letter-spacing:-.01em;}
 .saved-head .cnt{color:var(--ink-3);font-size:12.5px;font-weight:600;margin-left:9px;}
+.saved-head-actions{display:flex;align-items:center;gap:8px;}
+/* One tab per domain — the same pill tabs the History detail uses, one size down. */
+.gv-saved-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 20px;border-bottom:1px solid var(--line);}
+.gv-saved-tabs[hidden]{display:none;}
+.gv-saved-tab{display:flex;align-items:center;gap:8px;padding:7px 13px;border:1.5px solid var(--line);
+  border-radius:999px;background:var(--panel);font:600 12.5px var(--sans);color:var(--ink-2);cursor:pointer;}
+.gv-saved-tab:hover{border-color:var(--ink-3);color:var(--ink);}
+.gv-saved-tab.active{background:var(--ink);color:#fff;border-color:var(--ink);}
+.gv-saved-tab:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
+.gv-saved-tab-badge{padding:1px 7px;border-radius:999px;background:var(--field);color:var(--ink-3);font:600 10.5px var(--mono);}
+.gv-saved-tab.active .gv-saved-tab-badge{background:var(--blue-bg);color:var(--blue-ink);}
 .saved-list{display:flex;flex-direction:column;}
 .gv-saved .pl-item{border-bottom:1px solid var(--line);}
 .gv-saved .pl-item:last-child{border-bottom:none;}
 .gv-saved .pl-row{display:flex;align-items:center;gap:14px;padding:12px 20px;transition:background .12s;}
 .gv-saved .pl-row:hover{background:var(--field);}
+/* The row IS the Open action for a v2 pipeline. */
+.gv-saved .pl-row.pl-openable{cursor:pointer;}
+.gv-saved .pl-row.pl-openable:focus-visible{outline:2px solid var(--ink);outline-offset:-2px;}
+.gv-saved .pl-new{display:inline-block;margin-left:8px;padding:2px 7px;border-radius:999px;vertical-align:middle;
+  background:var(--blue-bg);color:var(--blue-ink);font:700 10px var(--mono);letter-spacing:.06em;}
 /* The thumbnail is a fixed TILE at the head of the row: the SVG carries its own
    width/height, so a percentage box would leave it stranded in dead space. */
 .gv-saved .pl-thumb{flex:0 0 auto;width:140px;height:54px;display:grid;place-items:center;overflow:hidden;
@@ -3654,14 +3712,16 @@ input.gv-name:focus-visible{outline:none;}
   overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
 .gv-saved .pl-meta{margin-top:4px;font-size:10.5px;font-weight:700;letter-spacing:.05em;
   text-transform:uppercase;color:var(--ink-3);}
-.gv-saved .pl-open{flex:0 0 auto;padding:7px 15px;font-size:12.5px;}
+.gv-saved .pl-export{flex:0 0 auto;padding:7px 15px;font-size:12.5px;}
 .gv-saved .pl-legacy,.gv-saved .pl-origin{flex:0 0 auto;background:var(--field);border:1px solid var(--line);color:var(--ink-3);
   border-radius:999px;padding:3px 10px;font-size:11px;font-weight:600;}
 .gv-saved .pl-origin{font-family:var(--mono);letter-spacing:-.01em;}
-.gv-saved .pl-del{flex:0 0 auto;width:34px;height:34px;border-radius:10px;border:1.5px solid var(--line-2);
-  background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--ink-3);
-  font-family:inherit;font-size:15px;line-height:1;transition:.12s;}
-.gv-saved .pl-del:hover{border-color:var(--red);color:var(--red-ink);background:var(--red-bg);}
+/* Delete: the bin icon in the pipeline Archive button's dress (.hd-archive — red
+   ink on a red-bg hairline pill, fills on hover), icon-only at row-action size. */
+.gv-saved .pl-del{flex:0 0 auto;width:34px;height:34px;border-radius:999px;border:1.5px solid var(--red-bg);
+  background:var(--panel);display:grid;place-items:center;cursor:pointer;color:var(--red-ink);transition:.12s;}
+.gv-saved .pl-del svg{width:15px;height:15px;stroke-width:1.9;}
+.gv-saved .pl-del:hover{border-color:var(--red);background:var(--red-bg);}
 .gv-saved .pl-del:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
 .gv-saved .pl-empty{padding:30px 20px;text-align:center;color:var(--ink-3);font-size:13px;}
 .gv-archived{display:flex;flex-wrap:wrap;align-items:center;gap:7px;