diff --git a/app/(root)/dashboard/loading.tsx b/app/(root)/dashboard/loading.tsx
index ef9d24dd..c75d3c34 100644
--- a/app/(root)/dashboard/loading.tsx
+++ b/app/(root)/dashboard/loading.tsx
@@ -1,9 +1,10 @@
 import StatsCardSkeleton from '@/components/dashboard/StatsCardSkeleton';
 import AchievementsSkeleton from '@/components/dashboard/AchievementsSkeleton';
+import AIInsightsSkeleton from '@/components/dashboard/AIInsightsSkeleton';
 
 export default function DashboardLoading() {
   return (
-    <div className="p-4 md:p-6 lg:p-8 min-h-screen">
+    <div className="p-4 md:p-6 lg:p-8 min-h-screen bg-black text-white">
       <div className="grid grid-cols-1 lg:grid-cols-[300px_1fr_320px] gap-6 lg:gap-8">
         {/* Left Sidebar Skeleton */}
         <div className="flex flex-col gap-6">
@@ -36,11 +37,11 @@ export default function DashboardLoading() {
         </div>
 
         {/* Right Sidebar Skeleton */}
-        <div className="flex flex-col gap-4">
+        <div className="flex flex-col gap-6">
           <div className="h-24 rounded-2xl shimmer border border-white/10" />
           <div className="h-24 rounded-2xl shimmer border border-white/10" />
           <div className="h-24 rounded-2xl shimmer border border-white/10" />
-          <div className="h-48 rounded-2xl shimmer border border-white/10" />
+          <AIInsightsSkeleton />
         </div>
       </div>
     </div>
diff --git a/app/globals.css b/app/globals.css
index 052c8358..0678a668 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -56,6 +56,7 @@ html {
 }
 
 .shimmer {
+  background-color: #1a1a1a; /* base dark gray */
   background: linear-gradient(
     90deg,
     rgba(255, 255, 255, 0) 0%,
diff --git a/components/dashboard/AIInsights.tsx b/components/dashboard/AIInsights.tsx
index 3203a8ab..2f03ba92 100644
--- a/components/dashboard/AIInsights.tsx
+++ b/components/dashboard/AIInsights.tsx
@@ -22,9 +22,10 @@ export default function AIInsights({ insights }: { insights: AIInsight[] }) {
         </h3>
       </div>
 
-      <div className="flex flex-col gap-2">
+      <div className="flex flex-col gap-6">
         {insights.map((insight, i) => {
           const Icon = iconMap[insight.icon] || Sparkles;
+
           return (
             <motion.div
               key={insight.id}
@@ -38,7 +39,8 @@ export default function AIInsights({ insights }: { insights: AIInsight[] }) {
                 size={14}
                 className="text-[#A1A1AA] mt-0.5 shrink-0 group-hover:text-white transition-colors duration-200"
               />
-              <p className="text-xs xs:text-sm  text-[#A1A1AA] leading-relaxed group-hover:text-white/80 transition-colors duration-200">
+
+              <p className="text-xs xs:text-sm text-[#A1A1AA] leading-relaxed group-hover:text-white/80 transition-colors duration-200">
                 {insight.text}
               </p>
             </motion.div>
diff --git a/components/dashboard/AIInsightsSkeleton.tsx b/components/dashboard/AIInsightsSkeleton.tsx
new file mode 100644
index 00000000..e8370d3e
--- /dev/null
+++ b/components/dashboard/AIInsightsSkeleton.tsx
@@ -0,0 +1,30 @@
+export default function AIInsightsSkeleton() {
+  return (
+    <div className="p-6 rounded-xl bg-[#0a0a0a] border border-[rgba(255,255,255,0.08)]">
+      {/* Header */}
+      <div className="flex items-center gap-2.5 mb-5">
+        <div className="w-4 h-4 shimmer rounded-full opacity-80" />
+        <div className="w-24 h-4 shimmer rounded opacity-80" />
+      </div>
+
+      {/* Insight Rows */}
+      <div className="flex flex-col gap-6">
+        {[...Array(3)].map((_, i) => (
+          <div
+            key={i}
+            className="flex items-start gap-3 p-3 rounded-lg bg-[#111] border border-[rgba(255,255,255,0.05)]"
+          >
+            {/* Icon */}
+            <div className="w-4 h-4 shimmer rounded-full mt-1 shrink-0 opacity-80" />
+
+            {/* Text */}
+            <div className="flex-1 space-y-2">
+              <div className="h-3 shimmer rounded w-full opacity-80" />
+              <div className="h-3 shimmer rounded w-4/5 opacity-60" />
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}