feat: 电商页面视觉精修，全局页面滚动按钮交互简化

AppShell.tsx：
- 全局页面滚动操作按钮（floating-page-scroll-actions）暂时关闭
- 后续将通过页面级滚动交互替代全局滚动按钮

EcommercePage.tsx（电商生成页功能增强）：
- 预览区header下方新增生成配置摘要条(clone-ai-preview-summary)
- 展示当前选择的输出类型、平台、市场、语言、比例参数
- 方便用户快速确认当前生成配置无误

ecommerce.css（电商页面视觉精修）：
- 新增CSS自定义属性体系(ecm-*)，统一电商页面颜色/间距/阴影
- 页面背景增加accent径向光晕和半透明渐变叠加
- 设置面板/预览区域卡片增加毛玻璃质感和微阴影
- 文本颜色层级化（ecm-text/ecm-muted/ecm-soft）
- 保持现有布局结构不变，仅提升视觉效果

dark-green.css（暗绿主题电商按钮状态精修）：
- 电商页面各工具模块按钮active态增加相对定位和overflow控制
- clone/set/detail/wear工具中is-active按钮状态一致性增强
- 限定在[data-view="ecommerce"]作用域内，避免全局污染

src/components/AppShell.tsx

@@ -88,7 +88,7 @@ function AppShell({
     "avatarConsole",
     "characterMix",
   ] as WebViewKey[];
-  const showPageScrollActions = showFloatingNav && !toolSurfaceViews.includes(activeView);
+  const showPageScrollActions = false;
 
   const visibleNavItems = useMemo(
     () => {

src/features/ecommerce/EcommercePage.tsx

@@ -2873,6 +2873,13 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
         <span>
           上传商品图，AI 即刻生成 <b>符合多电商平台规范</b> 的高转化率商品素材。
         </span>
+        <div className="clone-ai-preview-summary" aria-label="当前生成配置">
+          <span>{selectedCloneOutput.label}</span>
+          <span>{platform}</span>
+          <span>{market}</span>
+          <span>{language}</span>
+          <span>{formatRatioDisplayValue(ratio)}</span>
+        </div>
       </header>
 
       {status === "done" ? (

src/styles/pages/ecommerce.css

@@ -7933,3 +7933,777 @@
 .clone-ai-adwizard__risk.is-medium { color: #faad14; }
 .clone-ai-adwizard__risk.is-high { color: #ff4d4f; }
 .clone-ai-adwizard__issues { margin: 0; padding-left: 16px; font-size: 12px; display: flex; flex-direction: column; gap: 4px; }
+
+/* Ecommerce generation page SaaS polish: visual-only refinement for the product creation workspace. */
+.product-clone-page {
+  --ecm-page: #0e1012;
+  --ecm-panel: rgba(20, 23, 25, 0.96);
+  --ecm-panel-strong: rgba(24, 28, 30, 0.98);
+  --ecm-inset: rgba(255, 255, 255, 0.035);
+  --ecm-inset-hover: rgba(255, 255, 255, 0.06);
+  --ecm-line: rgba(255, 255, 255, 0.095);
+  --ecm-line-strong: rgba(255, 255, 255, 0.14);
+  --ecm-text: #eef4f0;
+  --ecm-muted: rgba(232, 240, 235, 0.62);
+  --ecm-soft: rgba(232, 240, 235, 0.42);
+  --ecm-accent: var(--accent, #00ff88);
+  --ecm-accent-rgb: var(--accent-rgb, 0, 255, 136);
+  --ecm-radius-sm: 10px;
+  --ecm-radius-md: 14px;
+  --ecm-radius-lg: 18px;
+  --ecm-shadow-soft: 0 14px 38px rgba(0, 0, 0, 0.2);
+  --ecm-shadow-panel: 0 18px 54px rgba(0, 0, 0, 0.28);
+  background:
+    radial-gradient(circle at 26% 0%, rgba(var(--ecm-accent-rgb), 0.055), transparent 34%),
+    linear-gradient(180deg, rgba(255, 255, 255, 0.022), transparent 150px),
+    var(--ecm-page);
+  color: var(--ecm-text);
+  font-family: var(--font-sans, Inter, "PingFang SC", "Microsoft YaHei", Arial, sans-serif);
+}
+
+.product-clone-page > .product-clone-shell {
+  background:
+    linear-gradient(90deg, rgba(255, 255, 255, 0.018), transparent 22%, transparent 76%, rgba(255, 255, 255, 0.014)),
+    transparent;
+}
+
+.product-clone-page :is(button, select, textarea, input) {
+  font-family: inherit;
+  letter-spacing: 0;
+}
+
+.product-clone-page :is(button, select, textarea):focus-visible {
+  outline: 2px solid rgba(var(--ecm-accent-rgb), 0.48);
+  outline-offset: 2px;
+}
+
+.product-clone-page :is(button, select, textarea):disabled {
+  box-shadow: none;
+}
+
+.product-clone-page[data-tool="clone"] {
+  --clone-settings-panel-width: clamp(420px, 36vw, 540px);
+  background:
+    radial-gradient(circle at 72% 12%, rgba(var(--ecm-accent-rgb), 0.045), transparent 31%),
+    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent 180px),
+    var(--ecm-page);
+}
+
+.product-clone-page[data-tool="clone"] > .product-clone-shell,
+.product-clone-page[data-tool="clone"] .clone-ai-preview {
+  background: transparent;
+}
+
+.product-clone-page[data-tool="clone"] .product-clone-panel {
+  border-right-color: var(--ecm-line);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 150px),
+    var(--ecm-panel);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-panel {
+  gap: 12px;
+  padding: 18px;
+  scrollbar-color: rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.035);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-logo {
+  position: sticky;
+  top: 0;
+  z-index: 3;
+  margin: -18px -18px 2px;
+  padding: 16px 18px 14px;
+  border-bottom-color: var(--ecm-line);
+  background:
+    linear-gradient(180deg, rgba(21, 24, 26, 0.98), rgba(21, 24, 26, 0.9));
+  backdrop-filter: blur(16px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-logo__mark {
+  border-radius: 9px;
+  box-shadow: 0 0 0 1px rgba(var(--ecm-accent-rgb), 0.18), 0 10px 24px rgba(var(--ecm-accent-rgb), 0.14);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-logo strong {
+  font-size: 15px;
+  line-height: 1.2;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-logo em {
+  border-color: var(--ecm-line);
+  background: var(--ecm-inset);
+  color: var(--ecm-muted);
+}
+
+.product-clone-page[data-tool="clone"] :is(
+  .clone-ai-card,
+  .clone-ai-platform-spec,
+  .clone-ai-count-panel,
+  .clone-ai-replicate-panel,
+  .clone-ai-module-panel,
+  .clone-ai-model-panel,
+  .clone-ai-video-panel
+) {
+  border-color: var(--ecm-line);
+  border-radius: var(--ecm-radius-md);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 58%),
+    var(--ecm-panel-strong);
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-card {
+  padding: 13px;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-card h2 {
+  margin-bottom: 10px;
+  color: var(--ecm-muted);
+  font-size: 11px;
+  line-height: 1.2;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-upload-zone {
+  min-height: 140px;
+  border-color: rgba(255, 255, 255, 0.16);
+  border-radius: var(--ecm-radius-md);
+  background:
+    radial-gradient(circle at 50% 0%, rgba(var(--ecm-accent-rgb), 0.09), transparent 58%),
+    var(--ecm-inset);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-upload-zone:hover,
+.product-clone-page[data-tool="clone"] .clone-ai-upload-zone.is-dragging {
+  border-color: rgba(var(--ecm-accent-rgb), 0.55);
+  background:
+    radial-gradient(circle at 50% 0%, rgba(var(--ecm-accent-rgb), 0.14), transparent 60%),
+    rgba(var(--ecm-accent-rgb), 0.055);
+  transform: translateY(-1px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-upload-icon {
+  background: rgba(var(--ecm-accent-rgb), 0.09);
+  color: var(--ecm-accent);
+}
+
+.product-clone-page[data-tool="clone"] :is(
+  .clone-ai-tag-group button,
+  .clone-ai-basic-select > button,
+  .clone-ai-basic-select__menu,
+  .clone-ai-basic-select__menu button,
+  .clone-ai-replicate-tabs button,
+  .clone-ai-replicate-upload,
+  .clone-ai-replicate-levels button,
+  .clone-ai-count-row,
+  .clone-ai-count-stepper button,
+  .clone-ai-module-list button,
+  .clone-ai-model-tabs button,
+  .clone-ai-model-scene-grid button,
+  .clone-ai-model-select,
+  .clone-ai-model-select > button,
+  .clone-ai-model-select__menu,
+  .clone-ai-model-select__menu button,
+  .clone-ai-video-options button,
+  .clone-ai-video-smart
+) {
+  border-color: var(--ecm-line);
+  background: var(--ecm-inset);
+  color: var(--ecm-muted);
+}
+
+.product-clone-page[data-tool="clone"] :is(
+  .clone-ai-tag-group button:hover,
+  .clone-ai-basic-select > button:hover,
+  .clone-ai-basic-select > button.is-open,
+  .clone-ai-basic-select__menu button:hover,
+  .clone-ai-replicate-tabs button:hover,
+  .clone-ai-replicate-upload:hover,
+  .clone-ai-replicate-levels button:hover,
+  .clone-ai-count-stepper button:hover:not(:disabled),
+  .clone-ai-module-list button:hover,
+  .clone-ai-model-tabs button:hover,
+  .clone-ai-model-scene-grid button:hover,
+  .clone-ai-model-select > button:hover,
+  .clone-ai-model-select > button.is-open,
+  .clone-ai-model-select__menu button:hover,
+  .clone-ai-video-options button:hover,
+  .clone-ai-video-smart:hover
+) {
+  border-color: var(--ecm-line-strong);
+  background: var(--ecm-inset-hover);
+  color: var(--ecm-text);
+}
+
+.product-clone-page[data-tool="clone"] :is(
+  .clone-ai-tag-group button.is-active,
+  .clone-ai-basic-select__menu button.is-active,
+  .clone-ai-replicate-tabs button.is-active,
+  .clone-ai-replicate-levels button.is-active,
+  .clone-ai-module-list button.is-active,
+  .clone-ai-model-tabs button.is-active,
+  .clone-ai-model-scene-grid button.is-active,
+  .clone-ai-model-select__menu button.is-active,
+  .clone-ai-video-options button.is-active,
+  .clone-ai-video-smart.is-on
+) {
+  border-color: rgba(var(--ecm-accent-rgb), 0.48);
+  background:
+    linear-gradient(180deg, rgba(var(--ecm-accent-rgb), 0.16), rgba(var(--ecm-accent-rgb), 0.07));
+  color: var(--ecm-accent);
+}
+
+.product-clone-page[data-tool="clone"] :is(.clone-ai-generate, .clone-ai-send-button, .clone-ai-upload-zone strong) {
+  background: var(--ecm-accent);
+  color: var(--dg-button-text, #061014);
+  box-shadow: 0 10px 28px rgba(var(--ecm-accent-rgb), 0.18);
+}
+
+.product-clone-page[data-tool="clone"] :is(.clone-ai-generate:hover:not(:disabled), .clone-ai-send-button:hover:not(:disabled)) {
+  filter: brightness(1.03);
+  transform: translateY(-1px);
+}
+
+.product-clone-page[data-tool="clone"] :is(.clone-ai-generate:disabled, .clone-ai-send-button:disabled) {
+  border-color: var(--ecm-line);
+  background: var(--ecm-inset);
+  color: var(--ecm-soft);
+  filter: none;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-settings-toggle {
+  border-color: var(--ecm-line-strong);
+  background: rgba(20, 23, 25, 0.86);
+  color: var(--ecm-muted);
+  box-shadow: var(--ecm-shadow-soft);
+  backdrop-filter: blur(14px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-settings-toggle:hover,
+.product-clone-page[data-tool="clone"] .clone-ai-settings-toggle:focus-visible {
+  border-color: rgba(var(--ecm-accent-rgb), 0.5);
+  background: rgba(var(--ecm-accent-rgb), 0.09);
+  color: var(--ecm-accent);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview {
+  align-content: center;
+  gap: 20px;
+  padding: 90px clamp(22px, 4vw, 46px) 134px;
+  background:
+    radial-gradient(circle at 50% 42%, rgba(var(--ecm-accent-rgb), 0.035), transparent 38%),
+    linear-gradient(180deg, rgba(255, 255, 255, 0.014), transparent 160px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-header {
+  top: 28px;
+  right: clamp(22px, 4vw, 46px);
+  left: clamp(22px, 4vw, 46px);
+  max-width: none;
+  padding-bottom: 16px;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.055);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-header strong {
+  font-size: clamp(18px, 1.6vw, 22px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-header span {
+  max-width: 620px;
+  color: var(--ecm-muted);
+  font-size: 13px;
+  line-height: 1.55;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-empty-state {
+  width: min(100%, 580px);
+  min-height: 260px;
+  padding: 28px;
+  border: 1px solid rgba(255, 255, 255, 0.055);
+  border-radius: 22px;
+  background: rgba(255, 255, 255, 0.014);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-empty-state .anticon {
+  width: 84px;
+  height: 84px;
+  border-color: var(--ecm-line);
+  background:
+    radial-gradient(circle at 50% 16%, rgba(var(--ecm-accent-rgb), 0.12), transparent 62%),
+    var(--ecm-panel-strong);
+  color: rgba(var(--ecm-accent-rgb), 0.46);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-showcase {
+  gap: 18px;
+}
+
+.product-clone-page[data-tool="clone"] :is(.clone-ai-main-result, .clone-ai-result-grid button) {
+  border-color: var(--ecm-line);
+  background: var(--ecm-panel-strong);
+  box-shadow: var(--ecm-shadow-soft);
+}
+
+.product-clone-page[data-tool="clone"] :is(.clone-ai-main-result:hover, .clone-ai-result-grid button:hover) {
+  border-color: rgba(var(--ecm-accent-rgb), 0.38);
+  box-shadow: var(--ecm-shadow-panel);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-bottom-input {
+  right: clamp(18px, 4vw, 46px);
+  bottom: 20px;
+  left: clamp(18px, 4vw, 46px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-input-wrapper {
+  border-color: var(--ecm-line);
+  border-radius: 18px;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
+    rgba(20, 24, 23, 0.92);
+  box-shadow: var(--ecm-shadow-panel);
+  backdrop-filter: blur(18px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-input-wrapper:focus-within {
+  border-color: rgba(var(--ecm-accent-rgb), 0.42);
+  box-shadow:
+    0 20px 58px rgba(0, 0, 0, 0.34),
+    0 0 0 1px rgba(var(--ecm-accent-rgb), 0.08);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-input-wrapper textarea {
+  color: var(--ecm-text);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-char-count {
+  color: var(--ecm-soft);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) {
+  background: var(--ecm-page);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) .product-clone-panel,
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) .product-clone-rail {
+  border-color: var(--ecm-line);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 160px),
+    var(--ecm-panel);
+}
+
+.product-clone-page:is([data-tool="detail"], [data-tool="wear"]) .product-clone-rail button {
+  border-radius: var(--ecm-radius-sm);
+  color: var(--ecm-muted);
+}
+
+.product-clone-page:is([data-tool="detail"], [data-tool="wear"]) .product-clone-rail button:hover,
+.product-clone-page:is([data-tool="detail"], [data-tool="wear"]) .product-clone-rail button.is-active {
+  background: rgba(var(--ecm-accent-rgb), 0.1);
+  color: var(--ecm-accent);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-clone-field,
+  .product-set-upload-section,
+  .product-set-settings-section,
+  .product-set-detail-section
+) {
+  border-color: var(--ecm-line);
+  border-radius: var(--ecm-radius-lg);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.034), transparent 54%),
+    var(--ecm-panel-strong);
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-clone-field h2,
+  .product-set-upload-section h2,
+  .product-set-settings-section h2,
+  .product-set-detail-section h2
+) {
+  color: var(--ecm-text);
+  font-size: 15px;
+  font-weight: 820;
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  select,
+  textarea,
+  .product-clone-upload-zone,
+  .product-set-upload,
+  .product-set-output-grid button,
+  .product-set-structure-grid button,
+  .product-detail-module-grid button,
+  .product-clone-scene-grid button,
+  .product-clone-ratio-row button,
+  .product-clone-segment button,
+  .product-clone-model-button,
+  .product-clone-switch-row,
+  .product-set-style-toggle
+) {
+  border-color: var(--ecm-line);
+  border-radius: var(--ecm-radius-sm);
+  background: var(--ecm-inset);
+  color: var(--ecm-muted);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  select:hover,
+  textarea:hover,
+  .product-clone-upload-zone:hover,
+  .product-set-upload:hover,
+  .product-set-output-grid button:hover,
+  .product-set-structure-grid button:hover,
+  .product-detail-module-grid button:hover,
+  .product-clone-scene-grid button:hover,
+  .product-clone-ratio-row button:hover,
+  .product-clone-segment button:hover,
+  .product-clone-model-button:hover,
+  .product-clone-switch-row:hover,
+  .product-set-style-toggle:hover
+) {
+  border-color: var(--ecm-line-strong);
+  background: var(--ecm-inset-hover);
+  color: var(--ecm-text);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-output-grid button.is-active,
+  .product-set-structure-grid button.is-active,
+  .product-detail-module-grid button.is-active,
+  .product-clone-scene-grid button.is-active,
+  .product-clone-ratio-row button.is-active,
+  .product-clone-segment button.is-active,
+  .product-set-style-toggle.is-active
+) {
+  border-color: rgba(var(--ecm-accent-rgb), 0.48);
+  background: rgba(var(--ecm-accent-rgb), 0.12);
+  color: var(--ecm-accent);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(.product-clone-primary, .product-set-floating-submit) {
+  border: 0;
+  background: var(--ecm-accent);
+  color: var(--dg-button-text, #061014);
+  box-shadow: 0 12px 30px rgba(var(--ecm-accent-rgb), 0.18);
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(.product-clone-primary, .product-set-floating-submit):disabled {
+  background: var(--ecm-inset);
+  color: var(--ecm-soft);
+  box-shadow: none;
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) .product-clone-preview {
+  background:
+    radial-gradient(circle at 50% 40%, rgba(var(--ecm-accent-rgb), 0.032), transparent 40%),
+    transparent;
+}
+
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-empty-preview,
+  .product-clone-empty-panel
+) {
+  border-color: rgba(255, 255, 255, 0.055);
+  border-radius: 22px;
+  background: rgba(255, 255, 255, 0.014);
+}
+
+.product-clone-page[data-tool="set"] .product-set-floating-detail {
+  border-color: var(--ecm-line);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
+    rgba(20, 24, 23, 0.92);
+  box-shadow: var(--ecm-shadow-panel);
+  backdrop-filter: blur(18px);
+}
+
+.ecommerce-progress-bar {
+  border-color: rgba(var(--ecm-accent-rgb), 0.22);
+  background: rgba(var(--ecm-accent-rgb), 0.07);
+}
+
+.ecommerce-progress-bar__fill {
+  box-shadow: 0 0 18px rgba(var(--ecm-accent-rgb), 0.36);
+}
+
+@media (max-width: 1180px) {
+  .product-clone-page[data-tool="clone"] {
+    --clone-settings-panel-width: clamp(390px, 45vw, 440px);
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-preview {
+    padding-right: 28px;
+    padding-left: 28px;
+  }
+}
+
+@media (max-width: 860px) {
+  .product-clone-page[data-tool="clone"] {
+    height: auto;
+    min-height: 100%;
+    overflow: auto;
+  }
+
+  .product-clone-page[data-tool="clone"] > .product-clone-shell,
+  .product-clone-page[data-tool="clone"].is-settings-collapsed > .product-clone-shell {
+    grid-template-columns: 1fr;
+    grid-template-rows: auto minmax(620px, 1fr);
+    height: auto;
+    min-height: 100%;
+  }
+
+  .product-clone-page[data-tool="clone"].is-settings-collapsed > .product-clone-shell {
+    grid-template-rows: 0 minmax(620px, 1fr);
+  }
+
+  .product-clone-page[data-tool="clone"] .product-clone-panel {
+    border-right: 0;
+    border-bottom: 1px solid var(--ecm-line);
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-panel {
+    width: 100%;
+    max-width: none;
+    max-height: none;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-settings-toggle,
+  .product-clone-page[data-tool="clone"].is-settings-collapsed .clone-ai-settings-toggle {
+    top: 14px;
+    right: 14px;
+    left: auto;
+    transform: none;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-settings-toggle:active {
+    transform: scale(0.94);
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-preview {
+    min-height: 620px;
+    padding: 92px 18px 134px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-preview-header {
+    top: 24px;
+    right: 18px;
+    left: 18px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-preview-showcase {
+    grid-template-columns: 1fr;
+    width: min(100%, 520px);
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-flow-arrow {
+    display: none;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-main-result {
+    height: 260px;
+  }
+}
+
+@media (max-width: 620px) {
+  .product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) .product-clone-panel__scroll,
+  .product-clone-page[data-tool="clone"] .clone-ai-panel {
+    padding: 14px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-logo {
+    margin: -14px -14px 0;
+    padding: 14px 54px 12px 14px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-card,
+  .product-clone-page[data-tool="clone"] :is(.clone-ai-platform-spec, .clone-ai-count-panel, .clone-ai-replicate-panel, .clone-ai-module-panel, .clone-ai-model-panel, .clone-ai-video-panel) {
+    padding: 11px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-upload-zone {
+    min-height: 120px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-tag-group,
+  .product-clone-page[data-tool="clone"] .clone-ai-basic-select-grid,
+  .product-clone-page[data-tool="clone"] .clone-ai-model-select-grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-preview {
+    min-height: 560px;
+    padding: 86px 12px 128px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-empty-state {
+    min-height: 220px;
+    padding: 22px 16px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-bottom-input {
+    right: 10px;
+    bottom: 12px;
+    left: 10px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper {
+    grid-template-columns: minmax(0, 1fr) 36px;
+    gap: 8px;
+    padding: 10px;
+    border-radius: 16px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-send-button {
+    width: 36px;
+    height: 36px;
+  }
+}
+
+@media (max-width: 900px) {
+  .product-clone-page {
+    box-sizing: border-box;
+    padding-top: 58px;
+  }
+
+  .product-clone-page > .product-clone-shell {
+    min-height: calc(100% - 58px);
+  }
+}
+
+@media (max-width: 480px) {
+  .product-clone-page {
+    padding-top: 56px;
+  }
+
+  .product-clone-page > .product-clone-shell {
+    min-height: calc(100% - 56px);
+  }
+}
+
+/* Ecommerce refinement pass: make the preview state more informative and selected controls quieter. */
+.product-clone-page[data-tool="clone"] .clone-ai-preview {
+  padding-top: 138px;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-header {
+  gap: 9px;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-summary {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 7px;
+  max-width: min(100%, 720px);
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-summary span {
+  display: inline-flex;
+  align-items: center;
+  max-width: 180px;
+  min-height: 26px;
+  padding: 0 10px;
+  overflow: hidden;
+  border: 1px solid rgba(255, 255, 255, 0.095);
+  border-radius: 999px;
+  background: rgba(255, 255, 255, 0.035);
+  color: rgba(232, 240, 235, 0.68);
+  font-size: 11px;
+  font-weight: 780;
+  line-height: 1;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-preview-summary span:first-child {
+  border-color: rgba(var(--ecm-accent-rgb), 0.28);
+  background: rgba(var(--ecm-accent-rgb), 0.08);
+  color: var(--ecm-accent);
+}
+
+.product-clone-page[data-tool="clone"] :is(
+  .clone-ai-module-list button,
+  .clone-ai-model-scene-grid button,
+  .clone-ai-replicate-levels button,
+  .clone-ai-video-options button
+),
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button,
+  .product-detail-module-grid button,
+  .product-clone-scene-grid button,
+  .product-clone-ratio-row button
+) {
+  position: relative;
+  overflow: hidden;
+}
+
+.product-clone-page[data-tool="clone"] :is(
+  .clone-ai-module-list button.is-active,
+  .clone-ai-model-scene-grid button.is-active,
+  .clone-ai-replicate-levels button.is-active,
+  .clone-ai-video-options button.is-active
+),
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button.is-active,
+  .product-detail-module-grid button.is-active,
+  .product-clone-scene-grid button.is-active,
+  .product-clone-ratio-row button.is-active
+) {
+  border-color: rgba(var(--ecm-accent-rgb), 0.5);
+  background:
+    linear-gradient(90deg, rgba(var(--ecm-accent-rgb), 0.13), rgba(var(--ecm-accent-rgb), 0.035)),
+    rgba(255, 255, 255, 0.035);
+  color: var(--ecm-text);
+}
+
+.product-clone-page[data-tool="clone"] :is(
+  .clone-ai-module-list button.is-active,
+  .clone-ai-model-scene-grid button.is-active,
+  .clone-ai-replicate-levels button.is-active,
+  .clone-ai-video-options button.is-active
+)::before,
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button.is-active,
+  .product-detail-module-grid button.is-active,
+  .product-clone-scene-grid button.is-active,
+  .product-clone-ratio-row button.is-active
+)::before {
+  position: absolute;
+  inset: 8px auto 8px 0;
+  width: 3px;
+  border-radius: 999px;
+  background: var(--ecm-accent);
+  content: "";
+}
+
+.product-clone-page[data-tool="clone"] .clone-ai-module-list button.is-active span,
+.product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button.is-active em,
+  .product-detail-module-grid button.is-active span
+) {
+  color: rgba(232, 240, 235, 0.62);
+}
+
+@media (max-width: 860px) {
+  .product-clone-page[data-tool="clone"] .clone-ai-preview {
+    padding-top: 148px;
+  }
+}
+
+@media (max-width: 620px) {
+  .product-clone-page[data-tool="clone"] .clone-ai-preview {
+    padding-top: 158px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-preview-summary {
+    gap: 6px;
+  }
+
+  .product-clone-page[data-tool="clone"] .clone-ai-preview-summary span {
+    max-width: 138px;
+    min-height: 24px;
+    padding: 0 8px;
+    font-size: 10px;
+  }
+}

src/styles/themes/dark-green.css

@@ -8881,3 +8881,67 @@
     padding-top: 6px;
   }
 }
+
+/* Ecommerce final polish: keep selected option states refined in the dark-green theme. */
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page[data-tool="clone"] :is(
+  .clone-ai-module-list button,
+  .clone-ai-model-scene-grid button,
+  .clone-ai-replicate-levels button,
+  .clone-ai-video-options button
+),
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button,
+  .product-detail-module-grid button,
+  .product-clone-scene-grid button,
+  .product-clone-ratio-row button
+) {
+  position: relative;
+  overflow: hidden;
+}
+
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page[data-tool="clone"] :is(
+  .clone-ai-module-list button.is-active,
+  .clone-ai-model-scene-grid button.is-active,
+  .clone-ai-replicate-levels button.is-active,
+  .clone-ai-video-options button.is-active
+),
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button.is-active,
+  .product-detail-module-grid button.is-active,
+  .product-clone-scene-grid button.is-active,
+  .product-clone-ratio-row button.is-active
+) {
+  border-color: rgba(var(--accent-rgb), 0.48);
+  background:
+    linear-gradient(90deg, rgba(var(--accent-rgb), 0.12), rgba(var(--accent-rgb), 0.035)),
+    rgba(255, 255, 255, 0.032);
+  color: var(--fg-body);
+}
+
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page[data-tool="clone"] :is(
+  .clone-ai-module-list button.is-active,
+  .clone-ai-model-scene-grid button.is-active,
+  .clone-ai-replicate-levels button.is-active,
+  .clone-ai-video-options button.is-active
+)::before,
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button.is-active,
+  .product-detail-module-grid button.is-active,
+  .product-clone-scene-grid button.is-active,
+  .product-clone-ratio-row button.is-active
+)::before {
+  position: absolute;
+  inset: 8px auto 8px 0;
+  width: 3px;
+  border-radius: 999px;
+  background: var(--accent);
+  content: "";
+}
+
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page[data-tool="clone"] .clone-ai-module-list button.is-active span,
+.web-shell[data-ui-theme="dark-green"][data-view="ecommerce"] .product-clone-page:is([data-tool="set"], [data-tool="detail"], [data-tool="wear"]) :is(
+  .product-set-structure-grid button.is-active em,
+  .product-detail-module-grid button.is-active span
+) {
+  color: rgba(232, 240, 235, 0.62);
+}