diff --git a/src/components/sidebar/ChatSidebar.vue b/src/components/sidebar/ChatSidebar.vue
index 4ed87dc..a353d95 100644
--- a/src/components/sidebar/ChatSidebar.vue
+++ b/src/components/sidebar/ChatSidebar.vue
@@ -33,7 +33,7 @@
                 <span class="model-name">{{ model.name }}</span>
                 <span class="model-desc">{{ model.description }}</span>
               </div>
-              <Check v-if="model.id === currentModelId" :size="16" class="check-icon" />
+              <!-- <Check v-if="model.id === currentModelId" :size="16" class="check-icon" /> -->
             </button>
           </div>
         </Transition>
@@ -419,13 +419,19 @@ onBeforeUnmount(() => {
   min-width: 200px;
   max-height: 300px;
   overflow-y: auto;
-  padding: 8px;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  padding: 15px;
   background: white;
   border: 1px solid #e2e8f0;
   border-radius: 14px;
-  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.10);
   z-index: 100;
 
+  &::-webkit-scrollbar {
+    display: none;
+  }
+
   .dark & {
     background: #1e1e2e;
     border-color: #2d2d3d;
@@ -438,7 +444,7 @@ onBeforeUnmount(() => {
   align-items: center;
   justify-content: space-between;
   width: 100%;
-  padding: 12px 14px;
+  padding: 10px;
   border: none;
   border-radius: 10px;
   background: transparent;
@@ -447,7 +453,7 @@ onBeforeUnmount(() => {
   transition: all 0.15s ease;
 
   &:hover {
-    background: #f3f4f6;
+    background: #F8F9FA;
 
     .dark & {
       background: #2d2d3d;
@@ -455,10 +461,13 @@ onBeforeUnmount(() => {
   }
 
   &.active {
-    background: rgba(59, 130, 246, 0.1);
+    background: #F8F9FA;
 
     .model-name {
-      color: #3b82f6;
+      color: var(---000F33, #000F33);
+    }
+    .model-desc{
+      color: var(--6-666666, #666);
     }
   }
 }
@@ -473,7 +482,7 @@ onBeforeUnmount(() => {
 .model-name {
   font-size: 14px;
   font-weight: 500;
-  color: #1f2937;
+  color: var(--6-666666, #666);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -485,7 +494,7 @@ onBeforeUnmount(() => {
 
 .model-desc {
   font-size: 12px;
-  color: #9ca3af;
+  color: var(--9-999999, #999);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
diff --git a/src/components/sidebar/ConversationItem.vue b/src/components/sidebar/ConversationItem.vue
index b722e71..3d0ed4f 100644
--- a/src/components/sidebar/ConversationItem.vue
+++ b/src/components/sidebar/ConversationItem.vue
@@ -170,6 +170,7 @@ function handleDelete() {
 
 <style lang="scss" scoped>
 .conversation-item {
+  position: relative;
   display: flex;
   align-items: center;
   gap: 10px;
@@ -177,7 +178,6 @@ function handleDelete() {
   margin: 2px 8px;
   border-radius: 10px;
   cursor: pointer;
-  position: relative;
 
   &:hover:not(.active) {
     background: rgba(0, 0, 0, 0.05);
@@ -194,6 +194,11 @@ function handleDelete() {
     .pin-indicator {
       opacity: 0;
     }
+
+    .item-content {
+      flex: 0 1 clamp(72px, 28%, 96px);
+      max-width: clamp(72px, 28%, 96px);
+    }
   }
 
   &.active {
@@ -224,9 +229,11 @@ function handleDelete() {
 }
 
 .item-content {
-  flex: 1;
+  flex: 1 1 auto;
   min-width: 0;
   overflow: hidden;
+  max-width: 100%;
+  transition: flex-basis 0.2s ease, max-width 0.2s ease;
 }
 
 .item-title {
@@ -280,6 +287,8 @@ function handleDelete() {
 }
 
 .item-actions {
+  position: absolute;
+  right: 12px;
   display: flex;
   align-items: center;
   gap: 2px;