diff --git a/packages/core/src/theme/components/Button/index.scss b/packages/core/src/theme/components/Button/index.scss
index 5bb5f8e66..f778298fe 100644
--- a/packages/core/src/theme/components/Button/index.scss
+++ b/packages/core/src/theme/components/Button/index.scss
@@ -7,9 +7,11 @@
   white-space: nowrap;
   height: 48px;
   transition:
-    color 0.1s,
-    border-color 0.1s,
-    background-color 0.1s;
+    color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+    border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+    background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+    transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+    box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
 
   &--medium {
     border-radius: var(--rp-radius);
@@ -35,11 +37,18 @@
   &--brand {
     opacity: 1;
     color: #fff;
-    transition: all 0.3s ease;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
     background: var(--rp-home-hero-title-bg);
+    box-shadow: 0 2px 8px rgba(0, 149, 255, 0.15);
 
     &:hover {
-      opacity: 0.8;
+      opacity: 0.9;
+      transform: translateY(-1px);
+      box-shadow: 0 4px 16px rgba(0, 149, 255, 0.25);
+    }
+
+    &:active {
+      transform: translateY(0);
     }
   }
 
@@ -47,17 +56,25 @@
     border: 1px solid var(--rp-c-gray-light-3);
     color: var(--rp-c-text-0);
     background-color: var(--rp-c-bg);
-    transition: all 0.3s ease;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
 
     .dark & {
       background-color: var(--rp-c-bg-mute);
       border-color: #484848;
       color: var(--rp-c-text-1);
+      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
     }
 
     &:hover {
-      opacity: 0.8;
       background-color: var(--rp-c-bg-mute);
+      border-color: var(--rp-c-brand);
+      transform: translateY(-1px);
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+    }
+
+    &:active {
+      transform: translateY(0);
     }
   }
 }
diff --git a/packages/core/src/theme/components/CodeBlock/index.scss b/packages/core/src/theme/components/CodeBlock/index.scss
index 47d5571e5..1b1ab42ff 100644
--- a/packages/core/src/theme/components/CodeBlock/index.scss
+++ b/packages/core/src/theme/components/CodeBlock/index.scss
@@ -3,8 +3,13 @@
   margin: 16px 0;
   border: var(--rp-code-block-border);
   overflow-x: auto;
-  transition: none;
+  transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   border-radius: var(--rp-radius);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+
+  &:hover {
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+  }
 
   @media (max-width: 640px) {
     margin: 24px 0;
diff --git a/packages/core/src/theme/components/HomeFeature/index.scss b/packages/core/src/theme/components/HomeFeature/index.scss
index 5e6531025..72aa88cf7 100644
--- a/packages/core/src/theme/components/HomeFeature/index.scss
+++ b/packages/core/src/theme/components/HomeFeature/index.scss
@@ -64,9 +64,9 @@
     border-radius: 2rem;
     border: 1px solid var(--rp-c-divider-light);
     background: var(--rp-home-feature-bg);
-    // fill: var(--rp-home-feature-bg-fill);
     backdrop-filter: blur(10px);
-    transition: all 0.3s;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
 
     &--clickable {
       cursor: pointer;
@@ -74,7 +74,13 @@
 
     &:hover {
       border: 1px solid var(--rp-c-brand);
-      color: var(--rp-c-brand);
+      transform: translateY(-4px);
+      box-shadow: 0 8px 24px rgba(0, 149, 255, 0.12);
+
+      .rp-home-feature__icon {
+        transform: scale(1.05);
+        border-color: var(--rp-c-brand);
+      }
     }
   }
 
@@ -97,6 +103,7 @@
     background-color: var(--rp-c-bg);
     border-radius: 1rem;
     border: 3px solid var(--rp-c-divider-light);
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   }
 
   &__title {
diff --git a/packages/core/src/theme/components/Sidebar/SidebarItem.scss b/packages/core/src/theme/components/Sidebar/SidebarItem.scss
index a7d9d2710..5bdda78ba 100644
--- a/packages/core/src/theme/components/Sidebar/SidebarItem.scss
+++ b/packages/core/src/theme/components/Sidebar/SidebarItem.scss
@@ -12,8 +12,9 @@
   font-weight: 400;
   color: var(--rp-c-text-2);
   transition:
-    color 0.15s,
-    background-color 0.15s;
+    color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
+    background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
+    transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
 
   &:first-child {
     margin-top: 0;
@@ -47,6 +48,9 @@
     color: var(--rp-c-link);
     background-color: var(--rp-c-brand-tint);
     font-weight: 600;
+    border-left: 3px solid var(--rp-c-brand);
+    padding-left: 9px;
+
     &:hover {
       color: var(--rp-c-link);
       background-color: var(--rp-c-brand-tint);
diff --git a/packages/core/src/theme/styles/scrollbar.scss b/packages/core/src/theme/styles/scrollbar.scss
index 68850c297..533bc8558 100644
--- a/packages/core/src/theme/styles/scrollbar.scss
+++ b/packages/core/src/theme/styles/scrollbar.scss
@@ -3,8 +3,8 @@
 
   /* Scrollbar dimensions */
   &::-webkit-scrollbar {
-    width: 4px;
-    height: 4px;
+    width: 6px;
+    height: 6px;
   }
 
   /* Scrollbar track */
@@ -14,14 +14,14 @@
 
   /* Scrollbar thumb */
   &::-webkit-scrollbar-thumb {
-    background: rgba(0, 0, 0, 0.05);
-    border-radius: 4px;
+    background: rgba(0, 0, 0, 0.12);
+    border-radius: 6px;
     transition: background 0.2s ease;
   }
 
   /* Hover state */
   &:hover::-webkit-scrollbar-thumb {
-    background: rgba(0, 0, 0, 0.1);
+    background: rgba(0, 0, 0, 0.2);
   }
 
   /* Scrollbar corner */
@@ -32,11 +32,11 @@
   /* Dark mode adaptation */
   .rp-dark & {
     &::-webkit-scrollbar-thumb {
-      background: rgba(255, 255, 255, 0.1);
+      background: rgba(255, 255, 255, 0.15);
     }
 
     &:hover::-webkit-scrollbar-thumb {
-      background: rgba(255, 255, 255, 0.2);
+      background: rgba(255, 255, 255, 0.25);
     }
   }
 }