diff --git a/assets/atlas/comp/btn_item.png b/assets/atlas/comp/btn_item.png
index 5898796..53219bb 100644
Binary files a/assets/atlas/comp/btn_item.png and b/assets/atlas/comp/btn_item.png differ
diff --git a/assets/atlas/comp/btn_item2.png b/assets/atlas/comp/btn_item2.png
new file mode 100644
index 0000000..0748302
Binary files /dev/null and b/assets/atlas/comp/btn_item2.png differ
diff --git a/assets/atlas/comp/btn_item2.png.meta b/assets/atlas/comp/btn_item2.png.meta
new file mode 100644
index 0000000..2e6aa95
--- /dev/null
+++ b/assets/atlas/comp/btn_item2.png.meta
@@ -0,0 +1,6 @@
+{
+  "uuid": "d8b02de6-eee7-47ea-b227-d6dbffdadae3",
+  "importer": {
+    "textureType": 2
+  }
+}
\ No newline at end of file
diff --git a/assets/resources/CommonTips.lh b/assets/resources/CommonTips.lh
index b88da18..34f9306 100644
--- a/assets/resources/CommonTips.lh
+++ b/assets/resources/CommonTips.lh
@@ -104,6 +104,12 @@
               "y": -12,
               "width": 412,
               "height": 120,
