npm - @dickpy/dsh-imagegen - Versions diffs - 1.0.9 → 1.0.19 - Mend

@dickpy/dsh-imagegen 1.0.9 → 1.0.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/README.md +19 -4
package/docs/images/prompt-template-library.png +0 -0
package/lib/client.js +1151 -464
package/lib/client.js.map +1 -1
package/lib/index.js +441 -36
package/package.json +3 -3
package/src/client/ImageGenPanel.tsx +452 -62
package/src/client/api.ts +38 -1
package/src/client/locales.ts +71 -22
package/src/client/mount.tsx +11 -6
package/src/client/panel.module.css +209 -7
package/src/engine.ts +78 -11
package/src/gallery-store.ts +266 -0
package/src/index.ts +2 -1
package/src/protocol.ts +21 -5
package/src/routes.ts +119 -1

package/lib/client.js CHANGED Viewed

@@ -12,7 +12,7 @@ window.__ModuleLoader__.load({
 		let _deepseek_ai_dsh_client_runtime_client = require("@deepseek-ai/dsh-client-runtime/client");
 		//#region src/protocol.ts
 		/** Published package version shared by the host updater and the client UI. */
-		const PLUGIN_VERSION = "1.0.9";
+		const PLUGIN_VERSION = "1.0.19";
 		/** Same-origin route family (loopback-only, mirroring the dsh-ssh fence). */
 		const SETTINGS_API = {
 			describe: "/api/dsh-imagegen/settings/describe",
@@ -39,6 +39,18 @@ window.__ModuleLoader__.load({
 			image: "/api/dsh-imagegen/history/image"
 		};
 		/**
+		* Same-origin route family for the user-curated gallery (favorites). Entries
+		* reuse the history wire shape and persist under ~/.dsh/dsh-imagegen/gallery/;
+		* unlike history there is no size cap 鈥?the user adds images on purpose.
+		*/
+		const GALLERY_API = {
+			list: "/api/dsh-imagegen/gallery/list",
+			append: "/api/dsh-imagegen/gallery/append",
+			remove: "/api/dsh-imagegen/gallery/remove",
+			clear: "/api/dsh-imagegen/gallery/clear",
+			image: "/api/dsh-imagegen/gallery/image"
+		};
+		/**
 		* Same-origin route family for the bundled prompt-template library
 		* (awesome-gpt-image-2 mirror). The case list ships inside the package and is
 		* served by the host; reference images are proxied through the `image` prefix
@@ -125,6 +137,35 @@ window.__ModuleLoader__.load({
 			async historyClear() {
 				return (await readEnvelope(await fetch(HISTORY_API.clear, { method: "POST" }))).entries;
 			}
+			/** List the host-persisted gallery (newest first). */
+			async galleryList() {
+				return (await readEnvelope(await fetch(GALLERY_API.list, { method: "POST" }))).entries;
+			}
+			/** Append one image to the gallery. The host assigns the id and skips the
+			*  append when a content-identical image is already in the gallery. */
+			async galleryAppend(entry) {
+				const body = await readEnvelope(await fetch(GALLERY_API.append, {
+					method: "POST",
+					headers: { "content-type": "application/json" },
+					body: JSON.stringify({ entry })
+				}));
+				return {
+					entries: body.entries,
+					added: body.added
+				};
+			}
+			/** Remove one gallery entry by id. */
+			async galleryRemove(id) {
+				return (await readEnvelope(await fetch(GALLERY_API.remove, {
+					method: "POST",
+					headers: { "content-type": "application/json" },
+					body: JSON.stringify({ id })
+				}))).entries;
+			}
+			/** Clear the entire gallery. */
+			async galleryClear() {
+				return (await readEnvelope(await fetch(GALLERY_API.clear, { method: "POST" }))).entries;
+			}
 			/** Fetch the prompt-template library (bundled snapshot or refreshed copy). */
 			async templatesList() {
 				const body = await readEnvelope(await fetch(TEMPLATES_API.list, { method: "POST" }));
@@ -185,9 +226,9 @@ window.__ModuleLoader__.load({
 		*/
 		const zh = {
 			"entry.label": "AI 生图",
-			"entry.tooltip": "AI 生图面板（gpt-image-2）",
+			"entry.tooltip": "AI 生图面板（gpt-image-2 / grok-imagine-image）",
 			"panel.title": "AI 生图",
-			"panel.subtitle": "gpt-image-2 图像生成",
+			"panel.githubTip": "觉得好用或有建议？欢迎来 GitHub 提 issues、点个 star 支持一下！",
 			"mode.text": "文生图",
 			"mode.edit": "图生图",
 			"prompt.placeholder": "描述你想要的画面，例如：一只戴着宇航员头盔的橘猫，在月球上举起望远镜，水彩风格，柔和光线…",
@@ -198,16 +239,18 @@ window.__ModuleLoader__.load({
 			"params.count": "生成数量",
 			"params.detail": "细节",
 			"size.auto": "自动",
-			"size.square": "1024×1024",
-			"size.landscape": "1536×1024",
-			"size.portrait": "1024×1536",
-			"size.small": "512×512",
-			"size.wide": "1792×1024",
-			"size.tall": "1024×1792",
+			"size.square": "1:1 方图",
+			"size.portrait34": "3:4 标准竖图",
+			"size.landscape43": "4:3 标准横图",
+			"size.portrait916": "9:16 竖屏",
+			"size.portrait23": "2:3 竖图",
+			"size.landscape32": "3:2 横图",
+			"size.wide169": "16:9 宽屏",
+			"size.ultrawide21": "21:9 超宽屏",
 			"quality.auto": "自动",
-			"quality.low": "低",
-			"quality.medium": "中",
-			"quality.high": "高",
+			"quality.1k": "1K",
+			"quality.2k": "2K",
+			"quality.4k": "4K",
 			"count.one": "1 张",
 			"count.two": "2 张",
 			"count.three": "3 张",
@@ -239,6 +282,28 @@ window.__ModuleLoader__.load({
 			"history.delete": "删除",
 			"history.images": "张",
 			"history.viewing": "历史 · {time}",
+			"gallery.title": "画廊",
+			"gallery.categories": "分类",
+			"gallery.all": "全部作品",
+			"gallery.gpt": "gpt-image-2",
+			"gallery.grok": "grok-imagine-image",
+			"gallery.ratio": "画面比例",
+			"gallery.filterHint": "按生成模式、模型和比例筛选画廊",
+			"gallery.count": "· 共 {count} 幅",
+			"gallery.viewMode": "视图模式",
+			"gallery.masonry": "瀑布流",
+			"gallery.grid": "整齐网格",
+			"gallery.sort": "排序",
+			"gallery.newest": "最新发布",
+			"gallery.oldest": "最早发布",
+			"gallery.untitled": "未命名作品",
+			"gallery.add": "加入画廊",
+			"gallery.added": "已加入画廊",
+			"gallery.already": "已在画廊中",
+			"gallery.delete": "移出画廊",
+			"gallery.clear": "清空画廊",
+			"gallery.empty": "画廊还是空的，把喜欢的图片加入进来吧",
+			"gallery.viewing": "画廊 · {time}",
 			"preview.title": "图片预览",
 			"preview.open": "点击预览",
 			"preview.close": "关闭",
@@ -322,9 +387,9 @@ window.__ModuleLoader__.load({
 		};
 		const en = {
 			"entry.label": "AI Image",
-			"entry.tooltip": "AI image generation studio (gpt-image-2)",
+			"entry.tooltip": "AI image generation studio (gpt-image-2 / grok-imagine-image)",
 			"panel.title": "AI Image",
-			"panel.subtitle": "gpt-image-2 image generation",
+			"panel.githubTip": "Like it or have suggestions? Head to GitHub to open issues and star us!",
 			"mode.text": "Text to Image",
 			"mode.edit": "Image to Image",
 			"prompt.placeholder": "Describe the picture you want, e.g. an orange cat in an astronaut helmet raising a telescope on the moon, watercolor style, soft light…",
@@ -335,16 +400,18 @@ window.__ModuleLoader__.load({
 			"params.count": "Count",
 			"params.detail": "Detail",
 			"size.auto": "Auto",
-			"size.square": "1024×1024",
-			"size.landscape": "1536×1024",
-			"size.portrait": "1024×1536",
-			"size.small": "512×512",
-			"size.wide": "1792×1024",
-			"size.tall": "1024×1792",
+			"size.square": "1:1 Square",
+			"size.portrait34": "3:4 Portrait",
+			"size.landscape43": "4:3 Landscape",
+			"size.portrait916": "9:16 Vertical",
+			"size.portrait23": "2:3 Portrait",
+			"size.landscape32": "3:2 Landscape",
+			"size.wide169": "16:9 Widescreen",
+			"size.ultrawide21": "21:9 Ultrawide",
 			"quality.auto": "Auto",
-			"quality.low": "Low",
-			"quality.medium": "Medium",
-			"quality.high": "High",
+			"quality.1k": "1K",
+			"quality.2k": "2K",
+			"quality.4k": "4K",
 			"count.one": "1",
 			"count.two": "2",
 			"count.three": "3",
@@ -376,6 +443,28 @@ window.__ModuleLoader__.load({
 			"history.delete": "Delete",
 			"history.images": "images",
 			"history.viewing": "History · {time}",
+			"gallery.title": "Gallery",
+			"gallery.categories": "Categories",
+			"gallery.all": "All works",
+			"gallery.gpt": "gpt-image-2",
+			"gallery.grok": "grok-imagine-image",
+			"gallery.ratio": "Aspect ratio",
+			"gallery.filterHint": "Filter by mode, model, and aspect ratio",
+			"gallery.count": "· {count} works",
+			"gallery.viewMode": "View mode",
+			"gallery.masonry": "Masonry",
+			"gallery.grid": "Grid",
+			"gallery.sort": "Sort",
+			"gallery.newest": "Newest",
+			"gallery.oldest": "Oldest",
+			"gallery.untitled": "Untitled work",
+			"gallery.add": "Add to gallery",
+			"gallery.added": "Added to gallery",
+			"gallery.already": "Already in gallery",
+			"gallery.delete": "Remove",
+			"gallery.clear": "Clear gallery",
+			"gallery.empty": "The gallery is empty — add images you like here",
+			"gallery.viewing": "Gallery · {time}",
 			"preview.title": "Image preview",
 			"preview.open": "Click to preview",
 			"preview.close": "Close",
@@ -494,46 +583,46 @@ window.__ModuleLoader__.load({
 		}
 		var templates_module_css_default = {
 			"title": "o0mAxG_title",
-			"meta": "o0mAxG_meta",
-			"cardBody": "o0mAxG_cardBody",
-			"thumb": "o0mAxG_thumb",
-			"cardSource": "o0mAxG_cardSource",
-			"card": "o0mAxG_card",
-			"detailActions": "o0mAxG_detailActions",
-			"dsh-imagegen-templates-spin": "o0mAxG_dsh-imagegen-templates-spin",
+			"cardCategory": "o0mAxG_cardCategory",
+			"cardTitle": "o0mAxG_cardTitle",
 			"sourceLink": "o0mAxG_sourceLink",
-			"detailOverlay": "o0mAxG_detailOverlay",
-			"thumbPlaceholder": "o0mAxG_thumbPlaceholder",
-			"close": "o0mAxG_close",
-			"detailMedia": "o0mAxG_detailMedia",
-			"state": "o0mAxG_state",
-			"toolbar": "o0mAxG_toolbar",
+			"detailInfo": "o0mAxG_detailInfo",
+			"heading": "o0mAxG_heading",
 			"detailMeta": "o0mAxG_detailMeta",
+			"attribution": "o0mAxG_attribution",
+			"detailLink": "o0mAxG_detailLink",
+			"detailActions": "o0mAxG_detailActions",
+			"shell": "o0mAxG_shell",
+			"card": "o0mAxG_card",
+			"body": "o0mAxG_body",
 			"featuredBadge": "o0mAxG_featuredBadge",
-			"cardCategory": "o0mAxG_cardCategory",
+			"footer": "o0mAxG_footer",
+			"meta": "o0mAxG_meta",
+			"dsh-imagegen-templates-spin": "o0mAxG_dsh-imagegen-templates-spin",
 			"spinner": "o0mAxG_spinner",
-			"thumbWrap": "o0mAxG_thumbWrap",
-			"detailTitle": "o0mAxG_detailTitle",
+			"headerActions": "o0mAxG_headerActions",
 			"overlay": "o0mAxG_overlay",
-			"categoryRow": "o0mAxG_categoryRow",
-			"categoryPill": "o0mAxG_categoryPill",
 			"notice": "o0mAxG_notice",
-			"body": "o0mAxG_body",
-			"detail": "o0mAxG_detail",
-			"header": "o0mAxG_header",
-			"attribution": "o0mAxG_attribution",
-			"detailInfo": "o0mAxG_detailInfo",
-			"footer": "o0mAxG_footer",
-			"shell": "o0mAxG_shell",
-			"detailPrompt": "o0mAxG_detailPrompt",
-			"headerActions": "o0mAxG_headerActions",
-			"heading": "o0mAxG_heading",
-			"cardTitle": "o0mAxG_cardTitle",
-			"cardMeta": "o0mAxG_cardMeta",
+			"thumbWrap": "o0mAxG_thumbWrap",
+			"cardSource": "o0mAxG_cardSource",
+			"thumbPlaceholder": "o0mAxG_thumbPlaceholder",
 			"detailImage": "o0mAxG_detailImage",
-			"search": "o0mAxG_search",
+			"categoryRow": "o0mAxG_categoryRow",
+			"thumb": "o0mAxG_thumb",
+			"cardMeta": "o0mAxG_cardMeta",
+			"detailMedia": "o0mAxG_detailMedia",
 			"grid": "o0mAxG_grid",
-			"detailLink": "o0mAxG_detailLink"
+			"cardBody": "o0mAxG_cardBody",
+			"detail": "o0mAxG_detail",
+			"search": "o0mAxG_search",
+			"detailTitle": "o0mAxG_detailTitle",
+			"detailOverlay": "o0mAxG_detailOverlay",
+			"header": "o0mAxG_header",
+			"categoryPill": "o0mAxG_categoryPill",
+			"toolbar": "o0mAxG_toolbar",
+			"close": "o0mAxG_close",
+			"state": "o0mAxG_state",
+			"detailPrompt": "o0mAxG_detailPrompt"
 		};
 		//#endregion
 		//#region src/client/TemplateLibrary.tsx
@@ -1010,7 +1099,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-css:E:\dsh-plugin\src\client\panel.module.css.mjs
-		const css$1 = "[data-pane=conversation]{position:relative}[data-dsh-imagegen-view]{z-index:60;background:var(--dsw-alias-bg-base);display:none;position:absolute;inset:0}html[data-dsh-imagegen-active]:not([data-dsh-taskboard-active]):not([data-dsh-ssh-active]) [data-dsh-imagegen-view]{display:block}html[data-dsh-imagegen-active]:not([data-dsh-taskboard-active]):not([data-dsh-ssh-active]) [data-pane=conversation]>:not([data-dsh-imagegen-view]),html[data-dsh-imagegen-active]:not([data-dsh-taskboard-active]):not([data-dsh-ssh-active]) [class*=centerCol]>:not([data-dsh-imagegen-view]){display:none!important}.Yvqh9W_entry{width:100%;height:32px;color:var(--dsw-alias-label-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:0 12px;font-size:13px;display:flex}.Yvqh9W_entry:hover{background:var(--dsw-specific-sidebar-nav-item-hover);color:var(--dsw-alias-label-primary)}.Yvqh9W_entry[data-active]{background:var(--dsw-specific-sidebar-nav-item-active);color:var(--dsw-alias-label-primary);font-weight:600}.Yvqh9W_entryIcon{flex:none;justify-content:center;align-items:center;display:inline-flex}.Yvqh9W_entryLabel{text-overflow:ellipsis;overflow:hidden}[data-dsh-frame][data-sidebar-collapsed] .Yvqh9W_entry{justify-content:center;width:100%;padding:0}[data-dsh-frame][data-sidebar-collapsed] .Yvqh9W_entryLabel{display:none}.Yvqh9W_view{overflow:hidden}.Yvqh9W_panel,.Yvqh9W_panel *,.Yvqh9W_panel :before,.Yvqh9W_panel :after{box-sizing:border-box}.Yvqh9W_panel{background:var(--dsw-alias-bg-base);min-width:0;height:100%;min-height:0;color:var(--dsw-alias-label-primary);font-family:var(--dsw-font-family);flex-direction:column;gap:10px;padding:14px 16px 16px;display:flex;overflow:hidden}.Yvqh9W_panelHeader{flex:none;justify-content:space-between;align-items:center;gap:12px;display:flex}.Yvqh9W_panelHeading{align-items:baseline;gap:10px;min-width:0;display:flex}.Yvqh9W_panelTitle{color:var(--dsw-alias-label-primary);white-space:nowrap;margin:0;font-size:16px;font-weight:700}.Yvqh9W_panelSubtitle{color:var(--dsw-alias-label-tertiary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.Yvqh9W_connectionStatus{border:1px solid var(--dsw-alias-label-error);height:28px;color:var(--dsw-alias-label-error);font:inherit;white-space:nowrap;background:0 0;border-radius:8px;flex:none;align-items:center;gap:6px;padding:0 10px;font-size:12px;line-height:1;display:inline-flex}.Yvqh9W_connectionStatus[data-connected=true]{border-color:var(--dsw-alias-state-success-primary);color:var(--dsw-alias-state-success-primary)}.Yvqh9W_connectionDot{background:currentColor;border-radius:50%;width:6px;height:6px}.Yvqh9W_updateBanner{border:1px solid var(--dsw-alias-state-warn-primary);color:var(--dsw-alias-state-warn-primary);overflow-wrap:anywhere;border-radius:10px;flex:none;justify-content:space-between;align-items:center;gap:12px;padding:7px 10px 7px 12px;font-size:12px;line-height:1.5;display:flex}.Yvqh9W_updateBanner[data-kind=ok]{color:var(--dsw-alias-state-success-primary);border-color:var(--dsw-alias-state-success-primary)}.Yvqh9W_updateText{min-width:0}.Yvqh9W_updateActions{flex:none;align-items:center;gap:10px;display:inline-flex}.Yvqh9W_updateRelease{color:inherit;text-underline-offset:2px;white-space:nowrap;text-decoration:underline}@media (width<=700px){.Yvqh9W_panelHeader{align-items:flex-start}.Yvqh9W_panelHeading{flex-direction:column;align-items:flex-start;gap:2px}.Yvqh9W_updateBanner{flex-direction:column;align-items:flex-start}.Yvqh9W_updateActions{justify-content:space-between;width:100%}}.Yvqh9W_studio{flex:1;gap:14px;min-width:0;min-height:0;display:flex}.Yvqh9W_config{flex-direction:column;flex:none;gap:12px;width:300px;min-width:260px;max-width:340px;height:100%;min-height:0;display:flex;overflow:hidden}.Yvqh9W_configScroll{scrollbar-width:thin;scrollbar-color:var(--dsw-alias-border-l2) transparent;flex-direction:column;flex:1;gap:12px;min-height:0;padding-right:2px;display:flex;overflow-y:auto}.Yvqh9W_configScroll::-webkit-scrollbar{width:8px}.Yvqh9W_configScroll::-webkit-scrollbar-thumb{background:var(--dsw-alias-border-l2);border-radius:999px}.Yvqh9W_canvas{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);border-radius:12px;flex-direction:column;flex:1;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.Yvqh9W_history{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);border-radius:12px;flex-direction:column;flex:none;width:240px;min-width:200px;max-width:280px;min-height:0;display:flex;overflow:hidden}.Yvqh9W_historyHeader{border-bottom:1px solid var(--dsw-alias-border-l1);flex:none;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;display:flex}.Yvqh9W_historyTitle{color:var(--dsw-alias-label-primary);font-size:13px;font-weight:600}.Yvqh9W_historyClear{font:inherit;color:var(--dsw-alias-label-tertiary);border:1px solid var(--dsw-alias-border-l2);cursor:pointer;background:0 0;border-radius:999px;padding:2px 8px;font-size:11.5px}.Yvqh9W_historyClear:hover{color:var(--dsw-alias-label-error);border-color:var(--dsw-alias-label-error)}.Yvqh9W_historyList{scrollbar-width:thin;scrollbar-color:var(--dsw-alias-border-l2) transparent;flex-direction:column;flex:1;gap:8px;min-height:0;padding:10px;display:flex;overflow-y:auto}.Yvqh9W_historyList::-webkit-scrollbar{width:8px}.Yvqh9W_historyList::-webkit-scrollbar-thumb{background:var(--dsw-alias-border-l2);border-radius:999px}.Yvqh9W_historyEmpty{text-align:center;color:var(--dsw-alias-label-tertiary);flex:1;justify-content:center;align-items:center;padding:20px;font-size:12px;line-height:1.6;display:flex}.Yvqh9W_historyItem{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-2);border-radius:10px;flex-direction:column;flex:none;gap:6px;padding:8px;display:flex}.Yvqh9W_historyItem:hover{border-color:var(--dsw-alias-border-l2)}.Yvqh9W_historyItem[data-active]{border-color:var(--dsw-alias-brand-primary)}.Yvqh9W_historyMain{font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;align-items:flex-start;gap:8px;min-width:0;padding:0;display:flex}.Yvqh9W_historyThumb{object-fit:cover;background:var(--dsw-alias-bg-base);border-radius:8px;flex:none;width:52px;height:52px}.Yvqh9W_historyThumbPlaceholder{background:var(--dsw-alias-bg-layer-3);border-radius:8px;flex:none;width:52px;height:52px}.Yvqh9W_historyInfo{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.Yvqh9W_historyPrompt{color:var(--dsw-alias-label-primary);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;line-height:1.4;display:-webkit-box;overflow:hidden}.Yvqh9W_historyMeta{color:var(--dsw-alias-label-tertiary);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.Yvqh9W_historyActions{justify-content:flex-end;gap:6px;display:flex}.Yvqh9W_historyAction{font:inherit;color:var(--dsw-alias-label-secondary);border:1px solid var(--dsw-alias-border-l2);cursor:pointer;background:0 0;border-radius:999px;padding:2px 8px;font-size:11.5px}.Yvqh9W_historyAction:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-dimmed)}.Yvqh9W_historyAction[data-danger]:hover{color:var(--dsw-alias-label-error);border-color:var(--dsw-alias-label-error)}.Yvqh9W_card{background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l1);border-radius:12px;flex-direction:column;flex:none;gap:10px;padding:12px;display:flex}.Yvqh9W_modeRow{align-items:center;gap:8px;display:flex}.Yvqh9W_modePill{flex:1;justify-content:center;height:28px;font-size:13px}.Yvqh9W_uploadBox{min-height:128px;color:var(--dsw-alias-label-secondary);border:1.5px dashed var(--dsw-alias-border-l2);cursor:pointer;font:inherit;text-align:center;background:0 0;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:16px;font-size:12.5px;display:flex}.Yvqh9W_uploadBox:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-dimmed);background:var(--dsw-alias-interactive-bg-hover)}.Yvqh9W_uploadBox:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.Yvqh9W_uploadIcon{color:var(--dsw-alias-label-tertiary);display:inline-flex}.Yvqh9W_uploadHint{color:var(--dsw-alias-label-tertiary);font-size:11px}.Yvqh9W_reference{flex-direction:column;gap:8px;display:flex}.Yvqh9W_referenceImage{object-fit:contain;background:var(--dsw-alias-bg-base);border:1px solid var(--dsw-alias-border-l1);border-radius:10px;width:100%;max-height:176px}.Yvqh9W_referenceActions{gap:8px;display:flex}.Yvqh9W_hiddenFile{display:none}.Yvqh9W_prompt{width:100%;min-height:120px;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-3);border:1px solid var(--dsw-alias-border-l2);resize:vertical;box-sizing:border-box;border-radius:10px;outline:none;padding:10px 12px;font-family:inherit;font-size:13px;line-height:1.6}.Yvqh9W_prompt:focus-visible{border-color:var(--dsw-alias-brand-primary)}.Yvqh9W_prompt::placeholder{color:var(--dsw-alias-label-tertiary)}.Yvqh9W_promptFooter{justify-content:space-between;align-items:center;gap:8px;margin-top:-6px;display:flex}.Yvqh9W_templatesButton{border:1px solid var(--dsw-alias-brand-primary);background:linear-gradient(135deg, color-mix(in srgb, var(--dsw-alias-brand-primary) 14%, transparent), color-mix(in srgb, var(--dsw-alias-brand-primary) 5%, transparent));height:26px;color:var(--dsw-alias-brand-primary);cursor:pointer;box-shadow:0 1px 0 color-mix(in srgb, var(--dsw-alias-brand-primary) 22%, transparent);border-radius:999px;align-items:center;gap:6px;padding:0 12px;font-family:inherit;font-size:12px;font-weight:600;transition:transform .12s,box-shadow .12s,background .12s;display:inline-flex}.Yvqh9W_templatesButton svg{flex:none}.Yvqh9W_templatesButton:hover{background:linear-gradient(135deg, color-mix(in srgb, var(--dsw-alias-brand-primary) 24%, transparent), color-mix(in srgb, var(--dsw-alias-brand-primary) 8%, transparent));color:var(--dsw-alias-brand-primary);box-shadow:0 2px 6px color-mix(in srgb, var(--dsw-alias-brand-primary) 30%, transparent);transform:translateY(-1px)}.Yvqh9W_templatesButton:active{transform:translateY(0)}.Yvqh9W_promptCount{color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums;font-size:11px}.Yvqh9W_paramGroup{flex-direction:column;gap:8px;display:flex}.Yvqh9W_paramLabel{color:var(--dsw-alias-label-secondary);font-size:12px;font-weight:600}.Yvqh9W_optionRow{flex-wrap:wrap;gap:6px;display:flex}.Yvqh9W_optionGrid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.Yvqh9W_optionPill{justify-content:center}.Yvqh9W_paramHint{color:var(--dsw-alias-label-tertiary);font-size:11px;line-height:1.45}.Yvqh9W_footer{border-top:1px solid var(--dsw-alias-border-l1);flex-direction:column;flex:none;align-items:stretch;gap:8px;padding:10px 2px 0 0;display:flex}.Yvqh9W_modelWrap{flex-direction:column;gap:5px;min-width:0;display:flex}.Yvqh9W_modelLabel{color:var(--dsw-alias-label-secondary);font-size:12px;font-weight:600}.Yvqh9W_modelSelect{width:100%;height:36px;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);cursor:pointer;border-radius:18px;outline:none;padding:0 12px;font-family:inherit;font-size:13px}.Yvqh9W_modelSelect:focus-visible{border-color:var(--dsw-alias-brand-primary)}.Yvqh9W_modelSelect:disabled{opacity:.55}.Yvqh9W_generateButton{width:100%}.Yvqh9W_generateInner{align-items:center;gap:7px;display:inline-flex}.Yvqh9W_canvasState{text-align:center;color:var(--dsw-alias-label-tertiary);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;padding:24px;display:flex}.Yvqh9W_canvasStateTitle{color:var(--dsw-alias-label-secondary);font-size:14px;font-weight:600}.Yvqh9W_canvasStateHint{max-width:380px;font-size:12px;line-height:1.6}.Yvqh9W_canvasEmptyIcon{color:var(--dsw-alias-label-tertiary);margin-bottom:4px;display:inline-flex}.Yvqh9W_canvasError{color:var(--dsw-alias-label-error);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-label-error);overflow-wrap:anywhere;border-radius:10px;flex:none;margin:14px;padding:10px 14px;font-size:12.5px;line-height:1.6}.Yvqh9W_canvasBody{scrollbar-width:thin;scrollbar-color:var(--dsw-alias-border-l2) transparent;flex-direction:column;flex:1;gap:10px;min-height:0;padding:14px;display:flex;overflow-y:auto}.Yvqh9W_canvasBody::-webkit-scrollbar{width:8px}.Yvqh9W_canvasBody::-webkit-scrollbar-thumb{background:var(--dsw-alias-border-l2);border-radius:999px}.Yvqh9W_canvasMeta{color:var(--dsw-alias-label-tertiary);flex:none;align-items:center;gap:8px;font-size:12px;display:flex}.Yvqh9W_canvasHistoryTag{color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);white-space:nowrap;border-radius:999px;padding:1px 8px;font-size:11px}.Yvqh9W_grid{flex:1;grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;min-height:0;display:grid}.Yvqh9W_grid[data-count=\"1\"] .Yvqh9W_imageCard{grid-area:1/1/3/3}.Yvqh9W_imageCard{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-2);cursor:zoom-in;border-radius:12px;flex-direction:column;min-height:0;margin:0;display:flex;position:relative;overflow:hidden}.Yvqh9W_imageCard:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.Yvqh9W_image{object-fit:cover;background:var(--dsw-alias-bg-base);flex:1;width:100%;min-height:0;display:block}.Yvqh9W_imageCaption{color:var(--dsw-alias-label-tertiary);white-space:nowrap;text-overflow:ellipsis;border-top:1px solid var(--dsw-alias-border-l1);padding:7px 10px;font-size:11px;line-height:1.5;overflow:hidden}.Yvqh9W_download{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-mask-1);border:1px solid var(--dsw-alias-border-l2);opacity:0;backdrop-filter:blur(4px);border-radius:999px;padding:2px 10px;font-size:12px;font-weight:500;line-height:20px;text-decoration:none;transition:opacity .12s;position:absolute;top:8px;right:8px}.Yvqh9W_imageCard:hover .Yvqh9W_download{opacity:1}.Yvqh9W_download:hover{background:var(--dsw-alias-bg-base)}.Yvqh9W_zoomHint{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-mask-1);border:1px solid var(--dsw-alias-border-l2);opacity:0;backdrop-filter:blur(4px);pointer-events:none;border-radius:999px;align-items:center;gap:5px;padding:2px 10px;font-size:12px;font-weight:500;line-height:20px;transition:opacity .12s;display:inline-flex;position:absolute;bottom:8px;left:8px}.Yvqh9W_imageCard:hover .Yvqh9W_zoomHint{opacity:1}.Yvqh9W_spinner,.Yvqh9W_bigSpinner{border:2px solid;border-top-color:#0000;border-radius:50%;flex:none;animation:.8s linear infinite Yvqh9W_dshImageGenSpin;display:inline-block}.Yvqh9W_spinner{width:11px;height:11px}.Yvqh9W_bigSpinner{width:30px;height:30px;color:var(--dsw-alias-state-business-primary);border-width:3px;margin-bottom:6px}.Yvqh9W_lightbox{z-index:1000;backdrop-filter:blur(6px);background:#000000b8;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.Yvqh9W_lightboxClose{color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;display:inline-flex;position:absolute;top:16px;right:16px}.Yvqh9W_lightboxClose:hover{background:#ffffff42}.Yvqh9W_lightboxNav{color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;display:inline-flex;position:absolute;top:50%;transform:translateY(-50%)}.Yvqh9W_lightboxNav:hover{background:#ffffff42}.Yvqh9W_lightboxNav[data-dir=prev]{left:max(20px,50% - 640px)}.Yvqh9W_lightboxNav[data-dir=next]{right:max(20px,50% - 640px)}.Yvqh9W_lightboxFigure{flex-direction:column;gap:10px;width:min(1100px,100vw - 160px);max-width:min(1100px,100vw - 160px);height:min(820px,100vh - 48px);min-height:0;margin:0;display:flex}.Yvqh9W_lightboxStage{background:#ffffff0a;border-radius:10px;flex:1;min-height:0;position:relative;overflow:auto}.Yvqh9W_lightboxScaleFrame{justify-content:center;align-items:center;min-width:100%;min-height:100%;display:flex}.Yvqh9W_lightboxImage{object-fit:contain;border-radius:10px;max-width:100%;max-height:100%;display:block;box-shadow:0 24px 80px #00000080}.Yvqh9W_lightboxTools{justify-content:center;align-items:center;gap:6px;display:flex}.Yvqh9W_lightboxTool,.Yvqh9W_lightboxZoomLevel,.Yvqh9W_lightboxCopy{color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;justify-content:center;align-items:center;display:inline-flex}.Yvqh9W_lightboxTool,.Yvqh9W_lightboxZoomLevel{height:32px}.Yvqh9W_lightboxTool{border-radius:50%;width:32px}.Yvqh9W_lightboxZoomLevel{min-width:58px;font:inherit;font-variant-numeric:tabular-nums;border-radius:999px;padding:0 9px;font-size:12px}.Yvqh9W_lightboxTool:hover,.Yvqh9W_lightboxZoomLevel:hover,.Yvqh9W_lightboxCopy:hover{background:#ffffff42}.Yvqh9W_lightboxCaptionRow{align-items:flex-start;gap:8px;min-width:0;display:flex}.Yvqh9W_lightboxCaption{color:#ffffffe6;-webkit-line-clamp:3;-webkit-box-orient:vertical;flex:1;min-width:0;font-size:12px;line-height:1.6;display:-webkit-box;overflow:hidden}.Yvqh9W_lightboxCopy{min-height:28px;font:inherit;white-space:nowrap;border-radius:999px;flex:none;gap:5px;padding:4px 9px;font-size:12px}.Yvqh9W_lightboxMeta{justify-content:space-between;align-items:center;gap:12px;display:flex}.Yvqh9W_lightboxIndex{color:#fffc;font-variant-numeric:tabular-nums;font-size:12px}.Yvqh9W_lightboxActions{align-items:center;gap:8px;display:inline-flex}.Yvqh9W_lightboxDownload,.Yvqh9W_lightboxEdit{font:inherit;color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;border-radius:999px;padding:4px 14px;font-size:12.5px;font-weight:500;text-decoration:none}.Yvqh9W_lightboxDownload:hover,.Yvqh9W_lightboxEdit:hover{background:#ffffff42}.Yvqh9W_lightboxEdit{color:#fff;background:#ffffff24;border:1px solid #ffffff47;border-radius:999px}@media (width<=720px){.Yvqh9W_lightbox{padding:16px}.Yvqh9W_lightboxFigure{width:calc(100vw - 32px);max-width:none}.Yvqh9W_lightboxNav[data-dir=prev]{left:20px}.Yvqh9W_lightboxNav[data-dir=next]{right:20px}.Yvqh9W_lightboxCaptionRow,.Yvqh9W_lightboxMeta{flex-direction:column;align-items:stretch}.Yvqh9W_lightboxCopy,.Yvqh9W_lightboxActions{align-self:flex-end}}@keyframes Yvqh9W_dshImageGenSpin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.Yvqh9W_download,.Yvqh9W_spinner,.Yvqh9W_bigSpinner{transition:none;animation-duration:1.5s}}";
+		const css$1 = "[data-pane=conversation],[class*=centerCol]{position:relative}[data-dsh-imagegen-view]{z-index:60;background:var(--dsw-alias-bg-base);display:none;position:absolute;inset:0}html[data-dsh-imagegen-active]:not([data-dsh-taskboard-active]):not([data-dsh-ssh-active]) [data-dsh-imagegen-view]{display:block}html[data-dsh-imagegen-active]:not([data-dsh-taskboard-active]):not([data-dsh-ssh-active]) [data-pane=conversation]>:not([data-dsh-imagegen-view]),html[data-dsh-imagegen-active]:not([data-dsh-taskboard-active]):not([data-dsh-ssh-active]) [class*=centerCol]>:not([data-dsh-imagegen-view]){display:none!important}.Yvqh9W_entry{width:100%;height:32px;color:var(--dsw-alias-label-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:0 12px;font-size:13px;display:flex}.Yvqh9W_entry:hover{background:var(--dsw-specific-sidebar-nav-item-hover);color:var(--dsw-alias-label-primary)}.Yvqh9W_entry[data-active]{background:var(--dsw-specific-sidebar-nav-item-active);color:var(--dsw-alias-label-primary);font-weight:600}.Yvqh9W_entryIcon{flex:none;justify-content:center;align-items:center;display:inline-flex}.Yvqh9W_entryLabel{text-overflow:ellipsis;overflow:hidden}[data-dsh-frame][data-sidebar-collapsed] .Yvqh9W_entry{justify-content:center;width:100%;padding:0}[data-dsh-frame][data-sidebar-collapsed] .Yvqh9W_entryLabel{display:none}.Yvqh9W_view{overflow:hidden}.Yvqh9W_panel,.Yvqh9W_panel *,.Yvqh9W_panel :before,.Yvqh9W_panel :after{box-sizing:border-box}.Yvqh9W_panel{background:var(--dsw-alias-bg-base);min-width:0;height:100%;min-height:0;color:var(--dsw-alias-label-primary);font-family:var(--dsw-font-family);flex-direction:column;gap:10px;padding:14px 16px 16px;display:flex;position:relative;overflow:hidden}.Yvqh9W_panelHeader{flex:none;justify-content:space-between;align-items:center;gap:12px;display:flex}.Yvqh9W_panelHeading{align-items:baseline;gap:10px;min-width:0;display:flex}.Yvqh9W_panelTitle{color:var(--dsw-alias-label-primary);white-space:nowrap;margin:0;font-size:16px;font-weight:700}.Yvqh9W_githubLink{width:22px;height:22px;color:var(--dsw-alias-label-secondary);border-radius:6px;flex:none;justify-content:center;align-items:center;text-decoration:none;transition:color .12s,background .12s;display:inline-flex}.Yvqh9W_githubLink:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-2)}.Yvqh9W_connectionStatus{border:1px solid var(--dsw-alias-label-error);height:28px;color:var(--dsw-alias-label-error);font:inherit;white-space:nowrap;background:0 0;border-radius:8px;flex:none;align-items:center;gap:6px;padding:0 10px;font-size:12px;line-height:1;display:inline-flex}.Yvqh9W_connectionStatus[data-connected=true]{border-color:var(--dsw-alias-state-success-primary);color:var(--dsw-alias-state-success-primary)}.Yvqh9W_connectionDot{background:currentColor;border-radius:50%;width:6px;height:6px}.Yvqh9W_updateBanner{border:1px solid var(--dsw-alias-state-warn-primary);color:var(--dsw-alias-state-warn-primary);overflow-wrap:anywhere;border-radius:10px;flex:none;justify-content:space-between;align-items:center;gap:12px;padding:7px 10px 7px 12px;font-size:12px;line-height:1.5;display:flex}.Yvqh9W_updateBanner[data-kind=ok]{color:var(--dsw-alias-state-success-primary);border-color:var(--dsw-alias-state-success-primary)}.Yvqh9W_updateText{min-width:0}.Yvqh9W_updateActions{flex:none;align-items:center;gap:10px;display:inline-flex}.Yvqh9W_updateRelease{color:inherit;text-underline-offset:2px;white-space:nowrap;text-decoration:underline}@media (width<=700px){.Yvqh9W_panelHeader{align-items:flex-start}.Yvqh9W_panelHeading{flex-direction:column;align-items:flex-start;gap:2px}.Yvqh9W_updateBanner{flex-direction:column;align-items:flex-start}.Yvqh9W_updateActions{justify-content:space-between;width:100%}}.Yvqh9W_studio{flex:1;gap:14px;min-width:0;min-height:0;display:flex}.Yvqh9W_config{flex-direction:column;flex:none;gap:12px;width:300px;min-width:260px;max-width:340px;height:100%;min-height:0;display:flex;overflow:hidden}.Yvqh9W_configScroll{scrollbar-width:thin;scrollbar-color:var(--dsw-alias-border-l2) transparent;flex-direction:column;flex:1;gap:12px;min-height:0;padding-right:2px;display:flex;overflow-y:auto}.Yvqh9W_configScroll::-webkit-scrollbar{width:8px}.Yvqh9W_configScroll::-webkit-scrollbar-thumb{background:var(--dsw-alias-border-l2);border-radius:999px}.Yvqh9W_canvas{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);border-radius:12px;flex-direction:column;flex:1;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.Yvqh9W_history{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);border-radius:12px;flex-direction:column;flex:none;width:240px;min-width:200px;max-width:280px;min-height:0;display:flex;overflow:hidden}.Yvqh9W_historyHeader{border-bottom:1px solid var(--dsw-alias-border-l1);flex:none;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;display:flex}.Yvqh9W_historyTitle{color:var(--dsw-alias-label-primary);font-size:13px;font-weight:600}.Yvqh9W_historyClear{font:inherit;color:var(--dsw-alias-label-tertiary);border:1px solid var(--dsw-alias-border-l2);cursor:pointer;background:0 0;border-radius:999px;padding:2px 8px;font-size:11.5px}.Yvqh9W_historyClear:hover{color:var(--dsw-alias-label-error);border-color:var(--dsw-alias-label-error)}.Yvqh9W_historyList{scrollbar-width:thin;scrollbar-color:var(--dsw-alias-border-l2) transparent;flex-direction:column;flex:1;gap:8px;min-height:0;padding:10px;display:flex;overflow-y:auto}.Yvqh9W_historyList::-webkit-scrollbar{width:8px}.Yvqh9W_historyList::-webkit-scrollbar-thumb{background:var(--dsw-alias-border-l2);border-radius:999px}.Yvqh9W_historyEmpty{text-align:center;color:var(--dsw-alias-label-tertiary);flex:1;justify-content:center;align-items:center;padding:20px;font-size:12px;line-height:1.6;display:flex}.Yvqh9W_historyItem{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-2);border-radius:10px;flex-direction:column;flex:none;gap:6px;padding:8px;display:flex}.Yvqh9W_historyItem:hover{border-color:var(--dsw-alias-border-l2)}.Yvqh9W_historyItem[data-active]{border-color:var(--dsw-alias-brand-primary)}.Yvqh9W_historyMain{font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;align-items:flex-start;gap:8px;min-width:0;padding:0;display:flex}.Yvqh9W_historyThumb{object-fit:cover;background:var(--dsw-alias-bg-base);border-radius:8px;flex:none;width:52px;height:52px}.Yvqh9W_historyThumbPlaceholder{background:var(--dsw-alias-bg-layer-3);border-radius:8px;flex:none;width:52px;height:52px}.Yvqh9W_historyInfo{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.Yvqh9W_historyPrompt{color:var(--dsw-alias-label-primary);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;line-height:1.4;display:-webkit-box;overflow:hidden}.Yvqh9W_historyMeta{color:var(--dsw-alias-label-tertiary);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.Yvqh9W_historyActions{justify-content:flex-end;gap:6px;display:flex}.Yvqh9W_historyAction{font:inherit;color:var(--dsw-alias-label-secondary);border:1px solid var(--dsw-alias-border-l2);cursor:pointer;background:0 0;border-radius:999px;padding:2px 8px;font-size:11.5px}.Yvqh9W_historyAction:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-dimmed)}.Yvqh9W_historyAction[data-danger]:hover{color:var(--dsw-alias-label-error);border-color:var(--dsw-alias-label-error)}.Yvqh9W_card{background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l1);border-radius:12px;flex-direction:column;flex:none;gap:10px;padding:12px;display:flex}.Yvqh9W_modeRow{align-items:center;gap:8px;display:flex}.Yvqh9W_modePill{flex:1;justify-content:center;height:28px;font-size:13px}.Yvqh9W_uploadBox{min-height:128px;color:var(--dsw-alias-label-secondary);border:1.5px dashed var(--dsw-alias-border-l2);cursor:pointer;font:inherit;text-align:center;background:0 0;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:16px;font-size:12.5px;display:flex}.Yvqh9W_uploadBox:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-dimmed);background:var(--dsw-alias-interactive-bg-hover)}.Yvqh9W_uploadBox:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.Yvqh9W_uploadIcon{color:var(--dsw-alias-label-tertiary);display:inline-flex}.Yvqh9W_uploadHint{color:var(--dsw-alias-label-tertiary);font-size:11px}.Yvqh9W_reference{flex-direction:column;gap:8px;display:flex}.Yvqh9W_referenceImage{object-fit:contain;background:var(--dsw-alias-bg-base);border:1px solid var(--dsw-alias-border-l1);border-radius:10px;width:100%;max-height:176px}.Yvqh9W_referenceActions{gap:8px;display:flex}.Yvqh9W_hiddenFile{display:none}.Yvqh9W_prompt{width:100%;min-height:120px;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-3);border:1px solid var(--dsw-alias-border-l2);resize:vertical;box-sizing:border-box;border-radius:10px;outline:none;padding:10px 12px;font-family:inherit;font-size:13px;line-height:1.6}.Yvqh9W_prompt:focus-visible{border-color:var(--dsw-alias-brand-primary)}.Yvqh9W_prompt::placeholder{color:var(--dsw-alias-label-tertiary)}.Yvqh9W_promptFooter{justify-content:space-between;align-items:center;gap:8px;margin-top:-6px;display:flex}.Yvqh9W_templatesButton{border:1px solid var(--dsw-alias-brand-primary);background:linear-gradient(135deg, color-mix(in srgb, var(--dsw-alias-brand-primary) 14%, transparent), color-mix(in srgb, var(--dsw-alias-brand-primary) 5%, transparent));height:26px;color:var(--dsw-alias-brand-primary);cursor:pointer;box-shadow:0 1px 0 color-mix(in srgb, var(--dsw-alias-brand-primary) 22%, transparent);border-radius:999px;align-items:center;gap:6px;padding:0 12px;font-family:inherit;font-size:12px;font-weight:600;transition:transform .12s,box-shadow .12s,background .12s;display:inline-flex}.Yvqh9W_templatesButton svg{flex:none}.Yvqh9W_templatesButton:hover{background:linear-gradient(135deg, color-mix(in srgb, var(--dsw-alias-brand-primary) 24%, transparent), color-mix(in srgb, var(--dsw-alias-brand-primary) 8%, transparent));color:var(--dsw-alias-brand-primary);box-shadow:0 2px 6px color-mix(in srgb, var(--dsw-alias-brand-primary) 30%, transparent);transform:translateY(-1px)}.Yvqh9W_templatesButton:active{transform:translateY(0)}.Yvqh9W_promptCount{color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums;font-size:11px}.Yvqh9W_paramGroup{flex-direction:column;gap:8px;display:flex}.Yvqh9W_paramLabel{color:var(--dsw-alias-label-secondary);font-size:12px;font-weight:600}.Yvqh9W_optionRow{flex-wrap:wrap;gap:6px;display:flex}.Yvqh9W_optionGrid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.Yvqh9W_optionPill{justify-content:center}.Yvqh9W_paramHint{color:var(--dsw-alias-label-tertiary);font-size:11px;line-height:1.45}.Yvqh9W_footer{border-top:1px solid var(--dsw-alias-border-l1);flex-direction:column;flex:none;align-items:stretch;gap:8px;padding:10px 2px 0 0;display:flex}.Yvqh9W_modelWrap{flex-direction:column;gap:5px;min-width:0;display:flex}.Yvqh9W_modelLabel{color:var(--dsw-alias-label-secondary);font-size:12px;font-weight:600}.Yvqh9W_modelSelect{width:100%;height:36px;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);cursor:pointer;text-align:left;border-radius:18px;outline:none;justify-content:space-between;align-items:center;gap:8px;padding:0 12px;font-family:inherit;font-size:13px;display:flex}.Yvqh9W_modelSelect:focus-visible{border-color:var(--dsw-alias-brand-primary)}.Yvqh9W_modelSelect:disabled{opacity:.55;cursor:default}.Yvqh9W_modelMenu{min-width:0;display:block;position:relative}.Yvqh9W_modelMenuList{z-index:40;background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:12px;flex-direction:column;padding:4px;display:flex;position:absolute;bottom:calc(100% + 6px);left:0;right:0;overflow:hidden;box-shadow:0 -8px 24px #0000002e}.Yvqh9W_modelMenuItem{width:100%;font:inherit;color:var(--dsw-alias-label-primary);cursor:pointer;text-align:left;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;border-radius:8px;padding:7px 10px;font-size:13px;display:block;overflow:hidden}.Yvqh9W_modelMenuItem:hover{background:var(--dsw-alias-bg-hover)}.Yvqh9W_modelMenuItem[data-selected]{color:var(--dsw-alias-brand-primary);background:var(--dsw-alias-bg-layer-1);font-weight:600}.Yvqh9W_generateButton{width:100%}.Yvqh9W_generateInner{align-items:center;gap:7px;display:inline-flex}.Yvqh9W_canvasState{text-align:center;color:var(--dsw-alias-label-tertiary);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;padding:24px;display:flex}.Yvqh9W_canvasStateTitle{color:var(--dsw-alias-label-secondary);font-size:14px;font-weight:600}.Yvqh9W_canvasStateHint{max-width:380px;font-size:12px;line-height:1.6}.Yvqh9W_canvasEmptyIcon{color:var(--dsw-alias-label-tertiary);margin-bottom:4px;display:inline-flex}.Yvqh9W_canvasError{color:var(--dsw-alias-label-error);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-label-error);overflow-wrap:anywhere;border-radius:10px;flex:none;margin:14px;padding:10px 14px;font-size:12.5px;line-height:1.6}.Yvqh9W_canvasBody{scrollbar-width:thin;scrollbar-color:var(--dsw-alias-border-l2) transparent;flex-direction:column;flex:1;gap:10px;min-height:0;padding:14px;display:flex;overflow-y:auto}.Yvqh9W_canvasBody::-webkit-scrollbar{width:8px}.Yvqh9W_canvasBody::-webkit-scrollbar-thumb{background:var(--dsw-alias-border-l2);border-radius:999px}.Yvqh9W_canvasMeta{color:var(--dsw-alias-label-tertiary);flex:none;align-items:center;gap:8px;font-size:12px;display:flex}.Yvqh9W_canvasHistoryTag{color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);white-space:nowrap;border-radius:999px;padding:1px 8px;font-size:11px}.Yvqh9W_grid{flex:1;grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;min-height:0;display:grid}.Yvqh9W_grid[data-count=\"1\"] .Yvqh9W_imageCard{grid-area:1/1/3/3}.Yvqh9W_imageCard{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-2);cursor:zoom-in;border-radius:12px;flex-direction:column;min-height:0;margin:0;display:flex;position:relative;overflow:hidden}.Yvqh9W_imageCard:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.Yvqh9W_image{object-fit:cover;background:var(--dsw-alias-bg-base);flex:1;width:100%;min-height:0;display:block}.Yvqh9W_imageCaption{color:var(--dsw-alias-label-tertiary);white-space:nowrap;text-overflow:ellipsis;border-top:1px solid var(--dsw-alias-border-l1);padding:7px 10px;font-size:11px;line-height:1.5;overflow:hidden}.Yvqh9W_download{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-mask-1);border:1px solid var(--dsw-alias-border-l2);opacity:0;backdrop-filter:blur(4px);border-radius:999px;padding:2px 10px;font-size:12px;font-weight:500;line-height:20px;text-decoration:none;transition:opacity .12s;position:absolute;top:8px;right:8px}.Yvqh9W_imageCard:hover .Yvqh9W_download{opacity:1}.Yvqh9W_download:hover{background:var(--dsw-alias-bg-base)}.Yvqh9W_galleryAdd{font:inherit;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-mask-1);border:1px solid var(--dsw-alias-border-l2);cursor:pointer;opacity:0;backdrop-filter:blur(4px);border-radius:999px;align-items:center;gap:5px;padding:2px 10px;font-size:12px;font-weight:500;line-height:20px;transition:opacity .12s;display:inline-flex;position:absolute;top:8px;left:8px}.Yvqh9W_imageCard:hover .Yvqh9W_galleryAdd{opacity:1}.Yvqh9W_galleryAdd:hover{background:var(--dsw-alias-bg-base)}.Yvqh9W_galleryAdd:disabled{opacity:.4;cursor:default}.Yvqh9W_zoomHint{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-mask-1);border:1px solid var(--dsw-alias-border-l2);opacity:0;backdrop-filter:blur(4px);pointer-events:none;border-radius:999px;align-items:center;gap:5px;padding:2px 10px;font-size:12px;font-weight:500;line-height:20px;transition:opacity .12s;display:inline-flex;position:absolute;bottom:8px;left:8px}.Yvqh9W_imageCard:hover .Yvqh9W_zoomHint{opacity:1}.Yvqh9W_spinner,.Yvqh9W_bigSpinner{border:2px solid;border-top-color:#0000;border-radius:50%;flex:none;animation:.8s linear infinite Yvqh9W_dshImageGenSpin;display:inline-block}.Yvqh9W_spinner{width:11px;height:11px}.Yvqh9W_bigSpinner{width:30px;height:30px;color:var(--dsw-alias-state-business-primary);border-width:3px;margin-bottom:6px}.Yvqh9W_lightbox{z-index:1000;backdrop-filter:blur(6px);background:#000000b8;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.Yvqh9W_lightboxClose{color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;display:inline-flex;position:absolute;top:16px;right:16px}.Yvqh9W_lightboxClose:hover{background:#ffffff42}.Yvqh9W_lightboxNav{color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;display:inline-flex;position:absolute;top:50%;transform:translateY(-50%)}.Yvqh9W_lightboxNav:hover{background:#ffffff42}.Yvqh9W_lightboxNav[data-dir=prev]{left:max(20px,50% - 640px)}.Yvqh9W_lightboxNav[data-dir=next]{right:max(20px,50% - 640px)}.Yvqh9W_lightboxFigure{flex-direction:column;gap:10px;width:min(1100px,100vw - 160px);max-width:min(1100px,100vw - 160px);height:min(820px,100vh - 48px);min-height:0;margin:0;display:flex}.Yvqh9W_lightboxStage{background:#ffffff0a;border-radius:10px;flex:1;min-height:0;position:relative;overflow:auto}.Yvqh9W_lightboxScaleFrame{justify-content:center;align-items:center;min-width:100%;min-height:100%;display:flex}.Yvqh9W_lightboxImage{object-fit:contain;border-radius:10px;max-width:100%;max-height:100%;display:block;box-shadow:0 24px 80px #00000080}.Yvqh9W_lightboxTools{justify-content:center;align-items:center;gap:6px;display:flex}.Yvqh9W_lightboxTool,.Yvqh9W_lightboxZoomLevel,.Yvqh9W_lightboxCopy{color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;justify-content:center;align-items:center;display:inline-flex}.Yvqh9W_lightboxTool,.Yvqh9W_lightboxZoomLevel{height:32px}.Yvqh9W_lightboxTool{border-radius:50%;width:32px}.Yvqh9W_lightboxZoomLevel{min-width:58px;font:inherit;font-variant-numeric:tabular-nums;border-radius:999px;padding:0 9px;font-size:12px}.Yvqh9W_lightboxTool:hover,.Yvqh9W_lightboxZoomLevel:hover,.Yvqh9W_lightboxCopy:hover{background:#ffffff42}.Yvqh9W_lightboxCaptionRow{align-items:flex-start;gap:8px;min-width:0;display:flex}.Yvqh9W_lightboxCaption{color:#ffffffe6;-webkit-line-clamp:3;-webkit-box-orient:vertical;flex:1;min-width:0;font-size:12px;line-height:1.6;display:-webkit-box;overflow:hidden}.Yvqh9W_lightboxCopy{min-height:28px;font:inherit;white-space:nowrap;border-radius:999px;flex:none;gap:5px;padding:4px 9px;font-size:12px}.Yvqh9W_lightboxMeta{justify-content:space-between;align-items:center;gap:12px;display:flex}.Yvqh9W_lightboxIndex{color:#fffc;font-variant-numeric:tabular-nums;font-size:12px}.Yvqh9W_lightboxActions{align-items:center;gap:8px;display:inline-flex}.Yvqh9W_lightboxDownload,.Yvqh9W_lightboxEdit{font:inherit;color:#fff;cursor:pointer;background:#ffffff24;border:1px solid #ffffff47;border-radius:999px;padding:4px 14px;font-size:12.5px;font-weight:500;text-decoration:none}.Yvqh9W_lightboxDownload:hover,.Yvqh9W_lightboxEdit:hover{background:#ffffff42}.Yvqh9W_lightboxEdit{color:#fff;background:#ffffff24;border:1px solid #ffffff47;border-radius:999px}@media (width<=720px){.Yvqh9W_lightbox{padding:16px}.Yvqh9W_lightboxFigure{width:calc(100vw - 32px);max-width:none}.Yvqh9W_lightboxNav[data-dir=prev]{left:20px}.Yvqh9W_lightboxNav[data-dir=next]{right:20px}.Yvqh9W_lightboxCaptionRow,.Yvqh9W_lightboxMeta{flex-direction:column;align-items:stretch}.Yvqh9W_lightboxCopy,.Yvqh9W_lightboxActions{align-self:flex-end}}@keyframes Yvqh9W_dshImageGenSpin{to{transform:rotate(360deg)}}.Yvqh9W_galleryToast{z-index:30;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-mask-1);border:1px solid var(--dsw-alias-border-l2);backdrop-filter:blur(6px);pointer-events:none;border-radius:999px;align-items:center;gap:7px;padding:6px 16px;font-size:13px;font-weight:500;animation:.16s ease-out Yvqh9W_dshImageGenToastIn;display:inline-flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #00000038}@keyframes Yvqh9W_dshImageGenToastIn{0%{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.Yvqh9W_download,.Yvqh9W_spinner,.Yvqh9W_bigSpinner{transition:none;animation-duration:1.5s}}.Yvqh9W_config[data-gallery=true] .Yvqh9W_configScroll>:not(:first-child),.Yvqh9W_config[data-gallery=true] .Yvqh9W_footer,.Yvqh9W_canvas[data-gallery=true]>.Yvqh9W_canvasState,.Yvqh9W_canvas[data-gallery=true]>.Yvqh9W_canvasError,.Yvqh9W_canvas[data-gallery=true]>.Yvqh9W_canvasBody,.Yvqh9W_studio:has(.Yvqh9W_config[data-gallery=true])>.Yvqh9W_history{display:none}.Yvqh9W_config[data-gallery=true] .Yvqh9W_configScroll{flex:none;order:1;display:flex;overflow:visible}.Yvqh9W_config[data-gallery=true] .Yvqh9W_galleryFilters{flex:1;order:2;min-height:0}.Yvqh9W_galleryFilters{padding:18px 14px;overflow:hidden auto}.Yvqh9W_galleryFilterHeading{color:var(--dsw-alias-label-tertiary);margin:0 4px 10px;font-size:12px;font-weight:600}.Yvqh9W_galleryFilter{width:100%;min-height:34px;color:var(--dsw-alias-label-secondary);cursor:pointer;text-align:left;background:0 0;border:0;border-radius:9px;justify-content:space-between;align-items:center;padding:0 10px;display:flex}.Yvqh9W_galleryFilter:hover,.Yvqh9W_galleryFilter[data-active]{color:var(--dsw-alias-brand-primary);background:color-mix(in srgb, var(--dsw-alias-brand-primary) 10%, transparent)}.Yvqh9W_galleryFilterCount{min-width:20px;color:var(--dsw-alias-label-tertiary);background:var(--dsw-alias-bg-layer-2);text-align:center;border-radius:999px;padding:1px 6px;font-size:11px}.Yvqh9W_galleryFilterDivider{background:var(--dsw-alias-border-l1);height:1px;margin:18px 4px}.Yvqh9W_galleryRatioList{flex-wrap:wrap;gap:6px;display:flex}.Yvqh9W_galleryRatio{color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-2);cursor:pointer;border:0;border-radius:999px;padding:6px 10px;font-size:12px}.Yvqh9W_galleryRatio[data-active]{color:var(--dsw-alias-brand-primary);background:color-mix(in srgb, var(--dsw-alias-brand-primary) 13%, transparent)}.Yvqh9W_galleryFilterNote{color:var(--dsw-alias-label-quaternary);margin:20px 4px 0;font-size:11px;line-height:1.5}.Yvqh9W_galleryWorkspace{box-sizing:border-box;flex-direction:column;width:100%;min-width:0;height:100%;min-height:0;padding:22px 24px 26px;display:flex;position:absolute;inset:0;overflow:hidden}.Yvqh9W_galleryToolbar{flex:none;justify-content:space-between;align-items:center;gap:16px;min-width:0;margin-bottom:18px;display:flex}.Yvqh9W_galleryHeading{color:var(--dsw-alias-label-primary);margin:0;font-size:20px;font-weight:700;display:inline}.Yvqh9W_galleryCount{color:var(--dsw-alias-label-tertiary);margin-left:8px;font-size:13px}.Yvqh9W_galleryToolbarActions{flex-wrap:wrap;align-items:center;gap:10px;min-width:0;display:flex}.Yvqh9W_galleryViewToggle{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);border-radius:9px;padding:3px;display:flex}.Yvqh9W_galleryViewToggle button,.Yvqh9W_gallerySort,.Yvqh9W_galleryClear{min-height:30px;color:var(--dsw-alias-label-secondary);cursor:pointer;font:inherit;background:0 0;border:0;border-radius:7px;padding:0 10px;font-size:12px}.Yvqh9W_galleryViewToggle button[data-active],.Yvqh9W_galleryViewToggle button:hover,.Yvqh9W_gallerySort:hover,.Yvqh9W_galleryClear:hover{color:var(--dsw-alias-brand-primary);background:color-mix(in srgb, var(--dsw-alias-brand-primary) 11%, transparent)}.Yvqh9W_gallerySort{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1)}.Yvqh9W_galleryClear{border:1px solid var(--dsw-alias-border-l1)}.Yvqh9W_galleryMasonry{box-sizing:border-box;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--dsw-alias-border-l2) transparent;flex:auto;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:max-content;align-content:start;gap:16px;width:100%;min-width:0;max-width:100%;height:0;min-height:0;padding:2px 8px 16px 2px;display:grid;overflow:hidden scroll}.Yvqh9W_galleryMasonry::-webkit-scrollbar{width:8px}.Yvqh9W_galleryMasonry::-webkit-scrollbar-thumb{background:var(--dsw-alias-border-l2);border-radius:999px}.Yvqh9W_galleryCard{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);border-radius:14px;width:100%;margin:0;display:block;overflow:hidden;box-shadow:0 5px 18px #18203612}.Yvqh9W_galleryImageButton{background:var(--dsw-alias-bg-base);cursor:zoom-in;border:0;width:100%;padding:0;display:block;position:relative}.Yvqh9W_galleryImage{aspect-ratio:4/3;object-fit:cover;width:100%;display:block}.Yvqh9W_galleryMasonry[data-view=masonry] .Yvqh9W_galleryCard:nth-child(3n+1) .Yvqh9W_galleryImage{aspect-ratio:4/5}.Yvqh9W_galleryMasonry[data-view=masonry] .Yvqh9W_galleryCard:nth-child(3n+2) .Yvqh9W_galleryImage{aspect-ratio:4/3}.Yvqh9W_galleryMasonry[data-view=masonry] .Yvqh9W_galleryCard:nth-child(3n) .Yvqh9W_galleryImage{aspect-ratio:3/4}.Yvqh9W_galleryBadge{color:#fff;backdrop-filter:blur(4px);background:#121724c2;border-radius:999px;padding:4px 9px;font-size:11px;position:absolute;top:10px;left:10px}.Yvqh9W_galleryCardFooter{align-items:center;gap:9px;min-width:0;padding:10px 12px;display:flex}.Yvqh9W_galleryAvatar{color:#fff;background:var(--dsw-alias-brand-primary);border-radius:50%;flex:none;place-items:center;width:27px;height:27px;font-size:12px;font-weight:700;display:grid}.Yvqh9W_galleryCardInfo{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.Yvqh9W_galleryCardInfo strong,.Yvqh9W_galleryCardInfo small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.Yvqh9W_galleryCardInfo strong{color:var(--dsw-alias-label-primary);font-size:12px}.Yvqh9W_galleryCardInfo small{color:var(--dsw-alias-label-tertiary);font-size:10px}.Yvqh9W_galleryRemove{width:24px;height:24px;color:var(--dsw-alias-label-tertiary);cursor:pointer;background:0 0;border:0;border-radius:50%;flex:none;padding:0;font-size:18px}.Yvqh9W_galleryRemove:hover{color:var(--dsw-alias-state-error);background:var(--dsw-alias-bg-layer-2)}@media (width<=1100px){.Yvqh9W_galleryMasonry{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=760px){.Yvqh9W_studio{flex-direction:column;overflow:auto}.Yvqh9W_config{width:auto;max-width:none;height:auto;min-height:0}.Yvqh9W_config[data-gallery=true]{flex:none}.Yvqh9W_canvas{min-height:560px}.Yvqh9W_galleryToolbar{flex-direction:column;align-items:flex-start}.Yvqh9W_galleryToolbarActions{flex-wrap:wrap;width:100%}.Yvqh9W_galleryMasonry{grid-template-columns:1fr}}";
 		const tagId$1 = "@dickpy/dsh-imagegen/panel.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$1) + "]") === null) {
 			const tag = document.createElement("style");
@@ -1020,101 +1109,132 @@ window.__ModuleLoader__.load({
 			document.head.appendChild(tag);
 		}
 		var panel_module_css_default = {
-			"updateRelease": "Yvqh9W_updateRelease",
-			"canvasHistoryTag": "Yvqh9W_canvasHistoryTag",
-			"lightboxCaptionRow": "Yvqh9W_lightboxCaptionRow",
-			"panelHeading": "Yvqh9W_panelHeading",
+			"galleryWorkspace": "Yvqh9W_galleryWorkspace",
+			"galleryClear": "Yvqh9W_galleryClear",
+			"generateInner": "Yvqh9W_generateInner",
+			"galleryAdd": "Yvqh9W_galleryAdd",
+			"lightboxScaleFrame": "Yvqh9W_lightboxScaleFrame",
+			"panelTitle": "Yvqh9W_panelTitle",
+			"modeRow": "Yvqh9W_modeRow",
 			"generateButton": "Yvqh9W_generateButton",
-			"historyHeader": "Yvqh9W_historyHeader",
+			"panelHeading": "Yvqh9W_panelHeading",
+			"historyThumb": "Yvqh9W_historyThumb",
+			"canvasHistoryTag": "Yvqh9W_canvasHistoryTag",
+			"galleryViewToggle": "Yvqh9W_galleryViewToggle",
+			"configScroll": "Yvqh9W_configScroll",
+			"reference": "Yvqh9W_reference",
+			"imageCaption": "Yvqh9W_imageCaption",
+			"historyActions": "Yvqh9W_historyActions",
+			"galleryImageButton": "Yvqh9W_galleryImageButton",
+			"lightboxIndex": "Yvqh9W_lightboxIndex",
+			"canvasBody": "Yvqh9W_canvasBody",
+			"galleryAvatar": "Yvqh9W_galleryAvatar",
+			"optionGrid": "Yvqh9W_optionGrid",
 			"footer": "Yvqh9W_footer",
+			"modelLabel": "Yvqh9W_modelLabel",
+			"bigSpinner": "Yvqh9W_bigSpinner",
+			"galleryFilterCount": "Yvqh9W_galleryFilterCount",
+			"galleryRatioList": "Yvqh9W_galleryRatioList",
+			"galleryRatio": "Yvqh9W_galleryRatio",
+			"canvasError": "Yvqh9W_canvasError",
+			"historyEmpty": "Yvqh9W_historyEmpty",
+			"githubLink": "Yvqh9W_githubLink",
 			"imageCard": "Yvqh9W_imageCard",
-			"spinner": "Yvqh9W_spinner",
-			"reference": "Yvqh9W_reference",
-			"panelHeader": "Yvqh9W_panelHeader",
-			"canvasStateHint": "Yvqh9W_canvasStateHint",
-			"historyInfo": "Yvqh9W_historyInfo",
-			"lightboxEdit": "Yvqh9W_lightboxEdit",
-			"promptCount": "Yvqh9W_promptCount",
-			"historyTitle": "Yvqh9W_historyTitle",
-			"uploadHint": "Yvqh9W_uploadHint",
-			"promptFooter": "Yvqh9W_promptFooter",
+			"updateText": "Yvqh9W_updateText",
+			"canvasStateTitle": "Yvqh9W_canvasStateTitle",
+			"modelMenu": "Yvqh9W_modelMenu",
 			"prompt": "Yvqh9W_prompt",
-			"modelSelect": "Yvqh9W_modelSelect",
-			"lightboxImage": "Yvqh9W_lightboxImage",
-			"download": "Yvqh9W_download",
-			"view": "Yvqh9W_view",
-			"optionGrid": "Yvqh9W_optionGrid",
-			"grid": "Yvqh9W_grid",
-			"entryLabel": "Yvqh9W_entryLabel",
+			"uploadIcon": "Yvqh9W_uploadIcon",
 			"canvas": "Yvqh9W_canvas",
+			"galleryImage": "Yvqh9W_galleryImage",
+			"entry": "Yvqh9W_entry",
+			"updateRelease": "Yvqh9W_updateRelease",
+			"dshImageGenSpin": "Yvqh9W_dshImageGenSpin",
+			"lightboxDownload": "Yvqh9W_lightboxDownload",
+			"galleryCardFooter": "Yvqh9W_galleryCardFooter",
+			"download": "Yvqh9W_download",
+			"historyTitle": "Yvqh9W_historyTitle",
+			"modelMenuList": "Yvqh9W_modelMenuList",
+			"canvasMeta": "Yvqh9W_canvasMeta",
+			"galleryFilters": "Yvqh9W_galleryFilters",
+			"updateActions": "Yvqh9W_updateActions",
+			"historyClear": "Yvqh9W_historyClear",
+			"galleryToolbarActions": "Yvqh9W_galleryToolbarActions",
+			"lightboxFigure": "Yvqh9W_lightboxFigure",
+			"panel": "Yvqh9W_panel",
+			"referenceImage": "Yvqh9W_referenceImage",
+			"historyMain": "Yvqh9W_historyMain",
+			"zoomHint": "Yvqh9W_zoomHint",
+			"lightboxEdit": "Yvqh9W_lightboxEdit",
+			"galleryToolbar": "Yvqh9W_galleryToolbar",
+			"galleryCard": "Yvqh9W_galleryCard",
 			"historyItem": "Yvqh9W_historyItem",
-			"uploadIcon": "Yvqh9W_uploadIcon",
-			"entryIcon": "Yvqh9W_entryIcon",
-			"hiddenFile": "Yvqh9W_hiddenFile",
-			"lightboxCopy": "Yvqh9W_lightboxCopy",
-			"connectionStatus": "Yvqh9W_connectionStatus",
-			"modeRow": "Yvqh9W_modeRow",
+			"studio": "Yvqh9W_studio",
+			"galleryFilterHeading": "Yvqh9W_galleryFilterHeading",
+			"historyHeader": "Yvqh9W_historyHeader",
+			"paramLabel": "Yvqh9W_paramLabel",
+			"historyAction": "Yvqh9W_historyAction",
+			"galleryCardInfo": "Yvqh9W_galleryCardInfo",
+			"lightboxCaptionRow": "Yvqh9W_lightboxCaptionRow",
+			"promptCount": "Yvqh9W_promptCount",
+			"historyList": "Yvqh9W_historyList",
 			"config": "Yvqh9W_config",
-			"referenceImage": "Yvqh9W_referenceImage",
+			"galleryBadge": "Yvqh9W_galleryBadge",
 			"modelWrap": "Yvqh9W_modelWrap",
-			"historyActions": "Yvqh9W_historyActions",
-			"history": "Yvqh9W_history",
-			"paramLabel": "Yvqh9W_paramLabel",
-			"modelLabel": "Yvqh9W_modelLabel",
-			"templatesButton": "Yvqh9W_templatesButton",
-			"generateInner": "Yvqh9W_generateInner",
-			"paramGroup": "Yvqh9W_paramGroup",
 			"canvasState": "Yvqh9W_canvasState",
-			"lightboxScaleFrame": "Yvqh9W_lightboxScaleFrame",
-			"historyList": "Yvqh9W_historyList",
-			"lightboxActions": "Yvqh9W_lightboxActions",
-			"lightboxMeta": "Yvqh9W_lightboxMeta",
-			"historyThumbPlaceholder": "Yvqh9W_historyThumbPlaceholder",
-			"canvasStateTitle": "Yvqh9W_canvasStateTitle",
-			"imageCaption": "Yvqh9W_imageCaption",
-			"canvasError": "Yvqh9W_canvasError",
-			"historyMain": "Yvqh9W_historyMain",
+			"historyInfo": "Yvqh9W_historyInfo",
 			"image": "Yvqh9W_image",
-			"lightboxStage": "Yvqh9W_lightboxStage",
-			"historyThumb": "Yvqh9W_historyThumb",
-			"lightbox": "Yvqh9W_lightbox",
-			"lightboxFigure": "Yvqh9W_lightboxFigure",
-			"historyClear": "Yvqh9W_historyClear",
-			"historyEmpty": "Yvqh9W_historyEmpty",
+			"lightboxImage": "Yvqh9W_lightboxImage",
+			"lightboxClose": "Yvqh9W_lightboxClose",
+			"promptFooter": "Yvqh9W_promptFooter",
+			"galleryFilterNote": "Yvqh9W_galleryFilterNote",
+			"galleryHeading": "Yvqh9W_galleryHeading",
+			"history": "Yvqh9W_history",
 			"historyPrompt": "Yvqh9W_historyPrompt",
-			"historyAction": "Yvqh9W_historyAction",
-			"referenceActions": "Yvqh9W_referenceActions",
-			"updateActions": "Yvqh9W_updateActions",
-			"optionPill": "Yvqh9W_optionPill",
-			"card": "Yvqh9W_card",
-			"lightboxNav": "Yvqh9W_lightboxNav",
-			"connectionDot": "Yvqh9W_connectionDot",
-			"uploadBox": "Yvqh9W_uploadBox",
-			"panelSubtitle": "Yvqh9W_panelSubtitle",
-			"paramHint": "Yvqh9W_paramHint",
-			"optionRow": "Yvqh9W_optionRow",
 			"lightboxZoomLevel": "Yvqh9W_lightboxZoomLevel",
-			"panelTitle": "Yvqh9W_panelTitle",
-			"lightboxIndex": "Yvqh9W_lightboxIndex",
-			"canvasEmptyIcon": "Yvqh9W_canvasEmptyIcon",
-			"entry": "Yvqh9W_entry",
+			"galleryCount": "Yvqh9W_galleryCount",
+			"galleryFilterDivider": "Yvqh9W_galleryFilterDivider",
 			"modePill": "Yvqh9W_modePill",
-			"lightboxTool": "Yvqh9W_lightboxTool",
-			"lightboxDownload": "Yvqh9W_lightboxDownload",
-			"updateText": "Yvqh9W_updateText",
+			"grid": "Yvqh9W_grid",
 			"updateBanner": "Yvqh9W_updateBanner",
-			"studio": "Yvqh9W_studio",
-			"dshImageGenSpin": "Yvqh9W_dshImageGenSpin",
-			"canvasMeta": "Yvqh9W_canvasMeta",
-			"lightboxClose": "Yvqh9W_lightboxClose",
-			"lightboxTools": "Yvqh9W_lightboxTools",
-			"configScroll": "Yvqh9W_configScroll",
+			"optionPill": "Yvqh9W_optionPill",
+			"galleryToast": "Yvqh9W_galleryToast",
+			"dshImageGenToastIn": "Yvqh9W_dshImageGenToastIn",
+			"optionRow": "Yvqh9W_optionRow",
+			"referenceActions": "Yvqh9W_referenceActions",
+			"panelHeader": "Yvqh9W_panelHeader",
+			"paramGroup": "Yvqh9W_paramGroup",
+			"paramHint": "Yvqh9W_paramHint",
+			"card": "Yvqh9W_card",
+			"historyThumbPlaceholder": "Yvqh9W_historyThumbPlaceholder",
+			"entryLabel": "Yvqh9W_entryLabel",
+			"uploadHint": "Yvqh9W_uploadHint",
+			"modelSelect": "Yvqh9W_modelSelect",
+			"canvasEmptyIcon": "Yvqh9W_canvasEmptyIcon",
+			"lightbox": "Yvqh9W_lightbox",
+			"lightboxStage": "Yvqh9W_lightboxStage",
+			"lightboxMeta": "Yvqh9W_lightboxMeta",
+			"entryIcon": "Yvqh9W_entryIcon",
+			"hiddenFile": "Yvqh9W_hiddenFile",
+			"galleryMasonry": "Yvqh9W_galleryMasonry",
+			"connectionDot": "Yvqh9W_connectionDot",
+			"lightboxNav": "Yvqh9W_lightboxNav",
+			"galleryRemove": "Yvqh9W_galleryRemove",
+			"gallerySort": "Yvqh9W_gallerySort",
 			"historyMeta": "Yvqh9W_historyMeta",
-			"canvasBody": "Yvqh9W_canvasBody",
-			"zoomHint": "Yvqh9W_zoomHint",
-			"bigSpinner": "Yvqh9W_bigSpinner",
+			"lightboxCopy": "Yvqh9W_lightboxCopy",
+			"spinner": "Yvqh9W_spinner",
 			"lightboxCaption": "Yvqh9W_lightboxCaption",
-			"panel": "Yvqh9W_panel"
+			"galleryFilter": "Yvqh9W_galleryFilter",
+			"view": "Yvqh9W_view",
+			"connectionStatus": "Yvqh9W_connectionStatus",
+			"lightboxTools": "Yvqh9W_lightboxTools",
+			"uploadBox": "Yvqh9W_uploadBox",
+			"lightboxTool": "Yvqh9W_lightboxTool",
+			"canvasStateHint": "Yvqh9W_canvasStateHint",
+			"templatesButton": "Yvqh9W_templatesButton",
+			"lightboxActions": "Yvqh9W_lightboxActions",
+			"modelMenuItem": "Yvqh9W_modelMenuItem"
 		};
 		//#endregion
 		//#region src/client/ImageGenPanel.tsx
@@ -1127,34 +1247,44 @@ window.__ModuleLoader__.load({
 		* Controls ride the system UI primitives (@deepseek-ai/dsh-client-ui-primitives,
 		* a platform module) so the studio matches the dsh shell look by construction.
 		*/
-		/** The model dropdown offers exactly the plugin's namesake model. */
-		const MODELS = ["gpt-image-2"];
-		/** All size options for gpt-image-2. */
+		/** Models offered by the dropdown. Anything OpenAI-compatible that answers
+		*  /images/generations (+ /images/edits) works; grok-imagine-image is handled
+		*  specially host-side (JSON /images/edits, aspect_ratio, b64_json). */
+		const MODELS = ["gpt-image-2", "grok-imagine-image"];
+		/** Size options, presented as aspect ratios (auto = let the model decide).
+		*  The host maps each ratio onto the model's own vocabulary: aspect_ratio for
+		*  Grok Imagine, the closest pixel size for OpenAI-compatible endpoints. */
 		const SIZES = [
 			"auto",
-			"1024x1024",
-			"1536x1024",
-			"1024x1536",
-			"512x512",
-			"1792x1024",
-			"1024x1792"
+			"1:1",
+			"3:4",
+			"4:3",
+			"9:16",
+			"2:3",
+			"3:2",
+			"16:9",
+			"21:9"
 		];
 		/** Size option keys in the locale dictionary. */
 		const SIZE_KEYS = {
 			auto: "size.auto",
-			"1024x1024": "size.square",
-			"1536x1024": "size.landscape",
-			"1024x1536": "size.portrait",
-			"512x512": "size.small",
-			"1792x1024": "size.wide",
-			"1024x1792": "size.tall"
+			"1:1": "size.square",
+			"3:4": "size.portrait34",
+			"4:3": "size.landscape43",
+			"9:16": "size.portrait916",
+			"2:3": "size.portrait23",
+			"3:2": "size.landscape32",
+			"16:9": "size.wide169",
+			"21:9": "size.ultrawide21"
 		};
-		/** Quality options. */
+		/** Quality options, shown as output-resolution tiers (auto = let the model
+		*  decide). The host maps them: resolution for Grok, quality level for
+		*  OpenAI-compatible endpoints (1k→low, 2k→medium, 4k→high). */
 		const QUALITIES = [
 			"auto",
-			"low",
-			"medium",
-			"high"
+			"1k",
+			"2k",
+			"4k"
 		];
 		/** Detail options ('' = omit the passthrough). */
 		const DETAILS = [
@@ -1167,6 +1297,32 @@ window.__ModuleLoader__.load({
 		const PREVIEW_SCALE_MIN = .5;
 		const PREVIEW_SCALE_MAX = 3;
 		const PREVIEW_SCALE_STEP = .25;
+		/** Legacy pixel sizes saved by older versions, mapped onto the current
+		*  aspect-ratio vocabulary so restoring old history entries still works. */
+		const LEGACY_SIZE_TO_RATIO = {
+			"512x512": "1:1",
+			"1024x1024": "1:1",
+			"1536x1024": "3:2",
+			"1024x1536": "2:3",
+			"1792x1024": "16:9",
+			"1024x1792": "9:16"
+		};
+		/** Legacy quality levels saved by older versions, mapped onto resolution. */
+		const LEGACY_QUALITY_TO_RES = {
+			low: "1k",
+			medium: "2k",
+			high: "4k"
+		};
+		/** Normalize a saved size value into a current dropdown option. */
+		function normalizeSize(value) {
+			if (SIZES.includes(value)) return value;
+			return LEGACY_SIZE_TO_RATIO[value] ?? "auto";
+		}
+		/** Normalize a saved quality value into a current dropdown option. */
+		function normalizeQuality(value) {
+			if (QUALITIES.includes(value)) return value;
+			return LEGACY_QUALITY_TO_RES[value] ?? "auto";
+		}
 		function clampPreviewScale(scale) {
 			return Math.min(PREVIEW_SCALE_MAX, Math.max(PREVIEW_SCALE_MIN, scale));
 		}
@@ -1238,13 +1394,14 @@ window.__ModuleLoader__.load({
 			const configured = (config?.apiUrl ?? "").trim() !== "";
 			const keySet = useKeySet(scope);
 			const connected = enabled && configured && keySet;
-			const [mode, setMode] = (0, react.useState)("text");
+			const [tab, setTab] = (0, react.useState)("text");
 			const [prompt, setPrompt] = (0, react.useState)("");
 			const [size, setSize] = (0, react.useState)("auto");
 			const [quality, setQuality] = (0, react.useState)("auto");
 			const [count, setCount] = (0, react.useState)(1);
 			const [detail, setDetail] = (0, react.useState)("");
 			const [model, setModel] = (0, react.useState)(MODELS[0]);
+			const [modelOpen, setModelOpen] = (0, react.useState)(false);
 			const [refImage, setRefImage] = (0, react.useState)(null);
 			const [images, setImages] = (0, react.useState)([]);
 			const [error, setError] = (0, react.useState)(null);
@@ -1252,6 +1409,14 @@ window.__ModuleLoader__.load({
 			const [startedAt, setStartedAt] = (0, react.useState)(null);
 			const [history, setHistory] = (0, react.useState)([]);
 			const [viewingHistoryId, setViewingHistoryId] = (0, react.useState)(null);
+			const [gallery, setGallery] = (0, react.useState)([]);
+			const [galleryViewingId, setGalleryViewingId] = (0, react.useState)(null);
+			const [galleryAdding, setGalleryAdding] = (0, react.useState)(false);
+			const [galleryMessage, setGalleryMessage] = (0, react.useState)(null);
+			const [galleryFilter, setGalleryFilter] = (0, react.useState)("all");
+			const [galleryRatio, setGalleryRatio] = (0, react.useState)("all");
+			const [galleryView, setGalleryView] = (0, react.useState)("masonry");
+			const [gallerySort, setGallerySort] = (0, react.useState)("newest");
 			const [preview, setPreview] = (0, react.useState)(null);
 			const [previewScale, setPreviewScale] = (0, react.useState)(1);
 			const [promptCopied, setPromptCopied] = (0, react.useState)(false);
@@ -1263,15 +1428,38 @@ window.__ModuleLoader__.load({
 			const fileInput = (0, react.useRef)(null);
 			const previewStage = (0, react.useRef)(null);
 			const elapsed = useElapsed(generating, startedAt);
+			const filteredGallery = gallery.filter((entry) => {
+				if (galleryFilter === "all") return true;
+				if (galleryFilter === "text" || galleryFilter === "edit") return entry.mode === galleryFilter;
+				return entry.model === galleryFilter;
+			}).filter((entry) => galleryRatio === "all" || normalizeSize(entry.size) === galleryRatio).slice().sort((a, b) => gallerySort === "newest" ? b.createdAt - a.createdAt : a.createdAt - b.createdAt);
 			(0, react.useEffect)(() => {
 				let disposed = false;
 				api.historyList().then((entries) => {
 					if (!disposed) setHistory(entries);
 				}).catch(() => {});
+				api.galleryList().then((entries) => {
+					if (!disposed) setGallery(entries);
+				}).catch(() => {});
 				return () => {
 					disposed = true;
 				};
 			}, [api]);
+			const modelMenuRef = (0, react.useRef)(null);
+			(0, react.useEffect)(() => {
+				if (!modelOpen) return;
+				const onPointer = (event) => {
+					const target = event.target;
+					if (target instanceof Node && modelMenuRef.current?.contains(target)) return;
+					setModelOpen(false);
+				};
+				document.addEventListener("mousedown", onPointer);
+				document.addEventListener("focusin", onPointer);
+				return () => {
+					document.removeEventListener("mousedown", onPointer);
+					document.removeEventListener("focusin", onPointer);
+				};
+			}, [modelOpen]);
 			(0, react.useEffect)(() => {
 				let disposed = false;
 				api.updateCheck().then((info) => {
@@ -1328,20 +1516,20 @@ window.__ModuleLoader__.load({
 					setError(tt("prompt.required"));
 					return;
 				}
-				if (mode === "edit" && refImage === null) {
+				if (tab === "edit" && refImage === null) {
 					setError(tt("edit.required"));
 					return;
 				}
 				const request = {
-					mode,
+					mode: tab === "gallery" ? "text" : tab,
 					model,
 					prompt: promptText,
 					size,
 					quality,
 					n: count,
 					detail,
-					...mode === "edit" && refImage !== null ? { image: refImage.dataUrl } : {},
-					...mode === "edit" && refImage !== null ? { refName: refImage.name } : {}
+					...tab === "edit" && refImage !== null ? { image: refImage.dataUrl } : {},
+					...tab === "edit" && refImage !== null ? { refName: refImage.name } : {}
 				};
 				setGenerating(true);
 				setError(null);
@@ -1351,6 +1539,7 @@ window.__ModuleLoader__.load({
 					const result = await api.generate(request);
 					setImages(result.images);
 					setViewingHistoryId(null);
+					setGalleryViewingId(null);
 					if (result.history !== void 0) setHistory(result.history);
 					if (result.historyError !== void 0) setError(result.historyError);
 				} catch (caught) {
@@ -1416,6 +1605,7 @@ window.__ModuleLoader__.load({
 					setImages(await historyImagesToGenerated(entry.images));
 					setError(null);
 					setViewingHistoryId(entry.id);
+					setGalleryViewingId(null);
 				} catch (caught) {
 					setError(errorMessage(caught));
 				}
@@ -1424,10 +1614,10 @@ window.__ModuleLoader__.load({
 			const restoreHistoryEntry = async (entry) => {
 				try {
 					const restored = await historyImagesToGenerated(entry.images);
-					setMode(entry.mode);
+					setTab(entry.mode);
 					setPrompt(entry.prompt);
-					setSize(SIZES.includes(entry.size) ? entry.size : "auto");
-					setQuality(QUALITIES.includes(entry.quality) ? entry.quality : "auto");
+					setSize(normalizeSize(entry.size));
+					setQuality(normalizeQuality(entry.quality));
 					setDetail(DETAILS.includes(entry.detail) ? entry.detail : "");
 					setCount(entry.n >= 1 && entry.n <= 4 ? entry.n : 1);
 					setModel(MODELS.includes(entry.model) ? entry.model : MODELS[0]);
@@ -1435,6 +1625,7 @@ window.__ModuleLoader__.load({
 					setImages(restored);
 					setError(null);
 					setViewingHistoryId(entry.id);
+					setGalleryViewingId(null);
 				} catch (caught) {
 					setError(errorMessage(caught));
 				}
@@ -1455,18 +1646,121 @@ window.__ModuleLoader__.load({
 					setHistory(await api.historyClear());
 				} catch {}
 			};
-			const generateDisabled = generating || !enabled || !configured;
-			const viewingEntry = viewingHistoryId === null ? null : history.find((entry) => entry.id === viewingHistoryId) ?? null;
-			const previewImage = preview === null ? null : preview.images[preview.index] ?? null;
-			const previewFrameScale = Math.max(1, previewScale);
-			const previewImageScale = previewScale / previewFrameScale;
-			const copyPreviewPrompt = async (text) => {
+			/** Add one generated image to the gallery (host deduplicates by content).
+			*  `entry` makes the action available from a history/gallery list item (its
+			*  metadata + first image are saved); otherwise the current form state is
+			*  used. */
+			const addToGallery = async (image, entry) => {
+				if (galleryAdding || tab === "gallery") return;
+				const source = entry ?? viewingEntry ?? {
+					mode: tab === "edit" ? "edit" : "text",
+					model,
+					prompt: prompt.trim(),
+					size,
+					quality,
+					detail,
+					...refImage !== null ? { refName: refImage.name } : {}
+				};
+				setGalleryAdding(true);
 				try {
-					if (navigator.clipboard?.writeText !== void 0) await navigator.clipboard.writeText(text);
-					else {
-						const textarea = document.createElement("textarea");
-						textarea.value = text;
-						textarea.style.position = "fixed";
+					const result = await api.galleryAppend({
+						id: "",
+						createdAt: Date.now(),
+						mode: source.mode,
+						model: source.model,
+						prompt: source.prompt,
+						size: source.size,
+						quality: source.quality,
+						detail: source.detail,
+						n: 1,
+						images: [image],
+						...source.refName === void 0 ? {} : { refName: source.refName }
+					});
+					setGallery(result.entries);
+					setGalleryMessage(result.added ? tt("gallery.added") : tt("gallery.already"));
+					window.setTimeout(() => {
+						setGalleryMessage(null);
+					}, 2200);
+				} catch (caught) {
+					setError(errorMessage(caught));
+				} finally {
+					setGalleryAdding(false);
+				}
+			};
+			/** Add one history entry's first image to the gallery (fetches it from the
+			*  history image route, then delegates to addToGallery). */
+			const addHistoryEntryToGallery = async (entry) => {
+				if (galleryAdding || entry.images.length === 0) return;
+				try {
+					const [image] = await historyImagesToGenerated(entry.images.slice(0, 1));
+					if (image === void 0) return;
+					await addToGallery(image, entry);
+				} catch (caught) {
+					setError(errorMessage(caught));
+				}
+			};
+			/** View a gallery image in the canvas. */
+			const viewGalleryEntry = async (entry) => {
+				try {
+					const restored = await historyImagesToGenerated(entry.images);
+					setImages(restored);
+					setError(null);
+					setViewingHistoryId(null);
+					setGalleryViewingId(entry.id);
+					if (restored.length > 0) openPreview(restored, 0);
+				} catch (caught) {
+					setError(errorMessage(caught));
+				}
+			};
+			/** Restore a gallery entry's parameters (and its images) into the form. */
+			const restoreGalleryEntry = async (entry) => {
+				try {
+					const restored = await historyImagesToGenerated(entry.images);
+					setTab(entry.mode);
+					setPrompt(entry.prompt);
+					setSize(normalizeSize(entry.size));
+					setQuality(normalizeQuality(entry.quality));
+					setDetail(DETAILS.includes(entry.detail) ? entry.detail : "");
+					setCount(entry.n >= 1 && entry.n <= 4 ? entry.n : 1);
+					setModel(MODELS.includes(entry.model) ? entry.model : MODELS[0]);
+					setRefImage(null);
+					setImages(restored);
+					setError(null);
+					setViewingHistoryId(null);
+					setGalleryViewingId(null);
+				} catch (caught) {
+					setError(errorMessage(caught));
+				}
+			};
+			/** Remove one gallery entry. */
+			const deleteGalleryEntry = async (id) => {
+				setGallery(gallery.filter((entry) => entry.id !== id));
+				if (galleryViewingId === id) setGalleryViewingId(null);
+				try {
+					setGallery(await api.galleryRemove(id));
+				} catch {}
+			};
+			/** Remove every gallery entry. */
+			const clearGalleryAll = async () => {
+				setGallery([]);
+				setGalleryViewingId(null);
+				try {
+					setGallery(await api.galleryClear());
+				} catch {}
+			};
+			const generateDisabled = generating || !enabled || !configured;
+			const viewingEntry = viewingHistoryId === null ? null : history.find((entry) => entry.id === viewingHistoryId) ?? null;
+			const viewingGalleryEntry = galleryViewingId === null ? null : gallery.find((entry) => entry.id === galleryViewingId) ?? null;
+			const previewImage = preview === null ? null : preview.images[preview.index] ?? null;
+			const previewFrameScale = Math.max(1, previewScale);
+			const previewImageScale = previewScale / previewFrameScale;
+			const copyPreviewPrompt = async (text) => {
+				try {
+					if (navigator.clipboard?.writeText !== void 0) await navigator.clipboard.writeText(text);
+					else {
+						const textarea = document.createElement("textarea");
+						textarea.value = text;
+						textarea.style.position = "fixed";
 						textarea.style.opacity = "0";
 						document.body.appendChild(textarea);
 						textarea.select();
@@ -1484,7 +1778,7 @@ window.__ModuleLoader__.load({
 			};
 			const addPreviewToEdit = () => {
 				if (previewImage === null || preview === null) return;
-				setMode("edit");
+				setTab("edit");
 				setRefImage({
 					dataUrl: srcOf(previewImage),
 					name: `dsh-image-${preview.index + 1}.${extensionOf(previewImage.mime)}`
@@ -1503,9 +1797,21 @@ window.__ModuleLoader__.load({
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
 								className: panel_module_css_default.panelTitle,
 								children: tt("panel.title")
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-								className: panel_module_css_default.panelSubtitle,
-								children: tt("panel.subtitle")
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+								className: panel_module_css_default.githubLink,
+								href: "https://github.com/dickpy/dsh-imagegen",
+								target: "_blank",
+								rel: "noreferrer",
+								title: tt("panel.githubTip"),
+								"aria-label": tt("panel.githubTip"),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+									viewBox: "0 0 16 16",
+									width: "15",
+									height: "15",
+									fill: "currentColor",
+									"aria-hidden": "true",
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8z" })
+								})
 							})]
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 							type: "button",
@@ -1548,268 +1854,501 @@ window.__ModuleLoader__.load({
 						children: [
 							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
 								className: panel_module_css_default.config,
-								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-									className: panel_module_css_default.configScroll,
-									children: [
-										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
-											className: panel_module_css_default.card,
-											children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-												className: panel_module_css_default.modeRow,
-												role: "tablist",
-												"aria-label": tt("panel.title"),
-												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
-													active: mode === "text",
+								"data-gallery": tab === "gallery" ? "true" : void 0,
+								children: [
+									tab === "gallery" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: panel_module_css_default.galleryFilters,
+										children: [
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+												className: panel_module_css_default.galleryFilterHeading,
+												children: tt("gallery.categories")
+											}),
+											[
+												["all", "gallery.all"],
+												["text", "mode.text"],
+												["edit", "mode.edit"],
+												["gpt-image-2", "gallery.gpt"],
+												["grok-imagine-image", "gallery.grok"]
+											].map(([value, label]) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+												type: "button",
+												className: panel_module_css_default.galleryFilter,
+												"data-active": galleryFilter === value ? "" : void 0,
+												onClick: () => {
+													setGalleryFilter(value);
+												},
+												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: tt(label) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+													className: panel_module_css_default.galleryFilterCount,
+													children: gallery.filter((entry) => value === "all" || value === "text" || value === "edit" ? value === "all" ? true : entry.mode === value : entry.model === value).length
+												})]
+											}, value)),
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: panel_module_css_default.galleryFilterDivider }),
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+												className: panel_module_css_default.galleryFilterHeading,
+												children: tt("gallery.ratio")
+											}),
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+												className: panel_module_css_default.galleryRatioList,
+												children: [
+													"all",
+													"1:1",
+													"3:4",
+													"4:3",
+													"16:9"
+												].map((ratio) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													className: panel_module_css_default.galleryRatio,
+													"data-active": galleryRatio === ratio ? "" : void 0,
 													onClick: () => {
-														setMode("text");
+														setGalleryRatio(ratio);
 													},
-													className: panel_module_css_default.modePill,
-													children: tt("mode.text")
-												}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
-													active: mode === "edit",
+													children: ratio === "all" ? tt("gallery.all") : ratio
+												}, ratio))
+											}),
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+												className: panel_module_css_default.galleryFilterNote,
+												children: tt("gallery.filterHint")
+											})
+										]
+									}) : null,
+									/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: panel_module_css_default.configScroll,
+										children: [
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
+												className: panel_module_css_default.card,
+												children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+													className: panel_module_css_default.modeRow,
+													role: "tablist",
+													"aria-label": tt("panel.title"),
+													children: [
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
+															active: tab === "text",
+															onClick: () => {
+																setTab("text");
+															},
+															className: panel_module_css_default.modePill,
+															children: tt("mode.text")
+														}),
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
+															active: tab === "edit",
+															onClick: () => {
+																setTab("edit");
+															},
+															className: panel_module_css_default.modePill,
+															children: tt("mode.edit")
+														}),
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
+															active: tab === "gallery",
+															onClick: () => {
+																setTab("gallery");
+															},
+															className: panel_module_css_default.modePill,
+															children: tt("gallery.title")
+														})
+													]
+												})
+											}),
+											tab === "edit" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+												className: panel_module_css_default.card,
+												children: [refImage === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+													type: "button",
+													className: panel_module_css_default.uploadBox,
 													onClick: () => {
-														setMode("edit");
+														fileInput.current?.click();
 													},
-													className: panel_module_css_default.modePill,
-													children: tt("mode.edit")
+													onDragOver: (event) => {
+														event.preventDefault();
+													},
+													onDrop: (event) => {
+														event.preventDefault();
+														acceptFile(event.dataTransfer.files?.[0]);
+													},
+													children: [
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+															className: panel_module_css_default.uploadIcon,
+															children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+																viewBox: "0 0 16 16",
+																width: "18",
+																height: "18",
+																fill: "none",
+																stroke: "currentColor",
+																strokeWidth: "1.3",
+																strokeLinecap: "round",
+																strokeLinejoin: "round",
+																"aria-hidden": "true",
+																children: [
+																	/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 10.5V3" }),
+																	/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M5 5.5l3-3 3 3" }),
+																	/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2.5 9v3.5h11V9" })
+																]
+															})
+														}),
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: tt("edit.upload") }),
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+															className: panel_module_css_default.uploadHint,
+															children: tt("edit.uploadHint")
+														})
+													]
+												}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+													className: panel_module_css_default.reference,
+													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+														className: panel_module_css_default.referenceImage,
+														src: refImage.dataUrl,
+														alt: refImage.name
+													}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+														className: panel_module_css_default.referenceActions,
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+															variant: "outline",
+															size: "sm",
+															onClick: () => {
+																fileInput.current?.click();
+															},
+															children: tt("edit.change")
+														}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+															variant: "outline",
+															size: "sm",
+															onClick: () => {
+																setRefImage(null);
+															},
+															children: tt("edit.remove")
+														})]
+													})]
+												}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+													ref: fileInput,
+													type: "file",
+													accept: "image/png,image/jpeg,image/webp,image/gif",
+													className: panel_module_css_default.hiddenFile,
+													onChange: (event) => {
+														acceptFile(event.target.files?.[0]);
+														event.target.value = "";
+													}
 												})]
-											})
-										}),
-										mode === "edit" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-											className: panel_module_css_default.card,
-											children: [refImage === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-												type: "button",
-												className: panel_module_css_default.uploadBox,
-												onClick: () => {
-													fileInput.current?.click();
-												},
-												onDragOver: (event) => {
-													event.preventDefault();
-												},
-												onDrop: (event) => {
-													event.preventDefault();
-													acceptFile(event.dataTransfer.files?.[0]);
-												},
-												children: [
-													/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-														className: panel_module_css_default.uploadIcon,
-														children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+											}) : null,
+											/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+												className: panel_module_css_default.card,
+												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+													className: panel_module_css_default.prompt,
+													value: prompt,
+													maxLength: PROMPT_MAX,
+													placeholder: tt("prompt.placeholder"),
+													onChange: (event) => {
+														setPrompt(event.target.value);
+													}
+												}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+													className: panel_module_css_default.promptFooter,
+													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+														type: "button",
+														className: panel_module_css_default.templatesButton,
+														title: tt("templates.title"),
+														onClick: () => {
+															setLibraryOpen(true);
+														},
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
 															viewBox: "0 0 16 16",
-															width: "18",
-															height: "18",
+															width: "12",
+															height: "12",
 															fill: "none",
 															stroke: "currentColor",
-															strokeWidth: "1.3",
+															strokeWidth: "1.4",
 															strokeLinecap: "round",
 															strokeLinejoin: "round",
 															"aria-hidden": "true",
+															children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2.5 3.5h11M2.5 8h11M2.5 12.5h7" })
+														}), tt("templates.open")]
+													}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+														className: panel_module_css_default.promptCount,
+														children: tt("prompt.count", { count: prompt.length })
+													})]
+												})]
+											}),
+											/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+												className: panel_module_css_default.card,
+												children: [
+													/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+														className: panel_module_css_default.paramGroup,
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+															className: panel_module_css_default.paramLabel,
+															children: tt("params.size")
+														}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+															className: panel_module_css_default.optionGrid,
+															children: SIZES.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
+																active: size === option,
+																onClick: () => {
+																	setSize(option);
+																},
+																className: panel_module_css_default.optionPill,
+																children: tt(SIZE_KEYS[option] ?? "size.auto")
+															}, option))
+														})]
+													}),
+													/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+														className: panel_module_css_default.paramGroup,
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+															className: panel_module_css_default.paramLabel,
+															children: tt("params.quality")
+														}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+															className: panel_module_css_default.optionRow,
+															children: QUALITIES.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
+																active: quality === option,
+																onClick: () => {
+																	setQuality(option);
+																},
+																className: panel_module_css_default.optionPill,
+																children: tt(`quality.${option}`)
+															}, option))
+														})]
+													}),
+													/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+														className: panel_module_css_default.paramGroup,
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+															className: panel_module_css_default.paramLabel,
+															children: tt("params.count")
+														}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+															className: panel_module_css_default.optionRow,
 															children: [
-																/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 10.5V3" }),
-																/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M5 5.5l3-3 3 3" }),
-																/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2.5 9v3.5h11V9" })
-															]
-														})
+																1,
+																2,
+																3,
+																4
+															].map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
+																active: count === option,
+																onClick: () => {
+																	setCount(option);
+																},
+																className: panel_module_css_default.optionPill,
+																children: tt(`count.${option === 1 ? "one" : option === 2 ? "two" : option === 3 ? "three" : "four"}`)
+															}, option))
+														})]
 													}),
