diff --git a/static/js/index.js b/static/js/index.js
index 352e154..f59b1bb 100644
--- a/static/js/index.js
+++ b/static/js/index.js
@@ -199,13 +199,18 @@ window.app = Vue.createApp({
     },
 
     getMilestoneProgress() {
-      if (!this.dashboardData) return 0
+      if (!this.dashboardData) {
+        console.log('getMilestoneProgress: no dashboard data')
+        return 0
+      }
       const sats = this.dashboardData.total_sats_accumulated
       const milestone = this.getNextMilestone()
 
       // Show total progress toward the next milestone (from 0)
       const progress = (sats / milestone.target) * 100
-      return Math.min(Math.max(progress, 0), 100)
+      const result = Math.min(Math.max(progress, 0), 100)
+      console.log('getMilestoneProgress:', { sats, milestone, progress, result })
+      return result
     },
     async loadChartData() {
       // Prevent multiple simultaneous requests
diff --git a/templates/satmachineclient/index.html b/templates/satmachineclient/index.html
index 06b9369..c11d5dc 100644
--- a/templates/satmachineclient/index.html
+++ b/templates/satmachineclient/index.html
@@ -43,16 +43,16 @@
             </div>
             <div class="col-12 col-md-4 q-mt-md">
               <q-circular-progress
+                show-value
+                font-size="12px"
                 :value="getMilestoneProgress()"
                 size="80px"
                 :thickness="0.25"
                 color="orange-7"
                 track-color="orange-1"
-                class="q-ma-md"
+                class="q-ma-md text-orange-8"
               >
-                <div class="text-body2 text-weight-bold text-orange-8">
-                  ${Math.round(getMilestoneProgress())}%
-                </div>
+                ${(getMilestoneProgress() || 0).toFixed(2)}%
               </q-circular-progress>
               <div class="text-body2 text-weight-medium text-grey-7">to ${getNextMilestone().name}</div>
             </div>