feat: add SegmentedTabs, custom DateTimePicker, redesign time range selector

New components:
- SegmentedTabs — pill-style tabs with sliding animated indicator,
  trailing slot for custom content, MutationObserver for dynamic resizing
- Custom DateTimePicker — replaces native datetime-local with calendar
  grid, hour/minute inputs, Now/Apply buttons, portal dropdown

Time range selector redesign:
- Uses SegmentedTabs with inline from/to DateTimePicker triggers
- "now" shown as clickable placeholder when to-date is not explicitly set
- Preset selection keeps to-date as "now" until user sets it
- No more "Custom" button — last tab is the live date range

Other improvements:
- FilterPill gains activeColor prop for status-colored active states
- TopBar and EventFeed status pills now use colored dots + activeColor
- Inventory nav expanded to full component-level table of contents
- COMPONENT_GUIDE.md updated with new components
- DateRangePicker test updated for custom DateTimePicker

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/pages/Inventory/Inventory.module.css

@@ -81,6 +81,21 @@
   color: var(--text-primary);
 }
 
+.navSubLink {
+  display: block;
+  font-size: 12px;
+  color: var(--text-muted);
+  text-decoration: none;
+  padding: 2px 8px 2px 20px;
+  border-radius: var(--radius-sm);
+  line-height: 1.5;
+}
+
+.navSubLink:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
+
 .content {
   flex: 1;
   min-width: 0;