diff --git a/static/css/main.css b/static/css/main.css
index d2667c3..a5a516e 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -422,10 +422,12 @@ iconify-icon {
     letter-spacing: -0.01em;
     height: 100%;
     line-height: 1;
+    transition: background-color 0.3s ease, color 0.3s ease; /* Smooth color transitions */
 }
 
 .action-btn iconify-icon {
     color: white;
+    transition: color 0.3s ease; /* Smooth icon color transition */
 }
 
 .action-btn:hover {
@@ -3718,7 +3720,8 @@ html {
 /* Zoom control highlight when hovering zoom toggle button */
 .zoom-control.zoom-highlight {
     opacity: 1;
-    box-shadow: 0 0 20px rgba(52, 152, 219, 0.6), 0 3px 10px rgba(0, 0, 0, 0.3);
+    box-shadow: 0px 0px 10px 4px rgb(1 113 188 / 80%);
+    background: rgb(91 91 91);
 }
 
 /* Hidden state for zoom control and show button */
@@ -3873,11 +3876,12 @@ html {
     border: 2px solid rgba(220, 220, 220, 0.3);
     border-radius: 50%;
     color: rgba(255, 255, 255, 0.8);
-    font-size: 0.75rem;
+    font-size: 0.85rem;
     font-weight: 700;
     cursor: pointer;
     transition: all 0.3s ease;
     flex-shrink: 0;
+    margin: 0 -5px 0 10px;
 }
 
 .zoom-reset-btn #zoom-value-current {