Index: chapterx-frontend/src/pages/admin/AdminGenresPage.tsx
===================================================================
--- chapterx-frontend/src/pages/admin/AdminGenresPage.tsx	(revision b62cefc14094ca5ac7154f7d48797a1e6c444935)
+++ chapterx-frontend/src/pages/admin/AdminGenresPage.tsx	(revision d300631ac3354730c3b03cb7b160974af50e7894)
@@ -1,3 +1,3 @@
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react'
 import { useNavigate } from 'react-router-dom'
 import { ArrowLeft, Plus, Trash2, Tag } from 'lucide-react'
@@ -10,5 +10,5 @@
 export const AdminGenresPage: React.FC = () => {
   const navigate = useNavigate()
-  const { genres, addGenre, deleteGenre } = useStoryStore()
+  const { genres, fetchGenres, addGenre, deleteGenre } = useStoryStore()
   const { addToast } = useUIStore()
   const [addOpen, setAddOpen] = useState(false)
@@ -16,5 +16,7 @@
   const [deleteTarget, setDeleteTarget] = useState<Genre | null>(null)
 
-  const handleAdd = () => {
+  useEffect(() => { fetchGenres() }, [])
+
+  const handleAdd = async () => {
     if (!newName.trim()) return
     if (genres.some(g => g.name.toLowerCase() === newName.trim().toLowerCase())) {
@@ -22,17 +24,21 @@
       return
     }
-    addGenre({ genre_id: Date.now(), name: newName.trim(), story_count: 0 })
-    addToast(`Genre "${newName.trim()}" added!`)
-    setNewName('')
-    setAddOpen(false)
+    try {
+      await addGenre(newName.trim())
+      addToast(`Genre "${newName.trim()}" added!`)
+      setNewName('')
+      setAddOpen(false)
+    } catch {
+      addToast('Failed to add genre', 'error')
+    }
   }
 
-  const handleDelete = (genre: Genre) => {
-    if (genre.story_count > 0) {
-      addToast('Cannot delete genre with associated stories', 'error')
-      return
+  const handleDelete = async (genre: Genre) => {
+    try {
+      await deleteGenre(genre.genre_id)
+      addToast(`Genre "${genre.name}" deleted`, 'info')
+    } catch {
+      addToast('Failed to delete genre', 'error')
     }
-    deleteGenre(genre.genre_id)
-    addToast(`Genre "${genre.name}" deleted`, 'info')
     setDeleteTarget(null)
   }