Constrain create-workspace dialog height for long orca.yaml scripts (#4873)

- Limit command preview blocks to 12rem (max-h-48) with scroll
- Cap dialog body to viewport height minus 2rem
- Add sr-only accessible description to the dialog

src/renderer/src/components/NewWorkspaceComposerCard.tsx

@@ -115,7 +115,8 @@ function SetupCommandPreview({
           <div className="font-mono text-[11px] text-muted-foreground">orca.yaml</div>
           {headerAction}
         </div>
-        <pre className="overflow-x-auto whitespace-pre-wrap break-words px-4 py-3 font-mono text-[12px] leading-5 text-emerald-700 dark:text-emerald-300/95">
+        {/* Why: long orca.yaml scripts must not grow the create dialog past the viewport. */}
+        <pre className="max-h-48 overflow-auto whitespace-pre-wrap break-words px-4 py-3 font-mono text-[12px] leading-5 text-emerald-700 scrollbar-sleek dark:text-emerald-300/95">
           {setupConfig.command}
         </pre>
       </div>
@@ -130,7 +131,7 @@ function SetupCommandPreview({
         </div>
         {headerAction}
       </div>
-      <pre className="overflow-x-auto whitespace-pre-wrap break-words font-mono text-[12px] leading-5 text-foreground">
+      <pre className="max-h-48 overflow-auto whitespace-pre-wrap break-words font-mono text-[12px] leading-5 text-foreground scrollbar-sleek">
         {setupConfig.command}
       </pre>
     </div>

src/renderer/src/components/NewWorkspaceComposerModal.tsx

@@ -1,6 +1,12 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react'
 import { useAppStore } from '@/store'
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle
+} from '@/components/ui/dialog'
 import NewWorkspaceComposerCard from '@/components/NewWorkspaceComposerCard'
 import AgentSettingsDialog from '@/components/agent/AgentSettingsDialog'
 import { useComposerState } from '@/hooks/useComposerState'
@@ -74,7 +80,7 @@ function ComposerModalBody({
   return (
     <Dialog open onOpenChange={onOpenChange}>
       <DialogContent
-        className="flex flex-col sm:max-w-lg"
+        className="flex max-h-[calc(100vh-2rem)] flex-col overflow-hidden sm:max-w-lg"
         onOpenAutoFocus={(event) => {
           // Why: Radix's FocusScope fires this once the dialog has mounted.
           // preventDefault stops it from focusing whatever first-tabbable it
@@ -221,9 +227,13 @@ function QuickTabBody({
     <>
       <DialogHeader className="gap-1">
         <DialogTitle className="text-base font-semibold">{primaryActionLabel}</DialogTitle>
+        <DialogDescription className="sr-only">
+          Choose the project, workspace name, and agent before creating the workspace.
+        </DialogDescription>
       </DialogHeader>
       <NewWorkspaceComposerCard
         contextualTourSource={modalData.contextualTourSource}
+        containerClassName="min-h-0 flex-1 overflow-y-auto pr-1 scrollbar-sleek"
         composerRef={composerRef}
         onComposerNodeChange={onComposerNodeChange}
         nameInputRef={nameInputRef}