diff --git a/main/manager-web/src/components/HeaderBar.vue b/main/manager-web/src/components/HeaderBar.vue
index 4d7c5ba9..476358db 100644
--- a/main/manager-web/src/components/HeaderBar.vue
+++ b/main/manager-web/src/components/HeaderBar.vue
@@ -687,7 +687,7 @@ export default {
   background: #deeafe;
   display: flex;
   justify-content: center;
-  font-size: 14px;
+  font-size: 16px;
   font-weight: 500;
   gap: 7px;
   color: #3d4566;
diff --git a/main/manager-web/src/views/KnowledgeBaseItem.vue b/main/manager-web/src/views/KnowledgeBaseItem.vue
index ed7d7cf3..fa830b6e 100644
--- a/main/manager-web/src/views/KnowledgeBaseItem.vue
+++ b/main/manager-web/src/views/KnowledgeBaseItem.vue
@@ -31,10 +31,10 @@
         <div class="doc-card-bottom">
           <div class="doc-card-progress">
             <div class="progress-ring">
-              <svg viewBox="0 0 44 44">
-                <circle class="bg" cx="22" cy="22" r="17"/>
-                <circle class="fg" :class="getProgressClass(doc)" cx="22" cy="22" r="17"
-                  stroke-dasharray="106.81"
+              <svg viewBox="0 0 40 40">
+                <circle class="bg" cx="20" cy="20" r="15"/>
+                <circle class="fg" :class="getProgressClass(doc)" cx="20" cy="20" r="15"
+                  stroke-dasharray="94.25"
                   :stroke-dashoffset="getProgressOffset(doc)"/>
               </svg>
               <span class="progress-ring-text" :style="{ color: getProgressTextColor(doc) }">{{ getProgressText(doc) }}</span>
@@ -326,7 +326,7 @@ export default {
 
     getProgressOffset(doc) {
       const code = doc.parseStatusCode;
-      const circumference = 106.81;
+      const circumference = 94.25;
       if (code === 3) return 0;
       if (code === 1) {
         const progress = doc.chunkNum && doc.totalChunkNum
@@ -403,13 +403,13 @@ export default {
 }
 
 .doc-section-title {
-  font-size: 20px;
+  font-size: 18px;
   font-weight: 500;
   color: #1f2a44;
 }
 
 .doc-section-count {
-  font-size: 14px;
+  font-size: 18px;
   color: #788ba8;
 }
 
@@ -436,13 +436,14 @@ export default {
 }
 
 .doc-card {
-  max-height: 120px;
+  max-height: 110px;
   border-radius: 8px;
   border: 1px solid transparent;
   padding: 18px;
   background: #fff;
   display: flex;
   flex-direction: column;
+  justify-content: center;
   cursor: pointer;
   transition: all 0.25s;
   position: relative;
@@ -495,7 +496,6 @@ export default {
 }
 
 .doc-card-bottom {
-  margin-top: auto;
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -509,13 +509,13 @@ export default {
 
 /* ========== Progress Ring ========== */
 .progress-ring {
-  width: 44px;
-  height: 44px;
+  width: 40px;
+  height: 40px;
   position: relative;
 
   svg {
-    width: 44px;
-    height: 44px;
+    width: 40px;
+    height: 40px;
     transform: rotate(-90deg);
   }
 
@@ -548,7 +548,7 @@ export default {
 }
 
 .progress-container {
-  height: 32px;
+  height: 36px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
diff --git a/main/manager-web/src/views/KnowledgeBaseManagement.vue b/main/manager-web/src/views/KnowledgeBaseManagement.vue
index 9ab2b42f..537b46e7 100644
--- a/main/manager-web/src/views/KnowledgeBaseManagement.vue
+++ b/main/manager-web/src/views/KnowledgeBaseManagement.vue
@@ -27,11 +27,11 @@
       <div class="content-panel">
         <div class="content-area" v-loading="loading" :element-loading-text="$t('knowledgeBaseManagement.loading')">
           <!-- Knowledge Base Cards Section -->
-          <div class="kb-section">
+          <div class="kb-section" :style="{ height: filteredKnowledgeBases.length > 0 ? 'fit-content' : '100%' }">
             <div class="kb-section-header">
               <div class="kb-section-title">{{ $t('knowledgeBaseManagement.switchKnowledgeBase') }}</div>
             </div>
-            <div class="kb-cards-wrapper">
+            <div class="kb-cards-wrapper" :style="{ height: filteredKnowledgeBases.length > 0 ? 'fit-content' : '100%' }">
               <div class="kb-arrow left" @click="scrollCards(-1)" v-if="filteredKnowledgeBases.length > 0">
                 <i class="el-icon-arrow-left"></i>
               </div>
@@ -67,8 +67,8 @@
                             v-model="kb.status"
                             :active-value="1"
                             :inactive-value="0"
-                            active-color="#13ce66"
-                            inactive-color="#ff4949"
+                            active-color="#5778ff"
+                            inactive-color="#DCDFE6"
                             @click.native.stop
                             @change="handleStatusChange(kb)"
                           ></el-switch>
@@ -79,7 +79,6 @@
                   <div class="kb-card-desc">{{ kb.description || '-' }}</div>
                 </div>
                 <div v-if="filteredKnowledgeBases.length === 0 && !loading" class="kb-empty">
-                  <i class="el-icon-folder-opened"></i>
                   <p>{{ $t('knowledgeBaseManagement.noData') }}</p>
                 </div>
               </div>
@@ -99,9 +98,6 @@
             @view-slices="handleViewSlices"
             @refresh="refreshDocuments"
           />
-          <div v-else class="doc-empty-placeholder">
-            <el-empty :description="$t('knowledgeBaseManagement.noData')"></el-empty>
-          </div>
         </div>
       </div>
     </div>
@@ -810,7 +806,7 @@ export default {
 }
 
 .kb-section-title {
-  font-size: 20px;
+  font-size: 18px;
   font-weight: 500;
   color: #1f2a44;
 }
@@ -976,7 +972,6 @@ export default {
 }
 
 .kb-card-desc {
-  margin-top: 10px;
   font-size: 14px;
   text-align: left;
   color: #7888a8;