- {showPreGenerationGuides ? (
+ {(status === "idle" || status === "ready") && !showMainVideoWorkspace ? (
) : null}
- {showPreGenerationGuides ? (
+ {(status === "idle" || status === "ready") && !showMainVideoWorkspace ? (
{ecommerceInspirationRows.map((row) => (
diff --git a/src/styles/ecommerce-standalone.css b/src/styles/ecommerce-standalone.css
index 6a213c9..b7b39ec 100644
--- a/src/styles/ecommerce-standalone.css
+++ b/src/styles/ecommerce-standalone.css
@@ -13017,3 +13017,459 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
color: inherit !important;
fill: currentColor !important;
}
+
+/* #/imageWorkbench generated results: remove all visual labels and their reserved space. */
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node .clone-ai-node-label,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node .clone-ai-main-result > span,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid button > span {
+ display: none !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node:not(.is-generating) {
+ padding-top: 20px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node:not(.is-generating) .clone-ai-node-drag-handle {
+ height: 100% !important;
+ background: transparent !important;
+}
+
+/* #/imageWorkbench history records: keep hover delete icon centered in the row. */
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item {
+ position: relative !important;
+ display: block !important;
+ isolation: isolate !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-main {
+ width: 100% !important;
+ padding-right: 46px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item:hover .ecom-command-history__item-delete,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item.is-active .ecom-command-history__item-delete {
+ grid-column: auto !important;
+ grid-row: auto !important;
+ align-self: auto !important;
+ position: absolute !important;
+ top: 50% !important;
+ right: 10px !important;
+ z-index: 4 !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ width: 28px !important;
+ height: 28px !important;
+ min-width: 28px !important;
+ min-height: 28px !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ line-height: 1 !important;
+ transform: translateY(-50%) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete .anticon,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete svg {
+ display: block !important;
+ line-height: 1 !important;
+}
+
+/* #/imageWorkbench composer redesign: mode tabs outside, settings and assets inside. */
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs {
+ display: grid !important;
+ grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
+ gap: 8px !important;
+ width: min(100%, 760px) !important;
+ margin: 0 auto 12px !important;
+ padding: 4px !important;
+ border: 1px solid rgba(30, 189, 219, 0.11) !important;
+ border-radius: 18px !important;
+ background: rgba(255, 255, 255, 0.64) !important;
+ box-shadow:
+ 0 14px 34px rgba(16, 115, 204, 0.055),
+ inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
+ backdrop-filter: blur(14px) saturate(1.08) !important;
+ -webkit-backdrop-filter: blur(14px) saturate(1.08) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button {
+ --mode-accent: #1073cc;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ gap: 7px !important;
+ min-width: 0 !important;
+ min-height: 42px !important;
+ padding: 0 11px !important;
+ border: 0 !important;
+ border-radius: 14px !important;
+ background: transparent !important;
+ color: rgba(16, 32, 44, 0.66) !important;
+ box-shadow: none !important;
+ cursor: pointer !important;
+ transition:
+ background 180ms ease,
+ color 180ms ease,
+ box-shadow 180ms ease,
+ transform 180ms ease !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--set) {
+ --mode-accent: #0f8f72;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--detail) {
+ --mode-accent: #7a5af8;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--model) {
+ --mode-accent: #1073cc;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--video) {
+ --mode-accent: #cc6b14;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--hot) {
+ --mode-accent: #c04468;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:hover,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button.is-active {
+ background:
+ radial-gradient(circle at 20% 18%, color-mix(in srgb, var(--mode-accent) 14%, transparent), transparent 58%),
+ linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 252, 254, 0.9)) !important;
+ color: rgba(16, 32, 44, 0.9) !important;
+ box-shadow:
+ inset 0 0 0 1px color-mix(in srgb, var(--mode-accent) 18%, transparent),
+ 0 10px 22px color-mix(in srgb, var(--mode-accent) 10%, transparent) !important;
+ transform: translateY(-1px) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs .ecom-command-mode-icon {
+ display: inline-grid !important;
+ width: 24px !important;
+ height: 24px !important;
+ min-width: 24px !important;
+ place-items: center !important;
+ border: 0 !important;
+ border-radius: 9px !important;
+ background: color-mix(in srgb, var(--mode-accent) 11%, #ffffff) !important;
+ color: var(--mode-accent) !important;
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
+ font-size: 13px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs strong {
+ min-width: 0 !important;
+ overflow: hidden !important;
+ font-size: 13px !important;
+ font-weight: 760 !important;
+ letter-spacing: 0 !important;
+ line-height: 1 !important;
+ text-overflow: ellipsis !important;
+ white-space: nowrap !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
+ display: grid !important;
+ grid-template-columns: minmax(0, 1fr) !important;
+ grid-auto-rows: auto !important;
+ grid-template-rows: none !important;
+ align-content: start !important;
+ row-gap: 12px !important;
+ min-height: clamp(214px, 17vh, 236px) !important;
+ padding: 18px 22px 16px !important;
+ overflow: visible !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
+ min-height: clamp(256px, 22vh, 286px) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings {
+ grid-column: 1 !important;
+ grid-row: auto !important;
+ display: flex !important;
+ flex-wrap: wrap !important;
+ align-items: center !important;
+ justify-content: flex-start !important;
+ gap: 8px !important;
+ width: 100% !important;
+ padding: 0 0 2px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button {
+ min-width: 0 !important;
+ min-height: 36px !important;
+ padding: 0 11px !important;
+ border: 1px solid rgba(30, 189, 219, 0.12) !important;
+ border-radius: 13px !important;
+ background: rgba(248, 253, 255, 0.72) !important;
+ color: rgba(16, 32, 44, 0.72) !important;
+ box-shadow: none !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button:hover,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button.is-active {
+ border-color: rgba(30, 189, 219, 0.28) !important;
+ background: rgba(241, 251, 254, 0.92) !important;
+ box-shadow: 0 8px 18px rgba(16, 115, 204, 0.055) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings .ecom-command-option-icon {
+ width: 20px !important;
+ height: 20px !important;
+ border: 0 !important;
+ background: rgba(232, 249, 253, 0.78) !important;
+ color: #0f829b !important;
+ box-shadow: none !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-popover {
+ position: static !important;
+ grid-column: 1 !important;
+ grid-row: auto !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: flex-start !important;
+ gap: 8px !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ min-height: 62px !important;
+ max-height: 72px !important;
+ padding: 8px 2px 10px !important;
+ overflow-x: auto !important;
+ overflow-y: visible !important;
+ border: 0 !important;
+ border-radius: 0 !important;
+ background: transparent !important;
+ box-shadow: none !important;
+ transform: none !important;
+ scrollbar-width: thin !important;
+ scrollbar-color: rgba(16, 115, 204, 0.18) transparent !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb {
+ flex: 0 0 58px !important;
+ width: 58px !important;
+ height: 58px !important;
+ border: 1px solid rgba(30, 189, 219, 0.12) !important;
+ border-radius: 14px !important;
+ background: rgba(246, 251, 253, 0.9) !important;
+ box-shadow: 0 8px 18px rgba(16, 115, 204, 0.06) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb img,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb video {
+ border-radius: 13px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add {
+ flex: 0 0 38px !important;
+ width: 38px !important;
+ height: 38px !important;
+ min-height: 38px !important;
+ margin: 0 !important;
+ border: 0 !important;
+ border-radius: 12px !important;
+ background: rgba(232, 249, 253, 0.72) !important;
+ color: #0f829b !important;
+ font-size: 24px !important;
+ box-shadow: none !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea {
+ grid-column: 1 !important;
+ grid-row: auto !important;
+ min-height: clamp(82px, 9vh, 106px) !important;
+ padding: 2px 0 4px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea {
+ min-height: clamp(68px, 7vh, 92px) !important;
+ max-height: 112px !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
+ grid-column: 1 !important;
+ grid-row: auto !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: space-between !important;
+ gap: 12px !important;
+ width: 100% !important;
+ padding: 10px 0 0 !important;
+ border-top: 1px solid rgba(30, 189, 219, 0.085) !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-actions {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: flex-start !important;
+ min-width: 0 !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom {
+ position: static !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ gap: 7px !important;
+ width: auto !important;
+ min-width: 0 !important;
+ height: 38px !important;
+ min-height: 38px !important;
+ margin: 0 !important;
+ padding: 0 12px !important;
+ border: 0 !important;
+ border-radius: 13px !important;
+ background: rgba(248, 253, 255, 0.78) !important;
+ color: rgba(16, 32, 44, 0.68) !important;
+ box-shadow: none !important;
+ transform: none !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom:hover,
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom.is-dragging {
+ background: rgba(232, 249, 253, 0.9) !important;
+ color: #0f829b !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom > span {
+ display: inline-flex !important;
+ width: 20px !important;
+ min-width: 20px !important;
+ height: 20px !important;
+ place-items: center !important;
+ margin: 0 !important;
+ font-size: 17px !important;
+ line-height: 1 !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom strong {
+ display: inline !important;
+ font-size: 13px !important;
+ font-weight: 720 !important;
+ line-height: 1 !important;
+ white-space: nowrap !important;
+}
+
+html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-submit-row {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: flex-end !important;
+ min-width: 0 !important;
+}
+
+@media (max-width: 900px) {
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs {
+ grid-template-columns: repeat(5, minmax(94px, 1fr)) !important;
+ width: 100% !important;
+ overflow-x: auto !important;
+ overscroll-behavior-x: contain !important;
+ scrollbar-width: none !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs::-webkit-scrollbar {
+ display: none !important;
+ }
+}
+
+@media (max-width: 640px) {
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs {
+ grid-template-columns: repeat(5, minmax(88px, 1fr)) !important;
+ margin-bottom: 10px !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button {
+ min-height: 38px !important;
+ padding-inline: 8px !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs .ecom-command-mode-icon {
+ width: 22px !important;
+ height: 22px !important;
+ min-width: 22px !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
+ min-height: 230px !important;
+ padding: 15px !important;
+ row-gap: 10px !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button {
+ flex: 1 1 calc(50% - 5px) !important;
+ justify-content: flex-start !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
+ align-items: center !important;
+ }
+}
+
+@media (max-width: 420px) {
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings {
+ display: grid !important;
+ grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+ gap: 7px !important;
+ justify-content: stretch !important;
+ overflow: visible !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button {
+ display: inline-flex !important;
+ width: auto !important;
+ min-width: 0 !important;
+ max-width: none !important;
+ height: 42px !important;
+ min-height: 42px !important;
+ padding: 0 !important;
+ justify-content: center !important;
+ font-size: 0 !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button > span:not(.ecom-command-option-icon) {
+ display: none !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings .ecom-command-option-icon {
+ display: inline-grid !important;
+ width: 22px !important;
+ height: 22px !important;
+ min-width: 22px !important;
+ margin: 0 !important;
+ font-size: 14px !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
+ flex-direction: row !important;
+ align-items: center !important;
+ justify-content: space-between !important;
+ min-height: 58px !important;
+ height: auto !important;
+ padding-top: 10px !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-actions,
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-submit-row {
+ width: auto !important;
+ min-width: 0 !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom {
+ width: auto !important;
+ min-width: 0 !important;
+ max-width: none !important;
+ height: 38px !important;
+ min-height: 38px !important;
+ padding: 0 12px !important;
+ font-size: 13px !important;
+ }
+
+ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom strong {
+ display: inline !important;
+ }
+}