diff --git a/public/css/style.css b/public/css/style.css
index 08a0cda..49e4aee 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -258,7 +258,8 @@ div.page>section h2 {
 ul {
   margin-top: var(--default-margin);
 }
-ul + ul {
+
+ul+ul {
   margin-right: 20px;
 }
 
@@ -283,7 +284,8 @@ ul>li>a {
   color: var(--secondary-text-color);
 }
 
-ul>li>p,ul>li>span {
+ul>li>p,
+ul>li>span {
   font-size: 18px;
 }
 
@@ -347,3 +349,89 @@ li[role=link]:focus {
     display: 100%;
   }
 }
+
+/* ===== UI ENHANCEMENTS ===== */
+
+.box-stats,
+.box-stats-resume>.one-stat {
+  background: var(--card-background, transparent);
+  transition: transform 0.15s ease, box-shadow 0.15s ease;
+}
+
+.box-stats:hover,
+.box-stats-resume>.one-stat:hover {
+  transform: translateY(-2px);
+}
+
+ul>li>a span {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.npm-packages-item:hover {
+  background: rgba(255, 255, 255, 0.04);
+  border-radius: 4px;
+}
+
+.box-stats-resume>.one-stat span {
+  font-size: 1.3rem;
+  letter-spacing: 1px;
+}
+
+.box-stats-container.charts {
+  box-shadow: inset 0 0 0 1px var(--faded-border-color);
+}
+
+/* ===== Authors & Maintainers – Leaderboard UI ===== */
+
+.authors-leaderboard {
+  margin-top: 20px;
+  max-width: 650px;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 0;
+}
+
+.authors-leaderboard li {
+  display: grid;
+  grid-template-columns: 40px 1fr 60px;
+  align-items: center;
+  gap: 10px;
+  padding: 10px 14px;
+  margin-bottom: 8px;
+  border-radius: 10px;
+  background: rgba(255, 255, 255, 0.04);
+  border: 1px solid var(--faded-border-color);
+  font-family: "mononoki";
+}
+
+.authors-leaderboard .rank {
+  font-weight: bold;
+  text-align: center;
+}
+
+/* Top 3 highlight */
+.authors-leaderboard .rank-1 {
+  border-color: gold;
+}
+
+.authors-leaderboard .rank-2 {
+  border-color: silver;
+}
+
+.authors-leaderboard .rank-3 {
+  border-color: #cd7f32;
+}
+
+.author-email {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.author-count {
+  font-weight: bold;
+  color: var(--main-color);
+  text-align: right;
+}
\ No newline at end of file
diff --git a/views/template.html b/views/template.html
index 1275220..5229801 100644
--- a/views/template.html
+++ b/views/template.html
@@ -153,6 +153,7 @@ <h3><span>[[=Object.keys(z.npm_stats.deps.node).length]]</span>Node.js Core Depe
           <i class="fas fa-user"></i>
           <h3>Authors & Maintainers</h3>
         </div>
+
         <div class="box-avatar">
           [[ for (const [email, count] of Object.entries(z.npm_stats.authors)) { ]]
           <div class="avatar" data-email="[[=email]]">
@@ -161,6 +162,19 @@ <h3>Authors & Maintainers</h3>
           </div>
           [[ } ]]
         </div>
+
+        <ul class="authors-leaderboard">
+          [[ let index = 0; ]]
+          [[ for (const [email, count] of Object.entries(z.npm_stats.authors).sort((a, b) => b[1] - a[1])) { ]]
+          <li class="rank-[[=index+1]]">
+            <span class="rank">[[=index+1]]</span>
+            <span class="author-email">[[=email]]</span>
+            <span class="author-count">[[=count]]</span>
+          </li>
+          [[ index++; ]]
+          [[ } ]]
+        </ul>
+
       </div>
     </div>
     [[ if (Object.keys(z.npm_stats.scorecards).length > 0) { ]]
@@ -370,4 +384,4 @@ <h3>[[=name]]</h3>
     [[ } ]]
   </section>
   [[ } ]]
-</div>
+</div>
\ No newline at end of file