From 8ce2cf201f0fcfda1e90cf9d41bd6c833ded7ac5 Mon Sep 17 00:00:00 2001
From: garnizeH <garnizeh.dev@gmail.com>
Date: Sun, 22 Feb 2026 19:34:14 -0300
Subject: [PATCH 1/3] =?UTF-8?q?P10-T110:=20Add=20responsive=20design=20usi?=
 =?UTF-8?q?ng=20Tailwind=20CSS=20=E2=80=94=20complete?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/tasks/{backlog => done}/P10-T110.md      |  2 +-
 .../server/ui/templates/active_workers.html   | 14 ++---
 go/internal/server/ui/templates/base.html     | 63 ++++++++++++++-----
 go/internal/server/ui/templates/daily.html    | 11 ++--
 .../server/ui/templates/found_results.html    | 22 +++----
 .../server/ui/templates/leaderboard.html      |  8 +--
 go/internal/server/ui/templates/login.html    | 12 ++--
 go/internal/server/ui/templates/monthly.html  | 17 +++--
 .../server/ui/templates/prefix_details.html   | 16 +++--
 9 files changed, 105 insertions(+), 60 deletions(-)
 rename docs/tasks/{backlog => done}/P10-T110.md (98%)

diff --git a/docs/tasks/backlog/P10-T110.md b/docs/tasks/done/P10-T110.md
similarity index 98%
rename from docs/tasks/backlog/P10-T110.md
rename to docs/tasks/done/P10-T110.md
index 31c02b7..b3f3107 100644
--- a/docs/tasks/backlog/P10-T110.md
+++ b/docs/tasks/done/P10-T110.md
@@ -1,7 +1,7 @@
 # P10-T110: Add responsive design using Tailwind CSS (via CDN or standalone CLI)
 
 **Phase:** P10 - Dashboard & Monitoring UI  
-**Status:** Not Started  
+**Status:** In Progress  
 **Priority:** Low  
 **Dependencies:** [P10-T040]  
 **Estimated Effort:** Small
diff --git a/go/internal/server/ui/templates/active_workers.html b/go/internal/server/ui/templates/active_workers.html
index 9f61315..3ae5832 100644
--- a/go/internal/server/ui/templates/active_workers.html
+++ b/go/internal/server/ui/templates/active_workers.html
@@ -27,13 +27,13 @@ <h3 class="text-base font-semibold leading-6 text-gray-900">Active Fleet Status<
                                 class="px-6 py-3 text-left text-xs font-bold text-gray-500 uppercase tracking-wider">
                                 Status</th>
                             <th scope="col"
-                                class="px-6 py-3 text-left text-xs font-bold text-gray-500 uppercase tracking-wider">
+                                class="hidden md:table-cell px-6 py-3 text-left text-xs font-bold text-gray-500 uppercase tracking-wider">
                                 Workload</th>
                             <th scope="col"
                                 class="px-6 py-3 text-left text-xs font-bold text-gray-500 uppercase tracking-wider">
                                 Throughput</th>
                             <th scope="col"
-                                class="px-6 py-3 text-left text-xs font-bold text-gray-500 uppercase tracking-wider">
+                                class="hidden lg:table-cell px-6 py-3 text-left text-xs font-bold text-gray-500 uppercase tracking-wider">
                                 Last Activity</th>
                         </tr>
                     </thead>
@@ -42,7 +42,7 @@ <h3 class="text-base font-semibold leading-6 text-gray-900">Active Fleet Status<
                         <tr class="hover:bg-gray-50 transition-colors">
                             <td class="px-6 py-4 whitespace-nowrap">
                                 <div class="flex items-center">
-                                    <div class="{{workerIconClass .WorkerType}}">
+                                    <div class="{{workerIconClass .WorkerType}} flex-shrink-0">
                                         {{if eq .WorkerType "pc"}}
                                         <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                                             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -55,8 +55,8 @@ <h3 class="text-base font-semibold leading-6 text-gray-900">Active Fleet Status<
                                         </svg>
                                         {{end}}
                                     </div>
-                                    <div class="ml-4">
-                                        <div class="text-sm font-bold text-gray-900 leading-none mb-1">
+                                    <div class="ml-4 truncate">
+                                        <div class="text-sm font-bold text-gray-900 leading-none mb-1 truncate">
                                             <a {{workerLinkAttr .ID}}
                                                 class="hover:text-blue-600 hover:underline underline-offset-4 transition">
                                                 {{.ID}}
