diff --git a/ui/src/styles/components.css b/ui/src/styles/components.css
index 4edba864cd3..2b44c478a10 100644
--- a/ui/src/styles/components.css
+++ b/ui/src/styles/components.css
@@ -2759,11 +2759,14 @@
 
 .exec-approval-card {
   width: min(540px, 100%);
+  max-height: calc(100vh - 48px);
   background: var(--card);
   border: 1px solid var(--border);
   border-radius: var(--radius-lg);
   padding: 20px;
   animation: scale-in 0.2s var(--ease-out);
+  display: flex;
+  flex-direction: column;
 }
 
 .exec-approval-header {
@@ -2771,6 +2774,16 @@
   align-items: center;
   justify-content: space-between;
   gap: 16px;
+  flex-shrink: 0;
+}
+
+.exec-approval-content {
+  overflow-y: auto;
+  overflow-x: hidden;
+  flex: 1 1 auto;
+  min-height: 0;
+  margin-right: -4px;
+  padding-right: 4px;
 }
 
 .exec-approval-title {
@@ -2835,6 +2848,7 @@
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
+  flex-shrink: 0;
 }
 
 /* ===========================================
diff --git a/ui/src/ui/views/exec-approval.ts b/ui/src/ui/views/exec-approval.ts
index f1f549fc354..6e9e3bf7c44 100644
--- a/ui/src/ui/views/exec-approval.ts
+++ b/ui/src/ui/views/exec-approval.ts
@@ -45,21 +45,23 @@ export function renderExecApprovalPrompt(state: AppViewState) {
               : nothing
           }
         </div>
-        <div class="exec-approval-command mono">${request.command}</div>
-        <div class="exec-approval-meta">
-          ${renderMetaRow("Host", request.host)}
-          ${renderMetaRow("Agent", request.agentId)}
-          ${renderMetaRow("Session", request.sessionKey)}
-          ${renderMetaRow("CWD", request.cwd)}
-          ${renderMetaRow("Resolved", request.resolvedPath)}
-          ${renderMetaRow("Security", request.security)}
-          ${renderMetaRow("Ask", request.ask)}
+        <div class="exec-approval-content">
+          <div class="exec-approval-command mono">${request.command}</div>
+          <div class="exec-approval-meta">
+            ${renderMetaRow("Host", request.host)}
+            ${renderMetaRow("Agent", request.agentId)}
+            ${renderMetaRow("Session", request.sessionKey)}
+            ${renderMetaRow("CWD", request.cwd)}
+            ${renderMetaRow("Resolved", request.resolvedPath)}
+            ${renderMetaRow("Security", request.security)}
+            ${renderMetaRow("Ask", request.ask)}
+          </div>
+          ${
+            state.execApprovalError
+              ? html`<div class="exec-approval-error">${state.execApprovalError}</div>`
+              : nothing
+          }
         </div>
-        ${
-          state.execApprovalError
-            ? html`<div class="exec-approval-error">${state.execApprovalError}</div>`
-            : nothing
-        }
         <div class="exec-approval-actions">
           <button
             class="btn primary"