diff --git a/apps/music/frontend/src/views/PlayerView.vue b/apps/music/frontend/src/views/PlayerView.vue
index 246b63d..cbed67a 100644
--- a/apps/music/frontend/src/views/PlayerView.vue
+++ b/apps/music/frontend/src/views/PlayerView.vue
@@ -44,6 +44,13 @@
         :class="{ active: activeTagName === t.name }"
         @click="setTag(t.name)"
       >{{ t.name }}<span class="chip-n">{{ t.count }}</span></button>
+
+      <button
+        class="chip fav-chip"
+        :class="{ active: favOnly }"
+        :title="favOnly ? '显示全部' : '仅看收藏'"
+        @click="toggleFavOnly"
+      >{{ favOnly ? '★ 仅看收藏' : '☆ 仅看收藏' }}</button>
     </nav>
 
     <div class="main">
@@ -54,12 +61,6 @@
           <button :class="{ active: sortMode === 'least' }" @click="setSort('least')">最少播放</button>
           <button :class="{ active: sortMode === 'recent' }" @click="setSort('recent')">最近</button>
           <button :class="{ active: sortMode === 'random' }" @click="setSort('random')">随机</button>
-          <button
-            class="fav-toggle"
-            :class="{ active: favOnly }"
-            :title="favOnly ? '显示全部' : '仅看收藏'"
-            @click="toggleFavOnly"
-          >{{ favOnly ? '★' : '☆' }}</button>
         </div>
 
         <div class="playlist">
@@ -1402,17 +1403,13 @@ onBeforeUnmount(() => {
   border-color: var(--accent-strong);
   color: var(--accent);
 }
-.sort-bar .fav-toggle {
+.fav-chip {
   margin-left: auto;
-  border-radius: 4px !important;
-  border-right-width: 1px !important;
-  font-size: 14px;
-  padding: 4px 8px;
 }
-.sort-bar .fav-toggle.active {
-  color: #f5b800;
-  border-color: #f5b800;
-  background: rgba(245, 184, 0, 0.12);
+.fav-chip.active {
+  color: #f5b800 !important;
+  border-color: #f5b800 !important;
+  background: rgba(245, 184, 0, 0.14) !important;
 }
 
 .row-fav {