feat: implement individual bookmark fetching and display

- Add IndividualBookmark interface for individual bookmark events
- Implement fetchIndividualBookmarks function to fetch events by e and a tags
- Update parseBookmarkEvent to be async and fetch individual bookmarks
- Add renderIndividualBookmark component for displaying individual bookmarks
- Update UI to show individual bookmarks in a grid layout
- Add CSS styles for individual bookmarks with dark/light mode support
- Support both event references (e tags) and article references (a tags)
- Use applesauce content parsing for proper content rendering

src/index.css

@@ -288,6 +288,90 @@ body {
   margin-top: 0.5rem;
 }
 
+/* Individual Bookmarks Styles */
+.individual-bookmarks {
+  margin: 1rem 0;
+}
+
+.individual-bookmarks h4 {
+  margin: 0 0 1rem 0;
+  font-size: 1rem;
+  color: #fff;
+}
+
+.bookmarks-grid {
+  display: grid;
+  gap: 1rem;
+  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+}
+
+.individual-bookmark {
+  background: #2a2a2a;
+  padding: 1rem;
+  border-radius: 6px;
+  border: 1px solid #444;
+  transition: border-color 0.2s;
+}
+
+.individual-bookmark:hover {
+  border-color: #646cff;
+}
+
+.bookmark-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 0.75rem;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+}
+
+.bookmark-type {
+  background: #646cff;
+  color: white;
+  padding: 0.25rem 0.5rem;
+  border-radius: 4px;
+  font-size: 0.8rem;
+  font-weight: 500;
+  text-transform: uppercase;
+}
+
+.bookmark-id {
+  font-family: monospace;
+  font-size: 0.8rem;
+  color: #888;
+  background: #1a1a1a;
+  padding: 0.25rem 0.5rem;
+  border-radius: 4px;
+}
+
+.bookmark-date {
+  font-size: 0.8rem;
+  color: #666;
+}
+
+.individual-bookmark .bookmark-content {
+  margin: 0.75rem 0;
+  color: #ccc;
+  line-height: 1.5;
+}
+
+.individual-bookmark .bookmark-meta {
+  display: flex;
+  gap: 1rem;
+  flex-wrap: wrap;
+  font-size: 0.8rem;
+  color: #888;
+  margin-top: 0.75rem;
+}
+
+.individual-bookmark .bookmark-meta span {
+  background: #1a1a1a;
+  padding: 0.25rem 0.5rem;
+  border-radius: 4px;
+  font-family: monospace;
+}
+
 @media (prefers-color-scheme: light) {
   :root {
     color: #213547;
@@ -315,4 +399,31 @@ body {
   .user-info {
     color: #666;
   }
+  
+  .individual-bookmark {
+    background: #f5f5f5;
+    border-color: #ddd;
+  }
+  
+  .individual-bookmark:hover {
+    border-color: #646cff;
+  }
+  
+  .individual-bookmarks h4 {
+    color: #213547;
+  }
+  
+  .individual-bookmark .bookmark-content {
+    color: #666;
+  }
+  
+  .bookmark-id {
+    background: #e9ecef;
+    color: #666;
+  }
+  
+  .individual-bookmark .bookmark-meta span {
+    background: #e9ecef;
+    color: #666;
+  }
 }