Fix button edge effect (#2)

Author: oxkitsune

src/app/globals.scss

@@ -211,6 +211,21 @@ body {
     transparent 332deg,
     var(--nav-link-spark-color, rgba(255, 255, 255, 0.95)) 360deg
   );
+  mask-image:
+    linear-gradient(#000 0 0),
+    linear-gradient(#000 0 0);
+  mask-mode: alpha;
+  mask-repeat: no-repeat;
+  mask-origin: content-box, border-box;
+  mask-clip: content-box, border-box;
+  mask-composite: exclude;
+  -webkit-mask-image:
+    linear-gradient(#000 0 0),
+    linear-gradient(#000 0 0);
+  -webkit-mask-repeat: no-repeat;
+  -webkit-mask-origin: content-box, border-box;
+  -webkit-mask-clip: content-box, border-box;
+  -webkit-mask-composite: xor;
   opacity: var(--nav-link-active);
   filter: drop-shadow(
     0 0 calc(var(--nav-link-active) * 16px) var(--nav-link-glow-color, rgba(255, 255, 255, 0.45))
@@ -220,14 +235,6 @@ body {
     filter var(--nav-link-transition);
   animation: nav-link-spin var(--nav-link-spin) linear infinite;
   animation-play-state: var(--nav-link-play-state);
-  mask:
-    linear-gradient(#000 0 0) content-box,
-    linear-gradient(#000 0 0);
-  mask-composite: exclude;
-  -webkit-mask:
-    linear-gradient(#000 0 0) content-box,
-    linear-gradient(#000 0 0);
-  -webkit-mask-composite: xor;
 }
 .nav-link:hover .nav-link__spark,
 .nav-link:focus-visible .nav-link__spark {