fix: multi-select问题默认使用modal而非drawer，改善checkbox间距

- DialogStyleContext: multi-select推荐样式从drawer改为modal
- A2UIPopupCard: DrawerPopup增加multi-select间距处理
- A2UICheckbox: 增大水平间距、行高和label-description间距

ccw/frontend/src/components/a2ui/A2UIPopupCard.tsx

@@ -810,6 +810,7 @@ function DrawerPopup({ surface, onClose, drawerSide, drawerSize }: StyleProps) {
     [sendA2UIAction, surface.surfaceId, onClose]
   );
 
+  const questionType = detectQuestionType(surface);
   const bodyComponents = surface.components.filter(
     (c) => !['title', 'message', 'description'].includes(c.id) && !isActionButton(c)
   );
@@ -823,12 +824,28 @@ function DrawerPopup({ surface, onClose, drawerSide, drawerSize }: StyleProps) {
         </DrawerHeader>
         <div className="flex-1 overflow-y-auto">
           {bodyComponents.length > 0 && (
+            <div className={cn(
+              'py-3',
+              questionType === 'multi-select' && 'space-y-3 px-1'
+            )}>
+              {questionType === 'multi-select' ? (
+                bodyComponents.map((comp) => (
+                  <div key={comp.id} className="py-1">
+                    <A2UIRenderer
+                      surface={{ ...surface, components: [comp] }}
+                      onAction={handleAction}
+                    />
+                  </div>
+                ))
+              ) : (
                 <A2UIRenderer
                   surface={{ ...surface, components: bodyComponents }}
                   onAction={handleAction}
                 />
               )}
             </div>
+          )}
+        </div>
         {actionButtons.length > 0 && (
           <DrawerFooter>
             {actionButtons.map((comp) => (

ccw/frontend/src/contexts/DialogStyleContext.tsx

@@ -61,7 +61,7 @@ export const DEFAULT_A2UI_PREFERENCES: A2UIPreferences = {
 const STYLE_RECOMMENDATIONS: Record<string, DialogStyle> = {
   confirm: 'modal',
   select: 'modal',
-  'multi-select': 'drawer',
+  'multi-select': 'modal',
   input: 'modal',
   'multi-question': 'drawer',
   form: 'drawer',

ccw/frontend/src/packages/a2ui-runtime/renderer/components/A2UICheckbox.tsx

@@ -50,20 +50,20 @@ export const A2UICheckbox: ComponentRenderer = ({ component, onAction, resolveBi
     : '';
 
   return (
-    <div className="flex items-start space-x-2">
+    <div className="flex items-start space-x-3 py-1">
       <Checkbox
         className="mt-0.5"
         checked={checked}
         onCheckedChange={handleChange}
       />
-      <div className="grid gap-0.5">
+      <div className="grid gap-1">
         {labelText && (
-          <Label className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
+          <Label className="text-sm font-medium leading-normal peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
             {labelText}
           </Label>
         )}
         {descriptionText && (
-          <p className="text-xs text-muted-foreground">{descriptionText}</p>
+          <p className="text-xs text-muted-foreground leading-relaxed">{descriptionText}</p>
         )}
       </div>
     </div>