diff --git a/src/components/TopBar.vue b/src/components/TopBar.vue
index eedff90..569c6d6 100644
--- a/src/components/TopBar.vue
+++ b/src/components/TopBar.vue
@@ -149,7 +149,7 @@ async function scrollToExport() {
           <span class="combo">
             <button
               class="tbtn combo-body"
-              :class="{ active: tool === 'shape' }"
+              :class="{ active: tool === 'shape' || open }"
               :title="tip('toolShape', '形状工具')"
               aria-label="形状工具"
               @click="pickShapeTool(open, toggle)"
@@ -158,7 +158,7 @@ async function scrollToExport() {
             </button>
             <button
               class="tbtn combo-caret"
-              :class="{ active: open }"
+              :class="{ active: tool === 'shape' || open }"
               title="形状类型"
               aria-label="选择形状类型"
               :aria-expanded="open"
@@ -178,7 +178,7 @@ async function scrollToExport() {
           <span class="combo">
             <button
               class="tbtn combo-body"
-              :class="{ active: tool === 'background' }"
+              :class="{ active: tool === 'background' || open }"
               :title="tip('toolBackground', '背景工具')"
               aria-label="背景工具"
               @click="pickBackgroundTool(open, toggle)"
@@ -187,7 +187,7 @@ async function scrollToExport() {
             </button>
             <button
               class="tbtn combo-caret"
-              :class="{ active: open }"
+              :class="{ active: tool === 'background' || open }"
               title="背景来源"
               aria-label="选择背景来源"
               :aria-expanded="open"
@@ -226,7 +226,7 @@ async function scrollToExport() {
       <span class="vr" aria-hidden="true"></span>
       <button
         class="tbtn"
-        title="导出（面板在右侧，点了滚过去）"
+        :title="tip('export', '导出')"
         aria-label="导出"
         @click="scrollToExport"
       >
@@ -322,6 +322,19 @@ async function scrollToExport() {
   font-size: 12px;
 }
 
+/* 组合按钮整块一起亮：hover 与 active 都作用到两个按钮，不分家。
+ * `.combo:hover .tbtn:not(.active)` 管非激活时的悬停（光靠单个 .tbtn:hover
+ * 只会亮鼠标底下那一半）；`.combo .tbtn.active` 保证激活态在悬停时也不被
+ * .tbtn:hover 的 color 盖回 fg。 */
+.combo:hover .tbtn:not(.active) {
+  background: var(--bg3);
+  color: var(--fg);
+}
+.combo .tbtn.active {
+  background: var(--bg3);
+  color: var(--accent);
+}
+
 .vr {
   width: 1px;
   height: 20px;