+              "_$comp": [
+                {
+                  "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
+                  "scriptPath": "../src/views/common/CommonHover.ts"
+                }
+              ],
               "_$child": [
                 {
                   "_$id": "he6hpns9",
@@ -159,6 +165,12 @@
               "y": -12,
               "width": 412,
               "height": 120,
+              "_$comp": [
+                {
+                  "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
+                  "scriptPath": "../src/views/common/CommonHover.ts"
+                }
+              ],
               "_$child": [
                 {
                   "_$id": "bqp1fe7k",
@@ -213,9 +225,15 @@
           "name": "toggle",
           "x": 320,
           "y": 424,
-          "width": 42,
+          "width": 330,
           "height": 42,
           "bottom": 54,
+          "_$comp": [
+            {
+              "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
+              "scriptPath": "../src/views/common/CommonHover.ts"
+            }
+          ],
           "_$child": [
             {
               "_$id": "74puwx15",
@@ -247,8 +265,7 @@
               "name": "Image",
               "width": 43,
               "height": 42,
-              "centerX": 0,
-              "centerY": 0,
+              "mouseThrough": true,
               "skin": "res://6f23a1ca-70f5-467a-afc3-5b178a851423",
               "useSourceSize": true,
               "color": "#ffffff"
@@ -261,9 +278,7 @@
               "y": 2,
               "width": 400,
               "height": 42,
-              "left": 54,
-              "centerY": 2,
-              "text": "Don't ask me agin",
+              "text": "Don't ask me again",
               "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
               "fontSize": 30,
               "color": "rgba(84, 89, 98, 1)",
diff --git a/assets/resources/Stage.lh b/assets/resources/Stage.lh
index 2eb95b9..1743c70 100644
--- a/assets/resources/Stage.lh
+++ b/assets/resources/Stage.lh
@@ -76,7 +76,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": true
             }
           ],
           "_$child": [
@@ -110,7 +111,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": true
             }
           ]
         }
@@ -44315,7 +44317,6 @@
           "width": 196,
           "height": 192,
           "_mouseState": 2,
-          "stateNum": 2,
           "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
           "label": "",
           "labelSize": 20,
@@ -44324,7 +44325,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": false
             }
           ],
           "_$child": [
@@ -44369,7 +44371,6 @@
           "width": 196,
           "height": 192,
           "_mouseState": 2,
-          "stateNum": 2,
           "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
           "label": "",
           "labelSize": 20,
@@ -44378,7 +44379,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": false
             }
           ],
           "_$child": [
@@ -44424,7 +44426,6 @@
           "width": 196,
           "height": 192,
           "_mouseState": 2,
-          "stateNum": 2,
           "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
           "label": "",
           "labelSize": 20,
@@ -44433,7 +44434,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": false
             }
           ],
           "_$child": [
@@ -44535,7 +44537,6 @@
           "width": 196,
           "height": 192,
           "_mouseState": 2,
-          "stateNum": 2,
           "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
           "label": "",
           "labelSize": 20,
@@ -44544,7 +44545,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": false
             }
           ],
           "_$child": [
@@ -44735,7 +44737,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -44833,7 +44836,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -44931,7 +44935,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -45040,7 +45045,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -45138,7 +45144,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -45236,7 +45243,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -45345,7 +45353,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -45443,7 +45452,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
@@ -45541,7 +45551,8 @@
                 },
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ],
               "_$child": [
diff --git a/assets/resources/Stage_H.lh b/assets/resources/Stage_H.lh
index d71fd0c..93c6717 100644
--- a/assets/resources/Stage_H.lh
+++ b/assets/resources/Stage_H.lh
@@ -44035,8 +44035,7 @@
               "width": 220,
               "height": 150,
               "_mouseState": 2,
-              "stateNum": 2,
-              "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
+              "skin": "res://d8b02de6-eee7-47ea-b227-d6dbffdadae3",
               "label": "",
               "labelSize": 20,
               "labelAlign": "center",
@@ -44044,7 +44043,8 @@
               "_$comp": [
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": false
                 }
               ],
               "_$child": [
@@ -44089,8 +44089,7 @@
               "width": 220,
               "height": 150,
               "_mouseState": 2,
-              "stateNum": 2,
-              "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
+              "skin": "res://d8b02de6-eee7-47ea-b227-d6dbffdadae3",
               "label": "",
               "labelSize": 20,
               "labelAlign": "center",
@@ -44098,7 +44097,8 @@
               "_$comp": [
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": false
                 }
               ],
               "_$child": [
@@ -44143,8 +44143,7 @@
               "width": 220,
               "height": 150,
               "_mouseState": 2,
-              "stateNum": 2,
-              "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
+              "skin": "res://d8b02de6-eee7-47ea-b227-d6dbffdadae3",
               "label": "",
               "labelSize": 20,
               "labelAlign": "center",
@@ -44152,7 +44151,8 @@
               "_$comp": [
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": false
                 }
               ],
               "_$child": [
@@ -44254,8 +44254,7 @@
               "width": 220,
               "height": 150,
               "_mouseState": 2,
-              "stateNum": 2,
-              "skin": "res://08a05164-eac8-4773-8e7d-749e477f1ee7",
+              "skin": "res://d8b02de6-eee7-47ea-b227-d6dbffdadae3",
               "label": "",
               "labelSize": 20,
               "labelAlign": "center",
@@ -44263,7 +44262,8 @@
               "_$comp": [
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": false
                 }
               ],
               "_$child": [
@@ -44454,7 +44454,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -44545,7 +44546,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -44636,7 +44638,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -44739,7 +44742,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -44830,7 +44834,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -44921,7 +44926,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -45024,7 +45030,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -45115,7 +45122,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -45206,7 +45214,8 @@
                     },
                     {
                       "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                      "scriptPath": "../src/views/common/CommonHover.ts"
+                      "scriptPath": "../src/views/common/CommonHover.ts",
+                      "hoverAlpha": true
                     }
                   ],
                   "_$child": [
@@ -45299,7 +45308,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": true
             }
           ],
           "_$child": [
@@ -45361,7 +45371,8 @@
           "_$comp": [
             {
               "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-              "scriptPath": "../src/views/common/CommonHover.ts"
+              "scriptPath": "../src/views/common/CommonHover.ts",
+              "hoverAlpha": true
             }
           ],
           "_$child": [
@@ -45500,7 +45511,8 @@
               "_$comp": [
                 {
                   "_$type": "a541bdfc-e8e1-4795-b68e-7138c5190f17",
-                  "scriptPath": "../src/views/common/CommonHover.ts"
+                  "scriptPath": "../src/views/common/CommonHover.ts",
+                  "hoverAlpha": true
                 }
               ]
             }
diff --git a/assets/resources/TopBar.lh b/assets/resources/TopBar.lh
index 0518310..b6d2c65 100644
--- a/assets/resources/TopBar.lh
+++ b/assets/resources/TopBar.lh
@@ -247,8 +247,9 @@
                       "lb": 12,
                       "rb": 12,
                       "percent": true,
-                      "lineWidth": 1,
-                      "fillColor": "rgba(14, 42, 83, 1)"
+                      "lineWidth": 5,
+                      "lineColor": "rgba(14, 42, 83, 1)",
+                      "fillColor": "rgba(245, 247, 251, 1)"
                     }
                   ]
                 },
@@ -310,8 +311,9 @@
                       "lb": 12,
                       "rb": 12,
                       "percent": true,
-                      "lineWidth": 1,
-                      "fillColor": "rgba(14, 42, 83, 1)"
+                      "lineWidth": 5,
+                      "lineColor": "rgba(14, 42, 83, 1)",
+                      "fillColor": "rgba(245, 247, 251, 1)"
                     }
                   ]
                 },
@@ -373,8 +375,9 @@
                       "lb": 12,
                       "rb": 12,
                       "percent": true,
