fix: improve Bible reader loading UX with skeleton states

- Remove full-screen loading backdrop that hides entire UI
- Add skeleton loading components for chapter headers and verses
- Implement smooth content transitions without UI disappearance
- Change initial loading state to prevent immediate UI hide
- Enhance Suspense fallbacks with better loading messages
- Keep Bible reader interface visible during all loading states

Fixes issue where:
- Entire reader disappeared during chapter changes
- Users saw only header/footer during loading
- Poor perceived performance with jarring transitions

Now provides professional skeleton loading within the reader
interface for a smooth, responsive user experience.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

app/[locale]/bible/[version]/[book]/[chapter]/page.tsx

@@ -120,8 +120,17 @@ export default async function BibleChapterPage({ params }: PageProps) {
 
   // Pass the parameters as props instead of URLSearchParams
   return (
-    <Suspense fallback={<div>Loading...</div>}>
-      <BibleReader 
+    <Suspense fallback={
+      <div style={{
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        minHeight: '200px'
+      }}>
+        Loading Bible reader...
+      </div>
+    }>
+      <BibleReader
         initialVersion={resources.versionId}
         initialBook={resources.bookId}
         initialChapter={chapter}