diff --git a/frontend/src/pages/QuestPage.tsx b/frontend/src/pages/QuestPage.tsx
index 8acab72..0135291 100644
--- a/frontend/src/pages/QuestPage.tsx
+++ b/frontend/src/pages/QuestPage.tsx
@@ -214,25 +214,37 @@ export function QuestPage() {
 
   if (loadActive || loadAvail) return <div style={{ padding: '2rem', color: '#6b7a99' }}>Chargement…</div>;
 
-  // Séparer quêtes narratives (slots limités) et répétables (toujours en fond)
-  const activeStory = active?.filter((pq: any) => !pq.quest.repeatable) ?? [];
-  const activeDaily = active?.filter((pq: any) => pq.quest.repeatable) ?? [];
-  const availableStory = available?.filter((q: any) => !q.repeatable) ?? [];
-  const availableDaily = available?.filter((q: any) => q.repeatable) ?? [];
+  const isCraftQuest = (q: any) => ['forge_item', 'craft_item'].includes(q.objectiveType ?? q.quest?.objectiveType);
+  const isCombatQuest = (q: any) => !isCraftQuest(q);
+
+  // Split by category
+  const activeAll = active ?? [];
+  const activeCombat = activeAll.filter((pq: any) => !pq.quest.repeatable && isCombatQuest(pq));
+  const activeCraft = activeAll.filter((pq: any) => !pq.quest.repeatable && isCraftQuest(pq));
+  const activeDaily = activeAll.filter((pq: any) => pq.quest.repeatable);
+
+  const availableAll = available ?? [];
+  const availableCombat = availableAll.filter((q: any) => !q.repeatable && isCombatQuest(q));
+  const availableCraft = availableAll.filter((q: any) => !q.repeatable && isCraftQuest(q));
+  const availableDaily = availableAll.filter((q: any) => q.repeatable);
+
+  // Stagger: show max 3 combat quests at a time
+  const shownCombat = availableCombat.slice(0, 3);
+  const hiddenCount = availableCombat.length - shownCombat.length;
 
   return (
     <div>
       <h2 style={{ margin: '0 0 1rem', color: '#f4c94e', fontSize: 20 }}>📜 Quêtes</h2>
 
       <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '1rem' }}>
-        {/* Active story quests */}
+        {/* Active combat quests */}
         <div>
           <p style={{ margin: '0 0 0.5rem', fontSize: 12, fontWeight: 700, color: '#6b7a99', textTransform: 'uppercase' }}>
-            Quêtes actives ({activeStory.length}/3)
+            Quêtes actives ({activeCombat.length}/3)
           </p>
-          {activeStory.length > 0 ? (
+          {activeCombat.length > 0 ? (
             <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
-              {activeStory.map((pq: any) => <QuestCard key={pq.id} pq={pq} mode="active" />)}
+              {activeCombat.map((pq: any) => <QuestCard key={pq.id} pq={pq} mode="active" />)}
             </div>
           ) : (
             <div className="card" style={{ padding: '1.5rem', textAlign: 'center', color: '#6b7a99', fontSize: 13 }}>
@@ -241,23 +253,41 @@ export function QuestPage() {
           )}
         </div>
 
-        {/* Available story quests */}
+        {/* Available combat quests (staggered) */}
         <div>
           <p style={{ margin: '0 0 0.5rem', fontSize: 12, fontWeight: 700, color: '#6b7a99', textTransform: 'uppercase' }}>
-            Quêtes disponibles
+            Quêtes de combat
           </p>
-          {availableStory.length > 0 ? (
+          {shownCombat.length > 0 ? (
             <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
-              {availableStory.map((q: any) => <QuestCard key={q.id} pq={q} mode="available" />)}
+              {shownCombat.map((q: any) => <QuestCard key={q.id} pq={q} mode="available" />)}
+              {hiddenCount > 0 && (
+                <div style={{ textAlign: 'center', fontSize: 11, color: '#6b7a99', padding: 4 }}>
+                  +{hiddenCount} quête{hiddenCount > 1 ? 's' : ''} supplémentaire{hiddenCount > 1 ? 's' : ''} après celles-ci
+                </div>
+              )}
             </div>
           ) : (
             <div className="card" style={{ padding: '1.5rem', textAlign: 'center', color: '#6b7a99', fontSize: 13 }}>
-              Toutes les quêtes sont acceptées ou complétées
+              Toutes les quêtes de combat sont complétées
             </div>
           )}
         </div>
       </div>
 
+      {/* Métiers (craft/forge — hors pool, comme les dailies) */}
+      {(activeCraft.length > 0 || availableCraft.length > 0) && (
+        <div style={{ marginTop: '1.5rem' }}>
+          <p style={{ margin: '0 0 0.5rem', fontSize: 12, fontWeight: 700, color: '#6b7a99', textTransform: 'uppercase' }}>
+            🔨 Métiers
+          </p>
+          <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: 6 }}>
+            {activeCraft.map((pq: any) => <QuestCard key={pq.id} pq={pq} mode="active" />)}
+            {availableCraft.map((q: any) => <QuestCard key={q.id} pq={q} mode="available" />)}
+          </div>
+        </div>
+      )}
+
       {/* Tâches quotidiennes (répétables — toujours en fond) */}
       <div style={{ marginTop: '1.5rem' }}>
         <p style={{ margin: '0 0 0.5rem', fontSize: 12, fontWeight: 700, color: '#6b7a99', textTransform: 'uppercase' }}>
diff --git a/src/quest/quest.service.ts b/src/quest/quest.service.ts
index 232c9e2..03fd48f 100644
--- a/src/quest/quest.service.ts
+++ b/src/quest/quest.service.ts
@@ -92,17 +92,20 @@ export class QuestService {
       throw new BadRequestException(`Niveau ${quest.minLevel} requis`);
     }
 
-    // Check active quest count (repeatable quests don't count toward the limit)
-    if (!quest.repeatable) {
-      const activeNonRepeatable = await this.playerQuestRepo
+    // Check active quest count
+    // Repeatable + craft/forge quests don't count toward the 3-slot limit
+    const isCraftQuest = ['forge_item', 'craft_item'].includes(quest.objectiveType);
+    if (!quest.repeatable && !isCraftQuest) {
+      const activeCombat = await this.playerQuestRepo
         .createQueryBuilder('pq')
         .innerJoin('pq.quest', 'q')
         .where('pq.character_id = :characterId', { characterId })
         .andWhere('pq.status = :status', { status: 'active' })
         .andWhere('q.repeatable = false')
+        .andWhere('q.objective_type NOT IN (:...types)', { types: ['forge_item', 'craft_item'] })
         .getCount();
-      if (activeNonRepeatable >= MAX_ACTIVE_QUESTS) {
-        throw new BadRequestException(`Maximum ${MAX_ACTIVE_QUESTS} quêtes actives (hors répétables)`);
+      if (activeCombat >= MAX_ACTIVE_QUESTS) {
+        throw new BadRequestException(`Maximum ${MAX_ACTIVE_QUESTS} quêtes de combat actives`);
       }
     }