diff --git a/app/[locale]/bible/reader.tsx b/app/[locale]/bible/reader.tsx
index 4b8b409..8a4c833 100644
--- a/app/[locale]/bible/reader.tsx
+++ b/app/[locale]/bible/reader.tsx
@@ -702,18 +702,26 @@ export default function BibleReaderNew() {
       return
     }
 
+    // Exit full-screen mode if currently in reading mode so chat is visible
+    if (preferences.readingMode) {
+      setPreferences(prev => ({ ...prev, readingMode: false }))
+    }
+
     const versionName = versions.find(v => v.id === selectedVersion)?.name || selectedVersion
     const bookName = currentBook?.name || 'Unknown Book'
 
     const initialMessage = `Explain in depth this verse "${verse.text}" from ${versionName}, ${bookName} ${selectedChapter}:${verse.verseNum} and its meaning`
 
-    // Dispatch event to open floating chat with the pre-filled message
-    window.dispatchEvent(new CustomEvent('floating-chat:open', {
-      detail: {
-        initialMessage: initialMessage,
-        fullscreen: false
-      }
-    }))
+    // Small delay to allow full-screen exit animation to complete
+    setTimeout(() => {
+      // Dispatch event to open floating chat with the pre-filled message
+      window.dispatchEvent(new CustomEvent('floating-chat:open', {
+        detail: {
+          initialMessage: initialMessage,
+          fullscreen: false
+        }
+      }))
+    }, 200)
   }
 
   const getThemeStyles = () => {
@@ -796,31 +804,67 @@ export default function BibleReaderNew() {
           </Typography>
         </Box>
 
-        {!preferences.readingMode && (
-          <Box className="verse-actions" sx={{ opacity: 0.3, transition: 'opacity 0.2s', display: 'flex', gap: 0.5 }}>
-            <IconButton
-              size="small"
-              onClick={() => handleVerseBookmark(verse)}
-              sx={{ color: isBookmarked ? 'warning.main' : 'action.active' }}
-            >
-              {isBookmarked ? <Bookmark fontSize="small" /> : <BookmarkBorder fontSize="small" />}
-            </IconButton>
-            <IconButton
-              size="small"
-              onClick={() => handleCopyVerse(verse)}
-              sx={{ color: 'action.active' }}
-            >
-              <ContentCopy fontSize="small" />
-            </IconButton>
-            <IconButton
-              size="small"
-              onClick={() => handleVerseChat(verse)}
-              sx={{ color: 'action.active' }}
-            >
-              <Chat fontSize="small" />
-            </IconButton>
-          </Box>
-        )}
+        <Box
+          className="verse-actions"
+          sx={{
+            opacity: preferences.readingMode ? 0.2 : 0.3,
+            transition: 'opacity 0.2s',
+            display: 'flex',
+            gap: 0.5,
+            '&:hover': {
+              opacity: 1
+            }
+          }}
+        >
+          <IconButton
+            size="small"
+            onClick={() => handleVerseBookmark(verse)}
+            sx={{
+              color: isBookmarked ? 'warning.main' : 'action.active',
+              '&:hover': {
+                backgroundColor: preferences.readingMode
+                  ? (preferences.theme === 'dark' ? 'rgba(255, 255, 255, 0.1)' :
+                     preferences.theme === 'sepia' ? 'rgba(92, 75, 58, 0.1)' :
+                     'rgba(0, 0, 0, 0.05)')
+                  : 'action.hover'
+              }
+            }}
+          >
+            {isBookmarked ? <Bookmark fontSize="small" /> : <BookmarkBorder fontSize="small" />}
+          </IconButton>
+          <IconButton
+            size="small"
+            onClick={() => handleCopyVerse(verse)}
+            sx={{
+              color: 'action.active',
+              '&:hover': {
+                backgroundColor: preferences.readingMode
+                  ? (preferences.theme === 'dark' ? 'rgba(255, 255, 255, 0.1)' :
+                     preferences.theme === 'sepia' ? 'rgba(92, 75, 58, 0.1)' :
+                     'rgba(0, 0, 0, 0.05)')
+                  : 'action.hover'
+              }
+            }}
+          >
+            <ContentCopy fontSize="small" />
+          </IconButton>
+          <IconButton
+            size="small"
+            onClick={() => handleVerseChat(verse)}
+            sx={{
+              color: 'action.active',
+              '&:hover': {
+                backgroundColor: preferences.readingMode
+                  ? (preferences.theme === 'dark' ? 'rgba(255, 255, 255, 0.1)' :
+                     preferences.theme === 'sepia' ? 'rgba(92, 75, 58, 0.1)' :
+                     'rgba(0, 0, 0, 0.05)')
+                  : 'action.hover'
+              }
+            }}
+          >
+            <Chat fontSize="small" />
+          </IconButton>
+        </Box>
       </Box>
     )
   }
@@ -832,8 +876,17 @@ export default function BibleReaderNew() {
         mb: preferences.readingMode ? 1 : 2,
         p: preferences.readingMode ? 1 : 2,
         ...getThemeStyles(),
-        border: preferences.readingMode ? 'none' : `1px solid ${getThemeStyles().borderColor}`,
-        backgroundColor: preferences.readingMode ? 'transparent' : getThemeStyles().backgroundColor,
+        border: preferences.readingMode
+          ? `1px solid ${preferences.theme === 'dark' ? 'rgba(255, 255, 255, 0.1)' :
+                           preferences.theme === 'sepia' ? 'rgba(92, 75, 58, 0.1)' :
+                           'rgba(0, 0, 0, 0.1)'}`
+          : `1px solid ${getThemeStyles().borderColor}`,
+        backgroundColor: preferences.readingMode
+          ? (preferences.theme === 'dark' ? 'rgba(26, 26, 26, 0.95)' :
+             preferences.theme === 'sepia' ? 'rgba(247, 243, 233, 0.95)' :
+             'rgba(255, 255, 255, 0.95)')
+          : getThemeStyles().backgroundColor,
+        backdropFilter: preferences.readingMode ? 'blur(8px)' : 'none',
         position: 'sticky',
         top: 0,
         zIndex: 1,