update at 2026-01-14 18:35:40

src/App.vue

@@ -111,6 +111,7 @@
                   </div>
                   <div class="top2-center" data-node-id="303:723">
                     <div class="svg-wrapper is-top3" ref="svgWrapper" v-html="svgContent"></div>
+                    <img class="top3-map-frame" :src="mapKuang" alt="" />
                   </div>
                 </div>
                 <div v-else class="top2-center" data-node-id="162:5">
@@ -154,6 +155,7 @@ import videoIcon from './assets/video.svg'
 import playIcon from './assets/play.svg'
 import aiIcon from './assets/ai.svg'
 import picIcon from './assets/pic.svg'
+import mapKuang from './assets/map-kuang.svg'
 
 type StyleType = 'circle' | 'top2' | 'top3'
 
@@ -901,6 +903,7 @@ const addTop2Animation = () => {
   height: 333.004px;
   position: relative;
   align-self: center;
+  overflow: visible;
 }
 
 .layout-top2 .top2-bottom-row {
@@ -946,12 +949,26 @@ const addTop2Animation = () => {
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
+  position: relative;
+}
+
+.top2-card-icon::before {
+  content: '';
+  position: absolute;
+  width: 49px;
+  height: 49px;
+  border-radius: 50%;
+  border: 1.5px solid rgba(255, 255, 255, 0.7);
+  background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.35), rgba(37, 67, 165, 0.15) 60%, rgba(37, 67, 165, 0) 100%);
+  box-shadow: 0 0 10px rgba(0, 245, 255, 0.35);
 }
 
 .top2-card-icon img {
-  width: 100%;
-  height: 100%;
+  width: 28px;
+  height: 28px;
   display: block;
+  position: relative;
+  z-index: 1;
 }
 
 .top2-card-text {
@@ -1015,6 +1032,18 @@ const addTop2Animation = () => {
   align-items: center;
 }
 
+.top3-map-frame {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  width: 795px;
+  height: 456px;
+  transform: translate(-50%, -50%);
+  object-fit: contain;
+  pointer-events: none;
+  z-index: 2;
+}
+
 .top3-subheader {
   width: 100%;
   height: 87.178px;