diff --git a/packages/coding-agent/src/core/export-html/template.css b/packages/coding-agent/src/core/export-html/template.css
index 61b0a75a..bea3be33 100644
--- a/packages/coding-agent/src/core/export-html/template.css
+++ b/packages/coding-agent/src/core/export-html/template.css
@@ -495,6 +495,9 @@
       padding: var(--line-height);
       border-radius: 4px;
       margin-bottom: var(--line-height);
+    }
+
+    .system-prompt.expandable {
       cursor: pointer;
     }
 
@@ -503,26 +506,35 @@
       color: var(--customMessageLabel);
     }
 
-    .system-prompt-collapsed {
+    .system-prompt-preview {
       color: var(--customMessageText);
+      white-space: pre-wrap;
+      word-wrap: break-word;
+      font-size: 11px;
+      margin-top: var(--line-height);
     }
 
-    .system-prompt-content {
+    .system-prompt-expand-hint {
+      color: var(--muted);
+      font-style: italic;
+      margin-top: 4px;
+    }
+
+    .system-prompt-full {
       display: none;
       color: var(--customMessageText);
       white-space: pre-wrap;
       word-wrap: break-word;
       font-size: 11px;
-      max-height: 400px;
-      overflow-y: auto;
       margin-top: var(--line-height);
     }
 
-    .system-prompt.expanded .system-prompt-collapsed {
+    .system-prompt.expanded .system-prompt-preview,
+    .system-prompt.expanded .system-prompt-expand-hint {
       display: none;
     }
 
-    .system-prompt.expanded .system-prompt-content {
+    .system-prompt.expanded .system-prompt-full {
       display: block;
     }
 
diff --git a/packages/coding-agent/src/core/export-html/template.js b/packages/coding-agent/src/core/export-html/template.js
index f967949d..69050023 100644
--- a/packages/coding-agent/src/core/export-html/template.js
+++ b/packages/coding-agent/src/core/export-html/template.js
@@ -964,13 +964,23 @@
           </div>`;
 
         if (systemPrompt) {
-          const promptLines = systemPrompt.split('\n').length;
-          const promptChars = systemPrompt.length;
-          html += `<div class="system-prompt" onclick="this.classList.toggle('expanded')">
-            <div class="system-prompt-header">System Prompt</div>
-            <div class="system-prompt-collapsed">${promptLines} lines, ${promptChars.toLocaleString()} chars (click to expand)</div>
-            <div class="system-prompt-content">${escapeHtml(systemPrompt)}</div>
-          </div>`;
+          const lines = systemPrompt.split('\n');
+          const previewLines = 10;
+          if (lines.length > previewLines) {
+            const preview = lines.slice(0, previewLines).join('\n');
+            const remaining = lines.length - previewLines;
+            html += `<div class="system-prompt expandable" onclick="this.classList.toggle('expanded')">
+              <div class="system-prompt-header">System Prompt</div>
+              <div class="system-prompt-preview">${escapeHtml(preview)}</div>
+              <div class="system-prompt-expand-hint">... (${remaining} more lines, click to expand)</div>
+              <div class="system-prompt-full">${escapeHtml(systemPrompt)}</div>
+            </div>`;
+          } else {
+            html += `<div class="system-prompt">
+              <div class="system-prompt-header">System Prompt</div>
+              <div class="system-prompt-full" style="display: block">${escapeHtml(systemPrompt)}</div>
+            </div>`;
+          }
         }
 
         if (tools && tools.length > 0) {