-													/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: tt("edit.upload") }),
-													/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-														className: panel_module_css_default.uploadHint,
-														children: tt("edit.uploadHint")
+													/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+														className: panel_module_css_default.paramGroup,
+														children: [
+															/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+																className: panel_module_css_default.paramLabel,
+																children: tt("params.detail")
+															}),
+															/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+																className: panel_module_css_default.optionRow,
+																children: DETAILS.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
+																	active: detail === option,
+																	onClick: () => {
+																		setDetail(option);
+																	},
+																	className: panel_module_css_default.optionPill,
+																	children: tt(option === "" ? "detail.auto" : option === "standard" ? "detail.standard" : "detail.high")
+																}, option === "" ? "auto" : option))
+															}),
+															/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+																className: panel_module_css_default.paramHint,
+																children: tt("detail.hint")
+															})
+														]
 													})
 												]
-											}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-												className: panel_module_css_default.reference,
-												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
-													className: panel_module_css_default.referenceImage,
-													src: refImage.dataUrl,
-													alt: refImage.name
-												}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-													className: panel_module_css_default.referenceActions,
-													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-														variant: "outline",
-														size: "sm",
-														onClick: () => {
-															fileInput.current?.click();
-														},
-														children: tt("edit.change")
-													}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-														variant: "outline",
-														size: "sm",
-														onClick: () => {
-															setRefImage(null);
-														},
-														children: tt("edit.remove")
-													})]
-												})]
-											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-												ref: fileInput,
-												type: "file",
-												accept: "image/png,image/jpeg,image/webp,image/gif",
-												className: panel_module_css_default.hiddenFile,
-												onChange: (event) => {
-													acceptFile(event.target.files?.[0]);
-													event.target.value = "";
-												}
-											})]
-										}) : null,
-										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-											className: panel_module_css_default.card,
-											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
-												className: panel_module_css_default.prompt,
-												value: prompt,
-												maxLength: PROMPT_MAX,
-												placeholder: tt("prompt.placeholder"),
-												onChange: (event) => {
-													setPrompt(event.target.value);
-												}
-											}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-												className: panel_module_css_default.promptFooter,
+											})
+										]
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+										className: panel_module_css_default.footer,
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+											className: panel_module_css_default.modelWrap,
+											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+												className: panel_module_css_default.modelLabel,
+												children: tt("model.label")
+											}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+												ref: modelMenuRef,
+												className: panel_module_css_default.modelMenu,
+												"data-open": modelOpen ? "true" : "false",
 												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 													type: "button",
