Refine AI run content block styling and improve visual hierarchy

• Adjust font sizes for headings
• Add background and border radius to blocks
• Implement hover effect for raw switch
• Reduce padding and adjust spacing
• Update text color for empty state

packages/editor-ui/src/components/RunDataAi/AiRunContentBlock.vue

@@ -233,17 +233,17 @@ onMounted(() => {
 		white-space: pre-wrap;
 
 		h1 {
-			font-size: var(--font-size-xl);
+			font-size: var(--font-size-l);
 			line-height: var(--font-line-height-xloose);
 		}
 
 		h2 {
-			font-size: var(--font-size-l);
+			font-size: var(--font-size-m);
 			line-height: var(--font-line-height-loose);
 		}
 
 		h3 {
-			font-size: var(--font-size-m);
+			font-size: var(--font-size-s);
 			line-height: var(--font-line-height-regular);
 		}
 
@@ -260,10 +260,13 @@ onMounted(() => {
 .contentText {
 	padding-top: var(--spacing-s);
 	padding-left: var(--spacing-m);
-	font-size: var(--font-size-m);
+	font-size: var(--font-size-s);
 }
 .block {
+	padding: 0 0 var(--spacing-2xs) var(--spacing-2xs);
+	background: var(--color-foreground-light);
 	margin-top: var(--spacing-xl);
+	border-radius: var(--border-radius-base);
 }
 :root .blockContent {
 	height: 0;
@@ -278,35 +281,40 @@ onMounted(() => {
 	white-space: pre-line;
 }
 .rawSwitch {
+	opacity: 0;
 	height: fit-content;
 	margin-left: auto;
+	margin-right: var(--spacing-2xs);
+
+	.block:hover & {
+		opacity: 1;
+	}
 }
 .blockHeader {
 	display: flex;
 	gap: var(--spacing-xs);
 	cursor: pointer;
 	/* This hack is needed to make the whole surface of header clickable  */
 	margin: calc(-1 * var(--spacing-xs));
-	padding: var(--spacing-4xs) var(--spacing-xs);
+	padding: var(--spacing-2xs) var(--spacing-xs);
 	align-items: center;
 
 	& * {
 		user-select: none;
 	}
 }
 .blockTitle {
-	font-size: var(--font-size-m);
+	font-size: var(--font-size-s);
 	color: var(--color-text-dark);
-	font-weight: var(--font-weight-bold);
 	margin: 0;
-	// Visually center the title
 	padding-bottom: var(--spacing-4xs);
 }
 .blockToggle {
 	border: none;
 	background: none;
 	padding: 0;
 	color: var(--color-text-base);
+	margin-top: calc(-1 * var(--spacing-3xs));
 }
 .error {
 	padding: var(--spacing-s) 0;

packages/editor-ui/src/components/RunDataAi/RunDataAi.vue

@@ -298,6 +298,7 @@ watch(() => props.runIndex, selectFirst, { immediate: true });
 	align-items: center;
 	justify-content: center;
 	width: 100%;
+	color: var(--color-text-light);
 }
 .empty {
 	padding: var(--spacing-l);