diff --git a/apps/web/src/pages/generate/generate.css b/apps/web/src/pages/generate/generate.css
index 2c2f0702c..1b958195d 100644
--- a/apps/web/src/pages/generate/generate.css
+++ b/apps/web/src/pages/generate/generate.css
@@ -2356,6 +2356,103 @@
    生成预览步骤
    ================================================================ */
 
+/* ── 初始状态：生成按钮 ── */
+.xx-preview-generate-section {
+  text-align: center;
+  padding: 40px 20px;
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-lg);
+  border: 2px dashed var(--border-color);
+}
+
+.xx-preview-generate-hint {
+  margin-bottom: 24px;
+}
+
+.xx-preview-generate-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--text-primary);
+  margin: 0 0 8px 0;
+}
+
+.xx-preview-generate-desc {
+  font-size: 13px;
+  color: var(--text-secondary);
+  margin: 0;
+}
+
+.xx-preview-generate-btn {
+  min-width: 160px;
+  height: 42px;
+  font-size: 14px;
+}
+
+/* ── 加载中状态 ── */
+.xx-preview-loading {
+  text-align: center;
+  padding: 40px 20px;
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-lg);
+  border: 1px solid var(--border-color);
+}
+
+.xx-preview-loading-text {
+  font-size: 15px;
+  font-weight: 600;
+  color: var(--text-primary);
+  margin: 16px 0 8px 0;
+}
+
+.xx-preview-loading-desc {
+  font-size: 13px;
+  color: var(--text-secondary);
+  margin: 0;
+}
+
+/* ── 错误状态 ── */
+.xx-preview-error {
+  text-align: center;
+  padding: 32px 20px;
+  background: rgba(239, 68, 68, 0.06);
+  border-radius: var(--radius-lg);
+  border: 1px solid rgba(239, 68, 68, 0.2);
+}
+
+.xx-preview-error-text {
+  font-size: 15px;
+  font-weight: 600;
+  color: var(--error-color, #ef4444);
+  margin: 12px 0 6px 0;
+}
+
+.xx-preview-error-desc {
+  font-size: 13px;
+  color: var(--text-secondary);
+  margin: 0 0 16px 0;
+}
+
+/* ── 成功状态的操作按钮 ── */
+.xx-preview-regenerate-btn {
+  margin-left: auto;
+  background: none;
+  border: none;
+  color: var(--text-tertiary);
+  font-size: 12px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding: 4px 8px;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+}
+
+.xx-preview-regenerate-btn:hover {
+  color: var(--primary-color);
+  background: rgba(59, 130, 246, 0.1);
+}
+
 .xx-preview-tip {
   display: flex;
   align-items: center;
@@ -2639,3 +2736,4 @@
 .ant-modal-close {
   color: #fff !important;
 }
+