-													className: panel_module_css_default.templatesButton,
-													title: tt("templates.title"),
+													className: panel_module_css_default.modelSelect,
+													disabled: generating,
+													"aria-haspopup": "listbox",
+													"aria-expanded": modelOpen,
 													onClick: () => {
-														setLibraryOpen(true);
+														setModelOpen((open) => !open);
 													},
-													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: model }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
 														viewBox: "0 0 16 16",
 														width: "12",
 														height: "12",
 														fill: "none",
 														stroke: "currentColor",
-														strokeWidth: "1.4",
+														strokeWidth: "1.6",
 														strokeLinecap: "round",
 														strokeLinejoin: "round",
 														"aria-hidden": "true",
-														children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2.5 3.5h11M2.5 8h11M2.5 12.5h7" })
-													}), tt("templates.open")]
-												}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-													className: panel_module_css_default.promptCount,
-													children: tt("prompt.count", { count: prompt.length })
-												})]
+														children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 10.5L4 6h8z" })
+													})]
+												}), modelOpen ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+													className: panel_module_css_default.modelMenuList,
+													role: "listbox",
+													"aria-label": tt("model.label"),
+													children: MODELS.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+														type: "button",
+														role: "option",
+														"aria-selected": model === option,
+														className: panel_module_css_default.modelMenuItem,
+														"data-selected": model === option ? "" : void 0,
+														onClick: () => {
+															setModel(option);
+															setModelOpen(false);
+														},
+														children: option
+													}, option))
+												}) : null]
 											})]
