fix: restore status dropdown click + color picker per status value

The positionDropdown callback ref ran during React's commit phase
before anchorRef was assigned (children refs commit before parents),
so the dropdown was never positioned and the invisible backdrop
stole all subsequent clicks. Switch to useLayoutEffect which runs
after all refs are set.

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

src/components/StatusDropdown.tsx

@@ -1,4 +1,4 @@
-import { useState, useRef, useEffect, useCallback, useMemo } from 'react'
+import { useState, useRef, useEffect, useLayoutEffect, useCallback, useMemo } from 'react'
 import { createPortal } from 'react-dom'
 import { getStatusStyle, SUGGESTED_STATUSES, setStatusColor, getStatusColorKey } from '../utils/statusStyles'
 import { ACCENT_COLORS } from '../utils/typeColors'
@@ -229,8 +229,10 @@ export function StatusDropdown({
   const inputRef = useRef<HTMLInputElement>(null)
   const listRef = useRef<HTMLDivElement>(null)
   const anchorRef = useRef<HTMLDivElement>(null)
+  const dropdownRef = useRef<HTMLDivElement>(null)
 
-  const positionDropdown = useCallback((node: HTMLDivElement | null) => {
+  useLayoutEffect(() => {
+    const node = dropdownRef.current
     if (!node) return
     const anchor = anchorRef.current?.parentElement
     if (!anchor) return
@@ -288,7 +290,7 @@ export function StatusDropdown({
         <>
           <div className="fixed inset-0 z-[12000]" onClick={onCancel} data-testid="status-dropdown-backdrop" />
           <div
-            ref={positionDropdown}
+            ref={dropdownRef}
             className="fixed z-[12001] w-52 overflow-hidden rounded-lg border border-border bg-background shadow-lg"
             data-testid="status-dropdown-popover"
           >