apps/pwa/src/components/CalendarShell.tsx

@@ -116,6 +116,15 @@ export function CalendarShell() {
 
   const defaultView = resolveDefaultView(selectedView)
 
+  // Display events in the VIEWER's local timezone. Schedule-X defaults to 'UTC', which made
+  // a 17:45-04:00 event render at 21:45 (9:45 PM). Events arrive as zoned ISO strings in their
+  // own IANA zones (Toronto/Detroit/New_York/Edmonton); Schedule-X converts them to this one
+  // display zone, so the family sees every event in their own wall-clock time.
+  // IANATimezone (the config's timezone type) is declared but not exported by @schedule-x/calendar,
+  // so derive it from useCalendarApp's config parameter rather than importing it.
+  type SxTimeZone = NonNullable<Parameters<typeof useCalendarApp>[0]['timezone']>
+  const displayTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone as SxTimeZone
+
   // useCalendarApp — config is stable; plugins passed as second argument
   const calendar = useCalendarApp(
     {
@@ -126,6 +135,7 @@ export function CalendarShell() {
         createViewMonthAgenda(),
       ],
       defaultView,
+      timezone: displayTimeZone,
       firstDayOfWeek: SX_FIRST_DAY_OF_WEEK as 7,
       calendars: calendarsConfig,
       callbacks: {