-										}),
-										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-											className: panel_module_css_default.card,
-											children: [
-												/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-													className: panel_module_css_default.paramGroup,
-													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-														className: panel_module_css_default.paramLabel,
-														children: tt("params.size")
-													}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-														className: panel_module_css_default.optionGrid,
-														children: SIZES.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
-															active: size === option,
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+											variant: "primary",
+											size: "md",
+											className: panel_module_css_default.generateButton,
+											disabled: generateDisabled,
+											onClick: () => {
+												handleGenerate();
+											},
+											children: generating ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+												className: panel_module_css_default.generateInner,
+												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: panel_module_css_default.spinner }), tt("generating")]
+											}) : tt("generate")
+										})]
+									})
+								]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+								className: panel_module_css_default.canvas,
+								"data-gallery": tab === "gallery" ? "true" : void 0,
+								children: [
+									tab === "gallery" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: panel_module_css_default.galleryWorkspace,
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+											className: panel_module_css_default.galleryToolbar,
+											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+												className: panel_module_css_default.galleryHeading,
+												children: tt("gallery.all")
+											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+												className: panel_module_css_default.galleryCount,
+												children: tt("gallery.count", { count: filteredGallery.length })
+											})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+												className: panel_module_css_default.galleryToolbarActions,
+												children: [
+													/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+														className: panel_module_css_default.galleryViewToggle,
+														role: "group",
+														"aria-label": tt("gallery.viewMode"),
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+															type: "button",
+															"data-active": galleryView === "masonry" ? "" : void 0,
 															onClick: () => {
-																setSize(option);
+																setGalleryView("masonry");
 															},
-															className: panel_module_css_default.optionPill,
-															children: tt(SIZE_KEYS[option] ?? "size.auto")
-														}, option))
-													})]
-												}),
-												/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-													className: panel_module_css_default.paramGroup,
-													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-														className: panel_module_css_default.paramLabel,
-														children: tt("params.quality")
-													}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-														className: panel_module_css_default.optionRow,
-														children: QUALITIES.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
-															active: quality === option,
+															title: tt("gallery.masonry"),
+															children: [
+																/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+																	"aria-hidden": "true",
+																	children: "▦"
+																}),
+																" ",
+																tt("gallery.masonry")
+															]
+														}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+															type: "button",
+															"data-active": galleryView === "grid" ? "" : void 0,
 															onClick: () => {
-																setQuality(option);
+																setGalleryView("grid");
 															},
