fix: classify highlights before passing to ContentPanel

- Add classifiedHighlights memo in Bookmarks to ensure highlights have level property
- Pass classified highlights to ContentPanel so color-coded rendering works
- Reduce reader border-radius from 12px to 8px to reduce visual separation
- Fixes highlights not showing with proper colors on default article

src/components/Bookmarks.tsx

@@ -128,6 +128,19 @@ const Bookmarks: React.FC<BookmarksProps> = ({ relayPool, onLogout }) => {
     }
   }
 
+  // Classify highlights with levels based on user context
+  const classifiedHighlights = useMemo(() => {
+    return highlights.map(h => {
+      let level: 'mine' | 'friends' | 'nostrverse' = 'nostrverse'
+      if (h.pubkey === activeAccount?.pubkey) {
+        level = 'mine'
+      } else if (followedPubkeys.has(h.pubkey)) {
+        level = 'friends'
+      }
+      return { ...h, level }
+    })
+  }, [highlights, activeAccount?.pubkey, followedPubkeys])
+
   const handleSelectUrl = async (url: string, bookmark?: BookmarkReference) => {
     if (!relayPool) return
     
@@ -182,7 +195,7 @@ const Bookmarks: React.FC<BookmarksProps> = ({ relayPool, onLogout }) => {
             markdown={readerContent?.markdown}
             image={readerContent?.image}
             selectedUrl={selectedUrl}
-            highlights={highlights}
+            highlights={classifiedHighlights}
             showUnderlines={showUnderlines}
             highlightStyle={settings.highlightStyle || 'marker'}
             highlightColor={settings.highlightColor || '#ffff00'}

src/index.css

@@ -477,7 +477,7 @@ body {
 .reader {
   background: #1a1a1a;
   border: 1px solid #333;
-  border-radius: 12px;
+  border-radius: 8px;
   padding: 1rem;
   text-align: left;
   overflow: hidden;