diff --git a/app/static/css/style.css b/app/static/css/style.css
index 7e3ab48..561c317 100644
--- a/app/static/css/style.css
+++ b/app/static/css/style.css
@@ -2313,29 +2313,6 @@ a.btn:hover {
     left: 100%;
 }
 
-/* 童趣控制器 */
-.kid-control {
-    z-index: 15;
-    width: 70px;
-    height: 70px;
-    background: linear-gradient(45deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7));
-    border-radius: 50%;
-    border: none;
-    margin: 0 20px;
-    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
-    transition: all 0.3s ease;
-}
-
-.kid-control:hover {
-    transform: scale(1.1);
-    box-shadow: 0 12px 35px rgba(0,0,0,0.3);
-}
-
-.kid-arrow-prev, .kid-arrow-next {
-    font-size: 2rem;
-    color: #FF6B6B;
-}
-
 /* 童趣指示器 */
 .hero-carousel-kid .carousel-indicators {
     bottom: 40px;
@@ -4087,3 +4064,65 @@ a.btn:hover {
         font-size: 0.9rem;
     }
 }
+
+/* 极简无框轮播图控制器 */
+.hero-carousel-kid .carousel-control-prev,
+.hero-carousel-kid .carousel-control-next {
+    z-index: 15;
+    width: 50px;
+    height: 50px;
+    background: none;
+    border: none;
+    margin: auto 15px;
+    transition: all 0.3s ease;
+    opacity: 0.7;
+}
+
+.hero-carousel-kid .carousel-control-prev:hover,
+.hero-carousel-kid .carousel-control-next:hover {
+    opacity: 1;
+    transform: scale(1.2);
+}
+
+.hero-carousel-kid .carousel-control-prev-icon,
+.hero-carousel-kid .carousel-control-next-icon {
+    width: 24px;
+    height: 24px;
+    background-size: 100% 100%;
+    filter: brightness(0) invert(1) drop-shadow(1px 1px 2px rgba(0,0,0,0.5));
+    transition: all 0.3s ease;
+}
+
+.hero-carousel-kid .carousel-control-prev:hover .carousel-control-prev-icon,
+.hero-carousel-kid .carousel-control-next:hover .carousel-control-next-icon {
+    filter: brightness(0) invert(1) drop-shadow(2px 2px 4px rgba(0,0,0,0.7));
+    transform: scale(1.1);
+}
+
+/* 指示器样式优化 */
+.hero-carousel-kid .carousel-indicators {
+    bottom: 30px;
+    z-index: 15;
+}
+
+.hero-carousel-kid .carousel-indicators button {
+    width: 12px !important;
+    height: 12px !important;
+    border-radius: 50% !important;
+    margin: 0 8px !important;
+    background: rgba(255, 255, 255, 0.6) !important;
+    border: 2px solid rgba(255, 255, 255, 0.8) !important;
+    transition: all 0.3s ease;
+    opacity: 0.7;
+}
+
+.hero-carousel-kid .carousel-indicators .active {
+    background: rgba(255, 255, 255, 0.95) !important;
+    transform: scale(1.3);
+    opacity: 1;
+}
+
+.hero-carousel-kid .carousel-indicators button:hover {
+    background: rgba(255, 255, 255, 0.8) !important;
+    opacity: 1;
+}
diff --git a/app/templates/index.html b/app/templates/index.html
index 2f4e955..41c2e2a 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -128,12 +128,12 @@
     </div>
 
     <!-- 控制器 -->
-    <button class="carousel-control-prev kid-control" type="button" data-bs-target="#heroCarousel" data-bs-slide="prev">
-        <span class="kid-arrow-prev">◀️</span>
+    <button class="carousel-control-prev" type="button" data-bs-target="#heroCarousel" data-bs-slide="prev">
+        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
         <span class="visually-hidden">Previous</span>
     </button>
-    <button class="carousel-control-next kid-control" type="button" data-bs-target="#heroCarousel" data-bs-slide="next">
-        <span class="kid-arrow-next">▶️</span>
+    <button class="carousel-control-next" type="button" data-bs-target="#heroCarousel" data-bs-slide="next">
+        <span class="carousel-control-next-icon" aria-hidden="true"></span>
         <span class="visually-hidden">Next</span>
     </button>
 </div>