diff --git a/src/styles/utils/animations.css b/src/styles/utils/animations.css
index c88e4818..bd289f39 100644
--- a/src/styles/utils/animations.css
+++ b/src/styles/utils/animations.css
@@ -14,6 +14,31 @@
   50% { opacity: 1; transform: scale(1.1); }
 }
 
+/* Subtle success burst used for archive action */
+@keyframes success-burst {
+  0% {
+    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.45), 0 0 0 0 rgba(16, 185, 129, 0.25);
+    transform: scale(1);
+  }
+  60% {
+    box-shadow: 0 0 0 10px rgba(16, 185, 129, 0), 0 0 0 0 rgba(16, 185, 129, 0);
+    transform: scale(1.05);
+  }
+  100% {
+    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0), 0 0 0 0 rgba(16, 185, 129, 0);
+    transform: scale(1);
+  }
+}
+
+/* Apply archive animation when button enters animating state */
+.mark-as-read-btn.animating {
+  animation: success-burst 600ms ease-out 1;
+}
+
+.mark-as-read-btn.animating svg {
+  animation: pulse 600ms ease-in-out 1;
+}
+
 @keyframes highlight-pulse-animation {
   0%, 100% { box-shadow: 0 0 8px rgba(var(--highlight-rgb, 255, 255, 0), 0.2); transform: scale(1); }
   25% { box-shadow: 0 0 20px rgba(var(--highlight-rgb, 255, 255, 0), 0.6); transform: scale(1.02); }