feat: project colors, timeline filters, sidebar fix, GitLooper agent, and misc improvements

- Fix sidebar double-highlight on /vacations/my (Gitea #6): add isNavItemActive() helper
- Add project color picker (schema + API + modal + timeline rendering)
- Add ProjectCombobox/ResourceCombobox to timeline toolbar
- Show PENDING vacations on timeline with dashed/dimmed style
- Add "show demand projects" preference with localStorage persistence
- Add ProjectAssignmentsTable with total hours/cost columns
- Extend vacation API to accept status arrays
- Add GitLooper formal YAML agent configuration
- Extend user admin with permission overrides UI
- Add delete-assignment use case tests
- Add status-styles.ts shared badge constants
- Centralize formatMoney/formatCents in format.ts

Co-Authored-By: claude-flow <ruv@ruv.net>

apps/web/src/components/layout/PreferencesModal.tsx

@@ -20,7 +20,7 @@ const ACCENT_OPTIONS: { value: AccentColor; label: string; swatch: string }[] =
 
 export function PreferencesModal({ onClose }: PreferencesModalProps) {
   const { prefs, setMode, setAccent } = useTheme();
-  const { prefs: appPrefs, setHideCompletedProjects, setTimelineDisplayMode, setHeatmapColorScheme } = useAppPreferences();
+  const { prefs: appPrefs, setHideCompletedProjects, setTimelineDisplayMode, setHeatmapColorScheme, setShowDemandProjects } = useAppPreferences();
 
   return (
     <div
@@ -245,6 +245,33 @@ export function PreferencesModal({ onClose }: PreferencesModalProps) {
                 </span>
               </div>
             </label>
+
+            <label className="flex items-start gap-3 cursor-pointer mt-3">
+              <div className="relative mt-0.5 flex-shrink-0">
+                <input
+                  type="checkbox"
+                  checked={appPrefs.showDemandProjects}
+                  onChange={(e) => setShowDemandProjects(e.target.checked)}
+                  className="sr-only peer"
+                />
+                <div className={clsx(
+                  "w-9 h-5 rounded-full transition-colors",
+                  appPrefs.showDemandProjects ? "bg-brand-600" : "bg-gray-200 dark:bg-gray-700",
+                )} />
+                <div className={clsx(
+                  "absolute top-0.5 left-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform",
+                  appPrefs.showDemandProjects ? "translate-x-4" : "translate-x-0",
+                )} />
+              </div>
+              <div>
+                <span className="text-sm text-gray-800 dark:text-gray-200 font-medium leading-tight block">
+                  Include demand projects on load
+                </span>
+                <span className="text-xs text-gray-400 dark:text-gray-500">
+                  Show open staffing demands (dashed bars) when loading pages.
+                </span>
+              </div>
+            </label>
           </div>
 
           {/* Preview note */}