fix: anchor overdue badge to icon via runtime wrapper (#56)

Root cause: the badge was `position: absolute` relative to the entire
`.nav-item`, which stretches to `flex: 1` on mobile (up to ~75 px wide).
With `right: 4px` the badge sat far from the icon on the bottom bar and
overlapped label text in the expanded desktop sidebar.

Fix: `updateOverdueBadge()` now wraps the nav icon in a
`.nav-item__icon-wrap` span (created once, reused on subsequent calls).
The badge is appended there instead of to the nav item root.

CSS changes:
- Remove `.nav-item .nav-badge` positional override
- Add `.nav-item__icon-wrap { position: relative; display: inline-flex }`
- Add `.nav-item__icon-wrap .nav-badge { position: absolute; top: -4px; right: -4px }`

The badge now consistently overlays the top-right corner of the icon
across all nav layouts (mobile column, collapsed sidebar row, expanded
sidebar row with label).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

public/styles/layout.css

@@ -196,10 +196,16 @@
   position: relative;
 }
 
-.nav-item .nav-badge {
+.nav-item__icon-wrap {
+  position: relative;
+  display: inline-flex;
+  flex-shrink: 0;
+}
+
+.nav-item__icon-wrap .nav-badge {
   position: absolute;
-  top: var(--space-1);
-  right: var(--space-1);
+  top: -4px;
+  right: -4px;
   margin-left: 0;
 }