diff --git a/web/src/pages/[...path].astro b/web/src/pages/[...path].astro
index f00c7c36..28f1b6ba 100644
--- a/web/src/pages/[...path].astro
+++ b/web/src/pages/[...path].astro
@@ -133,8 +133,8 @@ const title = page.type === 'poem' ? page.poem.title : page.type === 'poet' ? pa
       </article>
       <p class="muted hint">کسی لفظ کو منتخب کریں تو اس کے معنی اور تلفظ ساتھ نظر آئیں گے۔</p>
       <nav class="poem-nav">
-        {page.next ? <a href={page.next}>اگلا ›</a> : <span />}
-        {page.prev ? <a href={page.prev}>‹ پچھلا</a> : <span />}
+        {page.prev && <a href={page.prev} rel="prev">‹ پچھلا</a>}
+        {page.next && <a href={page.next} rel="next">اگلا ›</a>}
       </nav>
       {page.divan && (
         <p class="source divan-edit">
diff --git a/web/src/styles/global.css b/web/src/styles/global.css
index 93c91831..6bcf1c19 100644
--- a/web/src/styles/global.css
+++ b/web/src/styles/global.css
@@ -105,7 +105,7 @@ h1::after { content: ''; display: block; width: 140px; height: 2px; background:
   .couplet p, .couplet p + p { text-align: center; }
   .couplet::after { display: none; }
 }
-.poem-nav { display: flex; justify-content: space-between; }
+.poem-nav { display: flex; justify-content: center; gap: 12px; } /* RTL: پچھلا on the right, اگلا on the left */
 .poem-nav a { border: 1.5px solid var(--border); background: var(--inner); border-radius: 10px; padding: 0 14px; }
 .source { text-align: center; font-size: .85rem; color: var(--muted); }