diff --git a/src/components/status.css b/src/components/status.css
index c6ca5add..61260310 100644
--- a/src/components/status.css
+++ b/src/components/status.css
@@ -112,7 +112,11 @@
     border-radius: 10em;
     font-size: 90%;
     white-space: nowrap;
-    transition: all 0.2s ease-out;
+    box-shadow: inset 0 0 0 1px var(--bg-color);
+    text-shadow: 0 -1px var(--bg-color);
+    transition-property: transform, background-color, border-color;
+    transition-duration: 0.2s;
+    transition-timing-function: ease-out;
   }
 
   &:is(:hover, :focus):after {
diff --git a/src/pages/notifications.css b/src/pages/notifications.css
index 468051cf..6b3fe0fa 100644
--- a/src/pages/notifications.css
+++ b/src/pages/notifications.css
@@ -126,7 +126,11 @@
   border-radius: 10em;
   font-size: 90%;
   white-space: nowrap;
-  transition: all 0.2s ease-out;
+  box-shadow: inset 0 0 0 1px var(--bg-color);
+  text-shadow: 0 -1px var(--bg-color);
+  transition-property: transform, background-color, border-color;
+  transition-duration: 0.2s;
+  transition-timing-function: ease-out;
 }
 .notification .status-link:is(:hover, :focus).truncated:after {
   border-color: var(--link-color);