diff --git a/webui/src/web-components/sketch-monaco-view.ts b/webui/src/web-components/sketch-monaco-view.ts
index fa657f9..2ab89fa 100644
--- a/webui/src/web-components/sketch-monaco-view.ts
+++ b/webui/src/web-components/sketch-monaco-view.ts
@@ -340,7 +340,7 @@
       box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
       padding: 12px;
       z-index: 10001;
-      width: 350px;
+      width: 600px;
       animation: fadeIn 0.2s ease-in-out;
       max-height: 80vh;
       overflow-y: auto;
@@ -380,10 +380,20 @@
       margin-bottom: 10px;
       font-family: monospace;
       font-size: 12px;
-      max-height: 100px;
       overflow-y: auto;
       white-space: pre-wrap;
       word-break: break-all;
+      line-height: 1.4;
+    }
+
+    .selected-text-preview.small-selection {
+      /* For selections of 10 lines or fewer, ensure all content is visible */
+      max-height: none;
+    }
+
+    .selected-text-preview.large-selection {
+      /* For selections larger than 10 lines, limit height with scroll */
+      max-height: 280px; /* Approximately 10 lines at 12px font with 1.4 line-height */
     }
 
     .comment-textarea {
@@ -480,7 +490,9 @@
               </div>
               ${this.selectedLines
                 ? html`
-                    <div class="selected-text-preview">
+                    <div
+                      class="selected-text-preview ${this.getPreviewCssClass()}"
+                    >
                       ${this.selectedLines.text}
                     </div>
                   `
@@ -514,6 +526,21 @@
   }
 
   /**
+   * Get CSS class for selected text preview based on number of lines
+   */
+  private getPreviewCssClass(): string {
+    if (!this.selectedLines) {
+      return "large-selection";
+    }
+
+    // Count the number of lines in the selected text
+    const lineCount = this.selectedLines.text.split("\n").length;
+
+    // If 10 lines or fewer, show all content; otherwise, limit height
+    return lineCount <= 10 ? "small-selection" : "large-selection";
+  }
+
+  /**
    * Close the comment box
    */
   private closeCommentBox() {
@@ -635,9 +662,9 @@
           const viewportWidth = window.innerWidth;
           const viewportHeight = window.innerHeight;
 
-          // Estimated box dimensions
-          const boxWidth = 350;
-          const boxHeight = 300;
+          // Estimated box dimensions (updated for wider box)
+          const boxWidth = 600;
+          const boxHeight = 400;
 
           // Check if box would go off the right edge
           if (screenLeft + boxWidth > viewportWidth) {