diff --git a/cmd/templates/aggregate.html b/cmd/templates/aggregate.html
index bfa7b2c..27a658f 100644
--- a/cmd/templates/aggregate.html
+++ b/cmd/templates/aggregate.html
@@ -30,12 +30,11 @@
         th,
         td {
             padding: 0.7em 1em;
-            border-bottom: 1px solid #ddd;
             text-align: left;
         }
 
         th {
-            background: #f4f4f4;
+            background: #efefef;
             cursor: pointer;
             user-select: none;
         }
@@ -45,6 +44,7 @@
         }
 
         .bar {
+            position: relative;
             height: 18px;
             background: #efefef;
             border-radius: 9px;
@@ -54,15 +54,22 @@
         .bar-inner {
             background: #30ba78;
             height: 100%;
-            color: #0c322c;
+        }
+
+        .bar-label {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
             text-align: center;
+            line-height: 18px;
             font-size: 0.9em;
             font-weight: bold;
-            line-height: 18px;
+            color: #0c322c;
         }
 
         tr:nth-child(even) {
-            background-color: #f9f9f9;
+            background-color: #fafafa;
         }
 
         th.sort-asc::after {
@@ -86,6 +93,8 @@
             }
             .bar-inner {
                 background: #008657;
+            }
+            .bar-label {
                 color: #efefef;
             }
             th {
@@ -130,9 +139,8 @@ <h2>Total Coverage</h2>
                     <td>{{.CalledCount}}</td>
                     <td>
                         <div class="bar">
-                            <div class="bar-inner" style="width: {{printf " %.1f" .CoveragePct}}%">
-                                {{printf "%.1f" .CoveragePct}}%
-                            </div>
+                            <div class="bar-inner" style="width: {{printf "%.1f" .CoveragePct}}%"></div>
+                            <span class="bar-label">{{printf "%.1f" .CoveragePct}}%</span>
                         </div>
                     </td>
                 </tr>
diff --git a/cmd/templates/detailed.html b/cmd/templates/detailed.html
index 9a8220a..e2d16a8 100644
--- a/cmd/templates/detailed.html
+++ b/cmd/templates/detailed.html
@@ -29,29 +29,39 @@
             border: 1px solid #ddd;
         }
 
-        .summary .percentage {
-            font-size: 1.8em;
-            font-weight: bold;
-            color: #0c322c;
+        .progress-bar-wrap {
+            display: flex;
+            align-items: center;
+            gap: 0.75em;
+            margin-top: 1em;
         }
 
         .progress-bar {
+            position: relative;
             background: #e9ecef;
             border-radius: 50px;
             overflow: hidden;
-            height: 30px;
-            margin-top: 1em;
+            height: 25px;
+            flex: 1;
         }
 
         .progress-bar-inner {
             background: #30ba78;
             height: 100%;
-            color: #fff, text-align: center;
-            line-height: 30px;
-            font-weight: bold;
             transition: width 0.5s;
         }
 
+        .progress-bar-label {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            text-align: center;
+            line-height: 25px;
+            font-weight: bold;
+            color: #0c322c;
+        }
+
         .function-list {
             display: grid;
             grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
@@ -61,8 +71,6 @@
         }
 
         .function-list li {
-            padding: 0.6em;
-            border-radius: 5px;
             font-family: monospace;
             white-space: nowrap;
             overflow: hidden;
@@ -75,6 +83,13 @@
             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
         }
 
+        .called,
+        .uncalled {
+            padding: 0.2em 0.5em;
+            border-radius: 5px;
+            margin-right: 0.5em;
+        }
+
         .called {
             background: #d4edda;
             color: #025937;
@@ -87,6 +102,40 @@
             border-left: 5px solid #ff5a2b;
         }
 
+        .function-list li.called,
+        .function-list li.uncalled {
+            padding: 0.6em;
+            margin-right: 0;
+        }
+
+        details summary {
+            display: flex;
+            align-items: center;
+            cursor: pointer;
+            list-style: none;
+        }
+
+        details summary::-webkit-details-marker {
+            display: none;
+        }
+
+        details summary::before {
+            content: "▶";
+            margin-right: 0.5em;
+            font-size: 0.85em;
+            transition: transform 0.2s;
+            flex-shrink: 0;
+        }
+
+        details[open] summary::before {
+            transform: rotate(90deg);
+        }
+
+        details summary h2 {
+            display: inline;
+            margin: 0;
+        }
+
         @media (prefers-color-scheme: dark) {
             body {
                 background: #3e3e3e;
@@ -99,7 +148,7 @@
                 background: #1d1d1d;
                 border-color: #525252;
             }
-            .summary .percentage {
+            details summary h2 {
                 color: #efefef;
             }
             .progress-bar {
@@ -108,6 +157,9 @@
             .progress-bar-inner {
                 background: #008657;
             }
+            .progress-bar-label {
+                color: #efefef;
+            }
             .called {
                 background: #0c322c;
                 color: #c0efde;
@@ -130,10 +182,12 @@ <h2>Image: {{.ImageName}}</h2>
             <p><strong>Total Functions:</strong> {{.TotalCount}}</p>
             <p><strong>Called Functions:</strong> {{.CalledCount}}</p>
             <p><strong>Uncalled Functions:</strong> {{.UncalledCount}}</p>
-            <p class="percentage">Coverage: {{printf "%.1f" .CoveragePercentage}}%</p>
-            <div class="progress-bar">
-                <div class="progress-bar-inner" style="width: {{.CoveragePercentage}}%">{{printf "%.2f"
-                    .CoveragePercentage}}%</div>
+            <div class="progress-bar-wrap">
+                <strong>Coverage:</strong>
+                <div class="progress-bar">
+                    <div class="progress-bar-inner" style="width: {{.CoveragePercentage}}%"></div>
+                    <span class="progress-bar-label">{{printf "%.1f" .CoveragePercentage}}%</span>
+                </div>
             </div>
         </div>
         <details>