diff --git a/library/layouts/StackLayout.vue b/library/layouts/StackLayout.vue
index 080e87784..8fdcac86a 100644
--- a/library/layouts/StackLayout.vue
+++ b/library/layouts/StackLayout.vue
@@ -89,6 +89,18 @@ function injectScriptOnce(url) {
   _stlLoaded[url] = new Promise((ok, fail) => {
     const s = document.createElement('script')
     s.src = url
+    // ★ A DEV ENTRY IS AN ES MODULE, AND A CLASSIC <script> LIES ABOUT LOADING IT.
+    // Pointing a classic script at /plugin-designs/<bundle>/index.js fires onload SUCCESSFULLY and
+    // only THEN throws "Cannot use import statement outside a module", asynchronously. So this
+    // promise resolved, waitForDefine() below timed out, the tag never registered, and the section
+    // rendered empty — with NO failed request and NO console error at the injection site. onload is
+    // structurally incapable of detecting this.
+    // MEASURED on stack-demo's dev leaf 2026-09-22: 0 failed requests, and yet
+    // customElements.get('research-dashboard-map') === false with 0 rows rendered.
+    // Same rule as plugin-studio.vue:255, which hit this first. It belongs HERE because StackLayout
+    // is the SHARED layout — dashboard-plus-grid and research-map-plus-grid inject through this same
+    // function, so one fix covers all three consumers instead of becoming a fourth private copy.
+    if (/^\/plugin-designs\//.test(url) || /\/index\.js(\?|$)/.test(url)) s.type = 'module'
     s.onload = () => ok()
     s.onerror = () => { delete _stlLoaded[url]; fail(new Error('failed to load ' + url)) }
     document.head.appendChild(s)
diff --git a/plugin-designs/stack-demo/stack-demo.vue b/plugin-designs/stack-demo/stack-demo.vue
index 58f4744e2..5c2647a00 100644
--- a/plugin-designs/stack-demo/stack-demo.vue
+++ b/plugin-designs/stack-demo/stack-demo.vue
@@ -17,16 +17,38 @@ import StackLayout from '@map/layouts/StackLayout.vue'
 
 // The two elements to stack. `src` is TREE-RELATIVE at build; the leaf pages resolve it against the
 // bundle tree root. Both elements ship their own bundles in the same catalog.
+// ── WHERE A SIBLING BUNDLE LIVES DEPENDS ON WHICH TREE IS SERVING ────────────────────────────
+// A tree-relative src is resolved by the BROWSER against the document URL, so no attribute and no
+// host can redirect it — which makes it correct in exactly one tree and a 404 in the other.
+//   BUILT: this leaf is served two levels deep (doxa-maps/stack-demo/stack-demo/index.html), so a
+//          sibling bundle is '../../<bundle>/<bundle>.js'.
+//   DEV:   the dev server serves SOURCE, and a bundle's entry is '/plugin-designs/<bundle>/index.js'.
+// MEASURED 2026-09-22 against the running dev server:
+//     GET /plugin-designs/research-dashboard/index.js ........... 200
+//     GET /research-dashboard/research-dashboard.js ............. 404   <- what '../../' resolves to
+// So stack-demo took 2 x 404 and rendered empty sections in dev, with no console error and no failed
+// mount — the sections simply never got their element. Confirmed PRE-EXISTING and reproducible on this
+// bundle's own standalone leaf, independent of any composite that nests it.
+//
+// ★ THIS IS THE THIRD PLACE THIS EXACT DEFECT APPEARED. plugin-studio and doxa-maps-spa both carried
+// hardcoded tree-relative paths and both were cured the same way: resolve at RUNTIME from something
+// that knows which tree is serving, rather than baking one tree's shape into a string. Each instance
+// was found separately, after the previous one was "fixed", because a literal '../..' looks correct
+// in review and is invisible to a gate that only ever checks the built tree (check:composite-srcs
+// PASSES on this file today, for precisely that reason).
+//
+// import.meta.env.DEV is statically replaced at build time, so the production branch is the only one
+// that survives into the IIFE — the built output is byte-identical to the hardcoded form it replaces.
+const bundleSrc = (bundle, file) =>
+  import.meta.env.DEV ? `/plugin-designs/${bundle}/index.js` : `../../${bundle}/${file}.js`
+
 const sections = [
-  // src is resolved by the browser relative to THIS leaf page, which is served two levels deep
-  // (doxa-maps/stack-demo/stack-demo/index.html) — so go UP TWO to reach a sibling bundle's tree
-  // (doxa-maps/<bundle>/<bundle>.js). (Off-by-one here = a 404 + an empty section, caught silently.)
   {
     key: 'dashboard',
     title: 'Research Dashboard',
     sub: 'facets · map · charts · table (live)',
     element: 'research-dashboard-map',
-    src: '../../research-dashboard/research-dashboard.js',
+    src: bundleSrc('research-dashboard', 'research-dashboard'),
     // ★ REQUIRED, and its absence was a live defect (found + fixed 2026-09-22). research-dashboard's
     // entry mounts ProfileLoader, which reads profile-config.profile to choose WHICH .vue to load.
     // With none, the element still mounted at its full 844px and still reported its tag — so every
@@ -49,7 +71,7 @@ const sections = [
     title: 'People Groups',
     sub: 'the full searchable list (live)',
     element: 'people-groups-grid',
-    src: '../../people-groups-grid/people-groups-grid.js'
+    src: bundleSrc('people-groups-grid', 'people-groups-grid')
   }
 ]
 </script>