@@ -73,7 +73,7 @@ <h3 class="text-base font-semibold leading-6 text-gray-900">Active Fleet Status<
                                     ACTIVE
                                 </span>
                             </td>
-                            <td class="px-6 py-4 whitespace-nowrap">
+                            <td class="hidden md:table-cell px-6 py-4 whitespace-nowrap">
                                 {{if .CurrentNonce.Valid}}
                                 <div class="flex flex-col">
                                     <span class="text-xs font-mono text-gray-500 mb-1">Prefix: 0x{{printf "%x"
@@ -98,7 +98,7 @@ <h3 class="text-base font-semibold leading-6 text-gray-900">Active Fleet Status<
                                 <div class="text-sm text-gray-300 font-mono">---</div>
                                 {{end}}
                             </td>
-                            <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
+                            <td class="hidden lg:table-cell px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
                                 <div class="text-xs text-gray-500 font-mono">{{.LastSeen.UTC.Format "15:04:05"}} UTC
                                 </div>
                             </td>
diff --git a/go/internal/server/ui/templates/base.html b/go/internal/server/ui/templates/base.html
index 5597263..5e437a3 100644
--- a/go/internal/server/ui/templates/base.html
+++ b/go/internal/server/ui/templates/base.html
@@ -58,7 +58,7 @@
                 <!-- Mobile Menu Button -->
                 <div class="md:hidden flex items-center">
                     <button type="button" onclick="document.getElementById('mobile-menu').classList.toggle('hidden')"
-                        class="bg-gray-800 p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 transition">
+                        class="bg-gray-800 p-2 rounded-md text-gray-300 hover:text-white hover:bg-gray-700 transition focus:outline-none focus:ring-2 focus:ring-blue-500">
                         <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                 d="M4 6h16M4 12h16M4 18h16" />
@@ -82,27 +82,60 @@
             </div>
         </div>
 
-        <!-- Mobile Menu (Hidden by default) -->
+        <!-- Mobile Menu (Overlay) -->
         {{if not .HideNav}}
-        <div id="mobile-menu" class="hidden md:hidden border-t border-gray-800 bg-gray-900 absolute w-full shadow-lg">
-            <div class="px-4 py-3 space-y-2">
-                <a href="/dashboard" {{navAttr .CurrentPath "/dashboard" "block w-full" }}>Overview</a>
-                <a href="/dashboard/daily" {{navAttr .CurrentPath "/dashboard/daily" "block w-full" }}>Daily</a>
-                <a href="/dashboard/monthly" {{navAttr .CurrentPath "/dashboard/monthly" "block w-full" }}>Monthly</a>
-                <a href="/dashboard/leaderboard" {{navAttr .CurrentPath "/dashboard/leaderboard" "block w-full" }}>Hall
-                    of Fame</a>
-                <a href="/dashboard/workers" {{navAttr .CurrentPath "/dashboard/workers" "block w-full" }}>Workers</a>
-                <a href="/dashboard/settings" {{navAttr .CurrentPath "/dashboard/settings" "block w-full"
-                    }}>Settings</a>
-                <div class="border-t border-gray-700 pt-2 mt-2">
+        <div id="mobile-menu" class="hidden md:hidden fixed inset-0 z-50">
+            <!-- Backdrop -->
+            <div class="fixed inset-0 bg-gray-900/60 backdrop-blur-sm"
+                onclick="document.getElementById('mobile-menu').classList.add('hidden')"></div>
+
+            <!-- Sidebar Panel -->
+            <nav
+                class="fixed inset-y-0 right-0 w-64 max-w-xs bg-gray-900 shadow-xl overflow-y-auto border-l border-gray-800 flex flex-col transition-all duration-300">
+                <div class="px-6 py-5 flex items-center justify-between border-b border-gray-800">
+                    <div class="flex items-center">
+                        <img class="h-8 w-8 rounded-md" src="/static/img/apple-touch-icon.png" alt="EthScanner Logo">
+                        <span class="ml-3 text-sm font-bold uppercase tracking-widest">Navigation</span>
+                    </div>
+                    <button type="button" onclick="document.getElementById('mobile-menu').classList.add('hidden')"
+                        class="p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-800 transition">
+                        <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M6 18L18 6M6 6l12 12" />
+                        </svg>
+                    </button>
+                </div>
+
+                <div class="px-4 py-6 space-y-2 flex-grow">
+                    <a href="/dashboard" {{navAttr
+                        .CurrentPath "/dashboard" "block w-full py-3 px-4 rounded-lg text-sm font-bold" }}
+                        onclick="document.getElementById('mobile-menu').classList.add('hidden')">Overview</a>
+                    <a href="/dashboard/daily" {{navAttr
+                        .CurrentPath "/dashboard/daily" "block w-full py-3 px-4 rounded-lg text-sm font-bold" }}
+                        onclick="document.getElementById('mobile-menu').classList.add('hidden')">Daily Stats</a>
+                    <a href="/dashboard/monthly" {{navAttr
+                        .CurrentPath "/dashboard/monthly" "block w-full py-3 px-4 rounded-lg text-sm font-bold" }}
+                        onclick="document.getElementById('mobile-menu').classList.add('hidden')">Monthly Stats</a>
+                    <a href="/dashboard/leaderboard" {{navAttr
+                        .CurrentPath "/dashboard/leaderboard" "block w-full py-3 px-4 rounded-lg text-sm font-bold" }}
+                        onclick="document.getElementById('mobile-menu').classList.add('hidden')">Leaderboard</a>
+                    <a href="/dashboard/workers" {{navAttr
+                        .CurrentPath "/dashboard/workers" "block w-full py-3 px-4 rounded-lg text-sm font-bold" }}
+                        onclick="document.getElementById('mobile-menu').classList.add('hidden')">Workers</a>
+                    <a href="/dashboard/settings" {{navAttr
+                        .CurrentPath "/dashboard/settings" "block w-full py-3 px-4 rounded-lg text-sm font-bold" }}
+                        onclick="document.getElementById('mobile-menu').classList.add('hidden')">Settings</a>
+                </div>
+
+                <div class="p-4 border-t border-gray-800">
                     <form action="/logout" method="POST" class="w-full">
                         <button type="submit"
-                            class="w-full text-left px-3 py-2 text-red-400 hover:bg-gray-800 rounded-md text-sm font-medium transition">
+                            class="w-full text-center px-4 py-3 bg-red-600/10 text-red-400 hover:bg-red-600/20 rounded-lg text-xs font-bold transition uppercase tracking-widest border border-red-900/50">
                             Logout
                         </button>
                     </form>
                 </div>
-            </div>
+            </nav>
         </div>
         {{end}}
     </header>
diff --git a/go/internal/server/ui/templates/daily.html b/go/internal/server/ui/templates/daily.html
index 6400751..d881ec4 100644
--- a/go/internal/server/ui/templates/daily.html
+++ b/go/internal/server/ui/templates/daily.html
@@ -117,13 +117,15 @@ <h3 class="text-xs font-bold text-gray-500 uppercase tracking-widest">Daily Log
                         class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Date
                     </th>
                     <th scope="col"
-                        class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Status
+                        class="hidden sm:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        Status
                     </th>
                     <th scope="col"
                         class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Volume
                         (Keys)</th>
                     <th scope="col"
-                        class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Errors
+                        class="hidden md:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        Errors
                     </th>
                 </tr>
             </thead>
@@ -131,7 +133,7 @@ <h3 class="text-xs font-bold text-gray-500 uppercase tracking-widest">Daily Log
                 {{range .DailyStats}}
                 <tr class="hover:bg-gray-50/50 transition leading-none">
                     <td class="px-6 py-4 text-sm font-bold text-gray-600 font-mono">{{.StatsDate}}</td>
-                    <td class="px-6 py-4 text-sm text-gray-500">
+                    <td class="hidden sm:table-cell px-6 py-4 text-sm text-gray-500">
                         {{if .TotalKeysScanned}}
                         <div class="flex items-center">
                             <span class="h-1.5 w-1.5 rounded-full bg-green-400 mr-2"></span>
@@ -143,7 +145,8 @@ <h3 class="text-xs font-bold text-gray-500 uppercase tracking-widest">Daily Log
                     </td>
                     <td class="px-6 py-4 text-sm font-black text-gray-800 tracking-tight">
                         {{printf "%.0f" (float64 .TotalKeysScanned)}}</td>
-                    <td {{errorStatusAttr .TotalErrors}} class="px-6 py-4 text-sm uppercase tracking-tighter">
+                    <td {{errorStatusAttr .TotalErrors}}
+                        class="hidden md:table-cell px-6 py-4 text-sm uppercase tracking-tighter">
                         {{printf "%.0f" (float64 .TotalErrors)}}</td>
                 </tr>
                 {{else}}
diff --git a/go/internal/server/ui/templates/found_results.html b/go/internal/server/ui/templates/found_results.html
index 06b4d0f..8aa2a28 100644
--- a/go/internal/server/ui/templates/found_results.html
+++ b/go/internal/server/ui/templates/found_results.html
@@ -19,13 +19,13 @@ <h3 class="text-xs font-black text-gray-400 uppercase tracking-widest">Discovere
                             class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                             Ethereum Address</th>
                         <th scope="col"
-                            class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                            class="hidden md:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                             Prefix & Nonce</th>
                         <th scope="col"
-                            class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                            class="hidden sm:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                             Worker</th>
                         <th scope="col"
-                            class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                            class="hidden lg:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                             Found At (UTC)</th>
                         <th scope="col"
                             class="px-6 py-3 text-right text-[10px] font-bold text-gray-400 uppercase tracking-widest">
@@ -38,35 +38,35 @@ <h3 class="text-xs font-black text-gray-400 uppercase tracking-widest">Discovere
                         <td class="px-6 py-4 whitespace-nowrap">
                             <div class="flex items-center">
                                 <div
-                                    class="h-8 w-8 rounded-lg bg-yellow-400 flex items-center justify-center mr-3 shadow-sm border border-yellow-500">
+                                    class="h-8 w-8 rounded-lg bg-yellow-400 flex items-center justify-center mr-3 shadow-sm border border-yellow-500 flex-shrink-0">
                                     <svg class="h-5 w-5 text-yellow-900" fill="currentColor" viewBox="0 0 20 20">
                                         <path fill-rule="evenodd"
                                             d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z"
                                             clip-rule="evenodd" />
                                     </svg>
                                 </div>
-                                <div class="flex flex-col">
+                                <div class="flex flex-col truncate">
                                     <span
-                                        class="text-sm font-black text-gray-900 font-mono tracking-tighter">{{.Address}}</span>
+                                        class="text-sm font-black text-gray-900 font-mono tracking-tighter truncate max-w-[120px] sm:max-w-none">{{.Address}}</span>
                                     <span class="text-[10px] font-bold text-gray-400 uppercase tracking-widest">Full
                                         Match Discovered</span>
                                 </div>
                             </div>
                         </td>
-                        <td class="px-6 py-4 whitespace-nowrap">
+                        <td class="hidden md:table-cell px-6 py-4 whitespace-nowrap">
                             <div class="flex flex-col">
                                 <span class="text-xs font-mono text-blue-600 font-bold" {{titleAttr (fullHex
                                     .Prefix28)}}>{{truncateHex .Prefix28}}</span>
                                 <span class="text-[10px] text-gray-400 font-mono">Nonce: {{.NonceFound}}</span>
                             </div>
                         </td>
-                        <td class="px-6 py-4 whitespace-nowrap">
+                        <td class="hidden sm:table-cell px-6 py-4 whitespace-nowrap">
                             <div class="flex items-center">
                                 <span
                                     class="text-xs font-bold text-gray-700 bg-gray-100 px-2 py-0.5 rounded">{{.WorkerID}}</span>
                             </div>
                         </td>
-                        <td class="px-6 py-4 whitespace-nowrap text-xs text-gray-500 font-medium">
+                        <td class="hidden lg:table-cell px-6 py-4 whitespace-nowrap text-xs text-gray-500 font-medium">
                             {{.FoundAt.UTC.Format "2006-01-02 15:04:05"}}
                         </td>
                         <td class="px-6 py-4 whitespace-nowrap text-right">
@@ -82,10 +82,10 @@ <h3 class="text-xs font-black text-gray-400 uppercase tracking-widest">Discovere
                                     class="text-[10px] font-black text-yellow-400 uppercase tracking-widest mb-1">Confidential
                                     Private Key (HEX)</span>
                                 <div
-                                    class="bg-black/50 p-3 rounded border border-gray-700 flex items-center justify-between">
+                                    class="bg-black/50 p-3 rounded border border-gray-700 flex items-center justify-between overflow-x-auto">
                                     <code class="text-sm font-mono text-green-400 break-all">{{.PrivateKey}}</code>
                                     <button onclick="copyToClipboard('{{.PrivateKey}}')"
-                                        class="ml-4 text-gray-400 hover:text-white">
+                                        class="ml-4 text-gray-400 hover:text-white flex-shrink-0">
                                         <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                                             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                                 d="M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-1M8 5a2 2 0 002 2h2a2 2 0 002-2M8 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3" />
diff --git a/go/internal/server/ui/templates/leaderboard.html b/go/internal/server/ui/templates/leaderboard.html
index 2ae8b21..ad2c5b0 100644
--- a/go/internal/server/ui/templates/leaderboard.html
+++ b/go/internal/server/ui/templates/leaderboard.html
@@ -123,13 +123,13 @@ <h3 class="text-xs font-black text-gray-400 uppercase tracking-widest">Lifetime
                         class="px-8 py-4 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Worker
                         ID</th>
                     <th scope="col"
-                        class="px-8 py-4 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        class="hidden sm:table-cell px-8 py-4 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                         Platform</th>
                     <th scope="col"
                         class="px-8 py-4 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Total
                         Volume</th>
                     <th scope="col"
-                        class="px-8 py-4 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        class="hidden md:table-cell px-8 py-4 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                         Efficiency (Best K/s)</th>
                 </tr>
             </thead>
@@ -149,7 +149,7 @@ <h3 class="text-xs font-black text-gray-400 uppercase tracking-widest">Lifetime
                             </a>
                         </div>
                     </td>
-                    <td class="px-8 py-5 whitespace-nowrap">
+                    <td class="hidden sm:table-cell px-8 py-5 whitespace-nowrap">
                         <span {{workerBadgeAttr .WorkerType}}>
                             {{.WorkerType}}
                         </span>
@@ -158,7 +158,7 @@ <h3 class="text-xs font-black text-gray-400 uppercase tracking-widest">Lifetime
                         {{dataAttr "value" .TotalKeysScanned}}>
                         {{.TotalKeysScanned}}
                     </td>
-                    <td class="px-8 py-5 whitespace-nowrap text-sm text-gray-500 font-bold">
+                    <td class="hidden md:table-cell px-8 py-5 whitespace-nowrap text-sm text-gray-500 font-bold">
                         <div class="flex flex-col">
                             <span class="text-blue-600">{{printf "%.1f" (float64 .KeysPerSecondBest)}} k/s</span>
                             <span class="text-[10px] text-gray-400 uppercase tracking-widest mt-0.5">Average: {{printf
diff --git a/go/internal/server/ui/templates/login.html b/go/internal/server/ui/templates/login.html
index b0c20bf..a068ee9 100644
--- a/go/internal/server/ui/templates/login.html
+++ b/go/internal/server/ui/templates/login.html
@@ -3,9 +3,9 @@
 {{define "title"}}Login{{end}}
 
 {{define "content"}}
-<div class="max-w-md mx-auto mt-10 p-6 bg-white rounded-lg shadow-md border border-gray-200">
+<div class="mx-4 sm:mx-auto max-w-md mt-10 p-6 bg-white rounded-lg shadow-md border border-gray-200">
     <h1 class="text-2xl font-bold mb-6 text-gray-800 text-center">Dashboard Login</h1>
-    
+
     {{if .Error}}
     <div class="mb-4 p-3 bg-red-100 border border-red-400 text-red-700 rounded">
         {{.Error}}
@@ -16,12 +16,12 @@ <h1 class="text-2xl font-bold mb-6 text-gray-800 text-center">Dashboard Login</h
         <div class="mb-4">
             <label for="password" class="block text-sm font-medium text-gray-700 mb-1">Enter Password</label>
             <input type="password" name="password" id="password" required
-                   class="w-full px-3 py-2 border border-gray-300 rounded focus:ring-blue-500 focus:border-blue-500">
+                class="w-full px-3 py-2 border border-gray-300 rounded focus:ring-blue-500 focus:border-blue-500">
         </div>
-        <button type="submit" 
-                class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline transition duration-150">
+        <button type="submit"
+            class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline transition duration-150">
             Sign In
         </button>
     </form>
 </div>
-{{end}}
+{{end}}
\ No newline at end of file
diff --git a/go/internal/server/ui/templates/monthly.html b/go/internal/server/ui/templates/monthly.html
index b9fe861..5a9076c 100644
--- a/go/internal/server/ui/templates/monthly.html
+++ b/go/internal/server/ui/templates/monthly.html
@@ -117,16 +117,18 @@ <h3 class="text-xs font-bold text-gray-500 uppercase tracking-widest">Monthly Ag
                         class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Month
                     </th>
                     <th scope="col"
-                        class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        class="hidden md:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                         Batches</th>
                     <th scope="col"
                         class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Volume
                         (Keys)</th>
                     <th scope="col"
-                        class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Avg
+                        class="hidden sm:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        Avg
                         Throughput</th>
                     <th scope="col"
-                        class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Errors
+                        class="hidden md:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        Errors
                     </th>
                 </tr>
             </thead>
@@ -134,12 +136,15 @@ <h3 class="text-xs font-bold text-gray-500 uppercase tracking-widest">Monthly Ag
                 {{range .MonthlyStats}}
                 <tr class="hover:bg-gray-50/50 transition">
                     <td class="px-6 py-4 text-sm font-bold text-gray-600 font-mono">{{.StatsMonth}}</td>
-                    <td class="px-6 py-4 text-sm text-gray-500 font-bold">{{printf "%.0f" .TotalBatches.Float64}}</td>
+                    <td class="hidden md:table-cell px-6 py-4 text-sm text-gray-500 font-bold">{{printf "%.0f"
+                        .TotalBatches.Float64}}</td>
                     <td class="px-6 py-4 text-sm font-black text-gray-800 tracking-tight">{{printf "%.0f"
                         .TotalKeysScanned.Float64}}</td>
-                    <td class="px-6 py-4 text-sm text-blue-600 font-bold">{{printf "%.1f" .KeysPerSecondAvg.Float64}}
+                    <td class="hidden sm:table-cell px-6 py-4 text-sm text-blue-600 font-bold">{{printf "%.1f"
+                        .KeysPerSecondAvg.Float64}}
                         k/s</td>
-                    <td {{errorStatusAttr .TotalErrors.Float64}} class="px-6 py-4 text-sm uppercase tracking-tighter">
+                    <td {{errorStatusAttr .TotalErrors.Float64}}
+                        class="hidden md:table-cell px-6 py-4 text-sm uppercase tracking-tighter">
                         {{printf "%.0f" .TotalErrors.Float64}}
                     </td>
                 </tr>
diff --git a/go/internal/server/ui/templates/prefix_details.html b/go/internal/server/ui/templates/prefix_details.html
index 94c2e98..8880346 100644
--- a/go/internal/server/ui/templates/prefix_details.html
+++ b/go/internal/server/ui/templates/prefix_details.html
@@ -35,11 +35,14 @@ <h3 class="text-sm font-bold text-gray-400 uppercase tracking-widest">Scanning R
                         Range</th>
                     <th class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Worker
                     </th>
-                    <th class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                    <th
+                        class="hidden md:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
                         Progress</th>
                     <th class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Status
                     </th>
-                    <th class="px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">Last
+                    <th
+                        class="hidden lg:table-cell px-6 py-3 text-left text-[10px] font-bold text-gray-400 uppercase tracking-widest">
+                        Last
                         Activity</th>
                 </tr>
             </thead>
@@ -57,9 +60,10 @@ <h3 class="text-sm font-bold text-gray-400 uppercase tracking-widest">Scanning R
                     <td class="px-6 py-4 whitespace-nowrap">
                         {{if .WorkerID.Valid}}
                         <div class="flex items-center">
-                            <span {{workerBadgeAttr .WorkerType}}>{{.WorkerType.String}}</span>
+                            <span
+                                class="hidden sm:inline-flex {{workerBadgeAttr .WorkerType}}">{{.WorkerType.String}}</span>
                             <a {{workerLinkAttr .WorkerID.String}}
-                                class="ml-2 text-xs font-bold text-blue-600 hover:underline underline-offset-4 transition">
+                                class="sm:ml-2 text-xs font-bold text-blue-600 hover:underline underline-offset-4 transition">
                                 {{.WorkerID.String}}
                             </a>
                         </div>
@@ -67,7 +71,7 @@ <h3 class="text-sm font-bold text-gray-400 uppercase tracking-widest">Scanning R
                         <span class="text-xs font-bold text-gray-300 italic">Unassigned</span>
                         {{end}}
                     </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
+                    <td class="hidden md:table-cell px-6 py-4 whitespace-nowrap">
                         <div class="flex flex-col w-32">
                             <div class="flex items-center justify-between mb-1">
                                 <span class="text-[10px] font-black text-blue-600">{{printf "%.1f" (multiply (percentage
@@ -91,7 +95,7 @@ <h3 class="text-sm font-bold text-gray-400 uppercase tracking-widest">Scanning R
                             class="inline-flex items-center px-2 py-0.5 rounded text-[10px] font-black bg-gray-100 text-gray-500 uppercase tracking-widest">{{.Status}}</span>
                         {{end}}
                     </td>
-                    <td class="px-6 py-4 whitespace-nowrap text-xs text-gray-500 font-medium">
+                    <td class="hidden lg:table-cell px-6 py-4 whitespace-nowrap text-xs text-gray-500 font-medium">
                         {{if .LastCheckpointAt.Valid}}
                         {{.LastCheckpointAt.Time.UTC.Format "2006-01-02 15:04:05"}} UTC
                         {{else}}

From 4da6f5630ec8152b35fdb5cdde73caeaca79a9f2 Mon Sep 17 00:00:00 2001
From: garnizeH <garnizeh.dev@gmail.com>
Date: Sun, 22 Feb 2026 19:35:25 -0300
Subject: [PATCH 2/3] feat: Update status to completed and mark acceptance
 criteria as done for P10-T110

---
 docs/tasks/done/P10-T110.md | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/docs/tasks/done/P10-T110.md b/docs/tasks/done/P10-T110.md
index b3f3107..8144097 100644
--- a/docs/tasks/done/P10-T110.md
+++ b/docs/tasks/done/P10-T110.md
@@ -1,7 +1,7 @@
 # P10-T110: Add responsive design using Tailwind CSS (via CDN or standalone CLI)
 
 **Phase:** P10 - Dashboard & Monitoring UI  
-**Status:** In Progress  
+**Status:** Completed  
 **Priority:** Low  
 **Dependencies:** [P10-T040]  
 **Estimated Effort:** Small
@@ -14,11 +14,11 @@ Ensure the dashboard is fully responsive and visually polished across mobile, ta
 
 ## Acceptance Criteria
 
-- [ ] Implement a mobile-first sidebar/menu that collapses into a "hamburger" menu.
-- [ ] Set responsive column widths for lists and tables (`hidden md:table-cell`).
-- [ ] Verify chart scaling on small devices.
-- [ ] Optimize the login screen for mobile use.
-- [ ] Use Tailwind colors consistently across all components.
+- [x] Implement a mobile-first sidebar/menu that collapses into a "hamburger" menu.
+- [x] Set responsive column widths for lists and tables (`hidden md:table-cell`).
+- [x] Verify chart scaling on small devices.
+- [x] Optimize the login screen for mobile use.
+- [x] Use Tailwind colors consistently across all components.
 
 ## Implementation Notes
 

From 996f0d405aeb0136dd56ac62abae06bbf2cc4cb7 Mon Sep 17 00:00:00 2001
From: garnizeH <garnizeh.dev@gmail.com>
Date: Sun, 22 Feb 2026 19:46:08 -0300
Subject: [PATCH 3/3] test: Increase job polling range in crash recovery test
 for improved reliability

---
 go/internal/server/e2e_worker_crash_recovery_test.go | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/go/internal/server/e2e_worker_crash_recovery_test.go b/go/internal/server/e2e_worker_crash_recovery_test.go
index aef6a96..0688591 100644
--- a/go/internal/server/e2e_worker_crash_recovery_test.go
+++ b/go/internal/server/e2e_worker_crash_recovery_test.go
@@ -108,7 +108,7 @@ func TestWorkerCrashRecovery(t *testing.T) {
 	var lastCheckpoint int64
 
 	checkSuccess := false
-	for range 50 {
+	for range 100 {
 		time.Sleep(200 * time.Millisecond)
 		q := database.NewQueries(db)
 		jobs, err := q.GetJobsByWorker(context.Background(), sql.NullString{String: workerID, Valid: true})
@@ -150,7 +150,7 @@ func TestWorkerCrashRecovery(t *testing.T) {
 	// checking the DB for the final result is better.
 
 	completed := false
-	for range 50 {
+	for range 100 {
 		time.Sleep(200 * time.Millisecond)
 		q := database.NewQueries(db)
 		j, err := q.GetJobByID(context.Background(), jobID)