diff --git a/scraper/internal/server/ui.go b/scraper/internal/server/ui.go
index 3df4c30..0f2c6e5 100644
--- a/scraper/internal/server/ui.go
+++ b/scraper/internal/server/ui.go
@@ -1403,12 +1403,12 @@ const chapterTmpl = `
        hx-swap="innerHTML"
        title="Previous chapter"
        aria-label="Previous chapter"
-       style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;background:#27272a;color:#d4d4d8;font-size:0.8125rem;text-decoration:none;transition:background 0.15s;"
-       onmouseover="this.style.background='#3f3f46'" onmouseout="this.style.background='#27272a'">
+       style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;background:transparent;color:#a1a1aa;font-size:0.8125rem;text-decoration:none;transition:color 0.15s;"
+       onmouseover="this.style.color='#f4f4f5'" onmouseout="this.style.color='#a1a1aa'">
       ← Prev
     </a>
     {{else}}
-    <span style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;color:#52525b;font-size:0.8125rem;cursor:default;" aria-hidden="true">&#8592; Prev</span>
+    <span style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;color:#3f3f46;font-size:0.8125rem;cursor:default;" aria-hidden="true">&#8592; Prev</span>
     {{end}}
 
     <!-- Chapter title button — opens chapter list drawer -->
@@ -1433,12 +1433,12 @@ const chapterTmpl = `
        hx-swap="innerHTML"
        title="Next chapter"
        aria-label="Next chapter"
-       style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;background:#27272a;color:#d4d4d8;font-size:0.8125rem;text-decoration:none;transition:background 0.15s;"
-       onmouseover="this.style.background='#3f3f46'" onmouseout="this.style.background='#27272a'">
+       style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;background:transparent;color:#a1a1aa;font-size:0.8125rem;text-decoration:none;transition:color 0.15s;"
+       onmouseover="this.style.color='#f4f4f5'" onmouseout="this.style.color='#a1a1aa'">
       Next &#8594;
     </a>
     {{else}}
-    <span style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;color:#52525b;font-size:0.8125rem;cursor:default;" aria-hidden="true">Next &#8594;</span>
+    <span style="flex-shrink:0;padding:0.375rem 0.625rem;border-radius:0.5rem;color:#3f3f46;font-size:0.8125rem;cursor:default;" aria-hidden="true">Next &#8594;</span>
     {{end}}
 
     <!-- TTS play/pause button -->
@@ -1446,8 +1446,8 @@ const chapterTmpl = `
             onclick="ttsToggle()"
             title="Listen"
             aria-label="Listen"
-            style="flex-shrink:0;display:flex;align-items:center;gap:0.375rem;padding:0.375rem 0.75rem;border-radius:0.5rem;background:#d97706;color:#fff;font-size:0.8125rem;font-weight:500;border:none;cursor:pointer;transition:background 0.15s;"
-            onmouseover="this.style.background='#b45309'" onmouseout="this.style.background='#d97706'">
+            style="flex-shrink:0;display:flex;align-items:center;gap:0.375rem;padding:0.375rem 0.625rem;border-radius:0.5rem;background:transparent;color:#f59e0b;font-size:0.8125rem;font-weight:500;border:none;cursor:pointer;transition:color 0.15s;"
+            onmouseover="this.style.color='#fbbf24'" onmouseout="this.style.color='#f59e0b'">
       <span id="tts-icon" aria-hidden="true">&#9654;</span>
       <span id="tts-label">Listen</span>
     </button>