feat(ui): weekend/vacation/checkbox colors follow accent theme

- Unify Saturday+Sunday into single isWeekend flag (header + grid lines)
- Replace hardcoded amber vacation bar/tooltip colors with brand-* classes
- Add global accent-color for checkboxes and radio buttons via CSS variable
- Update VACATION_TIMELINE_COLORS/BORDER to use brand palette (SICK stays red)
- Vacation-only tooltip uses neutral dark surface with brand accent border

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

apps/web/src/hooks/useTimelineLayout.tsx

@@ -37,16 +37,15 @@ export function useTimelineLayout(
   // Grid lines — memoized; identical for every row
   const gridLines = useMemo(() => dates.map((date, i) => {
     const isToday = date.toDateString() === today.toDateString();
-    const isSaturday = date.getDay() === 6;
-    const isSunday = date.getDay() === 0;
+    const dow = date.getDay();
+    const isWeekend = dow === 0 || dow === 6;
     return (
       <div
         key={i}
         className={clsx(
           "absolute top-0 bottom-0 border-r",
           isToday ? "border-brand-300 dark:border-brand-700 border-r-2" :
-          isSaturday ? "border-amber-200 dark:border-amber-800 bg-amber-50/40 dark:bg-amber-950/20" :
-          isSunday ? "border-gray-200 dark:border-gray-700 bg-gray-100/60 dark:bg-gray-800/40" :
+          isWeekend ? "border-brand-200 dark:border-brand-800 bg-brand-50/40 dark:bg-brand-950/20" :
           "border-gray-100 dark:border-gray-800",
         )}
         style={{ left: i * CELL_WIDTH, width: CELL_WIDTH }}