diff --git a/js/planner.js b/js/planner.js
index b339c6d..c746a4e 100644
--- a/js/planner.js
+++ b/js/planner.js
@@ -599,11 +599,23 @@ function timelineScale(plan) {
     return { duration, width: Math.max(720, Math.ceil(duration / 1000 * pxPerSecond)) };
 }
 
+// Sortierreihenfolge im Gantt: Healer → Phys.Range → Caster → Melee → Tank
+const JOB_GANTT_ORDER = {
+    'WHM':  0, 'SCH':  1, 'AST':  2, 'SGE':  3,
+    'BRD': 10, 'MCH': 11, 'DNC': 12,
+    'BLM': 20, 'SMN': 21, 'RDM': 22, 'PCT': 23,
+    'MNK': 30, 'DRG': 31, 'NIN': 32, 'SAM': 33, 'RPR': 34, 'VPR': 35,
+    'PLD': 40, 'WAR': 41, 'DRK': 42, 'GNB': 43,
+};
+
 function timelinePlayerRows(plan) {
     const roster = plan.playerRoster ?? [];
     const rows = [];
-    (plan.jobComposition ?? []).forEach((job, idx) => {
-        if (!job) return;
+    const jobEntries = (plan.jobComposition ?? [])
+        .map((job, idx) => ({ job, idx }))
+        .filter(e => !!e.job)
+        .sort((a, b) => (JOB_GANTT_ORDER[a.job] ?? 99) - (JOB_GANTT_ORDER[b.job] ?? 99));
+    jobEntries.forEach(({ job, idx }) => {
         const name = roster[idx]?.name ?? '';
         const role = JOB_ROLE[job] ?? '';
         const abilities = (JOB_ABILITIES[job] ?? [])