floor-editor-ts 1.3.5 → 1.3.7

package/dist/floor-editor.es.js

@@ -6578,10 +6578,30 @@ function updateWindow(id, updates) {
 	});
 }
 function updateFurniture(id, updates) {
+	const p = get$1(currentProject);
+	const floor = p === null || p === void 0 ? void 0 : p.floors.find((f) => f.id === p.activeFloorId);
+	const before = floor === null || floor === void 0 ? void 0 : floor.furniture.find((fi) => fi.id === id);
+	const beforeSerial = (before === null || before === void 0 ? void 0 : before.catalogId) === "camera" ? before.serial || void 0 : void 0;
+	const beforeProps = (before === null || before === void 0 ? void 0 : before.catalogId) === "camera" ? cameraItemToCallbackProps(before) : null;
 	mutate((f) => {
 		const fi = f.furniture.find((fi) => fi.id === id);
 		if (fi) Object.assign(fi, updates);
 	});
+	if ((before === null || before === void 0 ? void 0 : before.catalogId) !== "camera" || isAssignedCamerasSyncing()) return;
+	const afterProject = get$1(currentProject);
+	const afterFloor = afterProject === null || afterProject === void 0 ? void 0 : afterProject.floors.find((f) => f.id === afterProject.activeFloorId);
+	const after = afterFloor === null || afterFloor === void 0 ? void 0 : afterFloor.furniture.find((fi) => fi.id === id);
+	const afterSerial = (after === null || after === void 0 ? void 0 : after.serial) || void 0;
+	if (beforeSerial === afterSerial) return;
+	const added = [];
+	const removed = [];
+	if (beforeSerial && beforeProps) removed.push(beforeProps);
+	const afterProps = after ? cameraItemToCallbackProps(after) : null;
+	if (afterSerial && afterProps) added.push(afterProps);
+	emitCamerasChanged({
+		added,
+		removed
+	});
 }
 function updateRoom(id, updates) {
 	mutate((f) => {
@@ -7100,7 +7120,8 @@ var DEFAULT_CONFIG = {
 	cameraThumbnail: "",
 	cameraThumbnailOpacity: .65,
 	canvasBackground: "#f8f9fa",
-	floorPlateBackground: "#f8f9fa"
+	floorPlateBackground: "#f8f9fa",
+	headerToolsMode: "full"
 };
 function normalizeConfig(value) {
 	if (!value || typeof value !== "object") return { ...DEFAULT_CONFIG };
@@ -7118,6 +7139,7 @@ function normalizeConfig(value) {
 	const opacity = typeof value.cameraThumbnailOpacity === "number" && value.cameraThumbnailOpacity >= 0 && value.cameraThumbnailOpacity <= 1 ? value.cameraThumbnailOpacity : DEFAULT_CONFIG.cameraThumbnailOpacity;
 	const canvasBackground = normalizeColor$1(value.canvasBackground, DEFAULT_CONFIG.canvasBackground);
 	const floorPlateBackground = normalizeColor$1(value.floorPlateBackground, DEFAULT_CONFIG.floorPlateBackground);
+	const headerToolsMode = value.headerToolsMode === "compact" || value.headerToolsMode === "auto" || value.headerToolsMode === "full" ? value.headerToolsMode : DEFAULT_CONFIG.headerToolsMode;
 	return {
 		...DEFAULT_CONFIG,
 		...value,
@@ -7126,7 +7148,8 @@ function normalizeConfig(value) {
 		cameraThumbnail: image,
 		cameraThumbnailOpacity: opacity,
 		canvasBackground,
-		floorPlateBackground
+		floorPlateBackground,
+		headerToolsMode
 	};
 }
 function normalizeColor$1(value, fallback) {
@@ -7135,16 +7158,31 @@ function normalizeColor$1(value, fallback) {
 	if (/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(trimmed)) return trimmed;
 	return fallback;
 }
+function isFloorLike(value) {
+	return !!value && typeof value === "object" && typeof value.id === "string" && Array.isArray(value.walls);
+}
+/**
+* Accepts a full Project, `{ floors }`, a floors array, or a single Floor.
+* Furniture (incl. cameras) is preserved as given.
+*/
 function normalizeFloorData(data) {
 	if (!data || typeof data !== "object") return createDefaultProject();
-	if (!Array.isArray(data.floors) || data.floors.length === 0) return createDefaultProject();
-	if (!data.activeFloorId || !data.floors.some((f) => f.id === data.activeFloorId)) return {
+	let floors;
+	let rest = {};
+	if (Array.isArray(data)) floors = data.filter(isFloorLike);
+	else if (isFloorLike(data) && !Array.isArray(data.floors)) floors = [data];
+	else {
+		rest = data;
+		floors = Array.isArray(rest.floors) ? rest.floors.filter(isFloorLike) : void 0;
+	}
+	if (!floors || floors.length === 0) return createDefaultProject();
+	const activeFloorId = rest.activeFloorId && floors.some((f) => f.id === rest.activeFloorId) ? rest.activeFloorId : floors[0].id;
+	return {
 		...createDefaultProject(),
-		...data,
-		floors: data.floors,
-		activeFloorId: data.floors[0].id
+		...rest,
+		floors,
+		activeFloorId
 	};
-	return data;
 }
 var RUNTIME_FURNITURE_FIELDS = [
 	"showHeatmap",
@@ -56244,11 +56282,11 @@ var root_7$6 = /* @__PURE__ */ from_html(`<div class="flex items-center justify-
                   before:content-[''] before:absolute before:w-4 before:h-4 before:rounded-full before:bg-white before:top-0.5 before:left-0.5 before:transition-transform checked:before:translate-x-5"/></label> <label class="flex items-center justify-between px-4 py-3.5 cursor-pointer"><span class="text-sm text-gray-700">Extension Lines</span> <input type="checkbox" class="w-10 h-5 rounded-full appearance-none cursor-pointer bg-gray-300 checked:bg-slate-700 relative transition-colors
                   before:content-[''] before:absolute before:w-4 before:h-4 before:rounded-full before:bg-white before:top-0.5 before:left-0.5 before:transition-transform checked:before:translate-x-5"/></label> <label class="flex items-center justify-between px-4 py-3.5 cursor-pointer"><span class="text-sm text-gray-700">Object Distance</span> <input type="checkbox" class="w-10 h-5 rounded-full appearance-none cursor-pointer bg-gray-300 checked:bg-slate-700 relative transition-colors
                   before:content-[''] before:absolute before:w-4 before:h-4 before:rounded-full before:bg-white before:top-0.5 before:left-0.5 before:transition-transform checked:before:translate-x-5"/></label> <div class="flex items-center justify-between px-4 py-3.5"><span class="text-sm text-gray-700">Line Color</span> <div class="flex items-center gap-2"><button style="background-color: #ffffff" aria-label="White line color"></button> <span class="text-gray-300">|</span> <button style="background-color: #1e293b" aria-label="Dark line color"></button></div></div></div>`, 1);
-var root_9$2 = /* @__PURE__ */ from_html(`<button><span class="text-2xl"> </span> <span class="text-xs font-medium text-gray-700 dark:text-gray-300"> </span></button>`);
+var root_9$3 = /* @__PURE__ */ from_html(`<button><span class="text-2xl"> </span> <span class="text-xs font-medium text-gray-700 dark:text-gray-300"> </span></button>`);
 var root_8$3 = /* @__PURE__ */ from_html(`<div class="space-y-4"><div><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-3">Theme</span> <div class="flex gap-3"></div></div></div>`);
-var root_11$2 = /* @__PURE__ */ from_html(`<button class="px-4 py-2 text-sm font-medium text-red-600 dark:text-red-400 border border-red-300 dark:border-red-600 rounded-lg hover:bg-red-50 dark:hover:bg-red-900/20 transition-colors">Remove</button>`);
+var root_11$3 = /* @__PURE__ */ from_html(`<button class="px-4 py-2 text-sm font-medium text-red-600 dark:text-red-400 border border-red-300 dark:border-red-600 rounded-lg hover:bg-red-50 dark:hover:bg-red-900/20 transition-colors">Remove</button>`);
 var root_12$3 = /* @__PURE__ */ from_html(`<button class="px-4 py-2 text-sm font-medium text-red-600 dark:text-red-400 border border-red-300 dark:border-red-600 rounded-lg hover:bg-red-50 dark:hover:bg-red-900/20 transition-colors">Remove</button>`);
-var root_10$2 = /* @__PURE__ */ from_html(`<div class="space-y-4"><div><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-1">Gemini API Key</span> <p class="text-xs text-gray-500 dark:text-gray-400 mb-3">Required for AI-powered photorealistic rendering. Your key is stored locally in your browser only - never sent to our servers.</p> <div class="flex gap-2"><div class="relative flex-1"><input class="w-full px-3 py-2 pr-10 border border-gray-300 dark:border-gray-600 rounded-lg text-sm font-mono focus:ring-2 focus:ring-slate-500 focus:border-slate-500 outline-none bg-white dark:bg-gray-700 dark:text-gray-100" placeholder="AIza..."/> <button class="absolute right-2 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 text-sm"> </button></div></div> <div class="flex gap-2 mt-3"><button class="px-4 py-2 text-sm font-medium bg-slate-700 text-white rounded-lg hover:bg-slate-600 transition-colors"> </button> <!></div></div> <div class="border-t border-gray-200 dark:border-gray-700 pt-4"><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-2">How to get a Gemini key</span> <ol class="text-xs text-gray-500 dark:text-gray-400 space-y-1 list-decimal list-inside"><li>Go to <a href="https://aistudio.google.com/apikey" target="_blank" rel="noopener" class="text-blue-500 hover:underline">Google AI Studio</a></li> <li>Click "Create API Key"</li> <li>Copy and paste it above</li></ol></div> <div class="border-t border-gray-200 dark:border-gray-700 pt-4"><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-1">OpenAI API Key</span> <p class="text-xs text-gray-500 dark:text-gray-400 mb-3">Optional — enables OpenAI image generation as an alternative to Gemini. Stored locally only.</p> <div class="flex gap-2"><div class="relative flex-1"><input class="w-full px-3 py-2 pr-10 border border-gray-300 dark:border-gray-600 rounded-lg text-sm font-mono focus:ring-2 focus:ring-slate-500 focus:border-slate-500 outline-none bg-white dark:bg-gray-700 dark:text-gray-100" placeholder="sk-..."/> <button class="absolute right-2 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 text-sm"> </button></div></div> <div class="flex gap-2 mt-3"><button class="px-4 py-2 text-sm font-medium bg-slate-700 text-white rounded-lg hover:bg-slate-600 transition-colors"> </button> <!></div> <div class="mt-3"><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-2">How to get an OpenAI key</span> <ol class="text-xs text-gray-500 dark:text-gray-400 space-y-1 list-decimal list-inside"><li>Go to <a href="https://platform.openai.com/api-keys" target="_blank" rel="noopener" class="text-blue-500 hover:underline">OpenAI Platform</a></li> <li>Click "Create new secret key"</li> <li>Copy and paste it above</li></ol></div></div></div>`);
+var root_10$3 = /* @__PURE__ */ from_html(`<div class="space-y-4"><div><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-1">Gemini API Key</span> <p class="text-xs text-gray-500 dark:text-gray-400 mb-3">Required for AI-powered photorealistic rendering. Your key is stored locally in your browser only - never sent to our servers.</p> <div class="flex gap-2"><div class="relative flex-1"><input class="w-full px-3 py-2 pr-10 border border-gray-300 dark:border-gray-600 rounded-lg text-sm font-mono focus:ring-2 focus:ring-slate-500 focus:border-slate-500 outline-none bg-white dark:bg-gray-700 dark:text-gray-100" placeholder="AIza..."/> <button class="absolute right-2 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 text-sm"> </button></div></div> <div class="flex gap-2 mt-3"><button class="px-4 py-2 text-sm font-medium bg-slate-700 text-white rounded-lg hover:bg-slate-600 transition-colors"> </button> <!></div></div> <div class="border-t border-gray-200 dark:border-gray-700 pt-4"><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-2">How to get a Gemini key</span> <ol class="text-xs text-gray-500 dark:text-gray-400 space-y-1 list-decimal list-inside"><li>Go to <a href="https://aistudio.google.com/apikey" target="_blank" rel="noopener" class="text-blue-500 hover:underline">Google AI Studio</a></li> <li>Click "Create API Key"</li> <li>Copy and paste it above</li></ol></div> <div class="border-t border-gray-200 dark:border-gray-700 pt-4"><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-1">OpenAI API Key</span> <p class="text-xs text-gray-500 dark:text-gray-400 mb-3">Optional — enables OpenAI image generation as an alternative to Gemini. Stored locally only.</p> <div class="flex gap-2"><div class="relative flex-1"><input class="w-full px-3 py-2 pr-10 border border-gray-300 dark:border-gray-600 rounded-lg text-sm font-mono focus:ring-2 focus:ring-slate-500 focus:border-slate-500 outline-none bg-white dark:bg-gray-700 dark:text-gray-100" placeholder="sk-..."/> <button class="absolute right-2 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 text-sm"> </button></div></div> <div class="flex gap-2 mt-3"><button class="px-4 py-2 text-sm font-medium bg-slate-700 text-white rounded-lg hover:bg-slate-600 transition-colors"> </button> <!></div> <div class="mt-3"><span class="text-sm font-medium text-gray-700 dark:text-gray-300 block mb-2">How to get an OpenAI key</span> <ol class="text-xs text-gray-500 dark:text-gray-400 space-y-1 list-decimal list-inside"><li>Go to <a href="https://platform.openai.com/api-keys" target="_blank" rel="noopener" class="text-blue-500 hover:underline">OpenAI Platform</a></li> <li>Click "Create new secret key"</li> <li>Copy and paste it above</li></ol></div></div></div>`);
 var root_1$13 = /* @__PURE__ */ from_html(`<div class="fixed inset-0 bg-black/50 z-50 flex items-center justify-center" role="dialog" tabindex="-1" aria-label="Settings"><div class="bg-white dark:bg-gray-800 rounded-xl shadow-2xl w-[420px] max-h-[80vh] flex flex-col" role="document"><div class="flex items-center justify-between px-5 pt-4 pb-2"><h2 class="text-lg font-bold text-gray-800 dark:text-gray-100">Settings</h2> <button class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 text-xl leading-none" aria-label="Close settings">✕</button></div> <div class="flex border-b border-gray-200 dark:border-gray-700 px-5"><button>Project <!></button> <button>Dimensions <!></button> <button>Appearance <!></button> <button>AI <!></button></div> <div class="p-5 overflow-y-auto"><!></div></div></div>`);
 function SettingsDialog($$anchor, $$props) {
 	push($$props, true);
@@ -56499,7 +56537,7 @@ function SettingsDialog($$anchor, $$props) {
 				let value = () => get($$array)[0];
 				let icon = () => get($$array)[1];
 				let label = () => get($$array)[2];
-				var button_9 = root_9$2();
+				var button_9 = root_9$3();
 				var span = child(button_9);
 				var text = child(span, true);
 				reset(span);
@@ -56521,7 +56559,7 @@ function SettingsDialog($$anchor, $$props) {
 			append($$anchor, div_15);
 		};
 		var consequent_9 = ($$anchor) => {
-			var div_18 = root_10$2();
+			var div_18 = root_10$3();
 			var div_19 = child(div_18);
 			var div_20 = sibling(child(div_19), 4);
 			var div_21 = child(div_20);
@@ -56538,7 +56576,7 @@ function SettingsDialog($$anchor, $$props) {
 			reset(button_11);
 			var node_6 = sibling(button_11, 2);
 			var consequent_7 = ($$anchor) => {
-				var button_12 = root_11$2();
+				var button_12 = root_11$3();
 				delegated("click", button_12, clearGeminiKey);
 				append($$anchor, button_12);
 			};
@@ -57109,14 +57147,19 @@ init_onboarding_svelte();
 var root_2$10 = /* @__PURE__ */ from_html(`<input type="text" class="bg-white/20 text-white font-semibold px-2 py-0.5 rounded border border-white/30 outline-none text-sm w-40"/>`);
 var root_3$9 = /* @__PURE__ */ from_html(`<button class="font-semibold text-white text-sm hover:bg-white/10 px-2 py-0.5 rounded transition-colors" title="Click to rename"> </button>`);
 var root_4$8 = /* @__PURE__ */ from_html(`<button> </button>`);
-var root_5$5 = /* @__PURE__ */ from_html(`<div class="flex bg-white/15 rounded-full p-0.5"><button title="Select mode (V)" aria-label="Select mode"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 3l7.07 16.97 2.51-7.39 7.39-2.51L3 3z"></path><path d="M13 13l6 6"></path></svg></button> <button title="Pan mode (H)" aria-label="Pan mode"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 11V6a2 2 0 0 0-4 0v1"></path><path d="M14 10V4a2 2 0 0 0-4 0v2"></path><path d="M10 10.5V6a2 2 0 0 0-4 0v8"></path><path d="M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15"></path></svg></button></div>`);
-var root_6$4 = /* @__PURE__ */ from_html(`<div class="flex items-center gap-1 bg-white/15 rounded-full p-0.5"><button class="w-7 h-7 flex items-center justify-center text-white/80 hover:text-white hover:bg-white/10 rounded-full transition-colors text-sm font-bold" title="Zoom Out (−)" aria-label="Zoom Out">−</button> <button class="px-2 py-1 text-xs font-medium text-white/80 hover:text-white hover:bg-white/10 rounded-full transition-colors min-w-[3rem] text-center" title="Reset Zoom (100%)"> </button> <button class="w-7 h-7 flex items-center justify-center text-white/80 hover:text-white hover:bg-white/10 rounded-full transition-colors text-sm font-bold" title="Zoom In (+)" aria-label="Zoom In">+</button></div>`);
-var root_8$2 = /* @__PURE__ */ from_html(`<button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg> Import JSON</button>`);
-var root_7$5 = /* @__PURE__ */ from_html(`<div class="absolute right-0 top-full mt-1 bg-white rounded-lg shadow-lg border border-gray-200 py-1 w-48 z-50"><button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 6 2 18 2 18 9"></polyline><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"></path><rect x="6" y="14" width="12" height="8"></rect></svg> Print Layout</button> <div class="h-px bg-gray-100 my-1"></div> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"></rect><circle cx="8.5" cy="8.5" r="1.5"></circle><path d="M21 15l-5-5L5 21"></path></svg> Export 2D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2L2 7l10 5 10-5-10-5z"></path><path d="M2 17l10 5 10-5"></path><path d="M2 12l10 5 10-5"></path></svg> Export 3D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 19V5"></path><path d="M5 12l7-7 7 7"></path></svg> Export as SVG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M8 16h2"></path><path d="M14 16h2"></path></svg> Export as DXF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M9 16h6"></path></svg> Export as DWG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M16 11v6"></path><path d="M8 11v6"></path><path d="M12 11v6"></path></svg> Export as PDF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path></svg> Download JSON</button> <div class="h-px bg-gray-100 my-1"></div> <!> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg> New Project</button></div>`);
-var root_1$10 = /* @__PURE__ */ from_html(`<div class="h-12 bg-gradient-to-r from-slate-800 to-slate-700 flex items-center px-4 gap-3 shrink-0 shadow-sm"><button type="button"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2.5"></rect><path d="M9 3v18"></path></svg></button> <!> <div class="h-5 w-px bg-white/20"></div> <div class="flex items-center gap-1"><!> <button class="text-white/80 hover:text-white text-xs hover:bg-white/10 px-1.5 py-0.5 rounded transition-colors" title="Add Floor" aria-label="Add Floor">+</button> <span class="text-white/40 text-[10px] ml-1"> </span></div> <div class="flex-1"></div> <button class="p-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Undo (Ctrl+Z)" aria-label="Undo"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg></button> <button class="p-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Redo (Ctrl+Y)" aria-label="Redo"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"></polyline><path d="M20.49 15a9 9 0 1 1-2.13-9.36L23 10"></path></svg></button> <div class="h-5 w-px bg-white/20"></div> <button aria-label="Snap to Grid"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7"></rect><rect x="14" y="3" width="7" height="7"></rect><rect x="14" y="14" width="7" height="7"></rect><rect x="3" y="14" width="7" height="7"></rect></svg></button> <!> <button aria-label="Toggle Furniture"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="12" width="20" height="8" rx="1"></rect><path d="M4 12V7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v5"></path><line x1="12" y1="12" x2="12" y2="20"></line></svg></button> <div class="h-5 w-px bg-white/20"></div> <!> <button class="p-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Version History" aria-label="Version History"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></button> <button class="px-2 py-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Area Summary" aria-label="Area Summary"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"></rect><path d="M3 9h18"></path><path d="M9 3v18"></path></svg></button> <button class="px-2 py-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Settings" aria-label="Settings"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg></button> <div class="h-5 w-px bg-white/20"></div> <div class="relative"><button class="px-3 py-1.5 text-sm text-white/90 hover:text-white hover:bg-white/10 rounded transition-colors flex items-center gap-1.5"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg> Export</button> <!></div> <span><!></span> <button class="px-3 py-1.5 text-sm bg-white text-slate-800 font-semibold rounded-lg hover:bg-blue-50 transition-colors shadow-sm">Save</button></div>`);
-var root_13$2 = /* @__PURE__ */ from_html(`<div class="absolute right-0 top-full mt-1 bg-white rounded-lg shadow-lg border border-gray-200 py-1 w-48 z-50"><button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 6 2 18 2 18 9"></polyline><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"></path><rect x="6" y="14" width="12" height="8"></rect></svg> Print Layout</button> <div class="h-px bg-gray-100 my-1"></div> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"></rect><circle cx="8.5" cy="8.5" r="1.5"></circle><path d="M21 15l-5-5L5 21"></path></svg> Export 2D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2L2 7l10 5 10-5-10-5z"></path><path d="M2 17l10 5 10-5"></path><path d="M2 12l10 5 10-5"></path></svg> Export 3D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 19V5"></path><path d="M5 12l7-7 7 7"></path></svg> Export as SVG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M8 16h2"></path><path d="M14 16h2"></path></svg> Export as DXF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M9 16h6"></path></svg> Export as DWG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M16 11v6"></path><path d="M8 11v6"></path><path d="M12 11v6"></path></svg> Export as PDF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path></svg> Download JSON</button> <div class="h-px bg-gray-100 my-1"></div> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg> Import JSON</button></div>`);
-var root_12$2 = /* @__PURE__ */ from_html(`<div class="h-12 bg-gradient-to-r from-slate-800 to-slate-700 flex items-center justify-between px-4 gap-3 shrink-0 shadow-sm"><span class="font-semibold text-white text-sm px-2 py-0.5 rounded transition-colors"> </span> <div class="relative"><button class="px-3 py-1.5 text-sm text-white/90 hover:text-white hover:bg-white/10 rounded transition-colors flex items-center gap-1.5"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg> Import</button> <!></div></div>`);
-var root_14$2 = /* @__PURE__ */ from_html(`<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/40"><div class="bg-white rounded-xl shadow-2xl w-[420px] max-h-[80vh] overflow-hidden"><div class="flex items-center justify-between px-5 py-3 border-b border-gray-200"><h2 class="text-base font-semibold text-gray-800">📐 Area Summary</h2> <button class="text-gray-400 hover:text-gray-600 text-xl leading-none">&times;</button></div> <div class="overflow-y-auto max-h-[calc(80vh-52px)] p-1"><!></div></div></div>`);
+var root_5$5 = /* @__PURE__ */ from_html(`<button aria-label="Snap to Grid"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7"></rect><rect x="14" y="3" width="7" height="7"></rect><rect x="14" y="14" width="7" height="7"></rect><rect x="3" y="14" width="7" height="7"></rect></svg></button>`);
+var root_6$4 = /* @__PURE__ */ from_html(`<div class="flex bg-white/15 rounded-full p-0.5 shrink-0"><button title="Select mode (V)" aria-label="Select mode"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 3l7.07 16.97 2.51-7.39 7.39-2.51L3 3z"></path><path d="M13 13l6 6"></path></svg></button> <button title="Pan mode (H)" aria-label="Pan mode"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 11V6a2 2 0 0 0-4 0v1"></path><path d="M14 10V4a2 2 0 0 0-4 0v2"></path><path d="M10 10.5V6a2 2 0 0 0-4 0v8"></path><path d="M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15"></path></svg></button></div>`);
+var root_7$5 = /* @__PURE__ */ from_html(`<button aria-label="Toggle Furniture"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="12" width="20" height="8" rx="1"></rect><path d="M4 12V7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v5"></path><line x1="12" y1="12" x2="12" y2="20"></line></svg></button>`);
+var root_8$2 = /* @__PURE__ */ from_html(`<div class="flex items-center gap-1 bg-white/15 rounded-full p-0.5 shrink-0"><button class="w-7 h-7 flex items-center justify-center text-white/80 hover:text-white hover:bg-white/10 rounded-full transition-colors text-sm font-bold" title="Zoom Out (−)" aria-label="Zoom Out">−</button> <button class="px-2 py-1 text-xs font-medium text-white/80 hover:text-white hover:bg-white/10 rounded-full transition-colors min-w-[3rem] text-center" title="Reset Zoom (100%)"> </button> <button class="w-7 h-7 flex items-center justify-center text-white/80 hover:text-white hover:bg-white/10 rounded-full transition-colors text-sm font-bold" title="Zoom In (+)" aria-label="Zoom In">+</button></div>`);
+var root_10$2 = /* @__PURE__ */ from_html(`<div class="absolute right-0 top-full mt-1 bg-white rounded-lg shadow-lg border border-gray-200 py-1 w-56 z-50" role="menu"><button type="button" role="menuitemcheckbox" class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center justify-between gap-2"><span>Snap to grid</span> <span> </span></button> <button type="button" role="menuitemcheckbox" class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center justify-between gap-2"><span>Show furniture</span> <span> </span></button> <div class="h-px bg-gray-100 my-1"></div> <button type="button" role="menuitem" class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left">Version history</button> <button type="button" role="menuitem" class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left">Area summary</button> <div class="h-px bg-gray-100 my-1"></div> <button type="button" role="menuitem" class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left">Settings…</button></div>`);
+var root_9$2 = /* @__PURE__ */ from_html(`<div class="relative shrink-0"><button title="Settings &amp; tools" aria-label="Settings &amp; tools"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg></button> <!></div>`);
+var root_11$2 = /* @__PURE__ */ from_html(`<button class="p-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Version History" aria-label="Version History"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></button> <button class="px-2 py-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Area Summary" aria-label="Area Summary"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"></rect><path d="M3 9h18"></path><path d="M9 3v18"></path></svg></button> <button class="px-2 py-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Settings" aria-label="Settings"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg></button>`, 1);
+var root_13$2 = /* @__PURE__ */ from_html(`<button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg> Import JSON</button>`);
+var root_12$2 = /* @__PURE__ */ from_html(`<div class="absolute right-0 top-full mt-1 bg-white rounded-lg shadow-lg border border-gray-200 py-1 w-48 z-50"><button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 6 2 18 2 18 9"></polyline><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"></path><rect x="6" y="14" width="12" height="8"></rect></svg> Print Layout</button> <div class="h-px bg-gray-100 my-1"></div> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"></rect><circle cx="8.5" cy="8.5" r="1.5"></circle><path d="M21 15l-5-5L5 21"></path></svg> Export 2D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2L2 7l10 5 10-5-10-5z"></path><path d="M2 17l10 5 10-5"></path><path d="M2 12l10 5 10-5"></path></svg> Export 3D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 19V5"></path><path d="M5 12l7-7 7 7"></path></svg> Export as SVG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M8 16h2"></path><path d="M14 16h2"></path></svg> Export as DXF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M9 16h6"></path></svg> Export as DWG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M16 11v6"></path><path d="M8 11v6"></path><path d="M12 11v6"></path></svg> Export as PDF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path></svg> Download JSON</button> <div class="h-px bg-gray-100 my-1"></div> <!> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg> New Project</button></div>`);
+var root_1$10 = /* @__PURE__ */ from_html(`<div class="h-12 bg-gradient-to-r from-slate-800 to-slate-700 flex items-center px-4 gap-3 shrink-0 shadow-sm overflow-hidden"><button type="button"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2.5"></rect><path d="M9 3v18"></path></svg></button> <!> <div class="h-5 w-px bg-white/20"></div> <div class="flex items-center gap-1"><!> <button class="text-white/80 hover:text-white text-xs hover:bg-white/10 px-1.5 py-0.5 rounded transition-colors" title="Add Floor" aria-label="Add Floor">+</button> <span class="text-white/40 text-[10px] ml-1"> </span></div> <div class="flex-1"></div> <button class="p-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Undo (Ctrl+Z)" aria-label="Undo"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg></button> <button class="p-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors" title="Redo (Ctrl+Y)" aria-label="Redo"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"></polyline><path d="M20.49 15a9 9 0 1 1-2.13-9.36L23 10"></path></svg></button> <div class="h-5 w-px bg-white/20"></div> <!> <!> <!> <div class="h-5 w-px bg-white/20"></div> <!> <!> <div class="h-5 w-px bg-white/20 shrink-0"></div> <div class="relative"><button class="px-3 py-1.5 text-sm text-white/90 hover:text-white hover:bg-white/10 rounded transition-colors flex items-center gap-1.5"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg> Export</button> <!></div> <span><!></span> <button class="px-3 py-1.5 text-sm bg-white text-slate-800 font-semibold rounded-lg hover:bg-blue-50 transition-colors shadow-sm">Save</button></div>`);
+var root_18$3 = /* @__PURE__ */ from_html(`<div class="absolute right-0 top-full mt-1 bg-white rounded-lg shadow-lg border border-gray-200 py-1 w-48 z-50"><button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 6 2 18 2 18 9"></polyline><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"></path><rect x="6" y="14" width="12" height="8"></rect></svg> Print Layout</button> <div class="h-px bg-gray-100 my-1"></div> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"></rect><circle cx="8.5" cy="8.5" r="1.5"></circle><path d="M21 15l-5-5L5 21"></path></svg> Export 2D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2L2 7l10 5 10-5-10-5z"></path><path d="M2 17l10 5 10-5"></path><path d="M2 12l10 5 10-5"></path></svg> Export 3D as PNG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 19V5"></path><path d="M5 12l7-7 7 7"></path></svg> Export as SVG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M8 16h2"></path><path d="M14 16h2"></path></svg> Export as DXF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M9 16h6"></path></svg> Export as DWG</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path><path d="M16 11v6"></path><path d="M8 11v6"></path><path d="M12 11v6"></path></svg> Export as PDF</button> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><path d="M14 2v6h6"></path></svg> Download JSON</button> <div class="h-px bg-gray-100 my-1"></div> <button class="w-full px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 text-left flex items-center gap-2"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg> Import JSON</button></div>`);
+var root_17$3 = /* @__PURE__ */ from_html(`<div class="h-12 bg-gradient-to-r from-slate-800 to-slate-700 flex items-center justify-between px-4 gap-3 shrink-0 shadow-sm"><span class="font-semibold text-white text-sm px-2 py-0.5 rounded transition-colors"> </span> <div class="relative"><button class="px-3 py-1.5 text-sm text-white/90 hover:text-white hover:bg-white/10 rounded transition-colors flex items-center gap-1.5"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg> Import</button> <!></div></div>`);
+var root_19$3 = /* @__PURE__ */ from_html(`<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/40"><div class="bg-white rounded-xl shadow-2xl w-[420px] max-h-[80vh] overflow-hidden"><div class="flex items-center justify-between px-5 py-3 border-b border-gray-200"><h2 class="text-base font-semibold text-gray-800">📐 Area Summary</h2> <button class="text-gray-400 hover:text-gray-600 text-xl leading-none">&times;</button></div> <div class="overflow-y-auto max-h-[calc(80vh-52px)] p-1"><!></div></div></div>`);
 var root$5 = /* @__PURE__ */ from_html(`<!> <!> <!> <!>`, 1);
 function TopBar($$anchor, $$props) {
 	push($$props, true);
@@ -57125,10 +57168,17 @@ function TopBar($$anchor, $$props) {
 	const $canvasZoom = () => store_get(canvasZoom, "$canvasZoom", $$stores);
 	const $saveState = () => store_get(saveState, "$saveState", $$stores);
 	const [$$stores, $$cleanup] = setup_stores();
-	let showBuildSidebar = prop($$props, "showBuildSidebar", 15, true);
+	/** Tailwind / common `lg` breakpoint — below this, secondary tools fold into Settings. */
+	const HEADER_AUTO_COMPACT_PX = 1024;
+	let showBuildSidebar = prop($$props, "showBuildSidebar", 15, true), headerToolsMode = prop($$props, "headerToolsMode", 3, "full");
 	let settingsOpen = /* @__PURE__ */ state(false);
 	let areaOpen = /* @__PURE__ */ state(false);
 	let versionHistoryOpen = /* @__PURE__ */ state(false);
+	let toolsMenuOpen = /* @__PURE__ */ state(false);
+	let headerNarrow = /* @__PURE__ */ state(false);
+	let headerEl = /* @__PURE__ */ state(void 0);
+	let toolsMenuRef = /* @__PURE__ */ state(void 0);
+	const useCompactTools = /* @__PURE__ */ user_derived(() => headerToolsMode() === "compact" || headerToolsMode() === "auto" && get(headerNarrow));
 	let projectName = /* @__PURE__ */ state("");
 	let mode = /* @__PURE__ */ state("2d");
 	let floors = /* @__PURE__ */ state(proxy([]));
@@ -57247,15 +57297,27 @@ function TopBar($$anchor, $$props) {
 		currentProject.set(createDefaultProject());
 		set(exportOpen, false);
 	}
+	function toggleSnap() {
+		snapEnabled.update((v) => !v);
+		set(snapOn, !get(snapOn));
+	}
+	function toggleFurniture() {
+		layerVisibility.update((v) => ({
+			...v,
+			furniture: !v.furniture
+		}));
+	}
 	onMount(() => {
 		initAutoSave($$props.onDispatch);
 		initVersionHistory();
 		const interval = setInterval(updateLastSavedText, 15e3);
 		function handleClickOutside(e) {
 			if (get(exportOpen) && exportRef && !exportRef.contains(e.target)) set(exportOpen, false);
+			if (get(toolsMenuOpen) && get(toolsMenuRef) && !get(toolsMenuRef).contains(e.target)) set(toolsMenuOpen, false);
 		}
 		function handleKeydown(e) {
 			if (get(exportOpen)) set(exportOpen, false);
+			if (e.key === "Escape" && get(toolsMenuOpen)) set(toolsMenuOpen, false);
 			if (e.key === "Escape" && get(versionHistoryOpen)) set(versionHistoryOpen, false);
 			if (e.key === "Escape" && get(areaOpen)) set(areaOpen, false);
 		}
@@ -57267,6 +57329,28 @@ function TopBar($$anchor, $$props) {
 			clearInterval(interval);
 		};
 	});
+	user_effect(() => {
+		const el = get(headerEl);
+		if (!el || headerToolsMode() !== "auto") {
+			if (headerToolsMode() !== "auto") set(headerNarrow, false);
+			return;
+		}
+		if (typeof ResizeObserver === "undefined") {
+			set(headerNarrow, el.clientWidth < HEADER_AUTO_COMPACT_PX);
+			return;
+		}
+		const ro = new ResizeObserver((entries) => {
+			var _entries$0$contentRec, _entries$;
+			const w = (_entries$0$contentRec = (_entries$ = entries[0]) === null || _entries$ === void 0 ? void 0 : _entries$.contentRect.width) !== null && _entries$0$contentRec !== void 0 ? _entries$0$contentRec : 0;
+			set(headerNarrow, w > 0 && w < HEADER_AUTO_COMPACT_PX, true);
+		});
+		ro.observe(el);
+		set(headerNarrow, el.clientWidth < HEADER_AUTO_COMPACT_PX);
+		return () => ro.disconnect();
+	});
+	user_effect(() => {
+		if (!get(useCompactTools) && get(toolsMenuOpen)) set(toolsMenuOpen, false);
+	});
 	function onImportJSON() {
 		const input = document.createElement("input");
 		input.type = "file";
@@ -57306,7 +57390,7 @@ function TopBar($$anchor, $$props) {
 	}
 	var fragment = root$5();
 	var node = first_child(fragment);
-	var consequent_7 = ($$anchor) => {
+	var consequent_11 = ($$anchor) => {
 		var div = root_1$10();
 		var button = child(div);
 		var node_1 = sibling(button, 2);
@@ -57352,10 +57436,22 @@ function TopBar($$anchor, $$props) {
 		reset(div_1);
 		var button_4 = sibling(div_1, 4);
 		var button_5 = sibling(button_4, 2);
-		var button_6 = sibling(button_5, 4);
-		var node_3 = sibling(button_6, 2);
+		var node_3 = sibling(button_5, 4);
 		var consequent_1 = ($$anchor) => {
-			var div_2 = root_5$5();
+			var button_6 = root_5$5();
+			template_effect(() => {
+				set_class(button_6, 1, `p-1.5 rounded transition-colors ${get(snapOn) ? "text-white bg-white/20" : "text-white/40 hover:text-white/70 hover:bg-white/10"}`);
+				set_attribute(button_6, "title", `Snap to Grid (${get(snapOn) ? "On" : "Off"})`);
+			});
+			delegated("click", button_6, toggleSnap);
+			append($$anchor, button_6);
+		};
+		if_block(node_3, ($$render) => {
+			if (!get(useCompactTools)) $$render(consequent_1);
+		});
+		var node_4 = sibling(node_3, 2);
+		var consequent_2 = ($$anchor) => {
+			var div_2 = root_6$4();
 			var button_7 = child(div_2);
 			var button_8 = sibling(button_7, 2);
 			reset(div_2);
@@ -57367,13 +57463,25 @@ function TopBar($$anchor, $$props) {
 			delegated("click", button_8, () => panMode.set(true));
 			append($$anchor, div_2);
 		};
-		if_block(node_3, ($$render) => {
-			if (get(mode) === "2d") $$render(consequent_1);
+		if_block(node_4, ($$render) => {
+			if (get(mode) === "2d") $$render(consequent_2);
 		});
-		var button_9 = sibling(node_3, 2);
-		var node_4 = sibling(button_9, 4);
-		var consequent_2 = ($$anchor) => {
-			var div_3 = root_6$4();
+		var node_5 = sibling(node_4, 2);
+		var consequent_3 = ($$anchor) => {
+			var button_9 = root_7$5();
+			template_effect(() => {
+				set_class(button_9, 1, `p-1.5 rounded transition-colors ${$showFurnitureStore() ? "text-white bg-white/20" : "text-white/40 hover:text-white/70 hover:bg-white/10"}`);
+				set_attribute(button_9, "title", `Toggle Furniture (${$showFurnitureStore() ? "Visible" : "Hidden"})`);
+			});
+			delegated("click", button_9, toggleFurniture);
+			append($$anchor, button_9);
+		};
+		if_block(node_5, ($$render) => {
+			if (!get(useCompactTools)) $$render(consequent_3);
+		});
+		var node_6 = sibling(node_5, 4);
+		var consequent_4 = ($$anchor) => {
+			var div_3 = root_8$2();
 			var button_10 = child(div_3);
 			var button_11 = sibling(button_10, 2);
 			var text_4 = child(button_11);
@@ -57386,77 +57494,146 @@ function TopBar($$anchor, $$props) {
 			delegated("click", button_12, () => canvasZoom.update((z) => Math.min(10, z * 1.25)));
 			append($$anchor, div_3);
 		};
-		if_block(node_4, ($$render) => {
-			if (get(mode) === "2d") $$render(consequent_2);
+		if_block(node_6, ($$render) => {
+			if (get(mode) === "2d") $$render(consequent_4);
 		});
-		var button_13 = sibling(node_4, 2);
-		var button_14 = sibling(button_13, 2);
-		var button_15 = sibling(button_14, 2);
-		var div_4 = sibling(button_15, 4);
-		var button_16 = child(div_4);
-		var node_5 = sibling(button_16, 2);
-		var consequent_4 = ($$anchor) => {
-			var div_5 = root_7$5();
-			var button_17 = child(div_5);
-			var button_18 = sibling(button_17, 4);
-			var button_19 = sibling(button_18, 2);
+		var node_7 = sibling(node_6, 2);
+		var consequent_6 = ($$anchor) => {
+			var div_4 = root_9$2();
+			var button_13 = child(div_4);
+			var node_8 = sibling(button_13, 2);
+			var consequent_5 = ($$anchor) => {
+				var div_5 = root_10$2();
+				var button_14 = child(div_5);
+				var span_1 = sibling(child(button_14), 2);
+				var text_5 = child(span_1, true);
+				reset(span_1);
+				reset(button_14);
+				var button_15 = sibling(button_14, 2);
+				var span_2 = sibling(child(button_15), 2);
+				var text_6 = child(span_2, true);
+				reset(span_2);
+				reset(button_15);
+				var button_16 = sibling(button_15, 4);
+				var button_17 = sibling(button_16, 2);
+				var button_18 = sibling(button_17, 4);
+				reset(div_5);
+				template_effect(() => {
+					set_attribute(button_14, "aria-checked", get(snapOn));
+					set_class(span_1, 1, `text-xs font-medium ${get(snapOn) ? "text-emerald-600" : "text-gray-400"}`);
+					set_text(text_5, get(snapOn) ? "On" : "Off");
+					set_attribute(button_15, "aria-checked", $showFurnitureStore());
+					set_class(span_2, 1, `text-xs font-medium ${$showFurnitureStore() ? "text-emerald-600" : "text-gray-400"}`);
+					set_text(text_6, $showFurnitureStore() ? "On" : "Off");
+				});
+				delegated("click", button_14, toggleSnap);
+				delegated("click", button_15, toggleFurniture);
+				delegated("click", button_16, () => {
+					set(toolsMenuOpen, false);
+					set(versionHistoryOpen, true);
+				});
+				delegated("click", button_17, () => {
+					set(toolsMenuOpen, false);
+					set(areaOpen, true);
+				});
+				delegated("click", button_18, () => {
+					set(toolsMenuOpen, false);
+					set(settingsOpen, true);
+				});
+				append($$anchor, div_5);
+			};
+			if_block(node_8, ($$render) => {
+				if (get(toolsMenuOpen)) $$render(consequent_5);
+			});
+			reset(div_4);
+			bind_this(div_4, ($$value) => set(toolsMenuRef, $$value), () => get(toolsMenuRef));
+			template_effect(() => {
+				set_class(button_13, 1, `px-2 py-1.5 text-white/80 hover:text-white hover:bg-white/10 rounded transition-colors ${get(toolsMenuOpen) ? "bg-white/15 text-white" : ""}`);
+				set_attribute(button_13, "aria-expanded", get(toolsMenuOpen));
+			});
+			delegated("click", button_13, () => set(toolsMenuOpen, !get(toolsMenuOpen)));
+			append($$anchor, div_4);
+		};
+		var alternate_1 = ($$anchor) => {
+			var fragment_1 = root_11$2();
+			var button_19 = first_child(fragment_1);
 			var button_20 = sibling(button_19, 2);
 			var button_21 = sibling(button_20, 2);
-			var button_22 = sibling(button_21, 2);
-			var button_23 = sibling(button_22, 2);
-			var button_24 = sibling(button_23, 2);
-			var node_6 = sibling(button_24, 4);
-			var consequent_3 = ($$anchor) => {
-				var button_25 = root_8$2();
-				delegated("click", button_25, onImportJSON);
-				append($$anchor, button_25);
+			delegated("click", button_19, () => set(versionHistoryOpen, true));
+			delegated("click", button_20, () => set(areaOpen, true));
+			delegated("click", button_21, () => set(settingsOpen, true));
+			append($$anchor, fragment_1);
+		};
+		if_block(node_7, ($$render) => {
+			if (get(useCompactTools)) $$render(consequent_6);
+			else $$render(alternate_1, -1);
+		});
+		var div_6 = sibling(node_7, 4);
+		var button_22 = child(div_6);
+		var node_9 = sibling(button_22, 2);
+		var consequent_8 = ($$anchor) => {
+			var div_7 = root_12$2();
+			var button_23 = child(div_7);
+			var button_24 = sibling(button_23, 4);
+			var button_25 = sibling(button_24, 2);
+			var button_26 = sibling(button_25, 2);
+			var button_27 = sibling(button_26, 2);
+			var button_28 = sibling(button_27, 2);
+			var button_29 = sibling(button_28, 2);
+			var button_30 = sibling(button_29, 2);
+			var node_10 = sibling(button_30, 4);
+			var consequent_7 = ($$anchor) => {
+				var button_31 = root_13$2();
+				delegated("click", button_31, onImportJSON);
+				append($$anchor, button_31);
 			};
-			if_block(node_6, ($$render) => {
-				if (!$$props.viewOnly) $$render(consequent_3);
+			if_block(node_10, ($$render) => {
+				if (!$$props.viewOnly) $$render(consequent_7);
 			});
-			var button_26 = sibling(node_6, 2);
-			reset(div_5);
-			delegated("click", button_17, () => {
+			var button_32 = sibling(node_10, 2);
+			reset(div_7);
+			delegated("click", button_23, () => {
 				set(exportOpen, false);
 				window.dispatchEvent(new KeyboardEvent("keydown", {
 					key: "p",
 					ctrlKey: true
 				}));
 			});
-			delegated("click", button_18, onExport2DPNG);
-			delegated("click", button_19, onExport3DPNG);
-			delegated("click", button_20, onExportSVG);
-			delegated("click", button_21, onExportDXF);
-			delegated("click", button_22, onExportDWG);
-			delegated("click", button_23, onExportPDF);
-			delegated("click", button_24, onExportJSON);
-			delegated("click", button_26, newProject);
-			append($$anchor, div_5);
+			delegated("click", button_24, onExport2DPNG);
+			delegated("click", button_25, onExport3DPNG);
+			delegated("click", button_26, onExportSVG);
+			delegated("click", button_27, onExportDXF);
+			delegated("click", button_28, onExportDWG);
+			delegated("click", button_29, onExportPDF);
+			delegated("click", button_30, onExportJSON);
+			delegated("click", button_32, newProject);
+			append($$anchor, div_7);
 		};
-		if_block(node_5, ($$render) => {
-			if (get(exportOpen)) $$render(consequent_4);
+		if_block(node_9, ($$render) => {
+			if (get(exportOpen)) $$render(consequent_8);
 		});
-		reset(div_4);
-		bind_this(div_4, ($$value) => exportRef = $$value, () => exportRef);
-		var span_1 = sibling(div_4, 2);
-		var node_7 = child(span_1);
-		var consequent_5 = ($$anchor) => {
+		reset(div_6);
+		bind_this(div_6, ($$value) => exportRef = $$value, () => exportRef);
+		var span_3 = sibling(div_6, 2);
+		var node_11 = child(span_3);
+		var consequent_9 = ($$anchor) => {
 			append($$anchor, text$1("Saving…"));
 		};
-		var consequent_6 = ($$anchor) => {
+		var consequent_10 = ($$anchor) => {
 			append($$anchor, text$1("Saved ✓"));
 		};
-		var alternate_1 = ($$anchor) => {
+		var alternate_2 = ($$anchor) => {
 			append($$anchor, text$1("Unsaved •"));
 		};
-		if_block(node_7, ($$render) => {
-			if ($saveState() === "saving") $$render(consequent_5);
-			else if ($saveState() === "saved") $$render(consequent_6, 1);
-			else $$render(alternate_1, -1);
+		if_block(node_11, ($$render) => {
+			if ($saveState() === "saving") $$render(consequent_9);
+			else if ($saveState() === "saved") $$render(consequent_10, 1);
+			else $$render(alternate_2, -1);
 		});
-		reset(span_1);
-		var button_27 = sibling(span_1, 2);
+		reset(span_3);
+		var button_33 = sibling(span_3, 2);
 		reset(div);
+		bind_this(div, ($$value) => set(headerEl, $$value), () => get(headerEl));
 		template_effect(() => {
 			var _$$get$length;
 			set_class(button, 1, `shrink-0 w-8 h-8 rounded-md flex items-center justify-center text-white/80 hover:text-white hover:bg-white/10 transition-colors ${showBuildSidebar() ? "bg-white/15 text-white" : ""}`);
@@ -57464,12 +57641,8 @@ function TopBar($$anchor, $$props) {
 			set_attribute(button, "aria-label", showBuildSidebar() ? "Hide sidebar" : "Show sidebar");
 			set_attribute(button, "aria-pressed", showBuildSidebar());
 			set_text(text_3, `${(_$$get$length = get(floors).length) !== null && _$$get$length !== void 0 ? _$$get$length : ""}F`);
-			set_class(button_6, 1, `p-1.5 rounded transition-colors ${get(snapOn) ? "text-white bg-white/20" : "text-white/40 hover:text-white/70 hover:bg-white/10"}`);
-			set_attribute(button_6, "title", `Snap to Grid (${get(snapOn) ? "On" : "Off"})`);
-			set_class(button_9, 1, `p-1.5 rounded transition-colors ${$showFurnitureStore() ? "text-white bg-white/20" : "text-white/40 hover:text-white/70 hover:bg-white/10"}`);
-			set_attribute(button_9, "title", `Toggle Furniture (${$showFurnitureStore() ? "Visible" : "Hidden"})`);
-			set_class(span_1, 1, `text-[11px] font-medium transition-all duration-300 ${$saveState() === "saved" ? "text-emerald-400" : $saveState() === "saving" ? "text-amber-300 animate-pulse" : "text-white/50"}`);
-			set_attribute(span_1, "title", get(lastSavedText) || "Not saved yet");
+			set_class(span_3, 1, `text-[11px] font-medium transition-all duration-300 ${$saveState() === "saved" ? "text-emerald-400" : $saveState() === "saving" ? "text-amber-300 animate-pulse" : "text-white/50"}`);
+			set_attribute(span_3, "title", get(lastSavedText) || "Not saved yet");
 		});
 		delegated("click", button, () => showBuildSidebar(!showBuildSidebar()));
 		delegated("click", button_3, onAddFloor);
@@ -57479,80 +57652,69 @@ function TopBar($$anchor, $$props) {
 		delegated("click", button_5, function(...$$args) {
 			redo === null || redo === void 0 || redo.apply(this, $$args);
 		});
-		delegated("click", button_6, () => {
-			snapEnabled.update((v) => !v);
-			set(snapOn, !get(snapOn));
-		});
-		delegated("click", button_9, () => layerVisibility.update((v) => ({
-			...v,
-			furniture: !v.furniture
-		})));
-		delegated("click", button_13, () => set(versionHistoryOpen, true));
-		delegated("click", button_14, () => set(areaOpen, true));
-		delegated("click", button_15, () => set(settingsOpen, true));
-		delegated("click", button_16, () => {
+		delegated("click", button_22, () => {
 			set(exportOpen, !get(exportOpen));
 			if (get(exportOpen)) triggerTip("first-export", 300, 60);
 		});
-		delegated("click", button_27, save);
+		delegated("click", button_33, save);
 		append($$anchor, div);
 	};
-	var alternate_2 = ($$anchor) => {
-		var div_6 = root_12$2();
-		var span_2 = child(div_6);
-		var text_8 = child(span_2, true);
-		reset(span_2);
-		var div_7 = sibling(span_2, 2);
-		var button_28 = child(div_7);
-		var node_8 = sibling(button_28, 2);
-		var consequent_8 = ($$anchor) => {
-			var div_8 = root_13$2();
-			var button_29 = child(div_8);
-			var button_30 = sibling(button_29, 4);
-			var button_31 = sibling(button_30, 2);
-			var button_32 = sibling(button_31, 2);
-			var button_33 = sibling(button_32, 2);
-			var button_34 = sibling(button_33, 2);
-			var button_35 = sibling(button_34, 2);
-			var button_36 = sibling(button_35, 2);
-			var button_37 = sibling(button_36, 4);
-			reset(div_8);
-			delegated("click", button_29, () => {
+	var alternate_3 = ($$anchor) => {
+		var div_8 = root_17$3();
+		var span_4 = child(div_8);
+		var text_10 = child(span_4, true);
+		reset(span_4);
+		var div_9 = sibling(span_4, 2);
+		var button_34 = child(div_9);
+		var node_12 = sibling(button_34, 2);
+		var consequent_12 = ($$anchor) => {
+			var div_10 = root_18$3();
+			var button_35 = child(div_10);
+			var button_36 = sibling(button_35, 4);
+			var button_37 = sibling(button_36, 2);
+			var button_38 = sibling(button_37, 2);
+			var button_39 = sibling(button_38, 2);
+			var button_40 = sibling(button_39, 2);
+			var button_41 = sibling(button_40, 2);
+			var button_42 = sibling(button_41, 2);
+			var button_43 = sibling(button_42, 4);
+			reset(div_10);
+			delegated("click", button_35, () => {
 				set(exportOpen, false);
 				window.dispatchEvent(new KeyboardEvent("keydown", {
 					key: "p",
 					ctrlKey: true
 				}));
 			});
-			delegated("click", button_30, onExport2DPNG);
-			delegated("click", button_31, onExport3DPNG);
-			delegated("click", button_32, onExportSVG);
-			delegated("click", button_33, onExportDXF);
-			delegated("click", button_34, onExportDWG);
-			delegated("click", button_35, onExportPDF);
-			delegated("click", button_36, onExportJSON);
-			delegated("click", button_37, onImportJSON);
-			append($$anchor, div_8);
+			delegated("click", button_36, onExport2DPNG);
+			delegated("click", button_37, onExport3DPNG);
+			delegated("click", button_38, onExportSVG);
+			delegated("click", button_39, onExportDXF);
+			delegated("click", button_40, onExportDWG);
+			delegated("click", button_41, onExportPDF);
+			delegated("click", button_42, onExportJSON);
+			delegated("click", button_43, onImportJSON);
+			append($$anchor, div_10);
 		};
-		if_block(node_8, ($$render) => {
-			if (get(exportOpen)) $$render(consequent_8);
+		if_block(node_12, ($$render) => {
+			if (get(exportOpen)) $$render(consequent_12);
 		});
-		reset(div_7);
-		bind_this(div_7, ($$value) => exportRef = $$value, () => exportRef);
-		reset(div_6);
-		template_effect(() => set_text(text_8, get(projectName)));
-		delegated("click", button_28, () => {
+		reset(div_9);
+		bind_this(div_9, ($$value) => exportRef = $$value, () => exportRef);
+		reset(div_8);
+		template_effect(() => set_text(text_10, get(projectName)));
+		delegated("click", button_34, () => {
 			set(exportOpen, !get(exportOpen));
 			if (get(exportOpen)) triggerTip("first-export", 300, 60);
 		});
-		append($$anchor, div_6);
+		append($$anchor, div_8);
 	};
 	if_block(node, ($$render) => {
-		if (!$$props.viewOnly) $$render(consequent_7);
-		else $$render(alternate_2, -1);
+		if (!$$props.viewOnly) $$render(consequent_11);
+		else $$render(alternate_3, -1);
 	});
-	var node_9 = sibling(node, 2);
-	SettingsDialog(node_9, {
+	var node_13 = sibling(node, 2);
+	SettingsDialog(node_13, {
 		get open() {
 			return get(settingsOpen);
 		},
@@ -57560,8 +57722,8 @@ function TopBar($$anchor, $$props) {
 			set(settingsOpen, $$value, true);
 		}
 	});
-	var node_10 = sibling(node_9, 2);
-	VersionHistoryPanel(node_10, {
+	var node_14 = sibling(node_13, 2);
+	VersionHistoryPanel(node_14, {
 		get open() {
 			return get(versionHistoryOpen);
 		},
@@ -57569,28 +57731,28 @@ function TopBar($$anchor, $$props) {
 			set(versionHistoryOpen, $$value, true);
 		}
 	});
-	var node_11 = sibling(node_10, 2);
-	var consequent_9 = ($$anchor) => {
-		var div_9 = root_14$2();
-		var div_10 = child(div_9);
-		var div_11 = child(div_10);
-		var button_38 = sibling(child(div_11), 2);
-		reset(div_11);
-		var div_12 = sibling(div_11, 2);
-		AreaSummaryPanel(child(div_12), {});
+	var node_15 = sibling(node_14, 2);
+	var consequent_13 = ($$anchor) => {
+		var div_11 = root_19$3();
+		var div_12 = child(div_11);
+		var div_13 = child(div_12);
+		var button_44 = sibling(child(div_13), 2);
+		reset(div_13);
+		var div_14 = sibling(div_13, 2);
+		AreaSummaryPanel(child(div_14), {});
+		reset(div_14);
 		reset(div_12);
-		reset(div_10);
-		reset(div_9);
-		delegated("click", div_9, () => set(areaOpen, false));
-		delegated("keydown", div_9, (e) => {
+		reset(div_11);
+		delegated("click", div_11, () => set(areaOpen, false));
+		delegated("keydown", div_11, (e) => {
 			if (e.key === "Escape") set(areaOpen, false);
 		});
-		delegated("click", div_10, (e) => e.stopPropagation());
-		delegated("click", button_38, () => set(areaOpen, false));
-		append($$anchor, div_9);
+		delegated("click", div_12, (e) => e.stopPropagation());
+		delegated("click", button_44, () => set(areaOpen, false));
+		append($$anchor, div_11);
 	};
-	if_block(node_11, ($$render) => {
-		if (get(areaOpen)) $$render(consequent_9);
+	if_block(node_15, ($$render) => {
+		if (get(areaOpen)) $$render(consequent_13);
 	});
 	append($$anchor, fragment);
 	pop();
@@ -59512,7 +59674,7 @@ var root_26 = /* @__PURE__ */ from_html(`<label class="block"><span class="text-
 var root_24$1 = /* @__PURE__ */ from_html(`<h3 class="text-sm font-semibold text-gray-700 mb-3 flex items-center gap-2"><span class="w-6 h-6 bg-gray-200 rounded flex items-center justify-center text-xs">🏛️</span> Column Properties</h3> <div class="space-y-3"><label class="block"><span class="text-xs text-gray-500">Shape</span> <div class="flex gap-2"><button>⭕ Round</button> <button>⬜ Square</button></div></label> <label class="block"><span class="text-xs text-gray-500"> </span> <input type="number" min="10" max="200" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label> <label class="block"><span class="text-xs text-gray-500"> </span> <input type="number" min="50" max="1000" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label> <div><span class="text-xs text-gray-500 mb-1.5 block">Color</span> <div class="grid grid-cols-5 gap-1.5 mb-2"></div> <div class="flex items-center gap-2"><span class="text-xs text-gray-500">Custom:</span> <input type="color" class="w-8 h-6 rounded border border-gray-200 cursor-pointer"/></div></div> <!></div>`, 1);
 var root_27 = /* @__PURE__ */ from_html(`<div class="space-y-3"><h3 class="text-sm font-semibold text-gray-700 mb-3 flex items-center gap-2"><span class="w-6 h-6 bg-emerald-100 rounded flex items-center justify-center text-xs">🏷️</span> Text Annotation</h3> <label class="block"><span class="text-xs text-gray-500">Text</span> <input type="text" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label> <label class="block"><span class="text-xs text-gray-500">Font Size</span> <input type="number" min="8" max="72" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label> <label class="block"><span class="text-xs text-gray-500">Color</span> <div class="flex items-center gap-2"><input type="color" class="w-8 h-6 rounded border border-gray-200 cursor-pointer"/> <span class="text-xs text-gray-400"> </span></div></label> <label class="block"><span class="text-xs text-gray-500">Rotation (°)</span> <input type="number" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label> <label class="block"><span class="text-xs text-gray-500">X</span> <input type="number" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label> <label class="block"><span class="text-xs text-gray-500">Y</span> <input type="number" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label></div>`);
 var root_28 = /* @__PURE__ */ from_html(`<div class="mt-4 pt-3 border-t border-gray-200"><h3 class="text-sm font-semibold text-gray-700 mb-3 flex items-center gap-2"><span class="w-6 h-6 bg-blue-100 rounded flex items-center justify-center text-xs">🖼️</span> Background Image</h3> <div class="space-y-3"><label class="block"><span class="text-xs text-gray-500">Opacity</span> <input type="range" min="0.05" max="1" step="0.05" class="w-full"/></label> <label class="block"><span class="text-xs text-gray-500">Scale</span> <input type="range" min="0.1" max="5" step="0.05" class="w-full"/></label> <label class="block"><span class="text-xs text-gray-500">Rotation</span> <input type="number" class="w-full px-2 py-1 border border-gray-200 rounded text-sm"/></label> <div class="flex gap-2"><button> </button> <button class="flex-1 px-2 py-1.5 border rounded text-sm border-gray-200 hover:bg-gray-50">📏 Set Scale</button></div> <button class="w-full px-2 py-1.5 border border-red-300 rounded text-sm text-red-600 hover:bg-red-50">Remove Image</button></div></div>`);
-var root$3 = /* @__PURE__ */ from_html(`<div data-properties-panel="" style="top: 48px; bottom: 36px;"><!> <!></div>`);
+var root$3 = /* @__PURE__ */ from_html(`<div data-properties-panel="" style="top: 0; bottom: 0;"><!> <!></div>`);
 function PropertiesPanel($$anchor, $$props) {
 	push($$props, true);
 	const $projectSettings = () => store_get(projectSettings, "$projectSettings", $$stores);
@@ -61116,7 +61278,7 @@ function PropertiesPanel($$anchor, $$props) {
 		if (get(hasBgImage) && ((_$$get19 = get(floor)) === null || _$$get19 === void 0 ? void 0 : _$$get19.backgroundImage)) $$render(consequent_14);
 	});
 	reset(div);
-	template_effect(() => classes = set_class(div, 1, `${is3D() ? "w-80" : "w-64"} shrink-0 bg-white border-l border-gray-200 flex flex-col overflow-y-auto p-3 fixed right-0 z-40 shadow-lg`, null, classes, { hidden: !get(hasSelection) }));
+	template_effect(() => classes = set_class(div, 1, `${is3D() ? "w-80" : "w-64"} shrink-0 bg-white border-l border-gray-200 flex flex-col overflow-y-auto p-3 absolute right-0 z-40 shadow-lg`, null, classes, { hidden: !get(hasSelection) }));
 	delegated("keydown", div, stopShortcutBubble);
 	event("keydown", div, stopShortcutBubble, true);
 	append($$anchor, div);
@@ -66736,13 +66898,19 @@ function FloorPlanCanvas($$anchor, $$props) {
 			markDirty();
 		});
 		const unsubZoom = canvasZoom.subscribe((v) => {
+			if (get(zoom) === v) return;
 			set(zoom, v, true);
+			markDirty();
 		});
 		const unsubCamX = canvasCamX.subscribe((v) => {
+			if (get(camX) === v) return;
 			set(camX, v, true);
+			markDirty();
 		});
 		const unsubCamY = canvasCamY.subscribe((v) => {
+			if (get(camY) === v) return;
 			set(camY, v, true);
+			markDirty();
 		});
 		function handlePaste(e) {
 			if (!e.clipboardData) return;
@@ -68941,12 +69109,15 @@ function FloorPlanCanvas($$anchor, $$props) {
 			set(camX, worldCX - (get(width) / 2 - get(width) / 2) / newZoom);
 			set(camY, worldCY - (get(height) / 2 - get(height) / 2) / newZoom);
 			set(zoom, newZoom, true);
+			markDirty();
 		});
 		delegated("click", button_12, () => {
 			set(zoom, 1);
+			markDirty();
 		});
 		delegated("click", button_13, () => {
 			set(zoom, Math.min(10, get(zoom) * 1.25), true);
+			markDirty();
 		});
 		delegated("click", button_14, () => zoomToFit());
 		append($$anchor, fragment);
@@ -69948,6 +70119,17 @@ var CAMERA_SPACING = 40;
 var CAMERA_HIT = 28;
 /** Avoid spamming host with the same rejection. */
 var lastRejectedKey = "";
+/**
+* Serials last applied from host `assignedCameras`.
+* Empty + never synced ⇒ do not strip cameras that came from floorData
+* (host may load a saved floor without passing assignedCameras).
+*/
+var lastSyncedSerials = /* @__PURE__ */ new Set();
+/** Call when host replaces floorData so load doesn't fight a stale sync set. */
+function resetAssignedCamerasSyncState() {
+	lastSyncedSerials = /* @__PURE__ */ new Set();
+	lastRejectedKey = "";
+}
 function getCameraFurniture(floor) {
 	return floor.furniture.filter((f) => f.catalogId === "camera");
 }
@@ -70033,9 +70215,11 @@ function syncAssignedCameras(assigned) {
 		});
 	}
 	if (toAdd.length > 0 && !hasFloorLayout) rejectNoFloor(toAdd);
+	const newSerials = new Set(normalized.map((c) => String(c.serial).trim()));
+	const hostDrivesAssignment = newSerials.size > 0 || lastSyncedSerials.size > 0;
 	setAssignedCamerasSyncing(true);
 	try {
-		for (const item of existing) {
+		if (hostDrivesAssignment) for (const item of existing) {
 			if (!item.serial) continue;
 			if (!assignedBySerial.has(item.serial)) removeFurniture(item.id);
 		}
@@ -70049,10 +70233,14 @@ function syncAssignedCameras(assigned) {
 			nextProps.serial = item.serial;
 			if (!propsEqual(item.props, nextProps) || item.name !== nextProps.name) applyCameraProps(item.id, assignedCam);
 		}
-		if (!hasFloorLayout) return;
+		if (!hasFloorLayout) {
+			if (hostDrivesAssignment || newSerials.size > 0) lastSyncedSerials = newSerials;
+			return;
+		}
 		const center = getFloorCenter(floorAfterRemove);
 		if (!center) {
 			rejectNoFloor(toAdd);
+			if (hostDrivesAssignment || newSerials.size > 0) lastSyncedSerials = newSerials;
 			return;
 		}
 		lastRejectedKey = "";
@@ -70063,6 +70251,7 @@ function syncAssignedCameras(assigned) {
 			applyCameraProps(addFurniture("camera", findOpenCameraPosition(workingFloor, center)), cam);
 			workingFloor = get$1(activeFloor);
 		}
+		lastSyncedSerials = newSerials;
 	} finally {
 		setAssignedCamerasSyncing(false);
 	}
@@ -70074,7 +70263,7 @@ init_index_client();
 var root_2 = /* @__PURE__ */ from_html(`<div class="shrink-0 h-full overflow-hidden transition-[width] duration-300 ease-in-out"><div><!></div></div>`);
 var root_3 = /* @__PURE__ */ from_html(`<!> <!>`, 1);
 var root_7 = /* @__PURE__ */ from_html(`<div class="fixed inset-0 bg-black/50 flex items-center justify-center z-50" role="dialog" tabindex="-1" aria-label="Keyboard Shortcuts"><div class="bg-white rounded-2xl shadow-2xl max-w-2xl w-full mx-4 max-h-[85vh] flex flex-col" role="document"><div class="flex items-center justify-between px-6 pt-5 pb-3 border-b border-gray-100"><div class="flex items-center gap-2"><svg class="w-5 h-5 text-slate-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707"></path></svg> <h2 class="text-lg font-bold text-slate-800">Keyboard Shortcuts</h2></div> <div class="flex items-center gap-2"><button class="text-xs px-3 py-1.5 rounded-lg bg-slate-100 hover:bg-slate-200 text-slate-600 hover:text-slate-800 transition-colors flex items-center gap-1.5" aria-label="Copy all shortcuts"><svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg> Copy All</button> <button class="text-gray-400 hover:text-gray-600 text-xl leading-none" aria-label="Close shortcuts">✕</button></div></div> <div class="overflow-y-auto px-6 py-4"><div class="grid grid-cols-2 gap-x-8 gap-y-0 text-sm"><div><div class="flex items-center gap-2 mb-2"><span class="text-xs font-bold uppercase tracking-wider text-indigo-500">Tools</span> <div class="flex-1 h-px bg-indigo-100"></div></div> <div class="space-y-1.5 mb-5"><div class="flex justify-between"><span class="text-gray-600">Select tool</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">V</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Wall tool</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">W</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Door tool</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">D</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Pan mode</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">H</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Measure tool</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">M</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Annotate tool</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">N</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Text tool</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">T</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Toggle snap</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">S</kbd></div></div> <div class="flex items-center gap-2 mb-2"><span class="text-xs font-bold uppercase tracking-wider text-amber-500">Edit</span> <div class="flex-1 h-px bg-amber-100"></div></div> <div class="space-y-1.5 mb-5"><div class="flex justify-between"><span class="text-gray-600">Undo</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+Z</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Redo</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+Y</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Copy</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+C</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Paste</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+V</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Select all</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+A</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Deselect all</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+D</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Save project</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+S</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Cancel / Deselect</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Esc</kbd></div></div></div> <div><div class="flex items-center gap-2 mb-2"><span class="text-xs font-bold uppercase tracking-wider text-emerald-500">Elements</span> <div class="flex-1 h-px bg-emerald-100"></div></div> <div class="space-y-1.5 mb-5"><div class="flex justify-between"><span class="text-gray-600">Rotate element</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">R</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Delete selected</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Del</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Lock / Unlock</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+L</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Group selection</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+G</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Ungroup</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Ctrl+⇧+G</kbd></div></div> <div class="flex items-center gap-2 mb-2"><span class="text-xs font-bold uppercase tracking-wider text-blue-500">View</span> <div class="flex-1 h-px bg-blue-100"></div></div> <div class="space-y-1.5 mb-5"><div class="flex justify-between"><span class="text-gray-600">Toggle 2D / 3D</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Tab</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Zoom to fit</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">F</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Toggle grid</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">G</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Toggle layers</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">L</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Show shortcuts</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">?</kbd></div></div> <div class="flex items-center gap-2 mb-2"><span class="text-xs font-bold uppercase tracking-wider text-purple-500">Canvas</span> <div class="flex-1 h-px bg-purple-100"></div></div> <div class="space-y-1.5 mb-5"><div class="flex justify-between"><span class="text-gray-600">Zoom in / out</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Scroll</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Zoom in / out</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">+ / −</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Pan canvas</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Space+Drag</kbd></div></div> <div class="flex items-center gap-2 mb-2"><span class="text-xs font-bold uppercase tracking-wider text-rose-500">Walls</span> <div class="flex-1 h-px bg-rose-100"></div></div> <div class="space-y-1.5"><div class="flex justify-between"><span class="text-gray-600">Finish wall chain</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">Dbl-click</kbd></div> <div class="flex justify-between"><span class="text-gray-600">Close wall loop</span><kbd class="px-1.5 py-0.5 bg-gray-100 rounded text-xs font-mono text-slate-700 border border-gray-200">C</kbd></div></div></div></div></div> <div class="px-6 py-3 border-t border-gray-100 text-center"><p class="text-xs text-gray-400">Press <kbd class="px-1 py-0.5 bg-gray-100 rounded text-xs font-mono border border-gray-200">?</kbd> or <kbd class="px-1 py-0.5 bg-gray-100 rounded text-xs font-mono border border-gray-200">Esc</kbd> to close</p></div></div></div>`);
-var root = /* @__PURE__ */ from_html(`<div class="h-full flex flex-col overflow-hidden"><!> <div class="flex flex-1 overflow-hidden"><!> <div class="flex-1 min-w-0 relative"><!></div> <!> <!></div></div> <!> <!> <!> <!> <!>`, 1);
+var root = /* @__PURE__ */ from_html(`<div class="h-full flex flex-col overflow-hidden"><!> <div class="flex flex-1 overflow-hidden relative"><!> <div class="flex-1 min-w-0 relative"><!></div> <!> <!></div></div> <!> <!> <!> <!> <!>`, 1);
 function App($$anchor, $$props) {
 	var _$$props$stores, _$$props$stores2;
 	push($$props, true);
@@ -70114,6 +70303,7 @@ function App($$anchor, $$props) {
 		set(mode, m, true);
 	});
 	user_effect(() => {
+		resetAssignedCamerasSyncState();
 		currentProject.set(normalizeFloorData(get(floorData)));
 	});
 	user_effect(() => {
@@ -70156,20 +70346,29 @@ function App($$anchor, $$props) {
 	var div = first_child(fragment);
 	var node = child(div);
 	var consequent = ($$anchor) => {
-		TopBar($$anchor, {
-			get viewOnly() {
-				return get(config).viewOnly;
-			},
-			get onDispatch() {
-				return $$props.onDispatch;
-			},
-			get showBuildSidebar() {
-				return get(showBuildSidebar);
-			},
-			set showBuildSidebar($$value) {
-				set(showBuildSidebar, $$value, true);
-			}
-		});
+		{
+			let $0 = /* @__PURE__ */ user_derived(() => {
+				var _$$get$headerToolsMod;
+				return (_$$get$headerToolsMod = get(config).headerToolsMode) !== null && _$$get$headerToolsMod !== void 0 ? _$$get$headerToolsMod : "full";
+			});
+			TopBar($$anchor, {
+				get viewOnly() {
+					return get(config).viewOnly;
+				},
+				get headerToolsMode() {
+					return get($0);
+				},
+				get onDispatch() {
+					return $$props.onDispatch;
+				},
+				get showBuildSidebar() {
+					return get(showBuildSidebar);
+				},
+				set showBuildSidebar($$value) {
+					set(showBuildSidebar, $$value, true);
+				}
+			});
+		}
 	};
 	if_block(node, ($$render) => {
 		if (!get(config).viewOnly) $$render(consequent);