feat: bag tracking with weight distribution, packing UX overhaul — closes #13

- Bag tracking: optional admin setting under Packing addon, weight per item,
  bag assignment with inline creation, iOS-style weight sidebar + mobile modal
- Admin: merged Categories + Packing Templates into "Configuration" tab
- Packing UI: category-first workflow, mobile-friendly action buttons,
  stable category ordering, responsive button labels

client/src/components/Admin/AddonManager.tsx

@@ -27,7 +27,7 @@ function AddonIcon({ name, size = 20 }: AddonIconProps) {
   return <Icon size={size} />
 }
 
-export default function AddonManager() {
+export default function AddonManager({ bagTrackingEnabled, onToggleBagTracking }: { bagTrackingEnabled?: boolean; onToggleBagTracking?: () => void }) {
   const { t } = useTranslation()
   const dm = useSettingsStore(s => s.settings.dark_mode)
   const dark = dm === true || dm === 'dark' || (dm === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches)
@@ -104,7 +104,28 @@ export default function AddonManager() {
                   </span>
                 </div>
                 {tripAddons.map(addon => (
-                  <AddonRow key={addon.id} addon={addon} onToggle={handleToggle} t={t} />
+                  <div key={addon.id}>
+                    <AddonRow addon={addon} onToggle={handleToggle} t={t} />
+                    {addon.id === 'packing' && addon.enabled && onToggleBagTracking && (
+                      <div className="flex items-center gap-4 px-6 py-3 border-b" style={{ borderColor: 'var(--border-secondary)', background: 'var(--bg-secondary)', paddingLeft: 70 }}>
+                        <div style={{ flex: 1, minWidth: 0 }}>
+                          <div className="text-sm font-medium" style={{ color: 'var(--text-secondary)' }}>{t('admin.bagTracking.title')}</div>
+                          <div className="text-xs mt-0.5" style={{ color: 'var(--text-faint)' }}>{t('admin.bagTracking.subtitle')}</div>
+                        </div>
+                        <div className="flex items-center gap-2 shrink-0">
+                          <span className="hidden sm:inline text-xs font-medium" style={{ color: bagTrackingEnabled ? 'var(--text-primary)' : 'var(--text-faint)' }}>
+                            {bagTrackingEnabled ? t('admin.addons.enabled') : t('admin.addons.disabled')}
+                          </span>
+                          <button onClick={onToggleBagTracking}
+                            className="relative inline-flex h-6 w-11 items-center rounded-full transition-colors"
+                            style={{ background: bagTrackingEnabled ? 'var(--text-primary)' : 'var(--border-primary)' }}>
+                            <span className="absolute left-0.5 h-5 w-5 rounded-full bg-white transition-transform duration-200"
+                              style={{ transform: bagTrackingEnabled ? 'translateX(20px)' : 'translateX(0)' }} />
+                          </button>
+                        </div>
+                      </div>
+                    )}
+                  </div>
                 ))}
               </div>
             )}
@@ -179,7 +200,7 @@ function AddonRow({ addon, onToggle, t }: AddonRowProps) {
 
       {/* Toggle */}
       <div className="flex items-center gap-2 shrink-0">
-        <span className="text-xs font-medium" style={{ color: (addon.enabled && !isComingSoon) ? 'var(--text-primary)' : 'var(--text-faint)' }}>
+        <span className="hidden sm:inline text-xs font-medium" style={{ color: (addon.enabled && !isComingSoon) ? 'var(--text-primary)' : 'var(--text-faint)' }}>
           {isComingSoon ? t('admin.addons.disabled') : addon.enabled ? t('admin.addons.enabled') : t('admin.addons.disabled')}
         </span>
         <button

client/src/components/Admin/CategoryManager.tsx

@@ -198,7 +198,6 @@ export default function CategoryManager() {
           className="flex items-center gap-2 bg-slate-900 text-white px-3 sm:px-4 py-2 rounded-lg hover:bg-slate-700 text-sm font-medium">
           <Plus className="w-4 h-4" />
           <span className="hidden sm:inline">{t('categories.new')}</span>
-          <span className="sm:hidden">Add</span>
         </button>
       </div>
 

client/src/components/Admin/PackingTemplateManager.tsx

@@ -159,7 +159,7 @@ export default function PackingTemplateManager() {
         </div>
         <button onClick={() => setShowCreate(true)}
           className="flex items-center gap-1.5 px-3 py-1.5 text-sm bg-slate-900 text-white rounded-lg hover:bg-slate-700 transition-colors">
-          <Plus className="w-4 h-4" /> {t('admin.packingTemplates.create')}
+          <Plus className="w-4 h-4" /> <span className="hidden sm:inline">{t('admin.packingTemplates.create')}</span>
         </button>
       </div>