diff --git a/frontend/src/components/stories/StoryCard.tsx b/frontend/src/components/stories/StoryCard.tsx
index c6c993a..a1b1830 100644
--- a/frontend/src/components/stories/StoryCard.tsx
+++ b/frontend/src/components/stories/StoryCard.tsx
@@ -29,6 +29,8 @@ export default function StoryCard({
   const [updating, setUpdating] = useState(false);
 
   const handleRatingClick = async (e: React.MouseEvent, newRating: number) => {
+    console.log('Rating click:', newRating, 'for story:', story.title);
+    // Prevent default and stop propagation to avoid triggering navigation
     e.preventDefault();
     e.stopPropagation();
     
@@ -56,7 +58,10 @@ export default function StoryCard({
 
   if (viewMode === 'list') {
     return (
-      <div className="theme-card theme-shadow rounded-lg p-4 hover:shadow-lg transition-shadow">
+      <div 
+        className="theme-card theme-shadow rounded-lg p-4 hover:shadow-lg transition-shadow"
+        onClick={(e) => console.log('Story card clicked (list view):', story.title, 'Target:', e.target)}
+      >
         <div className="flex gap-4">
           {/* Cover Image */}
           <div className="flex-shrink-0">
@@ -171,7 +176,10 @@ export default function StoryCard({
 
   // Grid view
   return (
-    <div className="theme-card theme-shadow rounded-lg overflow-hidden hover:shadow-lg transition-shadow group">
+    <div 
+      className="theme-card theme-shadow rounded-lg overflow-hidden hover:shadow-lg transition-shadow group"
+      onClick={(e) => console.log('Story card clicked (grid view):', story.title, 'Target:', e.target)}
+    >
       {/* Cover Image */}
       <Link href={`/stories/${story.id}`}>
         <div className="aspect-[3/4] bg-gray-200 dark:bg-gray-700 overflow-hidden">
diff --git a/frontend/src/components/stories/StoryMultiSelect.tsx b/frontend/src/components/stories/StoryMultiSelect.tsx
index 22b3801..e7de941 100644
--- a/frontend/src/components/stories/StoryMultiSelect.tsx
+++ b/frontend/src/components/stories/StoryMultiSelect.tsx
@@ -20,8 +20,16 @@ export default function StoryMultiSelect({
 }: StoryMultiSelectProps) {
   const [selectedStoryIds, setSelectedStoryIds] = useState<string[]>([]);
   const [isSelectionMode, setIsSelectionMode] = useState(false);
+  
+  console.log('StoryMultiSelect render:', { 
+    storiesCount: stories.length, 
+    isSelectionMode, 
+    selectedCount: selectedStoryIds.length,
+    allowMultiSelect 
+  });
 
   const handleStorySelect = (storyId: string) => {
+    console.log('Story selection triggered:', storyId, 'Selection mode:', isSelectionMode);
     setSelectedStoryIds(prev => {
       if (prev.includes(storyId)) {
         const newSelection = prev.filter(id => id !== storyId);
@@ -101,7 +109,10 @@ export default function StoryMultiSelect({
                 <input
                   type="checkbox"
                   checked={selectedStoryIds.includes(story.id)}
-                  onChange={() => handleStorySelect(story.id)}
+                  onChange={(e) => {
+                    e.stopPropagation(); // Prevent checkbox clicks from interfering
+                    handleStorySelect(story.id);
+                  }}
                   className="w-5 h-5 rounded border-gray-300 text-blue-600 focus:ring-blue-500 bg-white shadow-lg"
                 />
               </div>