diff --git a/components/reading-progress.tsx b/components/reading-progress.tsx
index edd5c9d..5dd3900 100644
--- a/components/reading-progress.tsx
+++ b/components/reading-progress.tsx
@@ -32,13 +32,13 @@ export function ReadingProgress() {
   if (!mounted) return null;
 
   return (
-    <div className="pointer-events-none fixed inset-x-0 top-0 z-60 h-px bg-transparent">
-      <div className="relative h-1 w-full overflow-visible">
+    <div className="pointer-events-none fixed inset-x-0 top-0 z-[999] h-2 bg-transparent">
+      <div className="relative h-2 w-full overflow-visible">
         <div
-          className="absolute inset-y-0 left-0 w-full origin-left rounded-full bg-gradient-to-r from-blue-500/70 via-sky-400/70 to-indigo-500/70 shadow-[0_0_8px_rgba(59,130,246,0.45)] transition-[transform,opacity] duration-300 ease-out dark:from-blue-400/70 dark:via-sky-300/70 dark:to-indigo-400/70"
+          className="absolute inset-y-0 left-0 w-full origin-left rounded-full bg-gradient-to-r from-[rgba(124,58,237,0.75)] via-[rgba(167,139,250,0.8)] to-[rgba(14,165,233,0.7)] shadow-[0_0_10px_rgba(124,58,237,0.45)] transition-[transform,opacity] duration-300 ease-out"
           style={{ transform: `scaleX(${progress / 100})`, opacity: progress > 0 ? 1 : 0 }}
         >
-          <span className="absolute -right-2 top-1/2 h-3 w-3 -translate-y-1/2 rounded-full bg-white/70 blur-[1px] dark:bg-slate-900/70" aria-hidden="true" />
+          <span className="absolute -right-2 top-1/2 h-3 w-3 -translate-y-1/2 rounded-full bg-white/75 blur-[1px] dark:bg-slate-900/75" aria-hidden="true" />
         </div>
         <span className="absolute inset-x-0 top-2 h-px bg-gradient-to-r from-transparent via-blue-200/40 to-transparent blur-sm dark:via-blue-900/30" aria-hidden="true" />
       </div>