diff --git a/src/components/HighlightsPanel/HighlightsPanelCollapsed.tsx b/src/components/HighlightsPanel/HighlightsPanelCollapsed.tsx
index 0e37bde8..983ae222 100644
--- a/src/components/HighlightsPanel/HighlightsPanelCollapsed.tsx
+++ b/src/components/HighlightsPanel/HighlightsPanelCollapsed.tsx
@@ -23,10 +23,13 @@ const HighlightsPanelCollapsed: React.FC<HighlightsPanelCollapsedProps> = ({
         className={`toggle-highlights-btn with-icon ${hasHighlights ? 'has-highlights' : ''}`}
         title="Expand highlights panel"
         aria-label="Expand highlights panel"
-        style={{ color: highlightColor }}
       >
-        <FontAwesomeIcon icon={faHighlighter} className={hasHighlights ? 'glow' : ''} />
-        <FontAwesomeIcon icon={faChevronRight} />
+        <FontAwesomeIcon 
+          icon={faHighlighter} 
+          className={hasHighlights ? 'glow' : ''} 
+          style={{ color: highlightColor }}
+        />
+        <FontAwesomeIcon icon={faChevronRight} style={{ color: highlightColor }} />
       </button>
     </div>
   )
diff --git a/src/index.css b/src/index.css
index 1277ef73..e4813c3e 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1836,17 +1836,17 @@ body.mobile-sidebar-open {
 }
 
 .highlights-container.collapsed .toggle-highlights-btn .glow {
-  color: #ffff00;
-  filter: drop-shadow(0 0 4px rgba(255, 255, 0, 0.6));
   animation: pulse-glow 2s ease-in-out infinite;
 }
 
 @keyframes pulse-glow {
   0%, 100% {
-    filter: drop-shadow(0 0 4px rgba(255, 255, 0, 0.6));
+    opacity: 0.8;
+    transform: scale(1);
   }
   50% {
-    filter: drop-shadow(0 0 8px rgba(255, 255, 0, 0.9));
+    opacity: 1;
+    transform: scale(1.1);
   }
 }