-															className: panel_module_css_default.optionPill,
-															children: tt(`quality.${option}`)
-														}, option))
-													})]
-												}),
-												/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-													className: panel_module_css_default.paramGroup,
-													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-														className: panel_module_css_default.paramLabel,
-														children: tt("params.count")
-													}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-														className: panel_module_css_default.optionRow,
+															title: tt("gallery.grid"),
+															children: [
+																/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+																	"aria-hidden": "true",
+																	children: "▤"
+																}),
+																" ",
+																tt("gallery.grid")
+															]
+														})]
+													}),
+													/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
+														className: panel_module_css_default.gallerySort,
+														value: gallerySort,
+														onChange: (event) => {
+															setGallerySort(event.target.value);
+														},
+														"aria-label": tt("gallery.sort"),
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+															value: "newest",
+															children: tt("gallery.newest")
+														}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+															value: "oldest",
+															children: tt("gallery.oldest")
+														})]
+													}),
+													gallery.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+														type: "button",
+														className: panel_module_css_default.galleryClear,
+														onClick: () => {
+															clearGalleryAll();
+														},
+														children: tt("gallery.clear")
+													}) : null
+												]
+											})]
+										}), filteredGallery.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+											className: panel_module_css_default.historyEmpty,
+											children: tt("gallery.empty")
+										}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+											className: panel_module_css_default.galleryMasonry,
+											"data-view": galleryView,
+											children: filteredGallery.map((entry) => {
+												const image = entry.images[0];
+												if (image === void 0) return null;
+												return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("article", {
+													className: panel_module_css_default.galleryCard,
+													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+														type: "button",
+														className: panel_module_css_default.galleryImageButton,
+														onClick: () => {
+															viewGalleryEntry(entry);
+														},
+														title: tt("preview.open"),
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+															className: panel_module_css_default.galleryImage,
+															src: image.url,
+															alt: entry.prompt
+														}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+															className: panel_module_css_default.galleryBadge,
+															children: entry.mode === "edit" ? tt("mode.edit") : tt("mode.text")
+														})]
+													}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+														className: panel_module_css_default.galleryCardFooter,
 														children: [
-															1,
-															2,
-															3,
-															4
-														].map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
-															active: count === option,
-															onClick: () => {
-																setCount(option);
-															},
-															className: panel_module_css_default.optionPill,
-															children: tt(`count.${option === 1 ? "one" : option === 2 ? "two" : option === 3 ? "three" : "four"}`)
-														}, option))
-													})]
-												}),
-												/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-													className: panel_module_css_default.paramGroup,
-													children: [
-														/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-															className: panel_module_css_default.paramLabel,
-															children: tt("params.detail")
-														}),
-														/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-															className: panel_module_css_default.optionRow,
-															children: DETAILS.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Pill, {
-																active: detail === option,
+															/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+																className: panel_module_css_default.galleryAvatar,
+																children: entry.model.startsWith("grok") ? "G" : "D"
+															}),
+															/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+																className: panel_module_css_default.galleryCardInfo,
+																children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: entry.prompt || tt("gallery.untitled") }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("small", { children: [
+																	entry.model,
+																	" · ",
+																	normalizeSize(entry.size),
+																	" · ",
+																	formatTime(entry.createdAt)
+																] })]
+															}),
+															/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+																type: "button",
+																className: panel_module_css_default.galleryRemove,
 																onClick: () => {
-																	setDetail(option);
+																	deleteGalleryEntry(entry.id);
 																},
