@snowcone-app/canvas 0.37.0 → 0.38.0

package/dist/{embed-CLz3CTcX.js → embed-SOFUZlGB.js}

@@ -1,176 +1,176 @@
-import { E as Ke, p as Ge, q as We, C as He, r as te, t as ne, v as Je, w as Qe, x as Ye, y as Xe, z as Ze, h as et, e as tt } from "./useCommands-CQi4Pyd2.js";
-import { E as I, y as Ce, z as P } from "./FontAnalyzer-CEYA_6fY.js";
-import { jsx as c, jsxs as F, Fragment as nt } from "react/jsx-runtime";
-import { useContext as rt, createContext as it, useRef as O, useState as T, useMemo as L, useCallback as K, useLayoutEffect as re, useEffect as U, useSyncExternalStore as J, Component as st, forwardRef as $e, useId as ge, memo as ot, isValidElement as Oe } from "react";
-import { assertVariantSelected as at, RenderSession as dt, createCartDetail as lt } from "@snowcone-app/sdk";
-import { s as de, B as ct, E as ut, r as mt, i as pt } from "./design-builder-CqgTpp9B.js";
-import { u as ft, p as ht } from "./usePieceGuideBundle-BUQKb0Ja.js";
-import { D as gt, C as yt, f as bt, d as vt } from "./template-fields-D8uOutD4.js";
-import "./ExportManager-CDX5_up8.js";
-import "./CanvasStateV1-DLE5d1-d.js";
-const Ne = it(void 0);
-function Q() {
-  const e = rt(Ne);
+import { n as Xe, o as Ze, E as et, C as tt, y as se, z as oe, A as nt, F as rt, G as it, H as st, J as ot, l as at, e as dt } from "./useCommands-x8J7_Mzy.js";
+import { t as S, V as Te, p as z } from "./FontAnalyzer-DWHS41ba.js";
+import { jsx as g, jsxs as U, Fragment as lt } from "react/jsx-runtime";
+import { useContext as ct, createContext as ut, useRef as C, useState as D, useMemo as A, useCallback as G, useLayoutEffect as ae, useEffect as L, useSyncExternalStore as J, Component as mt, forwardRef as Ae, useId as we, memo as pt, isValidElement as De } from "react";
+import { assertVariantSelected as ft, RenderSession as ht, createCartDetail as gt } from "@snowcone-app/sdk";
+import { s as ee, B as yt, E as bt, n as vt, i as wt } from "./design-builder-CoCtjIwj.js";
+import { u as Et, p as kt } from "./usePieceGuideBundle-C7r06a_x.js";
+import { D as xt, C as St, f as Rt, d as It } from "./template-fields-CBLHgW7G.js";
+import "./ExportManager-BbBfO22S.js";
+import "./CanvasStateV1-C9LQt2J0.js";
+const Be = ut(void 0);
+function te() {
+  const e = ct(Be);
   if (!e)
     throw new Error(
       "useRealtimeMockups / <RealtimeCanvas> / <RealtimeMockup> must be rendered inside <RealtimeEmbed>. Wrap them: <RealtimeEmbed shop=… product=… design=… grantUrl=…>…</RealtimeEmbed>"
     );
   return e;
 }
-function _e(e) {
+function Ue(e) {
   var t;
   return Array.isArray((t = e.bundle) == null ? void 0 : t.members) && e.bundle.members.length > 0;
 }
-const G = "bundles";
-function wt(e) {
+const W = "bundles";
+function Ot(e) {
   return Object.keys(e).sort().map((t) => `${t}:${e[t]}`).join(",");
 }
-function ye(e) {
+function Ee(e) {
   const t = e.indexOf(".");
   return t <= 0 || t === e.length - 1 ? null : { role: e.slice(0, t), key: e.slice(t + 1) };
 }
-function Et(e) {
+function $t(e) {
   return e.type !== "color" && typeof e.width == "number" && e.width > 0 && typeof e.height == "number" && e.height > 0;
 }
-function kt(e, t) {
+function Ct(e, t) {
   var i, s;
   const n = (s = (i = e.options) == null ? void 0 : i.combinations) == null ? void 0 : s.find((o) => o.variantId === t);
   if (!n) return t;
   const r = Object.entries(n).filter(([o, l]) => o !== "variantId" && o !== "price" && (typeof l == "string" || typeof l == "number")).map(([o, l]) => `${o} ${String(l)}`);
   return r.length > 0 ? r.join(" · ") : t;
 }
-function yn(e, t = {}) {
-  var E, A, C, D, V;
-  if (!_e(e))
-    throw new I(
+function On(e, t = {}) {
+  var v, B, N, _, F;
+  if (!Ue(e))
+    throw new S(
       "E_NOT_A_BUNDLE",
       `product ${e.id} has no bundle block — picks / variants are bundle parameters the server refuses on a single product (E_NOT_A_BUNDLE). Use productToRenderConfig() for it.`,
-      { productId: e.id, docSlug: G }
+      { productId: e.id, docSlug: W }
     );
-  const n = e.bundle.members, r = n.map((m) => m.role);
-  for (const [m, R] of [
+  const n = e.bundle.members, r = n.map((h) => h.role);
+  for (const [h, $] of [
     ["picks", t.picks],
     ["variants", t.variants]
   ])
-    for (const N of Object.keys(R ?? {}))
-      if (!r.includes(N))
-        throw new I(
+    for (const V of Object.keys($ ?? {}))
+      if (!r.includes(V))
+        throw new S(
           "E_BUNDLE_ROLE_NOT_FOUND",
-          `bundle ${e.id} has no role "${N}" (in ${m}). Roles: [${r.join(", ")}].`,
-          { productId: e.id, field: m, role: N, validNames: r, docSlug: G }
+          `bundle ${e.id} has no role "${V}" (in ${h}). Roles: [${r.join(", ")}].`,
+          { productId: e.id, field: h, role: V, validNames: r, docSlug: W }
         );
-  const i = {}, s = {}, o = {}, l = e.placements ?? [], u = [];
-  for (const m of n) {
-    const R = m.products.map((w) => w.productId), N = (E = t.picks) == null ? void 0 : E[m.role], _ = N === void 0 ? m.products[0] : m.products.find((w) => w.productId === N);
-    if (!_)
-      throw new I(
+  const i = {}, s = {}, o = {}, l = e.placements ?? [], d = [];
+  for (const h of n) {
+    const $ = h.products.map((w) => w.productId), V = (v = t.picks) == null ? void 0 : v[h.role], T = V === void 0 ? h.products[0] : h.products.find((w) => w.productId === V);
+    if (!T)
+      throw new S(
         "E_BUNDLE_PICK_NOT_FOUND",
-        `bundle ${e.id} role "${m.role}" has no alternative "${N}". Alternatives: [${R.join(", ")}] — pass picks: { ${m.role}: "${R[0]}" }.`,
-        { productId: e.id, role: m.role, requested: N, validNames: R, docSlug: G }
+        `bundle ${e.id} role "${h.role}" has no alternative "${V}". Alternatives: [${$.join(", ")}] — pass picks: { ${h.role}: "${$[0]}" }.`,
+        { productId: e.id, role: h.role, requested: V, validNames: $, docSlug: W }
       );
-    i[m.role] = _.productId;
-    const Y = (_.variants ?? []).map((w) => w.gvid).filter((w) => typeof w == "string" && w !== ""), q = Y.length > 0 ? Y : _.defaultGvid ? [_.defaultGvid] : [], M = ((A = t.variants) == null ? void 0 : A[m.role]) ?? _.defaultGvid ?? Y[0];
-    if (!M || !q.includes(M)) {
-      const w = (C = t.variants) == null ? void 0 : C[m.role];
-      throw new I(
+    i[h.role] = T.productId;
+    const j = (T.variants ?? []).map((w) => w.gvid).filter((w) => typeof w == "string" && w !== ""), M = j.length > 0 ? j : T.defaultGvid ? [T.defaultGvid] : [], K = ((B = t.variants) == null ? void 0 : B[h.role]) ?? T.defaultGvid ?? j[0];
+    if (!K || !M.includes(K)) {
+      const w = (N = t.variants) == null ? void 0 : N[h.role];
+      throw new S(
         "E_BUNDLE_VARIANT_NOT_FOUND",
-        q.length === 0 ? `bundle ${e.id} role "${m.role}": alternative ${_.productId} publishes no variant — nothing can render this slot (catalog data is incomplete).` : `bundle ${e.id} role "${m.role}" (${_.productId}) has no variant "${w}". Variants: [${q.join(", ")}] — pass variants: { ${m.role}: "${q[0]}" }.`,
+        M.length === 0 ? `bundle ${e.id} role "${h.role}": alternative ${T.productId} publishes no variant — nothing can render this slot (catalog data is incomplete).` : `bundle ${e.id} role "${h.role}" (${T.productId}) has no variant "${w}". Variants: [${M.join(", ")}] — pass variants: { ${h.role}: "${M[0]}" }.`,
         {
           productId: e.id,
-          role: m.role,
-          memberProductId: _.productId,
+          role: h.role,
+          memberProductId: T.productId,
           requested: w,
-          validNames: q,
-          docSlug: G
+          validNames: M,
+          docSlug: W
         }
       );
     }
-    s[m.role] = M, o[m.role] = ((V = (D = _.variants) == null ? void 0 : D.find((w) => w.gvid === M)) == null ? void 0 : V.gvidForMockup) || M;
-    const ie = l.filter(
-      (w) => w.role === m.role && w.memberProductId === _.productId && typeof w.key == "string" && w.key !== "" && Et(w)
+    s[h.role] = K, o[h.role] = ((F = (_ = T.variants) == null ? void 0 : _.find((w) => w.gvid === K)) == null ? void 0 : F.gvidForMockup) || K;
+    const X = l.filter(
+      (w) => w.role === h.role && w.memberProductId === T.productId && typeof w.key == "string" && w.key !== "" && $t(w)
     ).map((w) => ({
       key: w.key,
-      role: m.role,
+      role: h.role,
       label: w.label,
-      memberProductId: _.productId,
+      memberProductId: T.productId,
       width: w.width,
       height: w.height,
       aspectRatio: w.width / w.height
     }));
-    u.push({
-      role: m.role,
-      required: m.required !== !1,
-      alternatives: R,
-      pick: _.productId,
-      variantId: M,
-      variantChoices: q.map((w) => ({ gvid: w, label: kt(_, w) })),
-      placements: ie
+    d.push({
+      role: h.role,
+      required: h.required !== !1,
+      alternatives: $,
+      pick: T.productId,
+      variantId: K,
+      variantChoices: M.map((w) => ({ gvid: w, label: Ct(T, w) })),
+      placements: X
     });
   }
-  const a = new Set(u.flatMap((m) => m.placements.map((R) => R.key))), h = new Map(u.flatMap((m) => m.placements.map((R) => [R.key, R]))), p = [];
-  for (const m of l) {
-    if (typeof m.key != "string" || !a.has(m.key)) continue;
-    const R = h.get(m.key);
-    R && !p.includes(R) && p.push(R);
+  const a = new Set(d.flatMap((h) => h.placements.map(($) => $.key))), u = new Map(d.flatMap((h) => h.placements.map(($) => [$.key, $]))), c = [];
+  for (const h of l) {
+    if (typeof h.key != "string" || !a.has(h.key)) continue;
+    const $ = u.get(h.key);
+    $ && !c.includes($) && c.push($);
   }
-  const b = p.map((m) => m.key);
-  let k;
+  const b = c.map((h) => h.key);
+  let x;
   if (t.placement !== void 0) {
-    if (!ye(t.placement))
-      throw new I(
+    if (!Ee(t.placement))
+      throw new S(
         "E_BUNDLE_ROLE_REQUIRED",
         `placement "${t.placement}" names no role — on bundle ${e.id} a placement is addressed by its role-scoped key. Keys: [${b.join(", ")}].`,
-        { productId: e.id, requested: t.placement, validNames: b, docSlug: G }
+        { productId: e.id, requested: t.placement, validNames: b, docSlug: W }
       );
-    if (k = p.find((m) => m.key === t.placement), !k)
-      throw new I(
+    if (x = c.find((h) => h.key === t.placement), !x)
+      throw new S(
         "E_PRODUCT_NOT_RENDERABLE",
         `bundle ${e.id} has no renderable placement "${t.placement}" for picks ${JSON.stringify(i)}. Keys: [${b.join(", ")}].`,
-        { productId: e.id, requested: t.placement, picks: i, validNames: b, docSlug: G }
+        { productId: e.id, requested: t.placement, picks: i, validNames: b, docSlug: W }
       );
   } else
-    k = p[0];
-  if (!k)
-    throw new I(
+    x = c[0];
+  if (!x)
+    throw new S(
       "E_PRODUCT_NOT_RENDERABLE",
       `bundle ${e.id} has no renderable image placement for picks ${JSON.stringify(i)} (a role-scoped, non-color placement with width/height). The catalog payload may be incomplete — fetch it via getProduct(), not a search hit.`,
-      { productId: e.id, picks: i, docSlug: G }
+      { productId: e.id, picks: i, docSlug: W }
     );
-  const d = e.mockups ?? [], v = d.filter(
-    (m) => !m.picks || Object.entries(m.picks).every(([R, N]) => i[R] === N)
-  ), g = (v.length > 0 ? v : d).map((m) => m.id);
-  if (g.length === 0)
-    throw new I(
+  const m = e.mockups ?? [], E = m.filter(
+    (h) => !h.picks || Object.entries(h.picks).every(([$, V]) => i[$] === V)
+  ), y = (E.length > 0 ? E : m).map((h) => h.id);
+  if (y.length === 0)
+    throw new S(
       "E_PRODUCT_NOT_RENDERABLE",
       `bundle ${e.id} has no mockup scenes — nothing to render a preview into.`,
-      { productId: e.id, docSlug: G }
+      { productId: e.id, docSlug: W }
     );
-  const f = (e.requiredPlacements ?? []).filter((m) => typeof m.key == "string" && m.key !== "" && a.has(m.key)).map((m) => ({ label: m.key, key: m.key, type: m.type, autoFilledByVariant: m.autoFilledByVariant }));
+  const p = (e.requiredPlacements ?? []).filter((h) => typeof h.key == "string" && h.key !== "" && a.has(h.key)).map((h) => ({ label: h.key, key: h.key, type: h.type, autoFilledByVariant: h.autoFilledByVariant }));
   return {
     kind: "bundle",
     product: {
       productId: e.id,
-      mockupIds: g,
+      mockupIds: y,
       picks: i,
       variants: s,
       placements: b,
-      mockups: d,
-      ...f.length > 0 ? { requiredPlacements: f } : {},
+      mockups: m,
+      ...p.length > 0 ? { requiredPlacements: p } : {},
       ...typeof t.width == "number" ? { width: t.width } : {}
     },
     picks: i,
     variants: s,
-    variantToken: wt(o),
-    roles: u,
-    placement: k,
-    placements: p,
+    variantToken: Ot(o),
+    roles: d,
+    placement: x,
+    placements: c,
     placementKeys: b,
     roleNames: r,
-    primaryMockupId: g[0]
+    primaryMockupId: y[0]
   };
 }
-const Rt = "[RealtimeEmbed]";
-function Te(e) {
+const Nt = "[RealtimeEmbed]";
+function pe(e) {
   var r, i;
   if ((r = e == null ? void 0 : e.requiredPlacements) != null && r.length)
     return e.requiredPlacements.filter((s) => !s.autoFilledByVariant).map((s) => s.label);
@@ -179,21 +179,21 @@ function Te(e) {
   );
   return !!(e != null && e.variantId) || t.size > 1 ? [] : (e == null ? void 0 : e.placements) ?? [];
 }
-function xt(e) {
+function _t(e) {
   return !!(e != null && e.picks) || !!(e != null && e.variants);
 }
-function It(e) {
+function Tt(e) {
   const t = /* @__PURE__ */ new Set();
   for (const n of e.placements ?? []) {
-    const r = ye(n);
+    const r = Ee(n);
     r && t.add(r.role);
   }
   for (const n of Object.keys(e.picks ?? {})) t.add(n);
   for (const n of Object.keys(e.variants ?? {})) t.add(n);
   return [...t];
 }
-function Ae({ shop: e, product: t, design: n, hasGrant: r }) {
-  var d, v;
+function Le({ shop: e, product: t, design: n, hasGrant: r }) {
+  var m, E;
   const i = [];
   if (e || i.push({
     severity: "error",
@@ -203,67 +203,89 @@ function Ae({ shop: e, product: t, design: n, hasGrant: r }) {
     severity: "error",
     issue: "missing-grant",
     message: "no grant source — pass `grantUrl` (a proxy to mintRealtimeGrant) or `grant`. Without it the session can never authorize and no mockup renders."
-  }), (d = t == null ? void 0 : t.mockupIds) != null && d.length || i.push({
+  }), (m = t == null ? void 0 : t.mockupIds) != null && m.length || i.push({
     severity: "error",
     issue: "empty-mockup-ids",
     message: 'product.mockupIds is empty — pass the catalog scene codes (product.mockups[].id) you want rendered, e.g. ["FV1qjO"].'
   }), t != null && t.options)
     try {
-      at(t);
-    } catch (g) {
+      ft(t);
+    } catch (y) {
       i.push({
         severity: "error",
         issue: "variant-required",
-        message: g instanceof Error ? g.message : String(g)
+        message: y instanceof Error ? y.message : String(y)
       });
     }
-  const s = n.toJSON(), o = s.artboards.map((g) => g.name), l = xt(t);
-  let u = [];
+  const s = n.toJSON(), o = s.artboards.map((y) => y.name), l = _t(t);
+  let d = [];
   if (l) {
-    const g = t.placements ?? [];
-    u = o.filter((E) => !ye(E)), u.length > 0 && i.push({
+    const y = t.placements ?? [];
+    d = o.filter((v) => !Ee(v)), d.length > 0 && i.push({
       severity: "error",
       issue: "bundle-role-required",
-      message: `product ${t.productId} is a bundle, but the design's artboard(s) [${u.join(", ")}] name no role. On a bundle every placement is addressed by its role-scoped key (<role>.<key>)${g.length ? ` — keys: [${g.join(", ")}]` : ""}. Seed the design from bundleToRenderConfig(product).placement.key, not from a bare label.`
+      message: `product ${t.productId} is a bundle, but the design's artboard(s) [${d.join(", ")}] name no role. On a bundle every placement is addressed by its role-scoped key (<role>.<key>)${y.length ? ` — keys: [${y.join(", ")}]` : ""}. Seed the design from bundleToRenderConfig(product).placement.key, not from a bare label.`
     }), t.variantId && i.push({
       severity: "error",
       issue: "bundle-role-required",
       message: `product ${t.productId} is a bundle, but product.variantId ("${t.variantId}") names no slot — the server refuses it (E_BUNDLE_ROLE_REQUIRED). Name the variant per role instead: product.variants = { <role>: <gvid> } (bundleToRenderConfig fills it), and leave variantId unset.`
     });
-    const S = It(t).filter((E) => {
-      var A;
-      return !((A = t.variants) != null && A[E]);
+    const O = Tt(t).filter((v) => {
+      var B;
+      return !((B = t.variants) != null && B[v]);
     });
-    S.length > 0 && i.push({
+    O.length > 0 && i.push({
       severity: "error",
       issue: "bundle-variant-required",
-      message: `product ${t.productId} is a bundle, but role(s) [${S.join(", ")}] have no entry in product.variants (${JSON.stringify(t.variants ?? {})}). Every role needs a variant — the server keys the render on the per-role set. Build the product with bundleToRenderConfig(product, { picks, variants }), which fills each slot's default.`
+      message: `product ${t.productId} is a bundle, but role(s) [${O.join(", ")}] have no entry in product.variants (${JSON.stringify(t.variants ?? {})}). Every role needs a variant — the server keys the render on the per-role set. Build the product with bundleToRenderConfig(product, { picks, variants }), which fills each slot's default.`
     });
   }
-  const a = Te(t), h = a.filter((g) => !o.includes(g));
-  a.length > 1 && o.length > 1 && h.length > 0 && i.push({
-    severity: "error",
-    issue: "multi-placement",
-    message: `product ${t.productId} requires placements [${a.join(", ")}] but the design only has artboards [${o.join(", ")}] — missing [${h.join(", ")}]. The render would time out waiting for the missing canvas_states. Add each missing placement to the seed: design(…).artboard('` + h[0] + "', { width, height })… (ADR-0088), or use the eject path — see https://developers.snowcone.app/embed-mode#eject."
+  const a = pe(t), u = a.filter((y) => !o.includes(y));
+  a.length > 1 && o.length > 1 && u.length > 0 && i.push({
+    severity: "warn",
+    issue: "placements-inherit-base",
+    message: `product ${t.productId} requires placements [${a.join(", ")}]; the design authors [${o.join(", ")}], so [${u.join(", ")}] inherit the base artboard "${o[0]}" (re-fit per placement, ADR-0101). Intended? Otherwise split them: design(…).artboard('` + u[0] + "', { width, height })… or usePlacements().split('" + u[0] + "') at runtime."
   });
-  const p = (v = t == null ? void 0 : t.placements) != null && v.length ? o.filter((g) => !t.placements.includes(g) && !u.includes(g)) : [];
-  p.length > 0 && i.push({
+  const c = (E = t == null ? void 0 : t.placements) != null && E.length ? o.filter((y) => !t.placements.includes(y) && !d.includes(y)) : [];
+  c.length > 0 && i.push({
     severity: "error",
     issue: "placement-mismatch",
-    message: `the design's artboard(s) [${p.join(", ")}] are not in product.placements [${t.placements.join(", ")}]. Every artboard name must equal a real product placement label (renderState targets placements by that name), or the server renders a blank mockup. Fix the \`name\` passed to design({ name }) / design().artboard(name, …).`
+    message: `the design's artboard(s) [${c.join(", ")}] are not in product.placements [${t.placements.join(", ")}]. Every artboard name must equal a real product placement label (renderState targets placements by that name), or the server renders a blank mockup. Fix the \`name\` passed to design({ name }) / design().artboard(name, …).`
   });
-  const b = s.elements.map((g) => g.name).filter((g) => !!g), k = b.filter((g, f) => b.indexOf(g) !== f);
-  return k.length && i.push({
+  const b = s.elements.map((y) => y.name).filter((y) => !!y), x = b.filter((y, p) => b.indexOf(y) !== p);
+  return x.length && i.push({
     severity: "warn",
     issue: "duplicate-layer-names",
-    message: `duplicate layer name(s) [${[...new Set(k)].join(", ")}] — useTextBinding(name) / useImageBinding(name) bind to the FIRST match, so a duplicate name makes a control edit the wrong layer. Keep names unique.`
+    message: `duplicate layer name(s) [${[...new Set(x)].join(", ")}] — useTextBinding(name) / useImageBinding(name) bind to the FIRST match, so a duplicate name makes a control edit the wrong layer. Keep names unique.`
   }), i;
 }
-function St(e) {
-  for (const t of Ae(e))
-    (t.severity === "error" && t.issue !== "placement-mismatch" ? console.error : console.warn)(`${Rt} ${t.message}`);
+function At(e) {
+  for (const t of Le(e))
+    (t.severity === "error" && t.issue !== "placement-mismatch" ? console.error : console.warn)(`${Nt} ${t.message}`);
+}
+function Fe(e, t) {
+  const n = new Set(e);
+  if (t.length === 0)
+    return e.map((i) => ({ label: i, inherited: !1 }));
+  const r = t.map((i) => ({
+    label: i,
+    inherited: !n.has(i)
+  }));
+  for (const i of e)
+    t.includes(i) || r.push({ label: i, inherited: !1 });
+  return r;
+}
+function Ve(e, t) {
+  const n = e.artboards ?? [], r = n[0];
+  if (!r || t.length === 0) return e;
+  const i = n.map((d) => typeof d.name == "string" ? d.name : ""), s = new Map(n.map((d, a) => [i[a], d])), o = Fe(i, t);
+  if (o.every((d) => !d.inherited)) return e;
+  const l = o.map(
+    (d) => d.inherited ? { ...r, name: d.label } : s.get(d.label)
+  );
+  return { ...e, artboards: l };
 }
-function De({ registry: e, store: t, product: n }) {
+function Pe({ registry: e, store: t, product: n }) {
   const r = [], i = e.getParts(), s = e.getTextFields(), o = e.requiresCanvasPartNames();
   o.length > 0 && !e.hasCanvas() && r.push({
     code: "A_REQUIRES_CANVAS",
@@ -271,48 +293,48 @@ function De({ registry: e, store: t, product: n }) {
     message: `${o.join(", ")} ${o.length === 1 ? "is" : "are"} mounted with no <Editor.Canvas> under this Root — they operate on the editable artboard (selection, editor commands) and throw E_REQUIRES_CANVAS.`,
     fix: `Mount <Editor.Canvas/> under the same <Editor.Root>, or remove ${o.join(", ")}. Canvas-free parts: Editor.Preview, Editor.Buy, Editor.TextField, Editor.Layers.`
   });
-  const l = i.filter((d) => d.name === "Editor.Canvas").some((d) => d.meta.floatingToolbar !== !1);
+  const l = i.filter((m) => m.name === "Editor.Canvas").some((m) => m.meta.floatingToolbar !== !1);
   e.hasDockedControls() && l && r.push({
     code: "A_CONTROLS_INERT",
     severity: "warn",
     message: "a docked <Editor.Controls> is mounted while <Editor.Canvas> still has floatingToolbar={true} (the default) — both contextual zones are armed, and the floating toolbar is suppressed only as a side effect of the docked Controls being mounted this frame (it silently reappears when the Controls unmounts).",
     fix: 'Declare contextual-zone ownership in the type surface: pass floatingToolbar={false} on <Editor.Canvas> when a <Editor.Controls placement="docked"> owns the zone.'
   });
-  const u = (n == null ? void 0 : n.mockupIds) ?? [];
-  if (u.length > 1) {
-    const d = i.filter((v) => v.name === "Editor.Preview" && v.meta.mockupId === void 0);
-    d.length > 0 && r.push({
+  const d = (n == null ? void 0 : n.mockupIds) ?? [];
+  if (d.length > 1) {
+    const m = i.filter((E) => E.name === "Editor.Preview" && E.meta.mockupId === void 0);
+    m.length > 0 && r.push({
       code: "A_PREVIEW_AMBIGUOUS",
       severity: "warn",
-      message: `${d.length} <Editor.Preview> part${d.length === 1 ? " has" : "s have"} no mockupId while the product renders ${u.length} mockup scenes [${u.join(", ")}] — each shows whichever scene renders first, an ambiguous fan-out.`,
-      fix: `Pin each <Editor.Preview> to a scene: mockupId="${u[0]}" (one of product.mockupIds).`
+      message: `${m.length} <Editor.Preview> part${m.length === 1 ? " has" : "s have"} no mockupId while the product renders ${d.length} mockup scenes [${d.join(", ")}] — each shows whichever scene renders first, an ambiguous fan-out.`,
+      fix: `Pin each <Editor.Preview> to a scene: mockupId="${d[0]}" (one of product.mockupIds).`
     });
   }
-  const a = i.some((d) => d.name === "Editor.Buy");
+  const a = i.some((m) => m.name === "Editor.Buy");
   if (s.length > 0 && !a) {
-    const d = s.map((v) => v.name);
+    const m = s.map((E) => E.name);
     r.push({
       code: "A_NO_BUY",
       severity: "info",
-      message: `<Editor.TextField> parts are mounted (layers [${d.join(", ")}]) but no <Editor.Buy> — personalization has no commerce gate, so nothing enforces completeness (C2/C3) before the design is bought.`,
+      message: `<Editor.TextField> parts are mounted (layers [${m.join(", ")}]) but no <Editor.Buy> — personalization has no commerce gate, so nothing enforces completeness (C2/C3) before the design is bought.`,
       fix: "Mount <Editor.Buy onAddToCart={…}/> under the same <Editor.Root> (it assembles the payload and gates on completeness), or ignore if this composition is deliberately non-commerce."
     });
   }
-  const h = [];
-  for (const d of s)
-    t.layerKindOf(d.name) === void 0 ? r.push({
+  const u = [];
+  for (const m of s)
+    t.layerKindOf(m.name) === void 0 ? r.push({
       code: "A_LAYER_UNMATCHED",
       severity: "error",
-      message: `<Editor.TextField layer={design.layer("${d.name}")}> matches zero elements in the current design state — the layer was removed or renamed after the field mounted, so the binding is dead and writes will fail. Bindable layers now: ${JSON.stringify(t.bindableLayerNames())}.`,
-      fix: `Restore a text layer named "${d.name}" to the design, or bind the field to an existing layer: layer={design.layer(<one of ${JSON.stringify(t.bindableLayerNames())}>)}.`
-    }) : h.push(d);
-  const p = h.filter((d) => !d.optional);
-  if (p.length > 0 && p.every((d) => t.textOf(d.name) === t.seedTextOf(d.name))) {
-    const d = p.map((v) => v.name);
+      message: `<Editor.TextField layer={design.layer("${m.name}")}> matches zero elements in the current design state — the layer was removed or renamed after the field mounted, so the binding is dead and writes will fail. Bindable layers now: ${JSON.stringify(t.bindableLayerNames())}.`,
+      fix: `Restore a text layer named "${m.name}" to the design, or bind the field to an existing layer: layer={design.layer(<one of ${JSON.stringify(t.bindableLayerNames())}>)}.`
+    }) : u.push(m);
+  const c = u.filter((m) => !m.optional);
+  if (c.length > 0 && c.every((m) => t.textOf(m.name) === t.seedTextOf(m.name))) {
+    const m = c.map((E) => E.name);
     r.push({
       code: "A_TEXT_AT_SEED",
       severity: "info",
-      message: `every required <Editor.TextField> still equals its seed value (layers [${d.join(", ")}]) — <Editor.Buy>'s completeness rule C3 gates checkout until the shopper's text differs from the seed (placeholder text must not be bought).`,
+      message: `every required <Editor.TextField> still equals its seed value (layers [${m.join(", ")}]) — <Editor.Buy>'s completeness rule C3 gates checkout until the shopper's text differs from the seed (placeholder text must not be bought).`,
       fix: "Nothing to change for a fresh mount — this clears when the shopper edits the fields. For a field that should NOT gate Buy, pass optional on that <Editor.TextField>."
     });
   }
@@ -323,40 +345,40 @@ function De({ registry: e, store: t, product: n }) {
     fix: "Seed content on the builder passed to <Editor.Root design={…}> — design({…}).text(…)/.background(…)/.shape(…) — or add elements through <Editor.Add>."
   });
   const b = /* @__PURE__ */ new Map();
-  for (const d of i) b.set(d.name, (b.get(d.name) ?? 0) + 1);
-  const k = [...b.entries()].map(([d, v]) => ({ name: d, count: v })).sort((d, v) => d.name.localeCompare(v.name));
-  return { findings: r, parts: k };
+  for (const m of i) b.set(m.name, (b.get(m.name) ?? 0) + 1);
+  const x = [...b.entries()].map(([m, E]) => ({ name: m, count: E })).sort((m, E) => m.name.localeCompare(E.name));
+  return { findings: r, parts: x };
 }
-const ee = [];
-function Ct(e) {
-  return ee.push(e), () => {
-    const t = ee.indexOf(e);
-    t !== -1 && ee.splice(t, 1);
+const ie = [];
+function Dt(e) {
+  return ie.push(e), () => {
+    const t = ie.indexOf(e);
+    t !== -1 && ie.splice(t, 1);
   };
 }
-function bn() {
-  const e = ee[ee.length - 1];
+function $n() {
+  const e = ie[ie.length - 1];
   if (!e)
-    throw new I(
+    throw new S(
       "E_AUDIT_NO_ROOT",
       "auditEditor() found no mounted <Editor.Root>. Mount a Root first — or, to audit at mount time, pass onAudit on the Root: <Editor.Root onAudit={(report) => …}>.",
       { docSlug: "embed-mode" }
     );
   return e.compute();
 }
-const Be = 8e3;
-function $t(e) {
-  return `[RealtimeEmbed] No mockup after ${Math.round(Be / 1e3)}s. Common causes: a variant product missing \`variantId\` (pass \`product.options\` so the embed can flag it up front), a multi-placement product (the server waits for every required placement but <RealtimeEmbed> sends only "${e}" — pass \`product.requiredPlacements\` so this is flagged at mount; such products need the eject path), an unreachable or non-public asset URL in the design, or the placement "${e}" not existing on the product. The render may still arrive — this is a heads-up, not a failure.`;
+const je = 8e3;
+function Bt(e) {
+  return `[RealtimeEmbed] No mockup after ${Math.round(je / 1e3)}s. Common causes: a variant product missing \`variantId\` (pass \`product.options\` so the embed can flag it up front), a multi-placement product (the server waits for every required placement but <RealtimeEmbed> sends only "${e}" — pass \`product.requiredPlacements\` so this is flagged at mount; such products need the eject path), an unreachable or non-public asset URL in the design, or the placement "${e}" not existing on the product. The render may still arrive — this is a heads-up, not a failure.`;
 }
-function Ot(e) {
+function Ut(e) {
   if ("grantUrl" in e && e.grantUrl)
     return { grantUrl: e.grantUrl };
   const t = e.grant;
   return typeof t == "function" ? { getToken: t } : { getToken: () => Promise.resolve(t) };
 }
-function Le({ error: e, onRetry: t }) {
-  const n = Ce(e) ? e.code : "EDITOR_ERROR";
-  return /* @__PURE__ */ F(
+function Me({ error: e, onRetry: t }) {
+  const n = Te(e) ? e.code : "EDITOR_ERROR";
+  return /* @__PURE__ */ U(
     "div",
     {
       "data-sc-part": "error",
@@ -372,12 +394,12 @@ function Le({ error: e, onRetry: t }) {
         lineHeight: 1.5
       },
       children: [
-        /* @__PURE__ */ F("p", { style: { margin: 0, fontWeight: 700 }, children: [
+        /* @__PURE__ */ U("p", { style: { margin: 0, fontWeight: 700 }, children: [
           "Editor failed: ",
           n
         ] }),
-        /* @__PURE__ */ c("p", { style: { margin: "4px 0 0" }, children: e.message }),
-        t ? /* @__PURE__ */ c(
+        /* @__PURE__ */ g("p", { style: { margin: "4px 0 0" }, children: e.message }),
+        t ? /* @__PURE__ */ g(
           "button",
           {
             type: "button",
@@ -401,7 +423,7 @@ function Le({ error: e, onRetry: t }) {
     }
   );
 }
-class Nt extends st {
+class Lt extends mt {
   constructor() {
     super(...arguments), this.state = { caught: null };
   }
@@ -410,20 +432,20 @@ class Nt extends st {
   }
   componentDidCatch(t) {
     var n;
-    mt(t), typeof P < "u" && ((n = P.env) == null ? void 0 : n.NODE_ENV) !== "production" && console.error("[Editor.Root] contained a composition error:", t);
+    vt(t), typeof z < "u" && ((n = z.env) == null ? void 0 : n.NODE_ENV) !== "production" && console.error("[Editor.Root] contained a composition error:", t);
   }
   render() {
-    return this.state.caught ? /* @__PURE__ */ c(Le, { error: this.state.caught }) : this.props.children;
+    return this.state.caught ? /* @__PURE__ */ g(Me, { error: this.state.caught }) : this.props.children;
   }
 }
-function _t({ reportedError: e, onRetry: t, children: n }) {
+function Ft({ reportedError: e, onRetry: t, children: n }) {
   if (e) {
-    const r = Ce(e) && e.code === "E_CHUNK_LOAD_FAILED";
-    return /* @__PURE__ */ c(Le, { error: e, onRetry: r ? t : void 0 });
+    const r = Te(e) && e.code === "E_CHUNK_LOAD_FAILED";
+    return /* @__PURE__ */ g(Me, { error: e, onRetry: r ? t : void 0 });
   }
-  return /* @__PURE__ */ c(Nt, { reportedError: null, onRetry: t, children: n });
+  return /* @__PURE__ */ g(Lt, { reportedError: null, onRetry: t, children: n });
 }
-function Tt(e) {
+function Vt(e) {
   const {
     shop: t,
     product: n,
@@ -432,251 +454,284 @@ function Tt(e) {
     onMockups: s,
     onRenderError: o,
     onIssue: l,
-    wsUrl: u,
+    wsUrl: d,
     services: a,
-    children: h,
-    internals: p,
+    children: u,
+    internals: c,
     recordAudit: b,
-    __validation: k = "throw"
-  } = e, d = L(() => r.toJSON().activeArtboard, [r]), v = L(() => r.toJSON().artboards.map((y) => y.name), [r]), [g, f] = T(null), S = g && g.design === r ? g.label : d, E = L(
-    () => (y) => {
-      if (!v.includes(y))
-        throw new I(
+    __validation: x = "throw"
+  } = e, m = A(() => r.toJSON().activeArtboard, [r]), y = J(c.store.subscribe, c.store.getState, c.store.getState).artboards.map((f) => f.name).join("\0"), p = A(
+    () => y ? y.split("\0") : [],
+    [y]
+  ), O = JSON.stringify(pe(n)), v = A(() => JSON.parse(O), [O]), [B, N] = D(null), _ = B && B.design === r ? B.label : m, F = A(
+    () => (f) => {
+      const k = [.../* @__PURE__ */ new Set([...v, ...p])];
+      if (!k.includes(f))
+        throw new S(
           "E_UNKNOWN_PLACEMENT",
-          `no placement "${y}" in this design — its artboards are ${JSON.stringify(v)}. Add it to the seed with design(…).artboard('${y}', { width, height }) (ADR-0088).`,
-          { placement: y, validNames: v, docSlug: "embed-mode" }
+          `no placement "${f}" — the product's placements are ${JSON.stringify(v)} and the design's artboards are ${JSON.stringify(p)} (ADR-0088 / ADR-0101).`,
+          { placement: f, validNames: k, docSlug: "embed-mode" }
         );
-      f({ design: r, label: y });
+      const R = p[0] ?? f;
+      N({ design: r, label: p.includes(f) ? f : R });
+    },
+    [r, p, v]
+  ), h = C(null), $ = A(
+    () => (f) => {
+      var k;
+      if (!v.includes(f) && !p.includes(f))
+        throw new S(
+          "E_UNKNOWN_PLACEMENT",
+          `cannot split "${f}" — the product's placements are ${JSON.stringify(v)} (ADR-0101).`,
+          { placement: f, validNames: v, docSlug: "embed-mode" }
+        );
+      if (!p.includes(f)) {
+        const R = c.registry.getCanvasBridge();
+        R ? R.splitArtboard(f) : (c.store.splitArtboard(f), (k = h.current) == null || k.call(h, ee(c.store.getState())));
+      }
+      N({ design: r, label: f });
     },
-    [r, v]
-  ), A = L(() => {
-    const y = r.toJSON().artboards[0];
-    if (y)
+    [r, p, v, c]
+  ), V = A(
+    () => (f) => {
+      var P;
+      const k = p[0];
+      if (f === k)
+        throw new S(
+          "E_LINK_BASE",
+          `"${f}" is the base artboard — every linked placement inherits it, so it cannot be re-linked. Link a split placement instead, or call linkAll(). Artboards: ${JSON.stringify(p)}.`,
+          { artboardName: f, validNames: p.slice(1), docSlug: "embed-mode" }
+        );
+      if (!p.includes(f)) return;
+      const R = c.registry.getCanvasBridge();
+      R ? R.removeArtboard(f) : (c.store.removeArtboard(f), (P = h.current) == null || P.call(h, ee(c.store.getState()))), _ === f && k && N({ design: r, label: k });
+    },
+    [r, p, c, _]
+  ), T = A(() => {
+    const f = r.toJSON().artboards[0];
+    if (f)
       return {
-        name: y.name,
-        width: y.width,
-        height: y.height,
-        ...y.backgroundColor ? { backgroundColor: y.backgroundColor } : {}
+        name: f.name,
+        width: f.width,
+        height: f.height,
+        ...f.backgroundColor ? { backgroundColor: f.backgroundColor } : {}
       };
   }, [r]);
   J(
-    p.commerce.subscribe,
-    p.commerce.getVersion,
-    p.commerce.getVersion
+    c.commerce.subscribe,
+    c.commerce.getVersion,
+    c.commerce.getVersion
   );
-  const C = p.commerce.renderVariantId(), D = ft(C ?? n.variantId ?? n.defaultGvid), V = L(() => {
-    if (!D) return null;
-    const y = r.toJSON().artboards[0];
-    return ht(D, y) ?? null;
-  }, [D, r]), m = O(s), R = O(o), N = O(l);
-  m.current = s, R.current = o, N.current = l;
-  const [_, Y] = T([]), [q, M] = T(!0), [ie, w] = T(null), le = !!("grantUrl" in e && e.grantUrl || "grant" in e && e.grant), ce = Ot(e), qe = "grantUrl" in ce ? ce.grantUrl : "getToken", be = `${n.productId}|${n.mockupIds.join(",")}|${n.variantId ?? ""}`, X = n.picks || n.variants ? JSON.stringify([n.picks ?? null, n.variants ?? null]) : "", H = `${t}|${be}|${X}|${d}|${le}`, ue = L(() => {
-    var B;
-    const y = Ae({ shop: t, product: n, design: r, hasGrant: le });
-    if (k !== "throw") return y;
-    const $ = y.find((z) => z.severity === "error");
-    if ($)
-      throw new I("E_EMBED_CONFIG", $.message, {
-        issue: $.issue,
+  const j = c.commerce.renderVariantId(), M = Et(j ?? n.variantId ?? n.defaultGvid), K = A(() => {
+    if (!M) return null;
+    const f = r.toJSON().artboards, k = f.find((R) => R.name === _) ?? f[0];
+    return kt(M, k) ?? null;
+  }, [M, r, _]), X = C(s), w = C(o), Q = C(l);
+  X.current = s, w.current = o, Q.current = l;
+  const [ke, He] = D([]), [de, ne] = D(!0), [xe, le] = D(null), fe = !!("grantUrl" in e && e.grantUrl || "grant" in e && e.grant), he = Ut(e), Je = "grantUrl" in he ? he.grantUrl : "getToken", Se = `${n.productId}|${n.mockupIds.join(",")}|${n.variantId ?? ""}`, re = n.picks || n.variants ? JSON.stringify([n.picks ?? null, n.variants ?? null]) : "", Y = `${t}|${Se}|${re}|${m}|${fe}`, ge = A(() => {
+    var R;
+    const f = Le({ shop: t, product: n, design: r, hasGrant: fe });
+    if (x !== "throw") return f;
+    const k = f.find((P) => P.severity === "error");
+    if (k)
+      throw new S("E_EMBED_CONFIG", k.message, {
+        issue: k.issue,
         docSlug: "embed-mode"
       });
-    for (const z of y)
-      typeof P < "u" && ((B = P.env) == null ? void 0 : B.NODE_ENV) !== "production" && console.warn(`[Editor.Root] ${z.message}`);
-    return y;
-  }, [H, k]), ve = O(null);
-  U(() => {
-    var y;
-    if (ue.length !== 0 && ve.current !== H) {
-      ve.current = H;
-      for (const $ of ue) (y = N.current) == null || y.call(N, $);
+    for (const P of f)
+      typeof z < "u" && ((R = z.env) == null ? void 0 : R.NODE_ENV) !== "production" && console.warn(`[Editor.Root] ${P.message}`);
+    return f;
+  }, [Y, x]), Re = C(null);
+  L(() => {
+    var f;
+    if (ge.length !== 0 && Re.current !== Y) {
+      Re.current = Y;
+      for (const k of ge) (f = Q.current) == null || f.call(Q, k);
     }
-  }, [ue, H]);
-  const we = O(null);
-  U(() => {
-    var y;
-    if (k === "warn" && typeof P < "u" && ((y = P.env) == null ? void 0 : y.NODE_ENV) !== "production") {
-      if (we.current === H) return;
-      we.current = H, St({ shop: t, product: n, design: r, hasGrant: le });
+  }, [ge, Y]);
+  const Ie = C(null);
+  L(() => {
+    var f;
+    if (x === "warn" && typeof z < "u" && ((f = z.env) == null ? void 0 : f.NODE_ENV) !== "production") {
+      if (Ie.current === Y) return;
+      Ie.current = Y, At({ shop: t, product: n, design: r, hasGrant: fe });
     }
-  }, [H, k]);
-  const se = L(
+  }, [Y, x]);
+  const ce = A(
     () => {
       try {
-        return { session: new dt({ shop: t, product: n, wsUrl: u, ...ce }) };
-      } catch (y) {
-        return { error: y instanceof Error ? y.message : String(y) };
+        return { session: new ht({ shop: t, product: n, wsUrl: d, ...he }) };
+      } catch (f) {
+        return { error: f instanceof Error ? f.message : String(f) };
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [t, be, d, u, qe]
-  ), x = "session" in se ? se.session : null, oe = "error" in se ? se.error : null, Z = L(() => (y, $ = i) => {
-    if (!x) return;
-    w(null), M(!0);
-    const B = (j) => {
-      var Ie;
-      const ae = j instanceof Error ? j.message : String(j);
-      w(ae), M(!1), (Ie = R.current) == null || Ie.call(R, ae);
-    }, z = (j, ae) => void x.renderState(j, { schemaVersion: y.schemaVersion, artboards: [ae] }, $).catch(B), pe = y.artboards ?? [];
-    if (pe.length > 1) {
-      for (const j of pe)
-        z(typeof j.name == "string" && j.name ? j.name : d, j);
+    [t, Se, m, d, Je]
+  ), I = "session" in ce ? ce.session : null, ue = "error" in ce ? ce.error : null, Z = A(() => (f, k = i) => {
+    if (!I) return;
+    le(null), ne(!0);
+    const R = (q) => {
+      var Ne;
+      const me = q instanceof Error ? q.message : String(q);
+      le(me), ne(!1), (Ne = w.current) == null || Ne.call(w, me);
+    }, P = (q, me) => void I.renderState(q, { schemaVersion: f.schemaVersion, artboards: [me] }, k).catch(R), Ce = Ve(f, pe(n)).artboards ?? [];
+    if (Ce.length > 1) {
+      for (const q of Ce)
+        P(typeof q.name == "string" && q.name ? q.name : m, q);
       return;
     }
-    const Re = Te(n), xe = pe[0];
-    if (xe && Re.length > 1) {
-      for (const j of Re)
-        z(j, { ...xe, name: j });
+    I.renderState(m, f, k).catch(R);
+  }, [I, m, n, i]);
+  h.current = Z, L(() => {
+    var f;
+    if (ue) {
+      le(ue), ne(!1), (f = w.current) == null || f.call(w, ue);
       return;
     }
-    x.renderState(d, y, $).catch(B);
-  }, [x, d, n, i]);
-  U(() => {
-    var y;
-    if (oe) {
-      w(oe), M(!1), (y = R.current) == null || y.call(R, oe);
-      return;
-    }
-    if (x)
-      return x.onMockups(($) => {
-        var B;
-        Y($), M(!1), (B = m.current) == null || B.call(m, $);
-      }), x.onError(($) => {
-        var B;
-        w($), M(!1), (B = R.current) == null || B.call(R, $);
-      }), Z(r.toServerRequest()), () => x.close();
-  }, [x, oe]);
-  const me = O({
+    if (I)
+      return I.onMockups((k) => {
+        var R;
+        He(k), ne(!1), (R = X.current) == null || R.call(X, k);
+      }), I.onError((k) => {
+        var R;
+        le(k), ne(!1), (R = w.current) == null || R.call(w, k);
+      }), Z(r.toServerRequest()), () => I.close();
+  }, [I, ue]);
+  const ye = C({
     session: null,
     variantId: void 0
   });
-  U(() => {
-    if (!x || !C) return;
-    const y = me.current, $ = y.session === x ? y.variantId : n.variantId;
-    if (C === $) {
-      me.current = { session: x, variantId: $ };
+  L(() => {
+    if (!I || !j) return;
+    const f = ye.current, k = f.session === I ? f.variantId : n.variantId;
+    if (j === k) {
+      ye.current = { session: I, variantId: k };
       return;
     }
-    me.current = { session: x, variantId: C }, x.setProduct({ ...n, variantId: C }), Z(de(p.store.getState()));
-  }, [x, C]);
-  const Ee = O({ session: null, key: "" });
-  U(() => {
-    if (!x || !X) return;
-    const y = Ee.current;
-    if (y.session === x && y.key === X) return;
-    const $ = y.session !== x;
-    Ee.current = { session: x, key: X }, !$ && (x.setProduct(n), Z(de(p.store.getState())));
-  }, [x, X]), U(() => {
-    if (!q) return;
-    const y = setTimeout(() => {
-      var B, z;
-      const $ = $t(d);
-      typeof P < "u" && ((B = P.env) == null ? void 0 : B.NODE_ENV) !== "production" && console.warn($), (z = N.current) == null || z.call(N, { severity: "warn", issue: "slow-render", message: $ });
-    }, Be);
-    return () => clearTimeout(y);
-  }, [q, d]);
-  const Pe = L(
+    ye.current = { session: I, variantId: j }, I.setProduct({ ...n, variantId: j }), Z(ee(c.store.getState()));
+  }, [I, j]);
+  const Oe = C({ session: null, key: "" });
+  L(() => {
+    if (!I || !re) return;
+    const f = Oe.current;
+    if (f.session === I && f.key === re) return;
+    const k = f.session !== I;
+    Oe.current = { session: I, key: re }, !k && (I.setProduct(n), Z(ee(c.store.getState())));
+  }, [I, re]), L(() => {
+    if (!de) return;
+    const f = setTimeout(() => {
+      var R, P;
+      const k = Bt(m);
+      typeof z < "u" && ((R = z.env) == null ? void 0 : R.NODE_ENV) !== "production" && console.warn(k), (P = Q.current) == null || P.call(Q, { severity: "warn", issue: "slow-render", message: k });
+    }, je);
+    return () => clearTimeout(f);
+  }, [de, m]);
+  const Qe = A(
     () => ({
-      session: x,
+      session: I,
       design: r,
       // The ACTIVE placement (ADR-0088): Editor.Canvas follows it as its
       // controlled artboard; single-placement designs never see it move.
-      placement: S,
-      placements: v,
-      selectPlacement: E,
+      placement: _,
+      placements: p,
+      selectPlacement: F,
+      requiredPlacements: v,
+      splitPlacement: $,
+      linkPlacement: V,
       product: n,
-      mockups: _,
-      isRendering: q,
-      error: ie,
+      mockups: ke,
+      isRendering: de,
+      error: xe,
       throttleMs: i,
-      pieceGuides: V,
+      pieceGuides: K,
       pushRender: Z,
-      stateStore: p.store
+      stateStore: c.store
     }),
-    [x, r, S, v, E, n, _, q, ie, i, V, Z, p.store]
-  ), ze = J(
-    p.registry.subscribe,
-    p.registry.getVersion,
-    p.registry.getVersion
+    [I, r, _, p, F, v, $, V, n, ke, de, xe, i, K, Z, c.store]
+  ), Ye = J(
+    c.registry.subscribe,
+    c.registry.getVersion,
+    c.registry.getVersion
   );
-  L(() => {
+  A(() => {
     b(
-      De({ registry: p.registry, store: p.store, product: n })
-    ), p.registry.validate();
-  }, [p.registry, ze]);
-  const ke = /* @__PURE__ */ c(We.Provider, { value: p, children: /* @__PURE__ */ c(Ne.Provider, { value: Pe, children: /* @__PURE__ */ c(ct.Provider, { value: p.registry, children: /* @__PURE__ */ c(
-    ut,
+      Pe({ registry: c.registry, store: c.store, product: n })
+    ), c.registry.validate();
+  }, [c.registry, Ye]);
+  const $e = /* @__PURE__ */ g(et.Provider, { value: c, children: /* @__PURE__ */ g(Be.Provider, { value: Qe, children: /* @__PURE__ */ g(yt.Provider, { value: c.registry, children: /* @__PURE__ */ g(
+    bt,
     {
-      ...A ? { initialArtboardConfig: A } : {},
-      children: h
+      ...T ? { initialArtboardConfig: T } : {},
+      children: u
     }
   ) }) }) });
-  return a ? /* @__PURE__ */ c(He, { services: a, children: ke }) : ke;
+  return a ? /* @__PURE__ */ g(tt, { services: a, children: $e }) : $e;
 }
-function Ue(e) {
-  const { design: t, product: n, onAudit: r } = e, i = `${n.productId}|${n.variantId ?? ""}`, s = O(null), o = O(null), [l, u] = T(null);
+function qe(e) {
+  const { design: t, product: n, onAudit: r } = e, i = `${n.productId}|${n.variantId ?? ""}`, s = C(null), o = C(null), [l, d] = D(null);
   (s.current === null || s.current.design !== t) && (s.current = {
     design: t,
     internals: {
-      store: new gt(t.toJSON()),
-      registry: new Ke()
+      store: new xt(t.toJSON()),
+      registry: new Xe()
     }
-  }), (o.current === null || o.current.productIdentity !== i) && (o.current = { productIdentity: i, commerce: new yt(n) });
-  const a = L(
+  }), (o.current === null || o.current.productIdentity !== i) && (o.current = { productIdentity: i, commerce: new St(n) });
+  const a = A(
     () => ({
       ...s.current.internals,
       commerce: o.current.commerce,
-      ...Ge(u)
+      ...Ze(d)
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [s.current.internals, o.current.commerce]
-  ), h = O(n);
-  h.current = n;
-  const p = O(r);
-  p.current = r;
-  const b = O(null), k = K((g) => {
-    b.current = g;
-  }, []), d = K(
-    () => De({
+  ), u = C(n);
+  u.current = n;
+  const c = C(r);
+  c.current = r;
+  const b = C(null), x = G((y) => {
+    b.current = y;
+  }, []), m = G(
+    () => Pe({
       registry: s.current.internals.registry,
       store: s.current.internals.store,
-      product: h.current
+      product: u.current
     }),
     []
   );
-  re(() => Ct({ compute: d }), [d]);
-  const v = O(!1);
-  return U(() => {
-    let g = !1;
+  ae(() => Dt({ compute: m }), [m]);
+  const E = C(!1);
+  return L(() => {
+    let y = !1;
     return queueMicrotask(() => {
-      var f;
-      g || v.current || (v.current = !0, (f = p.current) == null || f.call(p, b.current ?? d()));
+      var p;
+      y || E.current || (E.current = !0, (p = c.current) == null || p.call(c, b.current ?? m()));
     }), () => {
-      g = !0;
+      y = !0;
     };
-  }, [d]), // `display: contents` — the .sc-root scope without a layout box, so the
+  }, [m]), // `display: contents` — the .sc-root scope without a layout box, so the
   // host's grid/flex sees the parts directly (and the legacy RealtimeEmbed
   // wrapper, which had no DOM at all, stays layout-identical).
-  /* @__PURE__ */ c("div", { className: "sc-root", style: { display: "contents" }, "data-sc-part": "root", children: /* @__PURE__ */ c(_t, { reportedError: l, onRetry: () => u(null), children: /* @__PURE__ */ c(Tt, { ...e, internals: a, recordAudit: k }) }) });
+  /* @__PURE__ */ g("div", { className: "sc-root", style: { display: "contents" }, "data-sc-part": "root", children: /* @__PURE__ */ g(Ft, { reportedError: l, onRetry: () => d(null), children: /* @__PURE__ */ g(Vt, { ...e, internals: a, recordAudit: x }) }) });
 }
-let At = () => import("./EditorCanvasImpl-BRdFWZA5.js").then((e) => e.EditorCanvasImpl);
-function Fe() {
-  return At();
+let Pt = () => import("./EditorCanvasImpl-BnxEbr2p.js").then((e) => e.EditorCanvasImpl);
+function ze() {
+  return Pt();
 }
-const Dt = $e(function({ children: t, maxHeight: n, floatingToolbar: r = !0, className: i, style: s }, o) {
-  const l = te("Editor.Canvas");
-  ne("Editor.Canvas", { floatingToolbar: r });
-  const u = ge();
-  re(() => l.registry.registerCanvas(u), [l.registry, u]);
-  const [a, h] = T(null);
-  return U(() => {
-    let p = !1;
-    return Fe().then(
+const jt = Ae(function({ children: t, maxHeight: n, floatingToolbar: r = !0, className: i, style: s }, o) {
+  const l = se("Editor.Canvas");
+  oe("Editor.Canvas", { floatingToolbar: r });
+  const d = we();
+  ae(() => l.registry.registerCanvas(d), [l.registry, d]);
+  const [a, u] = D(null);
+  return L(() => {
+    let c = !1;
+    return ze().then(
       (b) => {
-        p || h(() => b);
+        c || u(() => b);
       },
       (b) => {
-        p || l.reportRuntimeError(
-          new I(
+        c || l.reportRuntimeError(
+          new S(
             "E_CHUNK_LOAD_FAILED",
             `the editor's rendering chunk failed to load (${b instanceof Error ? b.message : String(b)}). This is a network/CDN failure, not a composition mistake — retry, or check the deployment serves the @snowcone-app/canvas lazy chunks.`,
             { cause: b instanceof Error ? b.message : String(b), docSlug: "embed-mode" }
@@ -684,14 +739,14 @@ const Dt = $e(function({ children: t, maxHeight: n, floatingToolbar: r = !0, cla
         );
       }
     ), () => {
-      p = !0;
+      c = !0;
     };
   }, [l]), a ? (
     // `builtinControls`: the canvas owns the floating contextual toolbar
     // unless the host opts out via `floatingToolbar={false}` or a docked
     // <Editor.Controls> is mounted (ADR-0085 §5). Only here — the legacy
     // <RealtimeCanvas> wrapper stays chrome-less.
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ g(
       a,
       {
         ref: o,
@@ -704,7 +759,7 @@ const Dt = $e(function({ children: t, maxHeight: n, floatingToolbar: r = !0, cla
         children: t
       }
     )
-  ) : /* @__PURE__ */ c(
+  ) : /* @__PURE__ */ g(
     "div",
     {
       "data-sc-part": "canvas",
@@ -715,55 +770,108 @@ const Dt = $e(function({ children: t, maxHeight: n, floatingToolbar: r = !0, cla
     }
   );
 });
-function Bt() {
-  const { placements: e, placement: t, selectPlacement: n } = Q();
-  return L(
-    () => ({
-      placements: e.map((r) => ({ label: r, active: r === t })),
-      activePlacement: t,
-      select: n
-    }),
-    [e, t, n]
-  );
+function Mt() {
+  const { placements: e, requiredPlacements: t, placement: n, selectPlacement: r, splitPlacement: i, linkPlacement: s } = te();
+  return A(() => {
+    const o = Fe(e, t), l = e[0] ?? n, d = o.map((u) => ({
+      label: u.label,
+      inherited: u.inherited,
+      active: u.inherited ? n === l : n === u.label
+    })), a = d.length > 1 && d.every((u) => u.inherited || u.label === l);
+    return {
+      placements: d,
+      activePlacement: n,
+      basePlacement: l,
+      linked: a,
+      select: r,
+      split: i,
+      link: s,
+      splitAll: () => {
+        for (const u of d) u.inherited && i(u.label);
+      },
+      linkAll: () => {
+        for (const u of d) !u.inherited && u.label !== l && s(u.label);
+      }
+    };
+  }, [e, t, n, r, i, s]);
 }
-function Lt({ className: e, style: t }) {
-  const { placements: n, select: r } = Bt();
-  return n.length < 2 ? null : /* @__PURE__ */ c(
+const qt = (e) => e.length === 2 ? "Both sides" : `All ${e.length} areas`, zt = {
+  font: "inherit",
+  fontSize: "12px",
+  color: "var(--sc-color-muted-foreground, inherit)",
+  background: "transparent",
+  border: "none",
+  padding: "2px 8px",
+  cursor: "pointer",
+  textDecoration: "underline",
+  textUnderlineOffset: "4px"
+};
+function Kt({ className: e, style: t, labels: n }) {
+  const { placements: r, linked: i, select: s, splitAll: o, linkAll: l } = Mt();
+  if (r.length < 2) return null;
+  const d = r.map((a) => a.label);
+  return /* @__PURE__ */ U(
     "div",
     {
       "data-sc-part": "placements",
+      "data-sc-linked": i ? "true" : "false",
       className: e,
       style: { display: "flex", alignItems: "center", gap: "4px", ...t },
-      children: n.map(({ label: i, active: s }) => /* @__PURE__ */ c(
-        "button",
-        {
-          type: "button",
-          "data-sc-part": "placements-item",
-          "data-sc-active": s ? "true" : "false",
-          "aria-pressed": s,
-          onClick: () => r(i),
-          style: {
-            font: "inherit",
-            fontSize: "13px",
-            fontWeight: s ? 700 : 400,
-            color: "var(--sc-color-foreground, inherit)",
-            background: "transparent",
-            border: "none",
-            borderRadius: "9999px",
-            padding: "2px 8px",
-            cursor: s ? "default" : "pointer",
-            textDecoration: s ? "underline" : "none",
-            textUnderlineOffset: "4px"
+      children: [
+        i ? /* @__PURE__ */ g(
+          "span",
+          {
+            "data-sc-part": "placements-item",
+            "data-sc-active": "true",
+            "data-sc-linked": "true",
+            title: d.join(" · "),
+            style: { fontSize: "13px", fontWeight: 700, padding: "2px 8px", color: "var(--sc-color-foreground, inherit)" },
+            children: ((n == null ? void 0 : n.linked) ?? qt)(d)
+          }
+        ) : r.map(({ label: a, active: u, inherited: c }) => /* @__PURE__ */ g(
+          "button",
+          {
+            type: "button",
+            "data-sc-part": "placements-item",
+            "data-sc-active": u ? "true" : "false",
+            "data-sc-linked": c ? "true" : "false",
+            "aria-pressed": u,
+            onClick: () => s(a),
+            style: {
+              font: "inherit",
+              fontSize: "13px",
+              fontWeight: u ? 700 : 400,
+              color: "var(--sc-color-foreground, inherit)",
+              opacity: c ? 0.6 : 1,
+              background: "transparent",
+              border: "none",
+              borderRadius: "9999px",
+              padding: "2px 8px",
+              cursor: u ? "default" : "pointer",
+              textDecoration: u ? "underline" : "none",
+              textUnderlineOffset: "4px"
+            },
+            children: a
           },
-          children: i
-        },
-        i
-      ))
+          a
+        )),
+        /* @__PURE__ */ g(
+          "button",
+          {
+            type: "button",
+            "data-sc-part": "placements-link-toggle",
+            "data-sc-linked": i ? "true" : "false",
+            onClick: i ? o : l,
+            style: zt,
+            children: i ? (n == null ? void 0 : n.customizeSeparately) ?? "Customize separately" : (n == null ? void 0 : n.useOneDesign) ?? "Use one design for all"
+          }
+        )
+      ]
     }
   );
 }
-const Ut = 200, Ft = 400;
-function Vt() {
+const Gt = 200, Wt = 400;
+function Ht() {
   return Array.from({ length: 10 }, () => ({
     left: 2 + Math.random() * 96,
     top: 2 + Math.random() * 96,
@@ -772,10 +880,10 @@ function Vt() {
     size: 3 + Math.random() * 5
   }));
 }
-let Se = !1;
-function jt() {
-  if (!(Se || typeof CSS > "u" || typeof CSS.registerProperty != "function")) {
-    Se = !0;
+let _e = !1;
+function Jt() {
+  if (!(_e || typeof CSS > "u" || typeof CSS.registerProperty != "function")) {
+    _e = !0;
     try {
       CSS.registerProperty({ name: "--sc-prism-mount", syntax: "<number>", initialValue: "0", inherits: !0 });
     } catch {
@@ -786,89 +894,89 @@ function jt() {
     }
   }
 }
-const Ve = ot(function({
+const Ke = pt(function({
   visible: t = !0,
   onExited: n,
   variant: r = "dark"
 }) {
-  jt();
-  const [i, s] = T([]);
-  U(() => {
-    s(Vt());
+  Jt();
+  const [i, s] = D([]);
+  L(() => {
+    s(Ht());
   }, []);
-  const [o, l] = T(!1);
-  U(() => {
-    const h = requestAnimationFrame(() => l(!0));
-    return () => cancelAnimationFrame(h);
+  const [o, l] = D(!1);
+  L(() => {
+    const u = requestAnimationFrame(() => l(!0));
+    return () => cancelAnimationFrame(u);
   }, []);
-  const u = K(
-    (h) => {
-      h.propertyName === "background-color" && (t || n == null || n());
+  const d = G(
+    (u) => {
+      u.propertyName === "background-color" && (t || n == null || n());
     },
     [t, n]
   );
   let a = "";
-  return t ? o && (a = "sc-prism-fade-in") : a = "sc-prism-fade-out", /* @__PURE__ */ F(
+  return t ? o && (a = "sc-prism-fade-in") : a = "sc-prism-fade-out", /* @__PURE__ */ U(
     "div",
     {
       "data-sc-part": "preview-loading",
       className: ["sc-prism-overlay", r === "light" ? "sc-prism-on-light" : "", a].filter(Boolean).join(" "),
-      onTransitionEnd: u,
+      onTransitionEnd: d,
       "aria-hidden": "true",
       children: [
-        Array.from({ length: 6 }, (h, p) => /* @__PURE__ */ c("div", { className: "sc-prism-band" }, `b-${p}`)),
-        i.map((h, p) => /* @__PURE__ */ c(
+        Array.from({ length: 6 }, (u, c) => /* @__PURE__ */ g("div", { className: "sc-prism-band" }, `b-${c}`)),
+        i.map((u, c) => /* @__PURE__ */ g(
           "div",
           {
             className: "sc-prism-particle",
             style: {
-              left: `${h.left}%`,
-              top: `${h.top}%`,
-              animationDelay: `${h.delay}s`,
-              animationDuration: `${h.duration}s`,
-              width: `${h.size}px`,
-              height: `${h.size}px`
+              left: `${u.left}%`,
+              top: `${u.top}%`,
+              animationDelay: `${u.delay}s`,
+              animationDuration: `${u.duration}s`,
+              width: `${u.size}px`,
+              height: `${u.size}px`
             }
           },
-          `p-${p}`
+          `p-${c}`
         ))
       ]
     }
   );
 });
-function je(e) {
-  const [t, n] = T(!1), [r, i] = T(!1), s = O(null), o = O(null), l = O(!1);
-  l.current = t, U(() => (e ? (i(!1), o.current && clearTimeout(o.current), s.current = setTimeout(() => n(!0), Ut)) : (s.current && (clearTimeout(s.current), s.current = null), l.current && (i(!0), o.current = setTimeout(() => i(!1), Ft))), () => {
+function Ge(e) {
+  const [t, n] = D(!1), [r, i] = D(!1), s = C(null), o = C(null), l = C(!1);
+  l.current = t, L(() => (e ? (i(!1), o.current && clearTimeout(o.current), s.current = setTimeout(() => n(!0), Gt)) : (s.current && (clearTimeout(s.current), s.current = null), l.current && (i(!0), o.current = setTimeout(() => i(!1), Wt))), () => {
     s.current && clearTimeout(s.current), o.current && clearTimeout(o.current);
   }), [e]);
-  const u = K(() => n(!1), []);
+  const d = G(() => n(!1), []);
   return {
     showOverlay: t,
     overlayVisible: e || r,
-    handleExited: u
+    handleExited: d
   };
 }
-const Mt = 1.2, fe = [1200, 1400, 1600, 1800, 2e3, 2500, 3e3, 4e3];
-function qt(e) {
-  for (const t of fe)
+const Qt = 1.2, be = [1200, 1400, 1600, 1800, 2e3, 2500, 3e3, 4e3];
+function Yt(e) {
+  for (const t of be)
     if (t >= e) return t;
-  return fe[fe.length - 1];
+  return be[be.length - 1];
 }
-function Pt(e, t) {
-  if (!(e > 0) || !(t > 0) || t <= e * Mt) return null;
-  const n = qt(t);
+function Xt(e, t) {
+  if (!(e > 0) || !(t > 0) || t <= e * Qt) return null;
+  const n = Yt(t);
   return `[RealtimeMockup] mockup rendered at ${e}px but displayed at ~${t} device px — the preview will look soft. Pass \`product.width\` (e.g. ${n}) on the embed for a crisp preview.`;
 }
-function zt(e) {
+function Zt(e) {
   if (e === void 0 || e === !0 || e === "dark") return "dark";
-  if (e === "light" || e === "host-owned" || Oe(e)) return e;
-  throw new I(
+  if (e === "light" || e === "host-owned" || De(e)) return e;
+  throw new S(
     "E_PREVIEW_NO_LOADER",
     `Editor.Preview: invalid loadingOverlay value ${JSON.stringify(e)}. A mockup preview always has a render-in-flight treatment (the loader paints over the still-visible previous mockup). Omit the prop for the default rainbow overlay, pass "dark" | "light", pass a custom ReactElement, or declare "host-owned" if the host renders its own indicator off data-sc-preview-state / <Editor.LoadingOverlay>.`,
     { docSlug: "preview-loading-overlay" }
   );
 }
-function Me({
+function We({
   mockupId: e,
   fallback: t = null,
   alt: n = "Live product mockup",
@@ -876,73 +984,73 @@ function Me({
   className: i,
   style: s
 }) {
-  const { mockups: o, error: l, isRendering: u } = Q();
-  ne("Editor.Preview", { ...e !== void 0 ? { mockupId: e } : {} });
-  const a = zt(r), h = a === "dark" || a === "light" ? a : null, p = Oe(a) ? a : null, b = a !== "host-owned", { showOverlay: k, overlayVisible: d, handleExited: v } = je(
-    b && u
-  ), g = O(/* @__PURE__ */ new Set()), f = e ? o.find((E) => E.mockupId === e && E.imageUrl) : o.find((E) => E.imageUrl), S = (E) => {
-    var m;
-    if (!f || typeof P > "u" || ((m = P.env) == null ? void 0 : m.NODE_ENV) === "production" || typeof window > "u" || g.current.has(f.mockupId)) return;
-    const A = E.currentTarget, C = A.getBoundingClientRect().width;
-    if (C <= 0) return;
-    const D = Math.round(C * (window.devicePixelRatio || 1)), V = Pt(A.naturalWidth, D);
-    V && (g.current.add(f.mockupId), console.warn(V));
+  const { mockups: o, error: l, isRendering: d } = te();
+  oe("Editor.Preview", { ...e !== void 0 ? { mockupId: e } : {} });
+  const a = Zt(r), u = a === "dark" || a === "light" ? a : null, c = De(a) ? a : null, b = a !== "host-owned", { showOverlay: x, overlayVisible: m, handleExited: E } = Ge(
+    b && d
+  ), y = C(/* @__PURE__ */ new Set()), p = e ? o.find((v) => v.mockupId === e && v.imageUrl) : o.find((v) => v.imageUrl), O = (v) => {
+    var h;
+    if (!p || typeof z > "u" || ((h = z.env) == null ? void 0 : h.NODE_ENV) === "production" || typeof window > "u" || y.current.has(p.mockupId)) return;
+    const B = v.currentTarget, N = B.getBoundingClientRect().width;
+    if (N <= 0) return;
+    const _ = Math.round(N * (window.devicePixelRatio || 1)), F = Xt(B.naturalWidth, _);
+    F && (y.current.add(p.mockupId), console.warn(F));
   };
   if (b) {
-    const E = f != null && f.imageUrl ? u ? "rendering" : "ready" : l ? "error" : "rendering";
-    return /* @__PURE__ */ F(
+    const v = p != null && p.imageUrl ? d ? "rendering" : "ready" : l ? "error" : "rendering";
+    return /* @__PURE__ */ U(
       "div",
       {
         "data-sc-part": "preview",
-        "data-sc-preview-state": E,
-        "aria-busy": E === "rendering" || void 0,
+        "data-sc-preview-state": v,
+        "aria-busy": v === "rendering" || void 0,
         className: `sc-preview-frame${i ? ` ${i}` : ""}`,
         style: s,
         children: [
-          f != null && f.imageUrl ? (
+          p != null && p.imageUrl ? (
             // eslint-disable-next-line @next/next/no-img-element
-            /* @__PURE__ */ c("img", { "data-sc-part": "preview-image", src: f.imageUrl, alt: n, onLoad: S })
-          ) : l ? /* @__PURE__ */ c("div", { "data-sc-part": "preview-error", role: "alert", "data-sc-error": l, children: t ?? `Render failed: ${l}` }) : t,
-          p ? (
+            /* @__PURE__ */ g("img", { "data-sc-part": "preview-image", src: p.imageUrl, alt: n, onLoad: O })
+          ) : l ? /* @__PURE__ */ g("div", { "data-sc-part": "preview-error", role: "alert", "data-sc-error": l, children: t ?? `Render failed: ${l}` }) : t,
+          c ? (
             // Custom indicator: same show-delay + linger window; no exit fade
             // (the host owns its animation), so it unmounts when the window
             // closes.
-            k && d ? /* @__PURE__ */ c(
+            x && m ? /* @__PURE__ */ g(
               "div",
               {
                 "data-sc-part": "preview-loading",
                 className: "sc-preview-custom-loading",
                 "aria-hidden": "true",
-                children: p
+                children: c
               }
             ) : null
-          ) : k && h ? /* @__PURE__ */ c(
-            Ve,
+          ) : x && u ? /* @__PURE__ */ g(
+            Ke,
             {
-              visible: d,
-              variant: h,
-              onExited: v
+              visible: m,
+              variant: u,
+              onExited: E
             }
           ) : null
         ]
       }
     );
   }
-  return f != null && f.imageUrl ? (
+  return p != null && p.imageUrl ? (
     // eslint-disable-next-line @next/next/no-img-element
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ g(
       "img",
       {
         "data-sc-part": "preview",
-        "data-sc-preview-state": u ? "rendering" : "ready",
-        src: f.imageUrl,
+        "data-sc-preview-state": d ? "rendering" : "ready",
+        src: p.imageUrl,
         alt: n,
         className: i,
         style: s,
-        onLoad: S
+        onLoad: O
       }
     )
-  ) : l ? /* @__PURE__ */ c(
+  ) : l ? /* @__PURE__ */ g(
     "div",
     {
       "data-sc-part": "preview-error",
@@ -953,45 +1061,45 @@ function Me({
       style: s,
       children: t ?? `Render failed: ${l}`
     }
-  ) : /* @__PURE__ */ c("div", { "data-sc-part": "preview", "data-sc-preview-state": "rendering", "aria-busy": "true", style: { display: "contents" }, children: t });
+  ) : /* @__PURE__ */ g("div", { "data-sc-part": "preview", "data-sc-preview-state": "rendering", "aria-busy": "true", style: { display: "contents" }, children: t });
 }
-function Kt(e) {
-  const { layer: t, optional: n = !1, placeholder: r, className: i, style: s } = e, o = te("Editor.TextField");
-  ne("Editor.TextField");
-  const { pushRender: l, throttleMs: u, stateStore: a } = Q(), h = ge(), p = O(null);
-  if (!pt(t))
-    throw new I(
+function en(e) {
+  const { layer: t, optional: n = !1, placeholder: r, className: i, style: s } = e, o = se("Editor.TextField");
+  oe("Editor.TextField");
+  const { pushRender: l, throttleMs: d, stateStore: a } = te(), u = we(), c = C(null);
+  if (!wt(t))
+    throw new S(
       "E_LAYER_TOKEN_REQUIRED",
       `the \`layer\` prop must be a token minted by the design — pass layer={design.layer("name")}, not ${typeof t == "string" ? `the bare string "${t}"` : "a plain value"}. Tokens validate the name against the design's layers at mint time.`,
       { received: typeof t == "string" ? t : typeof t, docSlug: "embed-mode" }
     );
-  if (p.current !== t.name) {
-    const d = a.layerKindOf(t.name);
-    if (d === void 0)
-      throw new I(
+  if (c.current !== t.name) {
+    const m = a.layerKindOf(t.name);
+    if (m === void 0)
+      throw new S(
         "E_LAYER_NOT_FOUND",
         `no layer "${t.name}" in this Root's design — the token was minted from a different design than the one passed to <Editor.Root design={…}>. Bindable layers here: ${JSON.stringify(a.bindableLayerNames())}.`,
         { layerName: t.name, validNames: a.bindableLayerNames(), docSlug: "embed-mode" }
       );
-    if (d !== "text")
-      throw new I(
+    if (m !== "text")
+      throw new S(
         "E_LAYER_WRONG_KIND",
-        `layer "${t.name}" is ${d === null ? "not a bindable kind" : `an ${d} layer`} — <Editor.TextField> binds text layers only.`,
-        { layerName: t.name, actualKind: d, docSlug: "embed-mode" }
+        `layer "${t.name}" is ${m === null ? "not a bindable kind" : `an ${m} layer`} — <Editor.TextField> binds text layers only.`,
+        { layerName: t.name, actualKind: m, docSlug: "embed-mode" }
       );
-    p.current = t.name;
+    c.current = t.name;
   }
-  re(() => o.registry.registerTextField(h, { name: t.name, optional: n }), [o.registry, h, t.name, n]);
+  ae(() => o.registry.registerTextField(u, { name: t.name, optional: n }), [o.registry, u, t.name, n]);
   const b = J(
     a.subscribe,
     () => a.textOf(t.name) ?? "",
     () => a.textOf(t.name) ?? ""
-  ), k = K(
-    (d) => {
-      const v = d.target.value, g = o.registry.getCanvasBridge();
-      if (g) {
-        g.setTextByName(t.name, v) || o.reportInvariant(
-          new I(
+  ), x = G(
+    (m) => {
+      const E = m.target.value, y = o.registry.getCanvasBridge();
+      if (y) {
+        y.setTextByName(t.name, E) || o.reportInvariant(
+          new S(
             "E_LAYER_NOT_FOUND",
             `layer "${t.name}" no longer exists in the mounted canvas — it was removed or renamed after this <Editor.TextField> bound to it. Bound layers must not be renamed or deleted while a field is mounted (ADR-0085 §3).`,
             { layerName: t.name, docSlug: "embed-mode" }
@@ -999,18 +1107,18 @@ function Kt(e) {
         );
         return;
       }
-      a.updateTextLayer(t.name, v), l(de(a.getState()), u);
+      a.updateTextLayer(t.name, E), l(ee(a.getState()), d);
     },
-    [o, t.name, a, l, u]
+    [o, t.name, a, l, d]
   );
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ g(
     "input",
     {
       "data-sc-part": "textfield",
       "data-sc-layer": t.name,
       type: "text",
       value: b,
-      onChange: k,
+      onChange: x,
       placeholder: r,
       "aria-label": e["aria-label"] ?? t.name,
       className: i,
@@ -1018,7 +1126,7 @@ function Kt(e) {
     }
   );
 }
-function Gt(e) {
+function tn(e) {
   const t = [];
   for (const n of e.missingOptionKeys)
     t.push(`option:${n}`);
@@ -1035,13 +1143,13 @@ function Gt(e) {
   }
   return e.hasRenderableElement || t.push("empty-design"), (!Number.isInteger(e.quantity) || e.quantity < 1) && t.push("quantity"), t;
 }
-function Wt(e, t) {
+function nn(e, t) {
   const n = t.getCombinations(), r = t.getAttributes();
   if (Object.keys(r).length === 0 || n.length === 0) return null;
   const i = Object.fromEntries(
-    Object.entries(r).map(([s, o]) => [s, { ...o, choices: bt(o) }])
+    Object.entries(r).map(([s, o]) => [s, { ...o, choices: Rt(o) }])
   );
-  return lt({
+  return gt({
     productId: e.productId,
     quantity: t.getQuantity(),
     selection: t.getSelection(),
@@ -1049,97 +1157,103 @@ function Wt(e, t) {
     attributes: i
   });
 }
-function Ht(e) {
-  const { onAddToCart: t, defaultQuantity: n, children: r, className: i, style: s } = e, o = te("Editor.Buy");
-  ne("Editor.Buy");
-  const { product: l, stateStore: u } = Q(), a = o.commerce;
+function rn(e) {
+  const { onAddToCart: t, defaultQuantity: n, children: r, className: i, style: s } = e, o = se("Editor.Buy");
+  oe("Editor.Buy");
+  const { product: l, stateStore: d } = te(), a = o.commerce;
   if (!(l != null && l.productId))
-    throw new I(
+    throw new S(
       "E_BUY_NO_PRODUCT",
       "<Editor.Buy> has no product context — pass `product` (with `productId`) on <Editor.Root product={…}>. Buy assembles its cart payload from the Root product and the live design state.",
       { docSlug: "embed-mode" }
     );
-  const h = O(!1);
-  re(() => {
-    h.current || (h.current = !0, typeof n == "number" && a.setQuantity(n));
+  const u = C(!1);
+  ae(() => {
+    u.current || (u.current = !0, typeof n == "number" && a.setQuantity(n));
   }, [a]);
-  const p = J(u.subscribe, u.getState, u.getState), b = J(a.subscribe, a.getVersion, a.getVersion), k = J(
+  const c = J(d.subscribe, d.getState, d.getState), b = J(a.subscribe, a.getVersion, a.getVersion), x = J(
     o.registry.subscribe,
     o.registry.getVersion,
     o.registry.getVersion
-  ), d = a.getQuantity(), v = L(
-    () => Gt({
-      quantity: d,
+  ), m = a.getQuantity(), E = A(
+    () => tn({
+      quantity: m,
       missingOptionKeys: a.missingOptionKeys(),
       selectionValid: a.selectionValid(),
       textFields: o.registry.getTextFields(),
-      textOf: (C) => u.textOf(C),
-      seedTextOf: (C) => u.seedTextOf(C),
-      hasRenderableElement: u.hasRenderableElement()
+      textOf: (N) => d.textOf(N),
+      seedTextOf: (N) => d.seedTextOf(N),
+      hasRenderableElement: d.hasRenderableElement()
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [a, d, p, b, k]
-  ), g = v.length === 0, [f, S] = T(!1), E = O(!1), A = K(() => {
-    if (E.current || !g) return;
-    E.current = !0, S(!0);
-    const C = u.getState(), D = a.resolvedVariantId(), V = {
+    [a, m, c, b, x]
+  ), y = E.length === 0, [p, O] = D(!1), v = C(!1), B = G(() => {
+    if (v.current || !y) return;
+    v.current = !0, O(!0);
+    const N = d.getState(), _ = a.resolvedVariantId(), F = {
       productId: l.productId,
-      ...D ? { variantId: D } : {},
+      ..._ ? { variantId: _ } : {},
       quantity: a.getQuantity(),
       selection: a.getSelection(),
-      cartDetail: Wt(l, a),
-      designState: C,
-      serverRequest: de(C)
+      cartDetail: nn(l, a),
+      designState: N,
+      // ADR-0101: one artboard per REQUIRED placement — linked placements
+      // carry the base relabelled — so buy and preview are the same bytes
+      // and the order pipeline never re-derives the link rule.
+      serverRequest: Ve(
+        ee(N),
+        pe(l)
+      )
     };
-    let m;
+    let h;
     try {
-      m = t(V);
-    } catch (R) {
-      throw E.current = !1, S(!1), R;
+      h = t(F);
+    } catch ($) {
+      throw v.current = !1, O(!1), $;
     }
-    Promise.resolve(m).finally(() => {
-      E.current = !1, S(!1);
+    Promise.resolve(h).finally(() => {
+      v.current = !1, O(!1);
     });
-  }, [g, l, a, u, t]);
-  return /* @__PURE__ */ c(
+  }, [y, l, a, d, t]);
+  return /* @__PURE__ */ g(
     "button",
     {
       type: "button",
       "data-sc-part": "buy",
-      "data-sc-buy-state": f ? "busy" : g ? "ready" : "incomplete",
-      "data-sc-buy-missing": v.join(",") || void 0,
-      disabled: !g || f,
-      "aria-busy": f || void 0,
-      onClick: A,
+      "data-sc-buy-state": p ? "busy" : y ? "ready" : "incomplete",
+      "data-sc-buy-missing": E.join(",") || void 0,
+      disabled: !y || p,
+      "aria-busy": p || void 0,
+      onClick: B,
       className: i,
       style: s,
       children: r ?? "Add to cart"
     }
   );
 }
-function Jt({
+function sn({
   placement: e = "docked",
   className: t,
   style: n
 }) {
-  const r = te("Editor.Controls");
-  Je("Editor.Controls"), ne("Editor.Controls");
-  const i = ge();
-  re(
+  const r = se("Editor.Controls");
+  nt("Editor.Controls"), oe("Editor.Controls");
+  const i = we();
+  ae(
     () => r.registry.registerControls(i, e),
     [r.registry, i, e]
   );
-  const s = e === "docked", [o, l] = T(null);
-  return U(() => {
+  const s = e === "docked", [o, l] = D(null);
+  return L(() => {
     if (!s) return;
-    let u = !1;
-    return import("./ContextualToolbars-CG5Gmv_i.js").then((a) => a.s).then(
+    let d = !1;
+    return import("./ContextualToolbars-C62As-xY.js").then((a) => a.s).then(
       (a) => {
-        u || l(() => a.ContextualToolbars);
+        d || l(() => a.ContextualToolbars);
       },
       (a) => {
-        u || r.reportRuntimeError(
-          new I(
+        d || r.reportRuntimeError(
+          new S(
             "E_CHUNK_LOAD_FAILED",
             `the editor's controls chunk failed to load (${a instanceof Error ? a.message : String(a)}). This is a network/CDN failure, not a composition mistake — retry, or check the deployment serves the @snowcone-app/canvas lazy chunks.`,
             { cause: a instanceof Error ? a.message : String(a), docSlug: "embed-mode" }
@@ -1147,9 +1261,9 @@ function Jt({
         );
       }
     ), () => {
-      u = !0;
+      d = !0;
     };
-  }, [s, r]), s ? /* @__PURE__ */ c(
+  }, [s, r]), s ? /* @__PURE__ */ g(
     "div",
     {
       "data-sc-part": "controls",
@@ -1157,30 +1271,30 @@ function Jt({
       className: t,
       style: n,
       "aria-busy": o ? void 0 : "true",
-      children: o ? /* @__PURE__ */ c(o, { mode: "embedded" }) : null
+      children: o ? /* @__PURE__ */ g(o, { mode: "embedded" }) : null
     }
   ) : null;
 }
-function Qt({
+function on({
   variant: e = "dark",
   className: t,
   style: n
 }) {
-  const { isRendering: r } = Q(), { showOverlay: i, overlayVisible: s, handleExited: o } = je(r);
-  return i ? /* @__PURE__ */ c(
+  const { isRendering: r } = te(), { showOverlay: i, overlayVisible: s, handleExited: o } = Ge(r);
+  return i ? /* @__PURE__ */ g(
     "div",
     {
       "data-sc-part": "loading-overlay",
       className: `sc-loading-overlay-host${t ? ` ${t}` : ""}`,
       style: n,
       "aria-hidden": "true",
-      children: /* @__PURE__ */ c(Ve, { visible: s, variant: e, onExited: o })
+      children: /* @__PURE__ */ g(Ke, { visible: s, variant: e, onExited: o })
     }
   ) : null;
 }
-function Yt() {
-  const t = te("useProductSelection").commerce, n = J(t.subscribe, t.getVersion, t.getVersion), r = K((s, o) => t.select(s, o), [t]), i = K((s) => t.setQuantity(s), [t]);
-  return L(
+function an() {
+  const t = se("useProductSelection").commerce, n = J(t.subscribe, t.getVersion, t.getVersion), r = G((s, o) => t.select(s, o), [t]), i = G((s) => t.setQuantity(s), [t]);
+  return A(
     () => ({
       attributes: t.getAttributes(),
       selection: t.getSelection(),
@@ -1197,53 +1311,53 @@ function Yt() {
     [t, r, i, n]
   );
 }
-const W = {
+const H = {
   /** The one provider boundary — session, design, live state, error boundary. */
-  Root: Ue,
+  Root: qe,
   /** The editable artboard (the ONE lazy renderer boundary — D9). */
-  Canvas: Dt,
+  Canvas: jt,
   /** Live product mockup. ×N under one Root is valid. */
-  Preview: Me,
+  Preview: We,
   /** Placement switcher tabs (ADR-0088). Renders nothing for a
    *  single-placement design; headless floor = usePlacements(). */
-  Placements: Lt,
+  Placements: Kt,
   /** Form input bound to a design text layer by typed token (T1). */
-  TextField: Kt,
+  TextField: en,
   /** Smart commerce part: completeness + payload assembly; submit = host callback. */
-  Buy: Ht,
+  Buy: rn,
   /** Layer list. The one editor part that works canvas-free (ADR-0085 §4). */
-  Layers: Ze,
+  Layers: ot,
   /** Morphing contextual zone — ONE coarse part; placement docked|floating (§5). */
-  Controls: Jt,
+  Controls: sn,
   /** Undo/redo controls. Requires Editor.Canvas. */
-  History: Xe,
+  History: st,
   /** The one ⋯ overflow menu. Requires Editor.Canvas. */
-  Menu: Ye,
+  Menu: it,
   /** The ⊕ add-element menu. Requires Editor.Canvas. */
-  Add: Qe,
+  Add: rt,
   /** Standalone render-in-flight rainbow for host-owned preview surfaces.
    *  Fills its positioned parent; rides the session (canvas-free). */
-  LoadingOverlay: Qt
+  LoadingOverlay: on
 };
-function vn(e) {
-  return /* @__PURE__ */ c(Ue, { ...e, __validation: "warn" });
+function Cn(e) {
+  return /* @__PURE__ */ g(qe, { ...e, __validation: "warn" });
 }
-const wn = $e(
+const Nn = Ae(
   function(t, n) {
-    const { children: r, className: i, style: s, maxHeight: o, ...l } = t, [u, a] = T(null);
-    return U(() => {
-      let h = !1;
-      return Fe().then(
-        (p) => {
-          h || a(() => p);
+    const { children: r, className: i, style: s, maxHeight: o, ...l } = t, [d, a] = D(null);
+    return L(() => {
+      let u = !1;
+      return ze().then(
+        (c) => {
+          u || a(() => c);
         },
-        (p) => {
-          console.error("[RealtimeCanvas] failed to load the rendering chunk:", p);
+        (c) => {
+          console.error("[RealtimeCanvas] failed to load the rendering chunk:", c);
         }
       ), () => {
-        h = !0;
+        u = !0;
       };
-    }, []), u ? /* @__PURE__ */ c(u, { ref: n, selfScope: !0, maxHeight: o, className: i, style: s, ...l, children: r }) : /* @__PURE__ */ c(
+    }, []), d ? /* @__PURE__ */ g(d, { ref: n, selfScope: !0, maxHeight: o, className: i, style: s, ...l, children: r }) : /* @__PURE__ */ g(
       "div",
       {
         className: `sc-root${i ? ` ${i}` : ""}`,
@@ -1253,52 +1367,52 @@ const wn = $e(
     );
   }
 );
-function En(e) {
-  return /* @__PURE__ */ c(Me, { ...e });
+function _n(e) {
+  return /* @__PURE__ */ g(We, { ...e });
 }
-function kn() {
-  const { mockups: e, isRendering: t, error: n } = Q();
+function Tn() {
+  const { mockups: e, isRendering: t, error: n } = te();
   return { mockups: e, isRendering: t, error: n };
 }
-function Xt(e) {
+function dn(e) {
   return e.type !== "color" && typeof e.width == "number" && e.width > 0 && typeof e.height == "number" && e.height > 0;
 }
-function Rn(e, t = {}) {
-  var b, k, d, v, g;
-  if (_e(e))
-    throw new I(
+function An(e, t = {}) {
+  var b, x, m, E, y;
+  if (Ue(e))
+    throw new S(
       "E_BUNDLE_CONFIG_REQUIRED",
-      `product ${e.id} is a bundle (roles: [${e.bundle.members.map((f) => f.role).join(", ")}]) — it has per-role variants and role-scoped placement keys, which the single-product config cannot describe. Use bundleToRenderConfig(product, { picks?, variants?, placement?, width? }) instead.`,
+      `product ${e.id} is a bundle (roles: [${e.bundle.members.map((p) => p.role).join(", ")}]) — it has per-role variants and role-scoped placement keys, which the single-product config cannot describe. Use bundleToRenderConfig(product, { picks?, variants?, placement?, width? }) instead.`,
       {
         productId: e.id,
-        validNames: e.bundle.members.map((f) => f.role),
+        validNames: e.bundle.members.map((p) => p.role),
         docSlug: "bundles"
       }
     );
-  const n = (e.placements ?? []).filter(Xt), r = n.map((f) => f.label), i = t.placement ? n.find((f) => f.label === t.placement) : n[0];
+  const n = (e.placements ?? []).filter(dn), r = n.map((p) => p.label), i = t.placement ? n.find((p) => p.label === t.placement) : n[0];
   if (!i)
-    throw t.placement ? new I(
+    throw t.placement ? new S(
       "E_PRODUCT_NOT_RENDERABLE",
       `product ${e.id} has no renderable placement "${t.placement}". Renderable image placements: [${r.join(", ")}].`,
       { productId: e.id, requested: t.placement, validNames: r, docSlug: "embed-mode" }
-    ) : new I(
+    ) : new S(
       "E_PRODUCT_NOT_RENDERABLE",
       `product ${e.id} has no renderable image placement (a non-color placement with width/height). The catalog payload may be incomplete — fetch it via getProduct(), not a search hit.`,
       { productId: e.id, docSlug: "embed-mode" }
     );
   const s = ((b = e.options) == null ? void 0 : b.attributes) ?? {}, l = Object.values(s).some(
-    (f) => {
-      var S;
-      return (S = f == null ? void 0 : f.choices) == null ? void 0 : S.some((E) => E == null ? void 0 : E.hex);
+    (p) => {
+      var O;
+      return (O = p == null ? void 0 : p.choices) == null ? void 0 : O.some((v) => v == null ? void 0 : v.hex);
     }
-  ) ? (v = (d = (k = e.options) == null ? void 0 : k.combinations) == null ? void 0 : d.find(
-    (f) => typeof f.variantId == "string" && f.variantId !== ""
-  )) == null ? void 0 : v.variantId : void 0, u = e.mockups ?? [], a = l ? u.filter((f) => {
-    var S;
-    return (S = f.gvids) == null ? void 0 : S.includes(l);
-  }) : u, h = (a.length > 0 ? a : u).map((f) => f.id);
-  if (h.length === 0)
-    throw new I(
+  ) ? (E = (m = (x = e.options) == null ? void 0 : x.combinations) == null ? void 0 : m.find(
+    (p) => typeof p.variantId == "string" && p.variantId !== ""
+  )) == null ? void 0 : E.variantId : void 0, d = e.mockups ?? [], a = l ? d.filter((p) => {
+    var O;
+    return (O = p.gvids) == null ? void 0 : O.includes(l);
+  }) : d, u = (a.length > 0 ? a : d).map((p) => p.id);
+  if (u.length === 0)
+    throw new S(
       "E_PRODUCT_NOT_RENDERABLE",
       `product ${e.id} has no mockup scenes — nothing to render a preview into.`,
       { productId: e.id, docSlug: "embed-mode" }
@@ -1306,11 +1420,11 @@ function Rn(e, t = {}) {
   return {
     product: {
       productId: e.id,
-      mockupIds: h,
+      mockupIds: u,
       ...typeof l == "string" ? { variantId: l } : {},
       options: e.options,
-      placements: (g = e.placements) == null ? void 0 : g.map((f) => f.label),
-      mockups: u,
+      placements: (y = e.placements) == null ? void 0 : y.map((p) => p.label),
+      mockups: d,
       requiredPlacements: e.requiredPlacements,
       ...e.defaultGvid ? { defaultGvid: e.defaultGvid } : {},
       ...typeof t.width == "number" ? { width: t.width } : {}
@@ -1322,17 +1436,17 @@ function Rn(e, t = {}) {
       aspectRatio: i.width / i.height
     },
     placementLabels: r,
-    placements: n.map((f) => ({
-      label: f.label,
-      width: f.width,
-      height: f.height,
-      aspectRatio: f.width / f.height
+    placements: n.map((p) => ({
+      label: p.label,
+      width: p.width,
+      height: p.height,
+      aspectRatio: p.width / p.height
     })),
-    primaryMockupId: h[0],
+    primaryMockupId: u[0],
     variantId: l
   };
 }
-function Zt(e) {
+function ln(e) {
   return new Intl.NumberFormat("en-US", {
     style: "currency",
     currency: "USD",
@@ -1340,7 +1454,7 @@ function Zt(e) {
     maximumFractionDigits: e % 100 === 0 ? 0 : 2
   }).format(e / 100);
 }
-const en = {
+const cn = {
   display: "inline-flex",
   alignItems: "center",
   justifyContent: "center",
@@ -1355,7 +1469,7 @@ const en = {
   fontSize: 16,
   lineHeight: 1,
   cursor: "pointer"
-}, tn = {
+}, un = {
   display: "flex",
   alignItems: "center",
   gap: 10,
@@ -1371,23 +1485,23 @@ const en = {
   textAlign: "left",
   cursor: "pointer"
 };
-function he({
+function ve({
   label: e,
   onSelect: t
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ g(
     "button",
     {
       type: "button",
       role: "menuitem",
       "data-sc-part": "snowcone-editor-menu-item",
-      style: tn,
+      style: un,
       onClick: t,
       children: e
     }
   );
 }
-function nn({
+function mn({
   fullscreen: e,
   onToggleFullscreen: t,
   viewCount: n,
@@ -1395,9 +1509,9 @@ function nn({
   onSelectView: i,
   onExport: s
 }) {
-  const [o, l] = T(!1), u = () => l(!1);
-  return /* @__PURE__ */ F("div", { style: { position: "relative" }, children: [
-    /* @__PURE__ */ c(
+  const [o, l] = D(!1), d = () => l(!1);
+  return /* @__PURE__ */ U("div", { style: { position: "relative" }, children: [
+    /* @__PURE__ */ g(
       "button",
       {
         type: "button",
@@ -1405,21 +1519,21 @@ function nn({
         "aria-haspopup": "menu",
         "aria-expanded": o,
         "data-sc-part": "snowcone-editor-menu",
-        style: en,
+        style: cn,
         onClick: () => l((a) => !a),
         children: "⋮"
       }
     ),
-    o ? /* @__PURE__ */ F(nt, { children: [
-      /* @__PURE__ */ c(
+    o ? /* @__PURE__ */ U(lt, { children: [
+      /* @__PURE__ */ g(
         "div",
         {
           style: { position: "fixed", inset: 0, zIndex: 39 },
-          onClick: u,
+          onClick: d,
           "aria-hidden": "true"
         }
       ),
-      /* @__PURE__ */ F(
+      /* @__PURE__ */ U(
         "div",
         {
           role: "menu",
@@ -1438,31 +1552,31 @@ function nn({
             zIndex: 40
           },
           children: [
-            /* @__PURE__ */ c(
-              he,
+            /* @__PURE__ */ g(
+              ve,
               {
                 label: e ? "Exit fullscreen" : "Fullscreen",
                 onSelect: () => {
-                  u(), t();
+                  d(), t();
                 }
               }
             ),
-            n > 1 ? Array.from({ length: n }, (a, h) => /* @__PURE__ */ c(
-              he,
+            n > 1 ? Array.from({ length: n }, (a, u) => /* @__PURE__ */ g(
+              ve,
               {
-                label: `View ${h + 1}${h === r ? " ✓" : ""}`,
+                label: `View ${u + 1}${u === r ? " ✓" : ""}`,
                 onSelect: () => {
-                  u(), i(h);
+                  d(), i(u);
                 }
               },
-              h
+              u
             )) : null,
-            /* @__PURE__ */ c(
-              he,
+            /* @__PURE__ */ g(
+              ve,
               {
                 label: "Export PNG",
                 onSelect: () => {
-                  u(), s();
+                  d(), s();
                 }
               }
             )
@@ -1472,19 +1586,19 @@ function nn({
     ] }) : null
   ] });
 }
-function rn() {
-  const { flatLayers: e, selectLayer: t, generateAllPreviews: n } = et({ previewSize: 96 });
-  return U(() => {
+function pn() {
+  const { flatLayers: e, selectLayer: t, generateAllPreviews: n } = at({ previewSize: 96 });
+  return L(() => {
     e.length > 0 && n();
-  }, [e.length, n]), /* @__PURE__ */ F(
+  }, [e.length, n]), /* @__PURE__ */ U(
     "div",
     {
       "data-sc-part": "snowcone-editor-idle-dock",
       style: { display: "flex", alignItems: "center", justifyContent: "center", gap: 8, minHeight: 44 },
       children: [
-        /* @__PURE__ */ c(W.Add, {}),
-        e.length > 0 ? /* @__PURE__ */ c("div", { style: { width: 1, height: 28, background: "rgba(0,0,0,0.1)", flexShrink: 0 }, "aria-hidden": "true" }) : null,
-        e.map((r) => /* @__PURE__ */ c(
+        /* @__PURE__ */ g(H.Add, {}),
+        e.length > 0 ? /* @__PURE__ */ g("div", { style: { width: 1, height: 28, background: "rgba(0,0,0,0.1)", flexShrink: 0 }, "aria-hidden": "true" }) : null,
+        e.map((r) => /* @__PURE__ */ g(
           "button",
           {
             type: "button",
@@ -1507,8 +1621,8 @@ function rn() {
             },
             children: r.previewUrl ? (
               // eslint-disable-next-line @next/next/no-img-element
-              /* @__PURE__ */ c("img", { src: r.previewUrl, alt: "", style: { width: "100%", height: "100%", objectFit: "contain" } })
-            ) : /* @__PURE__ */ c(
+              /* @__PURE__ */ g("img", { src: r.previewUrl, alt: "", style: { width: "100%", height: "100%", objectFit: "contain" } })
+            ) : /* @__PURE__ */ g(
               "span",
               {
                 style: {
@@ -1529,13 +1643,13 @@ function rn() {
     }
   );
 }
-function sn({
+function fn({
   onAddToCart: e,
   defaultQuantity: t
 }) {
-  const { price: n, complete: r } = Yt();
-  return /* @__PURE__ */ F(
-    W.Buy,
+  const { price: n, complete: r } = an();
+  return /* @__PURE__ */ U(
+    H.Buy,
     {
       onAddToCart: e,
       ...typeof t == "number" ? { defaultQuantity: t } : {},
@@ -1558,12 +1672,12 @@ function sn({
       },
       children: [
         "Add to cart",
-        typeof n == "number" ? ` · ${Zt(n)}` : ""
+        typeof n == "number" ? ` · ${ln(n)}` : ""
       ]
     }
   );
 }
-function on({
+function hn({
   title: e,
   height: t,
   mockupIds: n,
@@ -1572,15 +1686,15 @@ function on({
   className: s,
   style: o
 }) {
-  const [l, u] = T(!1), [a, h] = T(0), [p, b] = T(!1), k = O(null), d = vt(), v = n[Math.min(a, n.length - 1)], g = K(async () => {
-    var V;
-    const E = await ((V = k.current) == null ? void 0 : V.exportArtboards({ format: "dataUrl" }));
-    if (!E) return;
-    const [A, C] = Object.entries(E)[0] ?? [];
-    if (typeof C != "string") return;
-    const D = document.createElement("a");
-    D.href = C, D.download = `${A ?? "design"}.png`, D.click();
-  }, []), f = {
+  const [l, d] = D(!1), [a, u] = D(0), [c, b] = D(!1), x = C(null), m = It(), E = n[Math.min(a, n.length - 1)], y = G(async () => {
+    var F;
+    const v = await ((F = x.current) == null ? void 0 : F.exportArtboards({ format: "dataUrl" }));
+    if (!v) return;
+    const [B, N] = Object.entries(v)[0] ?? [];
+    if (typeof N != "string") return;
+    const _ = document.createElement("a");
+    _.href = N, _.download = `${B ?? "design"}.png`, _.click();
+  }, []), p = {
     display: "flex",
     flexDirection: "column",
     overflow: "hidden",
@@ -1601,7 +1715,7 @@ function on({
       boxShadow: "0 1px 3px rgba(0,0,0,0.08)"
     },
     ...o
-  }, S = {
+  }, O = {
     position: "absolute",
     top: 8,
     right: 12,
@@ -1616,15 +1730,15 @@ function on({
     cursor: "pointer",
     zIndex: 2
   };
-  return /* @__PURE__ */ F(
+  return /* @__PURE__ */ U(
     "div",
     {
       "data-sc-part": "snowcone-editor",
       "data-sc-fullscreen": l ? "true" : void 0,
       className: s,
-      style: f,
+      style: p,
       children: [
-        /* @__PURE__ */ F(
+        /* @__PURE__ */ U(
           "div",
           {
             "data-sc-part": "snowcone-editor-header",
@@ -1636,35 +1750,35 @@ function on({
               flexShrink: 0
             },
             children: [
-              /* @__PURE__ */ c("span", { style: { fontSize: 14, fontWeight: 700, marginRight: "auto" }, children: e }),
-              /* @__PURE__ */ c(W.History, {}),
-              /* @__PURE__ */ c(
-                nn,
+              /* @__PURE__ */ g("span", { style: { fontSize: 14, fontWeight: 700, marginRight: "auto" }, children: e }),
+              /* @__PURE__ */ g(H.History, {}),
+              /* @__PURE__ */ g(
+                mn,
                 {
                   fullscreen: l,
-                  onToggleFullscreen: () => u((E) => !E),
+                  onToggleFullscreen: () => d((v) => !v),
                   viewCount: n.length,
                   viewIndex: a,
-                  onSelectView: h,
-                  onExport: () => void g()
+                  onSelectView: u,
+                  onExport: () => void y()
                 }
               ),
-              /* @__PURE__ */ c(sn, { onAddToCart: r, defaultQuantity: i })
+              /* @__PURE__ */ g(fn, { onAddToCart: r, defaultQuantity: i })
             ]
           }
         ),
-        /* @__PURE__ */ F(
+        /* @__PURE__ */ U(
           "div",
           {
             "data-sc-part": "snowcone-editor-stage",
             style: { position: "relative", flex: 1, minHeight: 0, padding: "4px 12px" },
             children: [
-              /* @__PURE__ */ c(W.Canvas, { ref: k, style: { height: "100%" } }),
-              p ? (
+              /* @__PURE__ */ g(H.Canvas, { ref: x, style: { height: "100%" } }),
+              c ? (
                 // Swapped: the mockup IS the stage; the corner chip returns to the
                 // artwork. The canvas stays mounted underneath (no document
                 // teardown), just covered.
-                /* @__PURE__ */ F(
+                /* @__PURE__ */ U(
                   "div",
                   {
                     "data-sc-part": "snowcone-editor-swap-stage",
@@ -1679,17 +1793,17 @@ function on({
                       padding: 8
                     },
                     children: [
-                      /* @__PURE__ */ c(
-                        W.Preview,
+                      /* @__PURE__ */ g(
+                        H.Preview,
                         {
-                          mockupId: v,
+                          mockupId: E,
                           alt: "Product mockup",
                           loadingOverlay: !0,
-                          fallback: /* @__PURE__ */ c("div", { "aria-busy": "true", children: "Rendering…" }),
+                          fallback: /* @__PURE__ */ g("div", { "aria-busy": "true", children: "Rendering…" }),
                           style: { maxWidth: "100%", maxHeight: "100%", borderRadius: 12 }
                         }
                       ),
-                      /* @__PURE__ */ c(
+                      /* @__PURE__ */ g(
                         "button",
                         {
                           type: "button",
@@ -1697,7 +1811,7 @@ function on({
                           "data-sc-part": "snowcone-editor-swap-back",
                           onClick: () => b(!1),
                           style: {
-                            ...S,
+                            ...O,
                             display: "flex",
                             alignItems: "center",
                             justifyContent: "center",
@@ -1712,21 +1826,21 @@ function on({
                     ]
                   }
                 )
-              ) : /* @__PURE__ */ c(
+              ) : /* @__PURE__ */ g(
                 "button",
                 {
                   type: "button",
                   "aria-label": "Show product mockup",
                   "data-sc-part": "snowcone-editor-pip",
                   onClick: () => b(!0),
-                  style: S,
-                  children: /* @__PURE__ */ c(
-                    W.Preview,
+                  style: O,
+                  children: /* @__PURE__ */ g(
+                    H.Preview,
                     {
-                      mockupId: v,
+                      mockupId: E,
                       alt: "Product mockup preview",
                       loadingOverlay: !0,
-                      fallback: /* @__PURE__ */ c("span", { style: { fontSize: 10, opacity: 0.5 }, "aria-busy": "true", children: "mockup…" }),
+                      fallback: /* @__PURE__ */ g("span", { style: { fontSize: 10, opacity: 0.5 }, "aria-busy": "true", children: "mockup…" }),
                       style: { width: "100%", height: "100%", display: "block" }
                     }
                   )
@@ -1735,15 +1849,15 @@ function on({
             ]
           }
         ),
-        /* @__PURE__ */ F(
+        /* @__PURE__ */ U(
           "div",
           {
             "data-sc-part": "snowcone-editor-zone",
-            "data-sc-zone-state": d ? "selected" : "idle",
+            "data-sc-zone-state": m ? "selected" : "idle",
             style: { flexShrink: 0, padding: "4px 16px 14px" },
             children: [
-              /* @__PURE__ */ c("div", { style: { display: d ? void 0 : "none" }, children: /* @__PURE__ */ c(W.Controls, { placement: "docked" }) }),
-              d ? null : /* @__PURE__ */ c(rn, {})
+              /* @__PURE__ */ g("div", { style: { display: m ? void 0 : "none" }, children: /* @__PURE__ */ g(H.Controls, { placement: "docked" }) }),
+              m ? null : /* @__PURE__ */ g(pn, {})
             ]
           }
         )
@@ -1751,7 +1865,7 @@ function on({
     }
   );
 }
-function xn(e) {
+function Dn(e) {
   const {
     onAddToCart: t,
     defaultQuantity: n,
@@ -1761,8 +1875,8 @@ function xn(e) {
     style: o,
     ...l
   } = e;
-  return /* @__PURE__ */ c(W.Root, { ...l, children: /* @__PURE__ */ c(
-    on,
+  return /* @__PURE__ */ g(H.Root, { ...l, children: /* @__PURE__ */ g(
+    hn,
     {
       title: r,
       height: i,
@@ -1774,26 +1888,26 @@ function xn(e) {
     }
   ) });
 }
-tt();
+dt();
 export {
-  W as E,
-  wn as R,
-  xn as S,
-  vn as a,
-  En as b,
-  bn as c,
-  yn as d,
-  wt as e,
-  Ae as f,
-  Zt as g,
-  xt as h,
-  _e as i,
-  Bt as j,
-  Yt as k,
-  kn as l,
-  Rn as p,
-  ye as s,
-  Q as u,
-  St as v
+  H as E,
+  Nn as R,
+  Dn as S,
+  Cn as a,
+  _n as b,
+  $n as c,
+  On as d,
+  Ot as e,
+  Le as f,
+  ln as g,
+  _t as h,
+  Ue as i,
+  Mt as j,
+  an as k,
+  Tn as l,
+  An as p,
+  Ee as s,
+  te as u,
+  At as v
 };
-//# sourceMappingURL=embed-CLz3CTcX.js.map
+//# sourceMappingURL=embed-SOFUZlGB.js.map