@floless/app 0.83.0 → 0.85.0

package/dist/web/app.css

@@ -3322,10 +3322,13 @@ body {
 .mode-switch button.active { background:var(--accent-soft); color:var(--accent-bright); }
 
 /* Mode gating: Workflows chrome hides wholesale in Workspaces (hidden, never disabled).
-   ≡ keeps only app-wide items; Dashboard is Workflows-scoped (spec §2). */
+   ≡ keeps only app-wide items; Dashboard is Workflows-scoped (spec §2).
+   #guide-beacon is NOT hidden here — it's the ONE shared control that serves both modes:
+   aware.js repaints it as the Workspaces document-guide (drop → review → approve → export)
+   for the open project, and toggles its `hidden` attribute in JS (hidden on the landing). */
 .app.mode-workspaces .controls > label,
 .app.mode-workspaces .wf-combo, .app.mode-workspaces #wf-update, .app.mode-workspaces #wf-forked,
-.app.mode-workspaces #guide-beacon, .app.mode-workspaces #run-state,
+.app.mode-workspaces #run-state,
 .app.mode-workspaces #restore-btn, .app.mode-workspaces #customize-btn,
 .app.mode-workspaces #compile-btn, .app.mode-workspaces #sim-btn,
 .app.mode-workspaces #run-btn, .app.mode-workspaces #stop-run-btn,
@@ -3378,10 +3381,24 @@ body {
   color:var(--text-muted); font-size:12px; width:100%; text-align:center; padding:12px; }
 .ws-seed:hover { background:var(--accent-soft); border-color:var(--accent); }
 .ws-seed .plus { font-size:24px; color:var(--accent); line-height:1; }
+/* Drop-a-drawing seed card (vectorize): a click-to-pick + drag/drop target. .drag-over lights it up
+   while a file hovers (same intent as the editor's .canvas-drop-target.active). */
+.ws-seed-drop.drag-over { background:var(--accent-soft); border-color:var(--accent); border-style:solid; }
+.ws-seed .ws-seed-headline { font-size:12.5px; font-weight:600; color:var(--text); line-height:1.35; }
+.ws-seed .ws-seed-sub { font-size:11px; color:var(--text-dim); line-height:1.4; max-width:220px; }
 .ws-empty-note { color:var(--text-dim); font-size:12px; margin-top:10px; }
 
 /* open project */
 .ws-project { flex:1; min-height:0; display:flex; flex-direction:column; }
+/* Source-step placeholder — a filter-less workspace app (vectorize) shows this centered pane where
+   steel loads its filter iframe. Muted + baseline-faithful; guides forward (not a dead control).
+   The [hidden] guard is load-bearing: display:flex would otherwise override the hidden attribute. */
+.ws-source-placeholder { flex:1; min-height:0; display:flex; align-items:center; justify-content:center; padding:24px; }
+.ws-source-placeholder[hidden] { display:none; }
+.ws-source-inner { max-width:440px; text-align:center; }
+.ws-source-ico { font-size:34px; color:var(--accent); display:block; margin-bottom:12px; line-height:1; }
+.ws-source-title { font-size:14px; font-weight:600; color:var(--text); margin-bottom:6px; }
+.ws-source-sub { font-size:12px; color:var(--text-dim); line-height:1.55; }
 .ws-crumb-row { padding:12px 14px 8px; display:flex; justify-content:space-between; align-items:center; }
 .ws-crumb { font-size:12px; color:var(--text-muted); }
 .ws-crumb-link { background:none; border:none; padding:0; color:var(--text-muted); font-size:12px; cursor:pointer; }

package/dist/web/aware.js

@@ -575,7 +575,66 @@
   // The beacon pulses while a workflow is new to the user.
   function beaconIsNew(id) { const g = guideFor(id); return !g.firstRunDone && !g.dismissed; }
 
+  // ── Workspaces variant of the SAME beacon ───────────────────────────────────
+  // Workspaces is the DOCUMENT archetype (drop → review → approve → export), not the
+  // pipeline archetype (inputs → compile → run). One beacon element, two content
+  // sources: in Workspaces mode with a project open, this layer drives #guide-beacon +
+  // #guide-modal instead of the workflow layer. It REUSES the LS_GUIDE store and its
+  // get/set helpers — no parallel system — but keys its record under `ws:<app>` so a
+  // Workflows Run of an app (firstRunDone) never calms its Workspaces beacon and vice
+  // versa (vectorize is BOTH a pipeline app and a workspace app). "New" here calms on the
+  // first Approve for the app, mirroring how the workflow beacon calms on the first Run.
+  // workspaces.js owns the project state, so it hands us a small snapshot (app id + which
+  // lifecycle signals are true) via flolessBridge; we own the chrome, glyphs, and copy.
+  let wsGuideCtx = null; // { app, name, displayName, approved, exported } | null (name = the open project's name)
+  const wsGuideKey = (app) => `ws:${app}`;
+  const inWorkspacesMode = () => { const a = document.getElementById('app'); return !!(a && a.classList.contains('mode-workspaces')); };
+  // The Workspaces beacon is active only in Workspaces mode with a project open (a ctx set).
+  const wsGuideActive = () => inWorkspacesMode() && !!wsGuideCtx;
+  function wsBeaconIsNew(app) { const g = guideFor(wsGuideKey(app)); return !g.approveDone && !g.dismissed; }
+
+  // The document-lifecycle checklist. Approve/Export carry an honest boolean from project
+  // state; "Review" borrows Approve's boolean (you can't sign off without having looked —
+  // Approve sits next to the editor), never a faked "opened the tab" signal; "Drop" is
+  // done whenever the guide is open (a project only exists after a drawing was dropped —
+  // a cancelled/failed drop is rolled back, never left as an empty project). The current
+  // step = the first not-done row, so the arrow lands on the next real action.
+  function workspaceGuideSteps(ctx) {
+    return [
+      { label: 'Drop a drawing', note: 'PDF or image — vectors come out editable', done: true },
+      { label: 'Review the vectors', note: 'check layers, isolate low-confidence traces', done: !!ctx.approved },
+      { label: 'Approve', note: 'signs off this version, unlocks Export', done: !!ctx.approved },
+      { label: 'Export SVG', note: 'clean vectors, take them anywhere', done: !!ctx.exported },
+    ];
+  }
+
+  // Paint #guide-beacon for the open workspace project (called by paintBeacon when in
+  // Workspaces mode). Same glyphs/label/pulse dialect as the workflow beacon; names the
+  // open PROJECT (not the app id), matching the crumb/picker.
+  function paintWorkspaceBeacon() {
+    const $b = document.getElementById('guide-beacon');
+    if (!$b) return;
+    const ctx = wsGuideCtx;
+    if (!ctx) { $b.hidden = true; $b.classList.remove('is-new', 'spotlit'); return; }
+    const isNew = wsBeaconIsNew(ctx.app);
+    $b.hidden = false;
+    $b.classList.remove('spotlit');
+    $b.classList.toggle('is-new', isNew);
+    const ico = $b.querySelector('.guide-beacon-ico');
+    const label = $b.querySelector('.guide-beacon-label');
+    if (ico) ico.textContent = isNew ? '✦' : '?';
+    if (label) label.textContent = isNew ? 'Start here' : 'Guide';
+    // No "workflow"/"Run" vocabulary — this is a document project.
+    $b.dataset.tip = isNew
+      ? 'New here? See what this project does and how to take it from drawing to export.'
+      : 'Open the guide for this project.';
+    $b.setAttribute('aria-label', (isNew ? 'Start here — guide for ' : 'Guide for ') + (ctx.name || ctx.displayName || ctx.app));
+  }
+
   function paintBeacon(app) {
+    // In Workspaces mode the beacon belongs to the open project, not the last-loaded
+    // workflow — hand off to the workspace layer (which hides it when no project is open).
+    if (inWorkspacesMode()) { paintWorkspaceBeacon(); return; }
     const $b = document.getElementById('guide-beacon');
     if (!$b) return;
     if (!app) { $b.hidden = true; $b.classList.remove('is-new', 'spotlit'); return; }
@@ -624,30 +683,66 @@
     return steps;
   }
 
+  // Shared checklist renderer — shape carries state (✓ done · → current · ☐ to-do), never
+  // colour alone. The current step is the first not-done row. Labels/notes are authored
+  // constants but still pass escapeHtml (defence-in-depth; the security hook forbids raw
+  // string→DOM). Both the workflow and workspace guides render through this.
+  function guideStepsHtml(steps) {
+    const curIdx = steps.findIndex((s) => !s.done);
+    return `<ol class="guide-steps" role="list">${steps.map((s, i) => {
+      const state = s.done ? 'done' : i === curIdx ? 'current' : 'todo';
+      const box = s.done ? '✓' : i === curIdx ? '→' : '☐';
+      const cur = i === curIdx ? ' aria-current="step"' : '';
+      return `<li class="guide-step ${state}"${cur}><span class="guide-box" aria-hidden="true">${box}</span>` +
+        `<span class="guide-step-text"><span class="guide-step-label">${escapeHtml(s.label)}</span> ` +
+        `<span class="guide-step-note">— ${escapeHtml(s.note)}</span></span>` +
+        `<span class="sr-only">${s.done ? '(done)' : i === curIdx ? '(next step)' : '(to do)'}</span></li>`;
+    }).join('')}</ol>`;
+  }
+
+  // The Workspaces guide body — the document life-cycle, not node mechanics. No
+  // "Compile"/"Run"/"Save" language (those pipeline verbs are absent here; the verb is
+  // Approve). "Walk me through it" is a Workflows relay (terminal AI + the workflow's own
+  // skill), so it's hidden for a workspace — the beacon is a self-contained checklist here.
+  // The title is the open project's user-authored name → set via textContent only (never
+  // into innerHTML); the body innerHTML is authored constants + escaped step labels/notes.
+  function renderWorkspaceGuide() {
+    const ctx = wsGuideCtx;
+    const $body = document.getElementById('guide-body');
+    const $title = document.getElementById('guide-title');
+    const $eyebrow = document.getElementById('guide-eyebrow');
+    const $sub = document.querySelector('#guide-modal .modal-sub');
+    if (!ctx || !$body) return;
+    if ($title) $title.textContent = ctx.name || ctx.displayName || ctx.app;
+    if ($eyebrow) $eyebrow.textContent = wsBeaconIsNew(ctx.app) ? '✦ Start here' : '✦ Project guide';
+    if ($sub) $sub.textContent = 'What this project does, and how to take it from drawing to export.';
+    const descHtml = `<div class="guide-desc"><p>Drop in a drawing — a PDF, scan, or photo — and it comes back as clean, editable 2D vectors. Anything the trace wasn’t sure about gets flagged for you to check before you approve and export.</p></div>`;
+    const stepsHtml = guideStepsHtml(workspaceGuideSteps(ctx));
+    $body.innerHTML =
+      `<div class="guide-section-label">What this does</div>` + descHtml +
+      `<div class="guide-section-label">How to go through it</div>` + stepsHtml;
+  }
+
   function renderGuide() {
+    // In Workspaces mode with a project open, the guide describes the document life-cycle.
+    if (wsGuideActive()) { renderWorkspaceGuide(); return; }
     const app = currentId && apps.get(currentId);
     const $body = document.getElementById('guide-body');
     const $title = document.getElementById('guide-title');
     const $eyebrow = document.getElementById('guide-eyebrow');
+    const $sub = document.querySelector('#guide-modal .modal-sub');
     if (!app || !$body) return;
     if ($title) $title.textContent = app.displayName || app.id;
     if ($eyebrow) $eyebrow.textContent = beaconIsNew(app.id) ? '✦ Start here' : '✦ Workflow guide';
+    // Restore the workflow sub in case a prior Workspaces open overwrote it.
+    if ($sub) $sub.textContent = 'What this workflow does, and how to go through it.';
     const desc = (app.description || '').trim();
     const descHtml = desc
       ? `<div class="guide-desc">${desc.split(/\n{2,}/).map((p) => `<p>${mdInline(escapeHtml(p.trim()))}</p>`).join('')}</div>`
       : `<div class="guide-desc guide-desc-empty"><p>A ${app.nodes.length}-step workflow. Set its inputs, Compile to freeze the approved lock, then Run it against your live host.</p></div>`;
-    const steps = guideSteps(app);
-    const curIdx = steps.findIndex((s) => !s.done);
-    const stepsHtml = `<ol class="guide-steps" role="list">${steps.map((s, i) => {
-      const state = s.done ? 'done' : i === curIdx ? 'current' : 'todo';
-      // Shape carries state, not colour alone: ✓ done · → current · ☐ to-do.
-      const box = s.done ? '✓' : i === curIdx ? '→' : '☐';
-      const cur = i === curIdx ? ' aria-current="step"' : '';
-      return `<li class="guide-step ${state}"${cur}><span class="guide-box" aria-hidden="true">${box}</span>` +
-        `<span class="guide-step-text"><span class="guide-step-label">${escapeHtml(s.label)}</span> ` +
-        `<span class="guide-step-note">— ${escapeHtml(s.note)}</span></span>` +
-        `<span class="sr-only">${s.done ? '(done)' : i === curIdx ? '(next step)' : '(to do)'}</span></li>`;
-    }).join('')}</ol>`;
+    // Static authored strings + escapeHtml on every dynamic value (app.description, step
+    // label/note) — no raw user string reaches the DOM (the established guide pattern).
+    const stepsHtml = guideStepsHtml(guideSteps(app));
     const walkHint = `<div class="guide-walk-hint">A bigger workflow? <strong>Walk me through it</strong> hands off to your terminal AI for a step-by-step tour using this workflow's own skill.</div>`;
     $body.innerHTML =
       `<div class="guide-section-label">What this does</div>` + descHtml +
@@ -655,9 +750,15 @@
   }
 
   function openGuide() {
-    if (!currentId) { showToast('open a workflow first', 'warn'); return; }
+    const ws = wsGuideActive();
+    if (!ws && !currentId) { showToast('open a workflow first', 'warn'); return; }
     renderGuide();
     const $m = document.getElementById('guide-modal');
+    // "Walk me through it →" relays to the terminal AI using a WORKFLOW's own skill — a
+    // pipeline concept with no document-workspace analog. Hide it (never disable — an
+    // absent control, not a dead one) for the self-contained workspace guide.
+    const $walk = document.getElementById('guide-walk');
+    if ($walk) $walk.hidden = ws;
     showModal($m);
     // Focus the dialog shell (not a button) so the checklist is read first; Tab then
     // moves to Got it → Walk me through it. Focus returns to the beacon on close.
@@ -665,9 +766,13 @@
     if (shell) { try { shell.focus(); } catch { /* not focusable */ } }
   }
   // Closing the guide (Got it / backdrop / Esc) marks it seen → the beacon stops
-  // pulsing even before a first run (the user has looked; don't nag).
+  // pulsing even before a first run/approve (the user has looked; don't nag). In
+  // Workspaces mode this marks the project's app workspace-guide key, not the workflow.
   function closeGuide() {
-    if (currentId) {
+    if (wsGuideActive()) {
+      setGuide(wsGuideKey(wsGuideCtx.app), { dismissed: true });
+      paintWorkspaceBeacon();
+    } else if (currentId) {
       setGuide(currentId, { dismissed: true });
       const app = apps.get(currentId);
       if (app) paintBeacon(app);
@@ -4660,7 +4765,14 @@
         ? `\nRevised drawing${req.snapshots.length > 1 ? 's' : ''} (read these): ${req.snapshots.join(', ')}`
         : '';
       const note = req.instruction ? `\nMy note: ${req.instruction}` : '';
-      return `In floless project "${req.project}" (app "${req.appId}"), a REVISED drawing set was attached — re-read it into the SAME project as a new version (do NOT create a new project). Read the drawings per the floless-app-steel-takeoff skill, compose the updated steel.takeoff/v1 contract. First GET /api/contract/${req.appId}?project=${req.project} to read the CURRENT contract and PRESERVE each still-present member's id AND its sheet label (mint a NEW id only for a genuinely new member; drop the id of a member the revision deleted) so the version comparison matches members — do NOT renumber the whole model. Then POST /api/projects/${req.project}/revision-read with { contract, message: "<plain-English what changed>", requestId: "${req.id}" }. The server derives the base version + source provenance from this queued request, records a "revision-read" version, and clears the request — do NOT DELETE the request yourself. If you can't read the set, POST /api/projects/${req.project}/revision-requests/${req.id}/fail with { error }.${snaps}${note}`;
+      const post = `Then POST /api/projects/${req.project}/revision-read with { contract, message: "<plain-English what changed>", requestId: "${req.id}" }. The server derives the base version + source provenance from this queued request, records a "revision-read" version, and clears the request — do NOT DELETE the request yourself. If you can't read the set, POST /api/projects/${req.project}/revision-requests/${req.id}/fail with { error }.`;
+      // App-aware: the target contract shape differs per workspace app. A vectorize project holds a
+      // drawing.vector/v1 (clean editable 2D linework), NOT a steel takeoff — instructing the AI to
+      // read steel members would produce the wrong contract for the vector editor (spec §3.3g).
+      if (req.appId === 'vectorize') {
+        return `In floless project "${req.project}" (app "${req.appId}"), a REVISED drawing was attached — re-read (vectorize) it into the SAME project as a new version (do NOT create a new project). Vectorize the drawing per the floless-app-vectorize skill into a drawing.vector/v1 contract: emit clean, editable 2D vector geometry (sheets → elements: lines / polylines / curves / text, each on its layer), NOT steel members or a takeoff. A vector PDF is read deterministically (exact geometry, no guessing); a photo, scan or hand sketch is traced by a fenced vision extraction that flags every uncertain stroke (low confidence) for the user's review. ${post}${snaps}${note}`;
+      }
+      return `In floless project "${req.project}" (app "${req.appId}"), a REVISED drawing set was attached — re-read it into the SAME project as a new version (do NOT create a new project). Read the drawings per the floless-app-steel-takeoff skill, compose the updated steel.takeoff/v1 contract. First GET /api/contract/${req.appId}?project=${req.project} to read the CURRENT contract and PRESERVE each still-present member's id AND its sheet label (mint a NEW id only for a genuinely new member; drop the id of a member the revision deleted) so the version comparison matches members — do NOT renumber the whole model. ${post}${snaps}${note}`;
     }
     return '';
   }
@@ -4688,7 +4800,10 @@
   function markedInstruction(req) {
     const body = instructionFor(req);
     if (!body) return '';
-    const skill = REQUEST_SKILL[req.type] || 'floless-app-workflows';
+    // revision-read's skill is app-specific: steel takeoff by default, floless-app-vectorize for a
+    // vector project — keep the clipboard marker in step with the app-aware instruction body above.
+    let skill = REQUEST_SKILL[req.type] || 'floless-app-workflows';
+    if (req.type === 'revision-read' && req.appId === 'vectorize') skill = 'floless-app-vectorize';
     const base = (typeof location !== 'undefined' && location.origin) ? location.origin : 'http://127.0.0.1:4317';
     // A revision-read is cleared by its own /revision-read POST — a separate DELETE would 404. Every
     // other type is applied-then-DELETEd by the terminal AI.
@@ -6459,6 +6574,41 @@
     instructionFor,
     markedInstruction, // marked (paste-safe) form for clipboard copies — panels.js uses it (#73)
     formModal, // the shared styled prompt/form modal — workspaces.js reuses it (never a native prompt)
+    // ── Workspaces guide beacon (the SAME #guide-beacon/#guide-modal, document variant) ──
+    // workspaces.js owns the open project + its lifecycle state; aware.js owns the beacon
+    // chrome. workspaces.js calls setWorkspaceGuide() with a small snapshot whenever the
+    // open project (or its approve/export state) changes, clearWorkspaceGuide() on close/
+    // Workflows-mode, and markWorkspaceApproved() the first time an Approve succeeds (which
+    // calms the beacon, mirroring markFirstRunDone for a workflow's first Run).
+    setWorkspaceGuide(ctx) {
+      // ctx: { app, name, displayName?, approved, exported }. Null/!app → treat as clear.
+      wsGuideCtx = (ctx && ctx.app) ? { ...ctx } : null;
+      if (inWorkspacesMode()) {
+        paintWorkspaceBeacon();
+        const $m = document.getElementById('guide-modal');
+        if ($m && $m.classList.contains('show') && wsGuideCtx) renderWorkspaceGuide();
+      }
+    },
+    clearWorkspaceGuide() {
+      wsGuideCtx = null;
+      // Repaint through the mode-correct painter. In Workspaces mode paintWorkspaceBeacon() hides the
+      // (now-cleared) workspace beacon. On the mode-switch-BACK path we're already in Workflows mode,
+      // so repaint the WORKFLOW beacon for the current app instead of no-op'ing — otherwise the stale
+      // workspace label/tooltip/is-new lingers until the next workflow load. paintBeacon(null) is safe
+      // (it just hides the workflow beacon when no app is open).
+      if (inWorkspacesMode()) paintWorkspaceBeacon();
+      else paintBeacon(currentId ? apps.get(currentId) : null);
+    },
+    markWorkspaceApproved(app) {
+      if (!app || guideFor(wsGuideKey(app)).approveDone) return;
+      setGuide(wsGuideKey(app), { approveDone: true });
+      if (wsGuideCtx && wsGuideCtx.app === app) {
+        wsGuideCtx.approved = true;
+        if (inWorkspacesMode()) paintWorkspaceBeacon();
+        const $m = document.getElementById('guide-modal');
+        if ($m && $m.classList.contains('show')) renderWorkspaceGuide();
+      }
+    },
   };
 
   // ── boot ──────────────────────────────────────────────────────────────────────

package/dist/web/index.html

@@ -80,7 +80,7 @@
           </button>
           <span class="ctl-sep" aria-hidden="true"></span>
           <button id="ws-approve" type="button" class="primary"
-                  data-tip="Locks in this version of the model — your edits already auto-save; this is the sign-off.">✓ Approve</button>
+                  data-tip="Locks in this version — your edits already auto-save; this is the sign-off.">✓ Approve</button>
         </div>
         <!-- Per-workflow onboarding beacon. Pulses "✨ Start here" while this workflow is
              new to the user (no first Run completed, not dismissed); calms to a quiet
@@ -173,7 +173,7 @@
         <!-- Drawings step: a shell toolbar band + revision-read status card ABOVE the filter iframe
              (chrome around it, never inside — the filter owns its own layout). Shown only on Drawings. -->
         <div class="ws-drawings-bar" id="ws-drawings-bar" hidden>
-          <span class="ws-drawings-bar-label">Drawing set</span>
+          <span class="ws-drawings-bar-label">Source</span>
           <span class="ws-drawings-bar-sep"></span>
           <button type="button" id="ws-attach-revision" class="btn-mini" data-tip="Attach a revised drawing set — your terminal AI reads it into a new version">⤒ Attach revised drawings…</button>
           <input type="file" id="ws-revision-file" accept=".pdf,image/*" multiple hidden>
@@ -183,6 +183,16 @@
              Same-origin like #contract-editor-frame (they call /api/contract directly). -->
         <iframe id="ws-frame-model" class="ws-frame" title="Project model editor" hidden></iframe>
         <iframe id="ws-frame-drawings" class="ws-frame" title="Project drawings & filter" hidden></iframe>
+        <!-- Source-step placeholder: a workspace app with NO filter iframe (vectorize) shows this
+             where steel shows its filter. The ws-drawings-bar (attach/replace to re-vectorize) sits
+             above; this pane explains the Source step. Toggled by setStep() in workspaces.js. -->
+        <div class="ws-source-placeholder" id="ws-source-placeholder" hidden>
+          <div class="ws-source-inner">
+            <span class="ws-source-ico" aria-hidden="true">▨</span>
+            <div class="ws-source-title">This project's source drawing</div>
+            <div class="ws-source-sub">The vectors on the Vectors tab were read from the drawing you imported. Drop a revised drawing in the bar above to re-vectorize it as a new version.</div>
+          </div>
+        </div>
         <!-- Exports = a SHELL-rendered pane (not an iframe): export cards over the project's own
              contract. workspaces.js fills it on step-switch (renderExports). -->
         <div class="ws-exports" id="ws-exports" hidden></div>
@@ -828,6 +838,7 @@
        nothing project-specific (spec §2). Populated per-open in workspaces.js. -->
   <div class="menu ws-proj-menu" id="ws-proj-menu" role="menu" hidden></div>
 
+<script src="analytics.js"></script>
 <script src="app.js"></script>
 <script src="renderers.js"></script>
 <script src="aware.js"></script>

package/dist/web/steel-3d-view.js

@@ -1493,6 +1493,16 @@ function onKey(e) {
   if (!renderer || !canvasEl || canvasEl.style.display === 'none') return;     // only when 3D is active
   const ae = document.activeElement; if (ae && /^(INPUT|SELECT|TEXTAREA)$/.test(ae.tagName)) return;
   if (pending && pending.clipDrag && e.key === 'Escape') { e.preventDefault(); const p = pending; if (p.plane) p.clip.point = p.prePoint; else p.clip.box.copy(p.preBox); rebuildClipPlanes(p.clip); applyClips(); renderClipGizmo(); pending = dragging = null; if (controls) controls.enabled = true; if (readout) readout.style.display = 'none'; return; } // Esc mid-drag → undo the handle move
+  if (pending && e.key === 'Escape' && (pending.epDrag || pending.origMm)) { // Esc mid-drag → cancel a member move / endpoint stretch and revert to the pre-drag state (no commit)
+    e.preventDefault();
+    if (pending.mesh && pending.meshPos0) pending.mesh.position.copy(pending.meshPos0); // put a live-moved (or Alt-vertical) member mesh back
+    const wasEp = pending.epDrag;
+    pending = dragging = null; dragEp = null;
+    if (controls) controls.enabled = true;
+    if (marker) marker.visible = false; if (readout) readout.style.display = 'none'; if (epPreview) epPreview.visible = false; if (epMovedLine) epMovedLine.visible = false; clearCopyGhost();
+    if (wasEp) rebuildEndpoints(); // restore the dragged endpoint dot to its original spot
+    return;
+  }
   if (wpMode && e.key === 'Escape') { e.preventDefault(); if (wpMode === '3pt' && wpDraft && wpDraft.length) { wpDraft.pop(); updateStatusChip(); } else { wpMode = null; wpDraft = null; marker.visible = false; canvasEl.style.cursor = 'default'; reflectWpBar(); updateStatusChip(); } return; } // Esc steps a 3pt pick back, else disarms the set-plane mode
   if (insertMode && e.key === 'Escape') { e.preventDefault(); setInsertMode(false); if (api && api.toast) api.toast('Insert cancelled'); return; }   // Esc disarms the detail-placement pick
   if (basePickCol && e.key === 'Escape') { e.preventDefault(); setBasePickMode(null); if (api && api.toast) api.toast('Trim cancelled'); return; }   // Esc disarms the Mode B column-base pick

package/dist/web/steel-editor.html

@@ -3112,6 +3112,11 @@ addEventListener('keydown',e=>{
  if(e.key==='Escape'&&rfiOpen()){closeRFI();return;}
  if(e.key==='Escape'&&confOpen()){closeConf();return;}
  if(e.key==='Escape'&&snapMenuOpen()){closeSnapMenu();return;}
+ if(e.key==='Escape'&&drag){e.preventDefault();const pre=drag.pre,wasGrid=drag.type==='gridline';   // Esc mid-drag → cancel the command and revert to the pre-drag state (no undo entry committed)
+  if(drag.type==='draw'&&drag.line)drag.line.remove();else if(drag.type==='marquee'&&drag.rect)drag.rect.remove();
+  drag=null;snapClear();epPrevClear();gridReadoutHide();if(wasGrid||!anyToolActive())snapOnlyClear2d();   // a gridline drag's single-shot snap override is always cleared (it can run with the grid panel open, so don't gate on anyToolActive) — matches the normal release
+  if(pre)apply(pre);else render();   // apply() restores the snapshot + re-renders (2D+3D); draw/marquee have no snapshot, just refresh
+  return;}
  if(e.key==='Escape'&&!view3d&&snapOnly){snapOnlyClear2d();return;}  // own Esc rung: 1st Esc drops the snap override, the next cancels the tool/draft (mirrors the set-axes two-step)
  if(e.key==='Home'){e.preventDefault();if(view3d&&window.Steel3DView)window.Steel3DView.frameAll();else fitToWindow();return;}
  if(!view3d&&!inForm&&(((e.key==='z'||e.key==='Z')&&e.altKey)||(e.key===' '&&e.shiftKey))){e.preventDefault();zoomToSelection();return;}  // 2D zoom-to-selected (Tekla Shift+Space / Alt+Z); 3D handles its own (steel-3d-view onKey)

package/dist/web/vector-editor.html

@@ -68,6 +68,9 @@
   #toast.show{display:flex}
   #toast .ghost{height:24px;padding:0 8px;background:transparent;border:1px solid var(--line);color:var(--mut);border-radius:5px;font-size:11px}
   #toast .ghost:hover{color:var(--text);border-color:var(--brand)}
+  /* Themed tooltip — replaces native title= so no OS-default tooltip leaks the dark theme. */
+  #tooltip{position:fixed;z-index:80;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:5px 8px;font-size:11.5px;line-height:1.35;color:var(--text);pointer-events:none;max-width:260px;box-shadow:0 8px 22px rgba(0,0,0,.5);opacity:0;transition:opacity .12s}
+  #tooltip.show{opacity:1}
 </style>
 </head>
 <body>
@@ -76,7 +79,7 @@
     <span class="stat" id="title">—</span>
     <span class="spacer"></span>
     <span class="stat"><b id="nEl">0</b> elements · <b id="nTx">0</b> text</span>
-    <span id="saveStat" title="Edits save to the app's contract automatically" hidden>Auto-save on</span>
+    <span id="saveStat" data-tip="Edits save to the app's contract automatically" hidden>Auto-save on</span>
     <button class="primary" id="exportBtn" disabled>Export SVG</button>
   </header>
   <div id="wrap">
@@ -84,7 +87,7 @@
       <svg id="svg" xmlns="http://www.w3.org/2000/svg"></svg>
       <div id="state" class="show"><div class="spin"></div><div id="stateMsg">Loading drawing…</div></div>
       <div id="zoombar">
-        <button class="ghost" id="fitBtn" title="Fit to view">Fit</button>
+        <button class="ghost" id="fitBtn" data-tip="Fit to view">Fit</button>
         <input type="range" id="zoom" min="10" max="800" value="100" aria-label="Zoom">
         <span id="zpct">100%</span>
       </div>
@@ -120,7 +123,12 @@
   const svg = $('svg');
   const params = new URLSearchParams(location.search);
   const app = params.get('app');
-  const src = params.get('src') || (app ? ('/api/contract/' + encodeURIComponent(app)) : '/vector-example.json');
+  // Workspaces: a project-keyed contract lives at projects/<id>/contract.json. Empty PROJECT =
+  // legacy app-keyed behaviour (byte-for-byte today's URLs). PROJECT_QS is appended to every
+  // /api/contract call so two vectorize projects of the same app never share a draft (spec §4.3).
+  const PROJECT = params.get('project') || '';
+  const PROJECT_QS = PROJECT ? ('?project=' + encodeURIComponent(PROJECT)) : '';
+  const src = params.get('src') || (app ? ('/api/contract/' + encodeURIComponent(app) + PROJECT_QS) : '/vector-example.json');
   const WEAK = 0.5;
 
   let sheet = null;
@@ -307,7 +315,7 @@
   let saveQueue = Promise.resolve(true);
   async function doPut() {
     try {
-      const res = await fetch('/api/contract/' + encodeURIComponent(app), {
+      const res = await fetch('/api/contract/' + encodeURIComponent(app) + PROJECT_QS, {
         method: 'PUT', headers: { 'content-type': 'application/json' }, body: JSON.stringify(C),
       });
       setSaved(res.ok ? 'ok' : 'err');
@@ -382,14 +390,14 @@
     for (const el of weak) {
       const row = document.createElement('div'); row.className = 'wrow'; row.dataset.id = el.id || '';
       const lbl = document.createElement('span'); lbl.className = 'lbl'; lbl.textContent = elLabel(el);
-      lbl.title = 'Show this trace on the drawing';
+      lbl.dataset.tip = 'Show this trace on the drawing';
       lbl.addEventListener('click', () => locateOnCanvas(el.id));
       const pct = document.createElement('span'); pct.className = 'pct'; pct.textContent = Math.round((el.confidence || 0) * 100) + '%';
       const ok = document.createElement('button'); ok.className = 'ghost'; ok.textContent = 'Accept';
-      ok.title = 'Mark this trace as correct — clears its low-confidence flag.';
+      ok.dataset.tip = 'Mark this trace as correct — clears its low-confidence flag.';
       ok.addEventListener('click', () => acceptEl(el.id));
       const del = document.createElement('button'); del.className = 'danger'; del.textContent = 'Delete';
-      del.title = 'Remove this trace from the drawing (Undo available).';
+      del.dataset.tip = 'Remove this trace from the drawing (Undo available).';
       del.addEventListener('click', () => deleteEl(el.id));
       row.append(lbl, pct, ok, del); box.appendChild(row);
     }
@@ -461,6 +469,20 @@
 
   window.addEventListener('resize', () => { if (sheet) syncZoom(); });
 })();
+
+// Themed tooltips (replaces native title=) — one shared element, shown on data-tip hover after a
+// short delay, positioned below the control and clamped to the viewport (same handler as the steel
+// editor's 3D toolbar). Reads data-tip via getAttribute, so JS-set el.dataset.tip works too.
+(function(){ const tip=document.createElement('div'); tip.id='tooltip'; document.body.appendChild(tip); let t=null;
+  function show(el){ const txt=el.getAttribute('data-tip'); if(!txt) return; tip.textContent=txt; tip.classList.add('show');
+    const r=el.getBoundingClientRect(), tw=tip.offsetWidth, th=tip.offsetHeight;
+    let x=Math.max(6,Math.min(r.left+r.width/2-tw/2, innerWidth-tw-6)), y=r.bottom+6; if(y+th>innerHeight-6) y=r.top-th-6;
+    tip.style.left=x+'px'; tip.style.top=y+'px'; }
+  function hide(){ clearTimeout(t); tip.classList.remove('show'); }
+  document.addEventListener('pointerover', e=>{ const el=e.target.closest('[data-tip]'); if(!el) return; clearTimeout(t); t=setTimeout(()=>show(el),400); });
+  document.addEventListener('pointerout', e=>{ if(e.target.closest('[data-tip]')) hide(); });
+  document.addEventListener('pointerdown', hide, true); // a click hides the tip immediately
+})();
 </script>
 </body>
 </html>