-																className: panel_module_css_default.optionPill,
-																children: tt(option === "" ? "detail.auto" : option === "standard" ? "detail.standard" : "detail.high")
-															}, option === "" ? "auto" : option))
-														}),
-														/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-															className: panel_module_css_default.paramHint,
-															children: tt("detail.hint")
-														})
-													]
-												})
-											]
-										})
-									]
-								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-									className: panel_module_css_default.footer,
-									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
-										className: panel_module_css_default.modelWrap,
-										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-											className: panel_module_css_default.modelLabel,
-											children: tt("model.label")
-										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
-											className: panel_module_css_default.modelSelect,
-											value: model,
-											disabled: generating,
-											onChange: (event) => {
-												setModel(event.target.value);
-											},
-											children: MODELS.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-												value: option,
-												children: option
-											}, option))
+																title: tt("gallery.delete"),
+																children: "×"
+															})
+														]
+													})]
+												}, entry.id);
+											})
 										})]
-									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-										variant: "primary",
-										size: "md",
-										className: panel_module_css_default.generateButton,
-										disabled: generateDisabled,
-										onClick: () => {
-											handleGenerate();
-										},
-										children: generating ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-											className: panel_module_css_default.generateInner,
-											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: panel_module_css_default.spinner }), tt("generating")]
-										}) : tt("generate")
-									})]
-								})]
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-								className: panel_module_css_default.canvas,
-								children: [
+									}) : null,
 									generating ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 										className: panel_module_css_default.canvasState,
 										role: "status",
