style: 优化思考模式按钮排版为独立胶囊样式

frontend/vue-demo/src/views/Home.vue

@@ -528,18 +528,45 @@ async function handleUploadTemplate() {
     display: flex;
     justify-content: center;
     
-    :deep(.el-radio-button__inner) {
-      border-radius: 18px;
-      border: 1px solid var(--border);
-      background: var(--bg);
-      font-size: 12px;
-      padding: 6px 12px;
+    :deep(.el-radio-group) {
+      display: flex;
+      gap: 8px;
+      flex-wrap: wrap;
+      justify-content: center;
     }
     
-    :deep(.el-radio-button__original-radio:checked + .el-radio-button__inner) {
-      background: var(--primary-light);
-      border-color: var(--primary);
-      color: var(--primary);
+    :deep(.el-radio-button) {
+      // 移除默认的连接样式
+      &:first-child .el-radio-button__inner {
+        border-radius: 18px;
+        border-left: 1px solid var(--border);
+      }
+      
+      &:last-child .el-radio-button__inner {
+        border-radius: 18px;
+      }
+      
+      .el-radio-button__inner {
+        border-radius: 18px;
+        border: 1px solid var(--border);
+        background: var(--bg);
+        font-size: 12px;
+        padding: 8px 16px;
+        box-shadow: none;
+        transition: all 0.2s;
+        
+        &:hover {
+          border-color: var(--primary);
+          color: var(--primary);
+        }
+      }
+      
+      &.is-active .el-radio-button__inner {
+        background: var(--primary-light);
+        border-color: var(--primary);
+        color: var(--primary);
+        box-shadow: none;
+      }
     }
   }
 }