diff --git a/web/src/pages/Knowledge.tsx b/web/src/pages/Knowledge.tsx
index 598682e..24f5882 100644
--- a/web/src/pages/Knowledge.tsx
+++ b/web/src/pages/Knowledge.tsx
@@ -782,7 +782,7 @@ function CategoryRow({
   return (
     <div
       className={`group/cat relative rounded-lg transition-colors ${
-        active ? "bg-primary-50 ring-1 ring-primary-200" : ""
+        active ? "bg-primary-50 ring-1 ring-primary-300 shadow-[inset_3px_0_0_#4F46E5]" : ""
       }`}
     >
       <div className="flex items-center">
@@ -792,7 +792,7 @@ function CategoryRow({
           style={{ paddingLeft: `${8 + indent * 14}px` }}
           className={`flex min-w-0 flex-1 items-center justify-between gap-2 rounded-lg py-1.5 pr-1 text-sm transition-colors ${
             active
-              ? "font-medium text-primary-800"
+              ? "font-medium text-primary-900"
               : "text-ink-600 hover:bg-paper-100 hover:text-ink-900"
           }`}
         >
@@ -825,7 +825,7 @@ function CategoryRow({
           aria-expanded={open}
           onClick={onToggle}
           className={`mr-1 shrink-0 rounded-md p-1 text-ink-400 transition hover:bg-white hover:text-ink-700 ${
-            open ? "opacity-100" : "opacity-0 group-hover/cat:opacity-100 focus-visible:opacity-100"
+            open ? "opacity-100" : "opacity-40 hover:opacity-100 group-hover/cat:opacity-100 focus-visible:opacity-100"
           }`}
         >
           <More size={13} />
@@ -987,7 +987,7 @@ function CategoryButton({
       aria-current={active ? "true" : undefined}
       className={`flex w-full items-center justify-between gap-2 rounded-lg py-1.5 pl-2 pr-2 text-sm transition-colors ${
         active
-          ? "bg-primary-50 font-medium text-primary-800 ring-1 ring-primary-200"
+          ? "bg-primary-50 font-medium text-primary-900 ring-1 ring-primary-300 shadow-[inset_3px_0_0_#4F46E5]"
           : "text-ink-600 hover:bg-paper-100 hover:text-ink-900"
       }`}
     >