feat: position bookmark type icon in top-left corner of card

- Move bookmark type icon to top-left corner as overlay
- Add bookmark-type-overlay with absolute positioning
- Style icon with background, border, and shadow for visibility
- Update responsive design for smaller screens
- Remove icon from bookmark header to avoid duplication
- Ensure icon is always visible and accessible

src/components/BookmarkViews/CardView.tsx

@@ -117,6 +117,11 @@ export const CardView: React.FC<CardViewProps> = ({
       onKeyDown={handleKeyDown}
     >
       <div className="card-layout">
+        {/* Bookmark type icon in top-left corner */}
+        <div className="bookmark-type-overlay">
+          <FontAwesomeIcon icon={contentTypeIcon} className="content-type-icon" />
+        </div>
+        
         <div className="card-content">
           <div className="card-content-header">
             {(cachedImage || firstUrl) && (
@@ -134,9 +139,6 @@ export const CardView: React.FC<CardViewProps> = ({
             )}
             <div className="card-text-content">
         <div className="bookmark-header">
-          <span className="bookmark-type">
-            <FontAwesomeIcon icon={contentTypeIcon} className="content-type-icon" />
-          </span>
           
           {getInternalRoute() ? (
             <Link

src/styles/components/cards.css

@@ -99,6 +99,27 @@
   flex-direction: column;
   padding: 1.25rem;
   gap: 0.75rem;
+  position: relative;
+}
+
+.bookmark-type-overlay {
+  position: absolute;
+  top: 0.75rem;
+  left: 0.75rem;
+  z-index: 10;
+  background: var(--color-bg);
+  border: 1px solid var(--color-border);
+  border-radius: 6px;
+  padding: 0.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.bookmark-type-overlay .content-type-icon {
+  color: var(--color-primary);
+  font-size: 0.9rem;
 }
 
 .card-content-header {
@@ -282,6 +303,16 @@
     gap: 0.5rem;
   }
   
+  .bookmark-type-overlay {
+    top: 0.5rem;
+    left: 0.5rem;
+    padding: 0.375rem;
+  }
+  
+  .bookmark-type-overlay .content-type-icon {
+    font-size: 0.8rem;
+  }
+  
   .card-content-header {
     gap: 0.75rem;
   }
@@ -311,6 +342,16 @@
     gap: 0.5rem;
   }
   
+  .bookmark-type-overlay {
+    top: 0.375rem;
+    left: 0.375rem;
+    padding: 0.25rem;
+  }
+  
+  .bookmark-type-overlay .content-type-icon {
+    font-size: 0.75rem;
+  }
+  
   .card-content-header {
     gap: 0.5rem;
   }