diff --git a/components/ui/HoverShineOverlay.tsx b/components/ui/HoverShineOverlay.tsx
index 90762dfba..d2ae4d4e2 100644
--- a/components/ui/HoverShineOverlay.tsx
+++ b/components/ui/HoverShineOverlay.tsx
@@ -15,11 +15,18 @@ export function HoverShineOverlay({
   shineColor = 'via-white/10',
   hoverPrefix = 'group-hover:'
 }: HoverShineOverlayProps) {
+  
+  // Tailwind JIT cannot parse dynamic strings like `${prefix}left-[100%]`. 
+  // We must provide literal strings for the compiler.
+  const hoverClass = hoverPrefix === 'peer-hover:' 
+    ? 'peer-hover:left-[100%]' 
+    : 'group-hover:left-[100%]';
+
   return (
     <div 
       className={cn(
         "absolute top-0 -left-[150%] h-[200%] w-[150%] bg-gradient-to-r from-transparent to-transparent skew-x-[-20deg] transition-all duration-1000 ease-[cubic-bezier(0.16,1,0.3,1)] z-30 pointer-events-none",
-        `${hoverPrefix}left-[100%]`,
+        hoverClass,
         shineColor,
         className
       )}