diff --git a/stacks/homepage/conf/custom.css b/stacks/homepage/conf/custom.css
index fc87853..54fa723 100644
--- a/stacks/homepage/conf/custom.css
+++ b/stacks/homepage/conf/custom.css
@@ -448,6 +448,44 @@ body,
   font-variant-numeric: tabular-nums !important;
 }
 
+/* ---------- widget stat wells (Plex, Jellyfin, Paperless, Uptime Kuma) ----------
+   Stock Homepage builds each stat as:
+       <div class="font-thin text-sm">353</div>       <- the VALUE
+       <div class="font-bold text-xs uppercase">Movies</div>  <- the LABEL
+   which is exactly backwards. The number you actually came to read is
+   weight 100 at 13px; the label shouting beside it is weight 700. Skyfall's
+   rule is that hierarchy comes emphatically from weight AND size, and that
+   numbers are the data — so this inverts the pair: the value goes big, bold
+   and bright, the label drops to a quiet eyebrow.
+
+   The well itself is --surface-input, one step DOWN from the card it sits on,
+   so stats read as inset data rather than as another floating surface. Depth
+   here is a recess, so it takes the hairline without the shadow. */
+.service-block {
+  background: var(--surface-input) !important;
+  border: 1px solid var(--border-subtle) !important;
+  border-radius: var(--radius-sm) !important;
+  padding: var(--space-2) var(--space-1) !important;
+}
+
+.service-block > div:first-child {
+  color: var(--text-heading) !important;
+  font-family: var(--font-mono) !important;
+  font-size: var(--text-xl) !important;
+  font-weight: var(--weight-bold) !important;
+  line-height: var(--leading-tight) !important;
+  font-variant-numeric: tabular-nums !important;
+}
+
+.service-block > div:last-child {
+  color: var(--text-faint) !important;
+  font-family: var(--font-body) !important;
+  font-size: var(--text-2xs) !important;
+  font-weight: var(--weight-medium) !important;
+  letter-spacing: var(--tracking-caps) !important;
+  line-height: var(--leading-snug) !important;
+}
+
 /* ---------- tabs ----------
    The active rail is one of only two sanctioned accent expressions:
    a 2px accent bar plus an --accent-soft fill. No glow — glows are
@@ -526,8 +564,10 @@ body,
    Semantic colour is the whole point: the system communicates status with
    colour and icons, never emoji, and accents are semantic-ONLY. Stock
    Homepage paints every pill the same slate, which throws away the signal. */
+/* .service-block is deliberately NOT in this list — the stat wells get their
+   own treatment above, and folding them in here is what made every number
+   render at --text-2xs. */
 .service-tag,
-.service-block,
 .service-stats {
   background: var(--surface-raised) !important;
   border: 1px solid var(--border-subtle) !important;
diff --git a/stacks/homepage/theme/skyfall.css.in b/stacks/homepage/theme/skyfall.css.in
index 9061fbd..1884abd 100644
--- a/stacks/homepage/theme/skyfall.css.in
+++ b/stacks/homepage/theme/skyfall.css.in
@@ -104,6 +104,44 @@ body,
   font-variant-numeric: tabular-nums !important;
 }
 
+/* ---------- widget stat wells (Plex, Jellyfin, Paperless, Uptime Kuma) ----------
+   Stock Homepage builds each stat as:
+       <div class="font-thin text-sm">353</div>       <- the VALUE
+       <div class="font-bold text-xs uppercase">Movies</div>  <- the LABEL
+   which is exactly backwards. The number you actually came to read is
+   weight 100 at 13px; the label shouting beside it is weight 700. Skyfall's
+   rule is that hierarchy comes emphatically from weight AND size, and that
+   numbers are the data — so this inverts the pair: the value goes big, bold
+   and bright, the label drops to a quiet eyebrow.
+
+   The well itself is --surface-input, one step DOWN from the card it sits on,
+   so stats read as inset data rather than as another floating surface. Depth
+   here is a recess, so it takes the hairline without the shadow. */
+.service-block {
+  background: var(--surface-input) !important;
+  border: 1px solid var(--border-subtle) !important;
+  border-radius: var(--radius-sm) !important;
+  padding: var(--space-2) var(--space-1) !important;
+}
+
+.service-block > div:first-child {
+  color: var(--text-heading) !important;
+  font-family: var(--font-mono) !important;
+  font-size: var(--text-xl) !important;
+  font-weight: var(--weight-bold) !important;
+  line-height: var(--leading-tight) !important;
+  font-variant-numeric: tabular-nums !important;
+}
+
+.service-block > div:last-child {
+  color: var(--text-faint) !important;
+  font-family: var(--font-body) !important;
+  font-size: var(--text-2xs) !important;
+  font-weight: var(--weight-medium) !important;
+  letter-spacing: var(--tracking-caps) !important;
+  line-height: var(--leading-snug) !important;
+}
+
 /* ---------- tabs ----------
    The active rail is one of only two sanctioned accent expressions:
    a 2px accent bar plus an --accent-soft fill. No glow — glows are
@@ -182,8 +220,10 @@ body,
    Semantic colour is the whole point: the system communicates status with
    colour and icons, never emoji, and accents are semantic-ONLY. Stock
    Homepage paints every pill the same slate, which throws away the signal. */
+/* .service-block is deliberately NOT in this list — the stat wells get their
+   own treatment above, and folding them in here is what made every number
+   render at --text-2xs. */
 .service-tag,
-.service-block,
 .service-stats {
   background: var(--surface-raised) !important;
   border: 1px solid var(--border-subtle) !important;