@@ -1876,9 +2415,9 @@ window.__ModuleLoader__.load({
 										className: panel_module_css_default.canvasBody,
 										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 											className: panel_module_css_default.canvasMeta,
-											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: tt("canvas.images", { count: images.length }) }), viewingEntry !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: tt("canvas.images", { count: images.length }) }), viewingEntry !== null || viewingGalleryEntry !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 												className: panel_module_css_default.canvasHistoryTag,
-												children: tt("history.viewing", { time: formatTime(viewingEntry.createdAt) })
+												children: viewingEntry !== null ? tt("history.viewing", { time: formatTime(viewingEntry.createdAt) }) : tt("gallery.viewing", { time: formatTime(viewingGalleryEntry.createdAt) })
 											}) : null]
 										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 											className: panel_module_css_default.grid,
@@ -1931,6 +2470,34 @@ window.__ModuleLoader__.load({
 															]
 														}), tt("preview.open")]
 													}),
+													/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+														type: "button",
+														className: panel_module_css_default.galleryAdd,
+														title: tt("gallery.add"),
+														disabled: galleryAdding,
+														onClick: (event) => {
+															event.stopPropagation();
+															addToGallery(image);
+														},
+														children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+															viewBox: "0 0 16 16",
+															width: "12",
+															height: "12",
+															fill: "none",
+															stroke: "currentColor",
+															strokeWidth: "1.6",
+															strokeLinecap: "round",
+															strokeLinejoin: "round",
+															"aria-hidden": "true",
+															children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+																x: "2.5",
+																y: "3",
+																width: "11",
+																height: "10",
+																rx: "1.5"
+															}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 5.8v4.4M5.8 8h4.4" })]
+														}), tt("gallery.add")]
+													}),
 													/* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
 														className: panel_module_css_default.download,
 														href: srcOf(image),
@@ -1946,7 +2513,75 @@ window.__ModuleLoader__.load({
 									}) : null
 								]
 							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
+							tab === "gallery" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
+								className: panel_module_css_default.history,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+									className: panel_module_css_default.historyHeader,
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: panel_module_css_default.historyTitle,
+										children: tt("gallery.title")
+									}), gallery.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										className: panel_module_css_default.historyClear,
+										onClick: () => {
+											clearGalleryAll();
+										},
+										children: tt("gallery.clear")
+									}) : null]
+								}), gallery.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: panel_module_css_default.historyEmpty,
+									children: tt("gallery.empty")
+								}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: panel_module_css_default.historyList,
+									children: gallery.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: panel_module_css_default.historyItem,
+										"data-active": entry.id === galleryViewingId ? "" : void 0,
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+											type: "button",
+											className: panel_module_css_default.historyMain,
+											onClick: () => {
+												viewGalleryEntry(entry);
+											},
+											children: [entry.images.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+												className: panel_module_css_default.historyThumb,
+												src: entry.images[0].url,
+												alt: ""
+											}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: panel_module_css_default.historyThumbPlaceholder }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+												className: panel_module_css_default.historyInfo,
+												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+													className: panel_module_css_default.historyPrompt,
+													children: entry.prompt
+												}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+													className: panel_module_css_default.historyMeta,
+													children: [
+														tt(`mode.${entry.mode === "edit" ? "edit" : "text"}`),
+														" · ",
+														formatTime(entry.createdAt)
+													]
+												})]
+											})]
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+											className: panel_module_css_default.historyActions,
+											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+												type: "button",
+												className: panel_module_css_default.historyAction,
+												onClick: () => {
+													restoreGalleryEntry(entry);
+												},
+												children: tt("history.restore")
+											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+												type: "button",
+												className: panel_module_css_default.historyAction,
+												"data-danger": true,
+												onClick: () => {
+													deleteGalleryEntry(entry.id);
+												},
+												children: tt("gallery.delete")
+											})]
+										})]
+									}, entry.id))
+								})]
+							}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
 								className: panel_module_css_default.history,
 								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
 									className: panel_module_css_default.historyHeader,
@@ -1999,22 +2634,35 @@ window.__ModuleLoader__.load({
 											})]
 										}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 											className: panel_module_css_default.historyActions,
-											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-												type: "button",
-												className: panel_module_css_default.historyAction,
-												onClick: () => {
-													restoreHistoryEntry(entry);
-												},
-												children: tt("history.restore")
-											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-												type: "button",
-												className: panel_module_css_default.historyAction,
-												"data-danger": true,
-												onClick: () => {
-													deleteHistoryEntry(entry.id);
-												},
-												children: tt("history.delete")
-											})]
+											children: [
+												entry.images.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													className: panel_module_css_default.historyAction,
+													disabled: galleryAdding,
+													title: tt("gallery.add"),
+													onClick: () => {
+														addHistoryEntryToGallery(entry);
+													},
+													children: tt("gallery.add")
+												}) : null,
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													className: panel_module_css_default.historyAction,
+													onClick: () => {
+														restoreHistoryEntry(entry);
+													},
+													children: tt("history.restore")
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													className: panel_module_css_default.historyAction,
+													"data-danger": true,
+													onClick: () => {
+														deleteHistoryEntry(entry.id);
+													},
+													children: tt("history.delete")
+												})
+											]
 										})]
 									}, entry.id))
 								})]
@@ -2027,7 +2675,7 @@ window.__ModuleLoader__.load({
 							setLibraryOpen(false);
 						},
 						onUse: (text) => {
-							setMode("text");
+							setTab("text");
 							setPrompt(text);
 							setError(null);
 							setLibraryOpen(false);
@@ -2251,23 +2899,57 @@ window.__ModuleLoader__.load({
 											})
 										}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 											className: panel_module_css_default.lightboxActions,
-											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-												type: "button",
-												className: panel_module_css_default.lightboxEdit,
-												onClick: addPreviewToEdit,
-												children: tt("preview.addToEdit")
-											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
-												className: panel_module_css_default.lightboxDownload,
-												href: srcOf(previewImage),
-												download: `dsh-image-${preview.index + 1}.${extensionOf(previewImage.mime)}`,
-												children: tt("download")
-											})]
+											children: [
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													className: panel_module_css_default.lightboxEdit,
+													disabled: galleryAdding,
+													onClick: () => {
+														addToGallery(previewImage);
+													},
+													children: tt("gallery.add")
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													className: panel_module_css_default.lightboxEdit,
+													onClick: addPreviewToEdit,
+													children: tt("preview.addToEdit")
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+													className: panel_module_css_default.lightboxDownload,
+													href: srcOf(previewImage),
+													download: `dsh-image-${preview.index + 1}.${extensionOf(previewImage.mime)}`,
+													children: tt("download")
+												})
+											]
 										})]
 									})
 								]
 							})
 						]
-					}), document.body) : null
+					}), document.body) : null,
+					galleryMessage !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: panel_module_css_default.galleryToast,
+						role: "status",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+							viewBox: "0 0 16 16",
+							width: "14",
+							height: "14",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "1.6",
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							"aria-hidden": "true",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+								x: "2.5",
+								y: "3",
+								width: "11",
+								height: "10",
+								rx: "1.5"
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 5.8v4.4M5.8 8h4.4" })]
+						}), galleryMessage]
+					}) : null
 				]
 			});
 		}
@@ -2287,13 +2969,18 @@ window.__ModuleLoader__.load({
 		*
 		* The `conversation` slot is single-occupant (ui-conversation) and external
 		* plugins cannot declare slots, so the panel takes over the center column at
-		* the DOM level: a container is appended inside the `[data-pane="conversation"]`
-		* grid item (an extra trailing child React never manages), and a stylesheet
-		* rule hides the conversation content while the panel is active. Toggling is
-		* a data attribute on <html> — no React involvement, so the conversation
-		* subtree underneath stays mounted and stateful.
+		* the DOM level: a container is appended inside the conversation grid item
+		* (an extra trailing child React never manages), and a stylesheet rule hides
+		* the conversation content while the panel is active. Toggling is a data
+		* attribute on <html> — no React involvement, so the conversation subtree
+		* underneath stays mounted and stateful.
+		*
+		* Shell compatibility: the center column is `[data-pane="conversation"]` on
+		* legacy shells and `[class*="centerCol"]` on the rc.6+ AppFrame layout (the
+		* same dual selector the dsh-ssh / task-board panels use); both are queried
+		* and both get the `position: relative` base in panel.module.css.
 		*/