-                      "lineWidth": 1,
-                      "fillColor": "rgba(14, 42, 83, 1)"
+                      "lineWidth": 5,
+                      "lineColor": "rgba(14, 42, 83, 1)",
+                      "fillColor": "rgba(245, 247, 251, 1)"
                     }
                   ]
                 },
@@ -436,8 +439,9 @@
                       "lb": 12,
                       "rb": 12,
                       "percent": true,
-                      "lineWidth": 1,
-                      "fillColor": "rgba(14, 42, 83, 1)"
+                      "lineWidth": 5,
+                      "lineColor": "rgba(14, 42, 83, 1)",
+                      "fillColor": "rgba(245, 247, 251, 1)"
                     }
                   ]
                 },
@@ -499,8 +503,9 @@
                       "lb": 12,
                       "rb": 12,
                       "percent": true,
-                      "lineWidth": 1,
-                      "fillColor": "rgba(14, 42, 83, 1)"
+                      "lineWidth": 5,
+                      "lineColor": "rgba(14, 42, 83, 1)",
+                      "fillColor": "rgba(245, 247, 251, 1)"
                     }
                   ]
                 },
diff --git a/src/views/TopBar.ts b/src/views/TopBar.ts
index 439ffca..c9b9c85 100644
--- a/src/views/TopBar.ts
+++ b/src/views/TopBar.ts
@@ -36,7 +36,8 @@ export class TopBar extends Laya.Script {
   @property(Laya.Box)
   public obj_items: Laya.Box
 
-  private items: Map<string, Laya.Label> = new Map()
+  private item_sprites: Map<string, Laya.Sprite> = new Map()
+  private item_labels: Map<string, Laya.Label> = new Map()
 
   onStart(): void {
     // 如果是第一次以横屏启动游戏需要创建经典关卡
@@ -79,9 +80,11 @@ export class TopBar extends Laya.Script {
     for (let i = 0; i < this.obj_items.numChildren; i++) {
       const obj = this.obj_items.getChildAt(i)
       const value = config.DIFFICULTY_LIST[i]
+      const sprite = obj.getChildByName("Sprite") as Laya.Sprite
+      this.item_sprites.set(value, sprite)
       const label = obj.getChildByName("Label") as Laya.Label
       label.text = value
-      this.items.set(value, label)
+      this.item_labels.set(value, label)
       const common = obj.getComponent(CommonData)
       common.strValue = value
       obj.on(Laya.Event.CLICK, this, (evt: Laya.Event) => {
@@ -140,10 +143,18 @@ export class TopBar extends Laya.Script {
   }
 
   updateDifficulty(difficulty: string): void {
-    this.items.forEach((label: Laya.Label) => {
+    this.item_sprites.forEach((sprite: Laya.Sprite) => {
+      sprite.graphics.clear()
+      sprite.graphics.drawRoundRect(0, 0, sprite.width, sprite.height, 12, 12, 12, 12, "#f5f7fb", "#0e2a53", 5)
+    })
+    const sprite = this.item_sprites.get(difficulty)
+    sprite.graphics.clear()
+    sprite.graphics.drawRoundRect(0, 0, sprite.width, sprite.height, 12, 12, 12, 12, "#f5f7fb", "#1d5cdc", 5)
+
+    this.item_labels.forEach((label: Laya.Label) => {
       label.color = "#0e2a53"
     })
-    const label = this.items.get(difficulty)
+    const label = this.item_labels.get(difficulty)
     label.color = "#1d5cdc"
   }
 }
diff --git a/src/views/common/CommonHover.ts b/src/views/common/CommonHover.ts
index 00532d6..a225ef1 100644
--- a/src/views/common/CommonHover.ts
+++ b/src/views/common/CommonHover.ts
@@ -4,15 +4,22 @@ const { regClass, property } = Laya;
 export class CommonHover extends Laya.Script {
     declare owner : Laya.Box;
 
+    @property(Boolean)
+    public hoverAlpha: boolean = true
+
 
     onAwake(): void {
         this.owner.on(Laya.Event.MOUSE_OVER, this, ()=>{
             Laya.Render.canvas.style.cursor = "pointer"
-            this.owner.alpha = 0.7
+            if (this.hoverAlpha) {
+                this.owner.alpha = 0.7
+            }
         })
         this.owner.on(Laya.Event.MOUSE_OUT, this, ()=>{
             Laya.Render.canvas.style.cursor = ""
-            this.owner.alpha = 1
+            if (this.hoverAlpha) {
+                this.owner.alpha = 1
+            }
         })
 
     }