-		const CONVERSATION_COLUMN_SELECTOR = "[data-pane=\"conversation\"]";
+		const CONVERSATION_COLUMN_SELECTOR = "[data-pane=\"conversation\"], [class*=\"centerCol\"]";
 		const ACTIVE_ATTR = "data-dsh-imagegen-active";
 		/** Sibling panels' activation attributes, removed when this panel opens. */
 		const OTHER_ACTIVE_ATTRS = ["data-dsh-taskboard-active", "data-dsh-ssh-active"];
@@ -2744,35 +3431,35 @@ window.__ModuleLoader__.load({
 			document.head.appendChild(tag);
 		}
 		var settings_card_module_css_default = {
-			"pending": "i1cc5G_pending",
-			"save": "i1cc5G_save",
-			"card": "i1cc5G_card",
-			"inputInvalid": "i1cc5G_inputInvalid",
-			"versionValue": "i1cc5G_versionValue",
-			"description": "i1cc5G_description",
-			"versionRow": "i1cc5G_versionRow",
-			"head": "i1cc5G_head",
-			"header": "i1cc5G_header",
-			"name": "i1cc5G_name",
-			"failed": "i1cc5G_failed",
-			"notExposed": "i1cc5G_notExposed",
 			"chevron": "i1cc5G_chevron",
-			"field": "i1cc5G_field",
+			"reset": "i1cc5G_reset",
+			"failed": "i1cc5G_failed",
+			"readOnly": "i1cc5G_readOnly",
+			"head": "i1cc5G_head",
+			"versionValue": "i1cc5G_versionValue",
 			"hint": "i1cc5G_hint",
 			"discard": "i1cc5G_discard",
-			"badges": "i1cc5G_badges",
-			"select": "i1cc5G_select",
-			"readOnly": "i1cc5G_readOnly",
-			"footer": "i1cc5G_footer",
-			"chevronOpen": "i1cc5G_chevronOpen",
-			"invalid": "i1cc5G_invalid",
-			"body": "i1cc5G_body",
-			"versionLabel": "i1cc5G_versionLabel",
+			"notExposed": "i1cc5G_notExposed",
+			"header": "i1cc5G_header",
+			"save": "i1cc5G_save",
+			"card": "i1cc5G_card",
+			"pending": "i1cc5G_pending",
+			"name": "i1cc5G_name",
 			"input": "i1cc5G_input",
-			"label": "i1cc5G_label",
+			"body": "i1cc5G_body",
 			"headText": "i1cc5G_headText",
+			"label": "i1cc5G_label",
 			"badge": "i1cc5G_badge",
-			"reset": "i1cc5G_reset"
+			"badges": "i1cc5G_badges",
+			"inputInvalid": "i1cc5G_inputInvalid",
+			"chevronOpen": "i1cc5G_chevronOpen",
+			"footer": "i1cc5G_footer",
+			"field": "i1cc5G_field",
+			"select": "i1cc5G_select",
+			"description": "i1cc5G_description",
+			"versionRow": "i1cc5G_versionRow",
+			"invalid": "i1cc5G_invalid",
+			"versionLabel": "i1cc5G_versionLabel"
 		};
 		//#endregion
 		//#region src/client/SettingsCard.tsx