diff --git a/package-lock.json b/package-lock.json
index be2a30ec..3aef1850 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,10 +13,7 @@
         "@emotion/react": "^11.14.0",
         "@emotion/server": "^11.11.0",
         "@fontsource-variable/inter": "^5.2.8",
-        "@fullcalendar/core": "^6.1.20",
-        "@fullcalendar/interaction": "^6.1.20",
-        "@fullcalendar/react": "^6.1.20",
-        "@fullcalendar/timegrid": "^6.1.20",
+        "@fullcalendar/react": "7.0.0-rc.1",
         "@react-router/node": "^7.14.1",
         "@rjsf/chakra-ui": "^6.4.2",
         "@rjsf/core": "^6.4.2",
@@ -33,8 +30,9 @@
         "react-dom": "^19.2.4",
         "react-icons": "^5.6.0",
         "react-router": "^7.14.1",
-        "rrule": "^2.8.1",
+        "rrule-temporal": "^1.5.2",
         "smol-toml": "^1.6.1",
+        "temporal-polyfill": "^0.3.2",
         "timezones-ical-library": "^2.1.3"
       },
       "devDependencies": {
@@ -1752,54 +1750,38 @@
         "url": "https://github.com/sponsors/ayuhito"
       }
     },
-    "node_modules/@fullcalendar/core": {
-      "version": "6.1.20",
-      "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.20.tgz",
-      "integrity": "sha512-1cukXLlePFiJ8YKXn/4tMKsy0etxYLCkXk8nUCFi11nRONF2Ba2CD5b21/ovtOO2tL6afTJfwmc1ed3HG7eB1g==",
-      "license": "MIT",
-      "dependencies": {
-        "preact": "~10.12.1"
-      }
-    },
-    "node_modules/@fullcalendar/daygrid": {
-      "version": "6.1.20",
-      "resolved": "https://registry.npmjs.org/@fullcalendar/daygrid/-/daygrid-6.1.20.tgz",
-      "integrity": "sha512-AO9vqhkLP77EesmJzuU+IGXgxNulsA8mgQHynclJ8U70vSwAVnbcLG9qftiTAFSlZjiY/NvhE7sflve6cJelyQ==",
+    "node_modules/@full-ui/headless-calendar": {
+      "version": "7.0.0-rc.1",
+      "resolved": "https://registry.npmjs.org/@full-ui/headless-calendar/-/headless-calendar-7.0.0-rc.1.tgz",
+      "integrity": "sha512-JoecyBKMyF0OhpfH2wHAE3eSwTbK183CS+RkaB0KLXA7nS2Tf+obBGVz+kWsil9Ov0x41F7d96S27TnzvaO/UQ==",
       "license": "MIT",
       "peerDependencies": {
-        "@fullcalendar/core": "~6.1.20"
+        "temporal-polyfill": "^0.3.2"
       }
     },
-    "node_modules/@fullcalendar/interaction": {
-      "version": "6.1.20",
-      "resolved": "https://registry.npmjs.org/@fullcalendar/interaction/-/interaction-6.1.20.tgz",
-      "integrity": "sha512-p6txmc5txL0bMiPaJxe2ip6o0T384TyoD2KGdsU6UjZ5yoBlaY+dg7kxfnYKpYMzEJLG58n+URrHr2PgNL2fyA==",
+    "node_modules/@fullcalendar/core": {
+      "version": "7.0.0-rc.1",
+      "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-7.0.0-rc.1.tgz",
+      "integrity": "sha512-ke+z94EGR747DwXd6pgYxQhAQ/xjEEARjj6Nx4e3Y9s6L9PFNcdLNMxQr6QPRcgdQ2ipaWDREnPenH3tcak2qQ==",
       "license": "MIT",
       "peerDependencies": {
-        "@fullcalendar/core": "~6.1.20"
+        "@full-ui/headless-calendar": "7.0.0-rc.1",
+        "temporal-polyfill": "^0.3.2"
       }
     },
     "node_modules/@fullcalendar/react": {
-      "version": "6.1.20",
-      "resolved": "https://registry.npmjs.org/@fullcalendar/react/-/react-6.1.20.tgz",
-      "integrity": "sha512-1w0pZtceaUdfAnxMSCGHCQalhi+mR1jOe76sXzyAXpcPz/Lf0zHSdcGK/U2XpZlnQgQtBZW+d+QBnnzVQKCxAA==",
-      "license": "MIT",
-      "peerDependencies": {
-        "@fullcalendar/core": "~6.1.20",
-        "react": "^16.7.0 || ^17 || ^18 || ^19",
-        "react-dom": "^16.7.0 || ^17 || ^18 || ^19"
-      }
-    },
-    "node_modules/@fullcalendar/timegrid": {
-      "version": "6.1.20",
-      "resolved": "https://registry.npmjs.org/@fullcalendar/timegrid/-/timegrid-6.1.20.tgz",
-      "integrity": "sha512-4H+/MWbz3ntA50lrPif+7TsvMeX3R1GSYjiLULz0+zEJ7/Yfd9pupZmAwUs/PBpA6aAcFmeRr0laWfcz1a9V1A==",
+      "version": "7.0.0-rc.1",
+      "resolved": "https://registry.npmjs.org/@fullcalendar/react/-/react-7.0.0-rc.1.tgz",
+      "integrity": "sha512-/oMniktNyhuyfrVklN4QRKjvfMFR2kAqYeThFVjb8nfdF9EolN23ZkYnV2RU9n56KFg/zPOy2f0pdIDzn0kR3w==",
       "license": "MIT",
       "dependencies": {
-        "@fullcalendar/daygrid": "~6.1.20"
+        "@full-ui/headless-calendar": "7.0.0-rc.1",
+        "@fullcalendar/core": "7.0.0-rc.1"
       },
       "peerDependencies": {
-        "@fullcalendar/core": "~6.1.20"
+        "react": "^16.7.0 || ^17 || ^18 || ^19",
+        "react-dom": "^16.7.0 || ^17 || ^18 || ^19",
+        "temporal-polyfill": "^0.3.2"
       }
     },
     "node_modules/@humanfs/core": {
@@ -1918,6 +1900,18 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@js-temporal/polyfill": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/@js-temporal/polyfill/-/polyfill-0.5.1.tgz",
+      "integrity": "sha512-hloP58zRVCRSpgDxmqCWJNlizAlUgJFqG2ypq79DCvyv9tHjRYMDOcPFjzfl/A1/YxDvRCZz8wvZvmapQnKwFQ==",
+      "license": "ISC",
+      "dependencies": {
+        "jsbi": "^4.3.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@mjackson/node-fetch-server": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/@mjackson/node-fetch-server/-/node-fetch-server-0.2.0.tgz",
@@ -6222,6 +6216,12 @@
       "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
       "license": "MIT"
     },
+    "node_modules/jsbi": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/jsbi/-/jsbi-4.3.2.tgz",
+      "integrity": "sha512-9fqMSQbhJykSeii05nxKl4m6Eqn2P6rOlYiS+C5Dr/HPIU/7yZxu5qzbs40tgaFORiw2Amd0mirjxatXYMkIew==",
+      "license": "Apache-2.0"
+    },
     "node_modules/jsdom": {
       "version": "29.0.2",
       "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-29.0.2.tgz",
@@ -7221,16 +7221,6 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
-    "node_modules/preact": {
-      "version": "10.12.1",
-      "resolved": "https://registry.npmjs.org/preact/-/preact-10.12.1.tgz",
-      "integrity": "sha512-l8386ixSsBdbreOAkqtrwqHwdvR35ID8c3rKPa8lCWuO86dBi32QWHV4vfsZK1utLLFMvw+Z5Ad4XLkZzchscg==",
-      "license": "MIT",
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/preact"
-      }
-    },
     "node_modules/prelude-ls": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
@@ -7613,13 +7603,13 @@
         "fsevents": "~2.3.2"
       }
     },
-    "node_modules/rrule": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/rrule/-/rrule-2.8.1.tgz",
-      "integrity": "sha512-hM3dHSBMeaJ0Ktp7W38BJZ7O1zOgaFEsn41PDk+yHoEtfLV+PoJt9E9xAlZiWgf/iqEqionN0ebHFZIDAp+iGw==",
-      "license": "BSD-3-Clause",
+    "node_modules/rrule-temporal": {
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/rrule-temporal/-/rrule-temporal-1.5.2.tgz",
+      "integrity": "sha512-I5rAiZfRlMh0vuG23HrGBMLZOSiQO7H1Uq8l9qyfA6oTD5j+UMRwpRs4aVU4XdaFhgN1p3K+cHelG8KvLTTm+g==",
+      "license": "MIT",
       "dependencies": {
-        "tslib": "^2.4.0"
+        "@js-temporal/polyfill": "^0.5.1"
       }
     },
     "node_modules/run-parallel": {
@@ -7820,6 +7810,21 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/temporal-polyfill": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/temporal-polyfill/-/temporal-polyfill-0.3.2.tgz",
+      "integrity": "sha512-TzHthD/heRK947GNiSu3Y5gSPpeUDH34+LESnfsq8bqpFhsB79HFBX8+Z834IVX68P3EUyRPZK5bL/1fh437Eg==",
+      "license": "MIT",
+      "dependencies": {
+        "temporal-spec": "0.3.1"
+      }
+    },
+    "node_modules/temporal-spec": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/temporal-spec/-/temporal-spec-0.3.1.tgz",
+      "integrity": "sha512-B4TUhezh9knfSIMwt7RVggApDRJZo73uZdj8AacL2mZ8RP5KtLianh2MXxL06GN9ESYiIsiuoLQhgVfwe55Yhw==",
+      "license": "ISC"
+    },
     "node_modules/through": {
       "version": "2.3.8",
       "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
diff --git a/package.json b/package.json
index c9cd205e..96e62a7e 100644
--- a/package.json
+++ b/package.json
@@ -10,10 +10,7 @@
     "@emotion/react": "^11.14.0",
     "@emotion/server": "^11.11.0",
     "@fontsource-variable/inter": "^5.2.8",
-    "@fullcalendar/core": "^6.1.20",
-    "@fullcalendar/interaction": "^6.1.20",
-    "@fullcalendar/react": "^6.1.20",
-    "@fullcalendar/timegrid": "^6.1.20",
+    "@fullcalendar/react": "7.0.0-rc.1",
     "@react-router/node": "^7.14.1",
     "@rjsf/chakra-ui": "^6.4.2",
     "@rjsf/core": "^6.4.2",
@@ -30,8 +27,9 @@
     "react-dom": "^19.2.4",
     "react-icons": "^5.6.0",
     "react-router": "^7.14.1",
-    "rrule": "^2.8.1",
+    "rrule-temporal": "^1.5.2",
     "smol-toml": "^1.6.1",
+    "temporal-polyfill": "^0.3.2",
     "timezones-ical-library": "^2.1.3"
   },
   "scripts": {
diff --git a/src/components/Calendar.css b/src/components/Calendar.css
deleted file mode 100644
index b69ae34c..00000000
--- a/src/components/Calendar.css
+++ /dev/null
@@ -1,67 +0,0 @@
-.fc .fc-scrollgrid,
-.fc .fc-scrollgrid-section > td,
-.fc .fc-timegrid-axis {
-  border-color: transparent;
-}
-
-.fc .fc-timegrid-slot {
-  border-color: var(--chakra-colors-border-emphasized);
-  border-width: 1.5px;
-  border-left-color: transparent;
-}
-
-.fc td,
-.fc th {
-  border-color: var(--chakra-colors-border-emphasized);
-  border-width: 1.5px;
-}
-
-.fc .fc-scrollgrid-section > th:nth-child(1),
-.fc .fc-col-header-cell:last-child {
-  border-right-color: transparent;
-}
-
-.fc .fc-scrollgrid-section-sticky > * {
-  background: transparent;
-}
-
-.fc .fc-col-header-cell .fc-scrollgrid-sync-inner {
-  background: var(--chakra-colors-bg);
-}
-
-.fc .fc-timegrid-event-harness-inset .fc-timegrid-event {
-  box-shadow: var(--chakra-colors-bg) 0px 0px 0px 1.5px;
-}
-
-.fc .fc-scroller-harness {
-  overflow: visible;
-}
-
-.fc .fc-timegrid-slot-label {
-  border: none;
-}
-
-.fc .fc-timegrid-slot-label-frame {
-  position: relative;
-}
-
-.fc .fc-timegrid-slot-label-cushion {
-  font-size: 0.75rem;
-  line-height: 1.3;
-  opacity: 0.7;
-  position: absolute;
-  top: -1.25rem;
-  right: 0.25rem;
-}
-
-.fc .fc-timegrid-event {
-  border-radius: 0;
-  border-width: 0;
-  padding-left: 0.25rem;
-}
-
-.fc .fc-col-header-cell-cushion {
-  font-size: 0.8rem;
-  letter-spacing: 0.05rem;
-  text-transform: uppercase;
-}
diff --git a/src/components/Calendar.module.css b/src/components/Calendar.module.css
new file mode 100644
index 00000000..6643900a
--- /dev/null
+++ b/src/components/Calendar.module.css
@@ -0,0 +1,116 @@
+:global(:root) {
+  /* primary */
+  --fc-monarch-primary: rgb(65 95 145);
+  --fc-monarch-primary-foreground: rgb(255 255 255);
+  --fc-monarch-primary-over: #526e9c;
+  --fc-monarch-primary-down: #647ea7;
+
+  /* secondary */
+  --fc-monarch-secondary: rgb(214 227 255);
+  --fc-monarch-secondary-foreground: rgb(40 71 119);
+  --fc-monarch-secondary-over: #c9d6f2;
+  --fc-monarch-secondary-down: #bdc9e5;
+
+  /* tertiary */
+  --fc-monarch-tertiary: rgb(133 93 140);
+  --fc-monarch-tertiary-foreground: rgb(255 255 255);
+  --fc-monarch-tertiary-over: #916c97;
+  --fc-monarch-tertiary-down: #9d7ca2;
+
+  /* calendar content */
+  --fc-monarch-event: var(--fc-monarch-primary);
+  --fc-monarch-event-contrast: var(--fc-monarch-primary-foreground);
+  --fc-monarch-highlight: #d6e3ff4d;
+  --fc-monarch-now: rgb(186 26 26);
+
+  /* controls */
+  --fc-monarch-selected: rgb(86 95 113);
+  --fc-monarch-selected-foreground: rgb(255 255 255);
+  --fc-monarch-selected-over: #656e7e;
+  --fc-monarch-selected-down: #757d8c;
+  --fc-monarch-outline: #6687ff;
+
+  /* popover */
+  --fc-monarch-popover: var(--fc-monarch-background);
+
+  /* neutral backgrounds */
+  --fc-monarch-background: var(--chakra-colors-bg);
+  --fc-monarch-faint: var(--chakra-colors-bg-subtle);
+  --fc-monarch-muted: var(--chakra-colors-bg-muted);
+  --fc-monarch-strong: var(--chakra-colors-bg-emphasized);
+  --fc-monarch-stronger: var(--chakra-colors-bg-solid);
+  --fc-monarch-strongest: var(--chakra-colors-bg-focus-ring);
+
+  /* neutral foregrounds */
+  --fc-monarch-foreground: var(--chakra-colors-fg);
+  --fc-monarch-faint-foreground: var(--chakra-colors-fg-subtle);
+  --fc-monarch-muted-foreground: var(--chakra-colors-fg-muted);
+
+  /* neutral borders */
+  --fc-monarch-border: var(--chakra-colors-border-emphasized);
+  --fc-monarch-strong-border: var(--chakra-colors-border-inverted);
+}
+
+@media not print {
+  :global(.dark) {
+    /* primary */
+    --fc-monarch-primary: rgb(170 199 255);
+    --fc-monarch-primary-foreground: rgb(10 48 95);
+    --fc-monarch-primary-over: #b2cdff;
+    --fc-monarch-primary-down: #bbd2ff;
+
+    /* secondary */
+    --fc-monarch-secondary: rgb(40 71 119);
+    --fc-monarch-secondary-foreground: rgb(214 227 255);
+    --fc-monarch-secondary-over: #32507e;
+    --fc-monarch-secondary-down: #3c5885;
+
+    /* tertiary */
+    --fc-monarch-tertiary: rgb(221 188 224);
+    --fc-monarch-tertiary-foreground: rgb(63 40 68);
+    --fc-monarch-tertiary-over: #e0c3e3;
+    --fc-monarch-tertiary-down: #e4c9e6;
+
+    /* calendar content */
+    --fc-monarch-event: var(--fc-monarch-primary);
+    --fc-monarch-event-contrast: var(--fc-monarch-primary-foreground);
+    --fc-monarch-highlight: #2847774d;
+    --fc-monarch-now: rgb(255 180 171);
+
+    /* controls */
+    --fc-monarch-selected: rgb(190 198 220);
+    --fc-monarch-selected-foreground: rgb(40 49 65);
+    --fc-monarch-selected-over: #c4cce0;
+    --fc-monarch-selected-down: #cbd1e3;
+
+    /* popover */
+    --fc-monarch-popover: rgb(17 19 24);
+    --fc-monarch-popover-foreground: rgb(226 226 233);
+  }
+}
+
+/* THIS ONE */
+.fc-slot-header-inner {
+  line-height: 0.1rem;
+  padding-block: 0.2rem;
+  opacity: 0.7;
+  font-size: 0.75rem;
+}
+
+.fc-day-header-inner {
+  font-size: 0.8rem;
+  letter-spacing: 0.05rem;
+}
+
+.fc-event {
+  cursor: pointer;
+}
+
+.fc-event-inner {
+  padding-top: 0.25rem;
+  padding-inline-start: 0.5rem;
+}
+
+.fc-event-inner > * {
+  padding-block: 0rem;
+}
diff --git a/src/components/Calendar.tsx b/src/components/Calendar.tsx
index e19c9183..72ffa416 100644
--- a/src/components/Calendar.tsx
+++ b/src/components/Calendar.tsx
@@ -1,19 +1,24 @@
 import { useContext, useMemo } from "react";
 
-import { Box, Circle, Float, Text } from "@chakra-ui/react";
+import { Circle, Float, Text } from "@chakra-ui/react";
 import { Tooltip } from "./ui/tooltip";
 
-import FullCalendar from "@fullcalendar/react";
-import type { EventContentArg, EventApi } from "@fullcalendar/core";
-import timeGridPlugin from "@fullcalendar/timegrid";
-import interactionPlugin from "@fullcalendar/interaction";
+import FullCalendar, {
+  type EventDisplayInfo,
+  type EventApi,
+} from "@fullcalendar/react";
+import themePlugin from "@fullcalendar/react/themes/monarch";
+import timeGridPlugin from "@fullcalendar/react/timegrid";
+import interactionPlugin from "@fullcalendar/react/interaction";
 
 import type { Activity } from "../lib/activity";
 import { CustomActivity, Timeslot } from "../lib/activity";
 import { Slot } from "../lib/dates";
 import { HydrantContext } from "../lib/hydrant";
 
-import "./Calendar.css";
+import "@fullcalendar/react/skeleton.css";
+import "@fullcalendar/react/themes/monarch/theme.css";
+import styles from "./Calendar.module.css";
 
 // Threshold at which to display a distance warning, in feet (650 meters)
 const DISTANCE_WARNING_THRESHOLD = 2112;
@@ -21,6 +26,9 @@ const DISTANCE_WARNING_THRESHOLD = 2112;
 // Walking speed, in ft/s (~3 mph)
 const WALKING_SPEED = 4.4;
 
+// User's timezone (for converting between Date and Temporal.PlainDateTime)
+const USER_TZ = Temporal.Now.timeZoneId();
+
 /**
  * Calendar showing all the activities, including the buttons on top that
  * change the schedule option selected.
@@ -71,7 +79,14 @@ export function Calendar() {
       if (!beforeEvent.start || !beforeEvent.room) {
         continue;
       }
-      if (thisEvent.start.getTime() != beforeEvent.end.getTime()) {
+      if (
+        Temporal.Instant.compare(
+          thisEvent.start.toTemporalInstant(),
+          Temporal.PlainDateTime.from(beforeEvent.end)
+            .toZonedDateTime(USER_TZ)
+            .toInstant(),
+        ) !== 0
+      ) {
         continue;
       }
 
@@ -100,59 +115,60 @@ export function Calendar() {
     return undefined;
   };
 
-  const renderEvent = ({ event }: EventContentArg) => {
+  const renderEvent = ({
+    event,
+    titleClass,
+    timeClass,
+    isNarrow,
+    isShort,
+  }: EventDisplayInfo) => {
+    const room = event.extendedProps.room as string | undefined;
+    const activity = event.extendedProps.activity as Activity;
+    const distanceWarning = getDistanceWarning(event);
+    const smallText = isNarrow || isShort;
+
     const TitleText = () => (
       <Text
-        fontSize="sm"
+        fontSize={smallText ? "xs" : "sm"}
         fontWeight="medium"
-        overflow="hidden"
-        textOverflow="clip"
-        whiteSpace="nowrap"
+        className={titleClass}
       >
         {event.title}
       </Text>
     );
 
-    const room = event.extendedProps.room as string | undefined;
-    const activity = event.extendedProps.activity as Activity;
-    const distanceWarning = getDistanceWarning(event);
+    const RoomText = () => (
+      <Text fontSize={smallText ? "2xs" : "xs"} className={timeClass}>
+        {room}
+      </Text>
+    );
 
     return (
       <>
-        <Box
-          color={event.textColor}
-          overflow="hidden"
-          p={0.5}
-          lineHeight={1.3}
-          cursor="pointer"
-          height="100%"
-          position="relative"
-        >
-          {!(activity instanceof CustomActivity) ? (
-            <Tooltip
-              content={activity.name}
-              portalled
-              positioning={{ placement: "top" }}
-            >
-              {TitleText()}
-            </Tooltip>
-          ) : (
-            <TitleText />
-          )}
-          {event.extendedProps.roomClarification ? (
-            <Tooltip
-              content={event.extendedProps.roomClarification as string}
-              portalled
-              positioning={{ placement: "top" }}
-            >
-              <Text fontSize="xs">{room}</Text>
-            </Tooltip>
-          ) : (
-            <Text fontSize="xs">{room}</Text>
-          )}
-        </Box>
+        {!(activity instanceof CustomActivity) ? (
+          <Tooltip
+            content={activity.name}
+            portalled
+            positioning={{ placement: "top" }}
+          >
+            {TitleText()}
+          </Tooltip>
+        ) : (
+          <TitleText />
+        )}
+        {event.extendedProps.roomClarification ? (
+          <Tooltip
+            content={event.extendedProps.roomClarification as string}
+            portalled
+            positioning={{ placement: "top" }}
+          >
+            {RoomText()}
+          </Tooltip>
+        ) : (
+          <RoomText />
+        )}
         {distanceWarning ? (
-          <Float placement="top-end">
+          <Float placement="top-end" offsetX={1.5} offsetY={-0.5}>
             <Tooltip
               content={distanceWarning}
               portalled
@@ -163,6 +179,9 @@ export function Calendar() {
                 bg="orange.solid"
                 color="orange.contrast"
                 boxShadow="lg"
+                cursor={"initial"}
+                colorPalette={"orange"}
+                _print={{ boxShadow: "none" }}
               >
                 !
               </Circle>
@@ -175,12 +194,15 @@ export function Calendar() {
 
   return (
     <FullCalendar
-      plugins={[timeGridPlugin, interactionPlugin]}
+      plugins={[themePlugin, timeGridPlugin, interactionPlugin]}
+      borderless={true}
       initialView="timeGridWeek"
       allDaySlot={false}
       dayHeaderFormat={{ weekday: "short" }}
       editable={false}
       events={events}
+      eventClass={styles["fc-event"]}
+      eventInnerClass={styles["fc-event-inner"]}
       eventContent={renderEvent}
       eventClick={(e) => {
         // extendedProps: non-standard props of {@link Event.eventInputs}
@@ -188,23 +210,32 @@ export function Calendar() {
       }}
       headerToolbar={false}
       height="auto"
-      // a date that is, conveniently enough, a monday
-      initialDate="2001-01-01"
-      slotDuration="00:30:00"
-      slotLabelFormat={({ date }) => {
-        const { hour } = date;
+      eventShortHeight={30}
+      initialDate={(() => {
+        const now = Temporal.Now.plainDateISO();
+        return now.subtract({ days: now.dayOfWeek - 1 }).toString();
+      })()}
+      slotDuration={Temporal.Duration.from({ minutes: 30 })}
+      slotHeaderContent={({ time }) => {
+        const milliseconds = time?.milliseconds ?? 0;
+        const hour = Temporal.Duration.from({ milliseconds }).total({
+          unit: "hour",
+        });
         return hour === 12
           ? "noon"
           : hour < 12
             ? `${hour.toString()} AM`
             : `${(hour - 12).toString()} PM`;
       }}
+      slotHeaderInnerClass={styles["fc-slot-header-inner"]}
+      dayHeaderContent={({ text }) => text.toLocaleUpperCase()}
+      dayHeaderInnerClass={styles["fc-day-header-inner"]}
       slotMinTime={
-        events.some((e) => (e.start as Date).getHours() < 8)
-          ? "06:00:00"
-          : "08:00:00"
+        events.some((e) => Temporal.PlainDateTime.from(e.start).hour < 8)
+          ? Temporal.Duration.from({ hours: 6 })
+          : Temporal.Duration.from({ hours: 8 })
       }
-      slotMaxTime="22:00:00"
+      slotMaxTime={Temporal.Duration.from({ hours: 22 })}
       weekends={false}
       selectable={viewedActivity instanceof CustomActivity}
       select={(e) => {
@@ -212,8 +243,18 @@ export function Calendar() {
           state.addTimeslot(
             viewedActivity,
             Timeslot.fromStartEnd(
-              Slot.fromStartDate(e.start),
-              Slot.fromStartDate(e.end),
+              Slot.fromStartDate(
+                e.start
+                  .toTemporalInstant()
+                  .toZonedDateTimeISO(USER_TZ)
+                  .toPlainDateTime(),
+              ),
+              Slot.fromStartDate(
+                e.end
+                  .toTemporalInstant()
+                  .toZonedDateTimeISO(USER_TZ)
+                  .toPlainDateTime(),
+              ),
             ),
           );
         }
diff --git a/src/components/SelectedActivities.tsx b/src/components/SelectedActivities.tsx
index f37cf528..a1b20893 100644
--- a/src/components/SelectedActivities.tsx
+++ b/src/components/SelectedActivities.tsx
@@ -12,12 +12,19 @@ export function ColorButton(
   props: ComponentPropsWithoutRef<"button"> & { color: string },
 ) {
   const { children, color, style, ...otherProps } = props;
+  const contractColor = textColor(color);
   return (
     <Button
       {...otherProps}
       backgroundColor={color}
+      _hover={{
+        backgroundColor: `color-mix(in oklab, ${color} 92%, ${contractColor})`,
+      }}
+      _active={{
+        backgroundColor: `color-mix(in oklab, ${color} 85%, ${contractColor}) !important`,
+      }}
       borderColor={color}
-      color={textColor(color)}
+      color={contractColor}
       style={{
         ...style,
       }}
diff --git a/src/lib/activity.ts b/src/lib/activity.ts
index 6702fd77..b7188c9d 100644
--- a/src/lib/activity.ts
+++ b/src/lib/activity.ts
@@ -1,4 +1,4 @@
-import type { EventInput } from "@fullcalendar/core";
+import type { EventInput } from "@fullcalendar/react";
 import { nanoid } from "nanoid";
 
 import type { ColorScheme } from "./colors";
@@ -9,6 +9,14 @@ import { sum } from "./utils";
 import type { PEClass } from "./pe";
 import type { Class } from "./class";
 
+// TODO: fullcalendar's types aren't updated and require a Date,
+// but it can take a string for now.
+interface AcvitityEventInput extends EventInput {
+  room?: string;
+  start: string;
+  end: string;
+}
+
 /** A period of time, spanning several Slots. */
 export class Timeslot {
   startSlot: Slot;
@@ -30,12 +38,12 @@ export class Timeslot {
   }
 
   /** The start time, on the week of 2001-01-01. */
-  get startTime(): Date {
+  get startTime(): Temporal.PlainDateTime {
     return this.startSlot.startDate;
   }
 
   /** The end time, on the week of 2001-01-01. */
-  get endTime(): Date {
+  get endTime(): Temporal.PlainDateTime {
     return this.endSlot.startDate;
   }
 
@@ -132,19 +140,14 @@ export class Event {
   }
 
   /** List of events that can be directly given to FullCalendar. */
-  get eventInputs(): (EventInput & {
-    start: Date;
-    end: Date;
-    room?: string;
-  })[] {
+  get eventInputs(): AcvitityEventInput[] {
     const color = this.activity.backgroundColor;
     return this.slots.map((slot) => ({
-      textColor: textColor(color),
+      contrastColor: textColor(color),
       title: this.name,
-      start: slot.startTime,
-      end: slot.endTime,
-      backgroundColor: color,
-      borderColor: color,
+      start: slot.startTime.toString(),
+      end: slot.endTime.toString(),
+      color: color,
       room: this.room,
       roomClarification: this.roomClarification,
       activity: this.activity,
@@ -197,7 +200,7 @@ export class CustomActivity implements BaseActivity {
   addTimeslot(slot: Timeslot): void {
     if (
       this.timeslots.find((slot_) => slot_.equals(slot)) ||
-      slot.startTime.getDate() !== slot.endTime.getDate()
+      slot.startTime.day !== slot.endTime.day
     )
       return;
     this.timeslots.push(slot);
diff --git a/src/lib/dates.ts b/src/lib/dates.ts
index 8ca1b753..9fab257f 100644
--- a/src/lib/dates.ts
+++ b/src/lib/dates.ts
@@ -77,11 +77,11 @@ export class Slot {
   }
 
   /** Converts a date, within 6 AM to 11 PM, to a slot. */
-  static fromStartDate(date: Date): Slot {
+  static fromStartDate(date: Temporal.PlainDateTime): Slot {
     return new Slot(
-      TIMESLOTS * (date.getDay() - 1) +
-        2 * (date.getHours() - 6) +
-        Math.floor(date.getMinutes() / 30),
+      TIMESLOTS * (date.dayOfWeek - 1) +
+        2 * (date.hour - 6) +
+        Math.floor(date.minute / 30),
     );
   }
 
@@ -98,29 +98,25 @@ export class Slot {
   }
 
   /**
-   * The (local timezone) date on the day of date that this starts in. Assumes
+   * The datetime on the day of date that this starts in. Assumes
    * that date is the right day of the week.
    */
-  onDate(date: Date): Date {
+  onDate(date: Temporal.PlainDate): Temporal.PlainDateTime {
     const hour = Math.floor((this.slot % TIMESLOTS) / 2) + 6;
     const minute = (this.slot % 2) * 30;
-    return new Date(
-      date.getFullYear(),
-      date.getMonth(),
-      date.getDate(),
-      hour,
-      minute,
-    );
+
+    const time = Temporal.PlainTime.from({ hour, minute });
+    return date.toPlainDateTime(time);
   }
 
-  /** The date in the week of 2001-01-01 that this starts in. */
-  get startDate(): Date {
-    // conveniently enough, 2001-01-01 is a Monday:
-    return this.onDate(new Date(2001, 0, this.weekday));
+  /** The date in the current week that this class starts on. */
+  get startDate(): Temporal.PlainDateTime {
+    const today = Temporal.Now.plainDateISO();
+    return this.onDate(today.add({ days: this.weekday - today.dayOfWeek }));
   }
 
-  /** The date in the week of 2001-01-01 that this ends in. */
-  get endDate(): Date {
+  /** The date in this week that this ends on. */
+  get endDate(): Temporal.PlainDateTime {
     return this.add(1).startDate;
   }
 
@@ -286,17 +282,17 @@ export class Term {
   /** Semester as a character, e.g. "f" */
   public semester: TSemester;
   /** First day of classes, inclusive. */
-  public start: Date;
+  public start: Temporal.PlainDate;
   /** Last day of H1 classes, inclusive. */
-  public h1End?: Date;
+  public h1End?: Temporal.PlainDate;
   /** First day of H2 classes, inclusive. */
-  public h2Start?: Date;
+  public h2Start?: Temporal.PlainDate;
   /** Last day of classes, inclusive. */
-  public end: Date;
+  public end: Temporal.PlainDate;
   /** A Tuesday which runs on Monday schedule, if it exists. */
-  public mondaySchedule?: Date;
+  public mondaySchedule?: Temporal.PlainDate;
   /** A list of dates with no class. */
-  public holidays: Date[];
+  public holidays: Temporal.PlainDate[];
 
   constructor({
     urlName,
@@ -307,22 +303,21 @@ export class Term {
     mondayScheduleDate,
     holidayDates = [],
   }: Partial<TermInfo> & { urlName: string }) {
-    const midnight = (date: string) => new Date(`${date}T00:00:00`);
     const { year, semester } = parseUrlName(urlName);
     this.year = year;
     this.semester = semester;
-    this.start = startDate
-      ? midnight(startDate)
-      : new Date(Number(`20${year}`), 0, 1);
-    this.h1End = h1EndDate ? midnight(h1EndDate) : undefined;
-    this.h2Start = h2StartDate ? midnight(h2StartDate) : undefined;
+    this.start = Temporal.PlainDate.from(startDate ?? `20${year}-01-01`);
+    this.h1End = h1EndDate ? Temporal.PlainDate.from(h1EndDate) : undefined;
+    this.h2Start = h2StartDate
+      ? Temporal.PlainDate.from(h2StartDate)
+      : undefined;
     this.end = endDate
-      ? midnight(endDate)
-      : new Date(Number(`20${year}`), 11, 31);
+      ? Temporal.PlainDate.from(endDate)
+      : Temporal.PlainDate.from(`20${year}-12-31`);
     this.mondaySchedule = mondayScheduleDate
-      ? midnight(mondayScheduleDate)
+      ? Temporal.PlainDate.from(mondayScheduleDate)
       : undefined;
-    this.holidays = holidayDates.map((date) => midnight(date));
+    this.holidays = holidayDates.map((date) => Temporal.PlainDate.from(date));
   }
 
   /** e.g. "2022" */
@@ -360,10 +355,8 @@ export class Term {
     slot: Slot,
     secondHalf = false,
     startDay?: [number, number],
-  ): Date {
-    const date = new Date(
-      (secondHalf && this.h2Start ? this.h2Start : this.start).getTime(),
-    );
+  ): Temporal.PlainDateTime {
+    let date = secondHalf && this.h2Start ? this.h2Start : this.start;
 
     const startDayValid =
       // is defined
@@ -374,25 +367,35 @@ export class Term {
       startDay[1] >= 1 &&
       startDay[1] <= 31 &&
       // before end date
-      new Date(date.getFullYear(), startDay[0] - 1, startDay[1]).getTime() <
-        this.end.getTime();
+      Temporal.PlainDate.compare(
+        Temporal.PlainDate.from({
+          year: date.year,
+          month: startDay[0],
+          day: startDay[1],
+        }),
+        this.end,
+      ) < 0;
 
     if (startDayValid) {
-      date.setMonth(startDay[0] - 1);
-      date.setDate(startDay[1]);
+      date = date.with({
+        month: startDay[0],
+        day: startDay[1],
+      });
     }
 
-    while (date.getDay() !== slot.weekday) {
-      date.setDate(date.getDate() + 1);
+    while (date.dayOfWeek !== slot.weekday) {
+      date = date.add({ days: 1 });
     }
     return slot.onDate(date);
   }
 
   /** The date a slot ends on, plus an extra day. */
-  endDateFor(slot: Slot, firstHalf = false, endDay?: [number, number]): Date {
-    const date = new Date(
-      (firstHalf && this.h1End ? this.h1End : this.end).getTime(),
-    );
+  endDateFor(
+    slot: Slot,
+    firstHalf = false,
+    endDay?: [number, number],
+  ): Temporal.PlainDateTime {
+    let date = firstHalf && this.h1End ? this.h1End : this.end;
 
     const endDayValid =
       // is defined
@@ -403,25 +406,33 @@ export class Term {
       endDay[1] >= 1 &&
       endDay[1] <= 31 &&
       // after start date
-      new Date(date.getFullYear(), endDay[0] - 1, endDay[1]).getTime() >
-        this.start.getTime();
+      Temporal.PlainDate.compare(
+        Temporal.PlainDate.from({
+          year: date.year,
+          month: endDay[0],
+          day: endDay[1],
+        }),
+        this.start,
+      ) > 0;
 
     if (endDayValid) {
-      date.setMonth(endDay[0] - 1);
-      date.setDate(endDay[1]);
+      date = date.with({
+        month: endDay[0],
+        day: endDay[1],
+      });
     }
 
-    while (date.getDay() !== slot.weekday) {
-      date.setDate(date.getDate() - 1);
+    while (date.dayOfWeek !== slot.weekday) {
+      date = date.subtract({ days: 1 });
     }
     // plus an extra day, for inclusivity issues
-    date.setDate(date.getDate() + 1);
+    date = date.add({ days: 1 });
     return slot.onDate(date);
   }
 
   /** Dates that a given slot *doesn't* run on. */
-  exDatesFor(slot: Slot): Date[] {
-    const res = this.holidays.filter((date) => date.getDay() === slot.weekday);
+  exDatesFor(slot: Slot): Temporal.PlainDateTime[] {
+    const res = this.holidays.filter((date) => date.dayOfWeek === slot.weekday);
     const resDates = res.map((date) => slot.onDate(date));
 
     // remove the tuesday for monday schedule
@@ -433,7 +444,7 @@ export class Term {
   }
 
   /** An extra date a given slot would fall on, if it exists. */
-  rDateFor(slot: Slot): Date | undefined {
+  rDateFor(slot: Slot): Temporal.PlainDateTime | undefined {
     return slot.weekday === 1 && this.mondaySchedule
       ? slot.onDate(this.mondaySchedule)
       : undefined;
diff --git a/src/lib/gapi.ts b/src/lib/gapi.ts
index eaacc00b..6746978f 100644
--- a/src/lib/gapi.ts
+++ b/src/lib/gapi.ts
@@ -1,6 +1,6 @@
 import type { ICalEventData } from "ical-generator";
 import { ICalCalendar } from "ical-generator";
-import { RRule, RRuleSet } from "rrule";
+import { RRuleTemporal } from "rrule-temporal";
 import { tzlib_get_ical_block } from "timezones-ical-library";
 
 import type { Activity } from "./activity";
@@ -8,7 +8,7 @@ import type { Term } from "./dates";
 import type { State } from "./state";
 import { Class } from "./class";
 
-/** Timezone string. */
+/** MIT's Timezone string. */
 const TIMEZONE = "America/New_York";
 
 /** Downloads a file with the given text data */
@@ -28,6 +28,7 @@ function download(filename: string, text: string) {
   document.body.removeChild(element);
 }
 
+// TODO: add tests for this...
 function toICalEvents(activity: Activity, term: Term): ICalEventData[] {
   return activity.events.flatMap((event) =>
     event.slots.map((slot) => {
@@ -53,29 +54,21 @@ function toICalEvents(activity: Activity, term: Term): ICalEventData[] {
       const exDates = term.exDatesFor(slot.startSlot);
       const rDate = term.rDateFor(slot.startSlot);
 
-      const rrule = new RRule({
-        freq: RRule.WEEKLY,
-        until: endDate,
+      const rrule = new RRuleTemporal({
+        freq: "WEEKLY",
+        dtstart: startDate.toZonedDateTime(TIMEZONE),
+        until: endDate.toZonedDateTime(TIMEZONE),
+        exDate: exDates.map((date) => date.toZonedDateTime(TIMEZONE)),
+        rDate: rDate ? [rDate.toZonedDateTime(TIMEZONE)] : undefined,
       });
 
-      const rruleSet = new RRuleSet();
-      rruleSet.rrule(rrule);
-
-      for (const exdate of exDates) {
-        rruleSet.exdate(exdate);
-      }
-
-      if (rDate) {
-        rruleSet.rdate(rDate);
-      }
-
       return {
         summary: event.name,
         location: event.room,
         start: startDate,
         end: startDateEnd,
         timezone: TIMEZONE,
-        repeating: rruleSet,
+        repeating: rrule.toString(),
       } satisfies ICalEventData;
     }),
   );
diff --git a/src/lib/pe.ts b/src/lib/pe.ts
index ac3a66ff..ab1b3ca0 100644
--- a/src/lib/pe.ts
+++ b/src/lib/pe.ts
@@ -145,11 +145,11 @@ export class PEClass implements BaseActivity {
   }
 
   get startDate() {
-    return new Date(this.rawClass.startDate);
+    return Temporal.PlainDate.from(this.rawClass.startDate);
   }
 
   get endDate() {
-    return new Date(this.rawClass.endDate);
+    return Temporal.PlainDate.from(this.rawClass.endDate);
   }
 
   /** Fee, in dollars */
@@ -172,13 +172,11 @@ export class PEClass implements BaseActivity {
   }
 
   get start(): [number, number] {
-    const startDate = new Date(this.rawClass.startDate);
-    return [startDate.getMonth() + 1, startDate.getDate()];
+    return [this.startDate.month, this.startDate.day];
   }
 
   get end(): [number, number] {
-    const endDate = new Date(this.rawClass.endDate);
-    return [endDate.getMonth() + 1, endDate.getDate()];
+    return [this.endDate.month, this.endDate.day];
   }
 
   get flags(): PEFlags {
diff --git a/src/lib/schema.ts b/src/lib/schema.ts
index 0cbeb386..f97ff049 100644
--- a/src/lib/schema.ts
+++ b/src/lib/schema.ts
@@ -2,13 +2,19 @@ import type { Activity } from "./activity";
 import type { ColorScheme } from "./colors";
 import type { MeasurementSystem } from "./measurement";
 
+if (!("Temporal" in globalThis)) {
+  await import("temporal-polyfill/global");
+}
+
 export enum ClassType {
   ACADEMIC = "Academic",
   PEW = "PE & Wellness",
 }
 
 /** The date the content of the banner was last changed. */
-export const BANNER_LAST_CHANGED = new Date("2026-03-02T12:00:00Z").valueOf();
+export const BANNER_LAST_CHANGED = Temporal.Instant.from(
+  "2026-03-02T12:00:00Z",
+).epochMilliseconds;
 export const BANNER_MESSAGE =
   "Q4 Physical Education and Wellness classes are now available on Hydrant! Registration opens March 4 on the PE&W website.";
 
diff --git a/src/lib/state.ts b/src/lib/state.ts
index f9e8e049..90a07343 100644
--- a/src/lib/state.ts
+++ b/src/lib/state.ts
@@ -413,7 +413,8 @@ export class State {
 
   set showBanner(show: boolean) {
     this.preferences.showBanner = show;
-    this.preferences.showBannerChanged = new Date().valueOf();
+    this.preferences.showBannerChanged =
+      Temporal.Now.instant().epochMilliseconds;
     this.updateState();
   }
 
diff --git a/src/root.tsx b/src/root.tsx
index 535fb2ef..396afcd8 100644
--- a/src/root.tsx
+++ b/src/root.tsx
@@ -16,6 +16,10 @@ import { Flex, Spinner, Text, Stack, Code } from "@chakra-ui/react";
 
 import "@fontsource-variable/inter/index.css";
 
+if (!("Temporal" in globalThis)) {
+  await import("temporal-polyfill/global");
+}
+
 // eslint-disable-next-line react-refresh/only-export-components
 export const links: Route.LinksFunction = () => [
   {
diff --git a/tests/activity.test.ts b/tests/activity.test.ts
index 3b844da0..80ff15f3 100644
--- a/tests/activity.test.ts
+++ b/tests/activity.test.ts
@@ -8,7 +8,21 @@ import {
   COLOR_SCHEME_DARK_CONTRAST,
 } from "../src/lib/colors";
 
+if (!("Temporal" in globalThis)) {
+  await import("temporal-polyfill/global");
+}
+
 describe("Timeslot", () => {
+  beforeEach(() => {
+    // Set fixed system time to ensure consistency
+    vi.setSystemTime("2001-01-01T12:00:00.000Z"); // January 1st, 2001 at noon
+  });
+
+  afterEach(() => {
+    // Restore the original system time after each test
+    vi.useRealTimers();
+  });
+
   test("Timeslot.fromStartEnd", () => {
     const myStart: Slot = new Slot(2);
     const myEnd: Slot = new Slot(120);
@@ -26,14 +40,30 @@ describe("Timeslot", () => {
   test("Timeslot.startTime", () => {
     const myTimeslot: Timeslot = new Timeslot(22, 43); // note: slot 22 is Monday at 5:00 PM
     expect(myTimeslot.startTime).toStrictEqual(
-      new Date(2001, 0, 1, 17, 0, 0, 0),
+      Temporal.PlainDateTime.from({
+        year: 2001,
+        month: 1,
+        day: 1,
+        hour: 17,
+        minute: 0,
+        second: 0,
+        millisecond: 0,
+      }),
     );
   });
 
   test("Timeslot.endTime", () => {
     const myTimeslot: Timeslot = new Timeslot(79, 52); // note: slot 79 + 52 = 131 is Thursday at 8:30 PM
     expect(myTimeslot.endTime).toStrictEqual(
-      new Date(2001, 0, 4, 20, 30, 0, 0),
+      Temporal.PlainDateTime.from({
+        year: 2001,
+        month: 1,
+        day: 4,
+        hour: 20,
+        minute: 30,
+        second: 0,
+        millisecond: 0,
+      }),
     );
   });
 
@@ -120,44 +150,89 @@ describe("Timeslot", () => {
   });
 });
 
-test("Event.eventInputs", () => {
-  const myCustomActivity: CustomActivity = new CustomActivity(
-    COLOR_SCHEME_LIGHT_CONTRAST,
-  );
-  const myHexCode = "#611917"; // randomly generated hex code
-  const myTitle = "y8g0i81"; // random keysmashes
-  const myRoom = "ahouttoanhontjanota";
-  myCustomActivity.backgroundColor = myHexCode;
-  const myEvent: Event = new Event(
-    myCustomActivity,
-    myTitle,
-    [new Timeslot(6, 7), new Timeslot(57, 10)],
-    myRoom,
-  );
-  expect(myEvent.eventInputs).toStrictEqual([
-    {
-      textColor: "#ffffff",
-      title: myTitle,
-      start: new Date(2001, 0, 1, 9, 0, 0, 0), // slot 6 = Monday at 9 AM
-      end: new Date(2001, 0, 1, 12, 30, 0, 0), // slot 13 = Monday at 12:30 PM
-      backgroundColor: myHexCode,
-      borderColor: myHexCode,
-      room: myRoom,
-      roomClarification: undefined,
-      activity: myCustomActivity,
-    },
-    {
-      textColor: "#ffffff",
-      title: myTitle,
-      start: new Date(2001, 0, 2, 17, 30, 0, 0), // slot 57 = Tuesday at 5:30 PM
-      end: new Date(2001, 0, 2, 22, 30, 0, 0), // slot 67 = Tuesday at 10:30 PM
-      backgroundColor: myHexCode,
-      borderColor: myHexCode,
-      room: myRoom,
-      roomClarification: undefined,
-      activity: myCustomActivity,
-    },
-  ]);
+describe("Event", () => {
+  beforeEach(() => {
+    // Set fixed system time to ensure consistency
+    vi.setSystemTime("2001-01-01T12:00:00.000Z"); // January 1st, 2001 at noon
+  });
+
+  afterEach(() => {
+    // Restore the original system time after each test
+    vi.useRealTimers();
+  });
+
+  describe("Event.eventInputs", () => {
+    test("returns correct event inputs", () => {
+      const myCustomActivity: CustomActivity = new CustomActivity(
+        COLOR_SCHEME_LIGHT_CONTRAST,
+      );
+      const myHexCode = "#611917"; // randomly generated hex code
+      const myTitle = "y8g0i81"; // random keysmashes
+      const myRoom = "ahouttoanhontjanota";
+      myCustomActivity.backgroundColor = myHexCode;
+      const myEvent: Event = new Event(
+        myCustomActivity,
+        myTitle,
+        [new Timeslot(6, 7), new Timeslot(57, 10)],
+        myRoom,
+      );
+
+      expect(myEvent.eventInputs).toStrictEqual([
+        {
+          contrastColor: "#ffffff",
+          title: myTitle,
+          start: Temporal.PlainDateTime.from({
+            year: 2001,
+            month: 1,
+            day: 1,
+            hour: 9,
+            minute: 0,
+            second: 0,
+            millisecond: 0,
+          }).toString(),
+          end: Temporal.PlainDateTime.from({
+            year: 2001,
+            month: 1,
+            day: 1,
+            hour: 12,
+            minute: 30,
+            second: 0,
+            millisecond: 0,
+          }).toString(),
+          color: myHexCode,
+          room: myRoom,
+          roomClarification: undefined,
+          activity: myCustomActivity,
+        },
+        {
+          contrastColor: "#ffffff",
+          title: myTitle,
+          start: Temporal.PlainDateTime.from({
+            year: 2001,
+            month: 1,
+            day: 2,
+            hour: 17,
+            minute: 30,
+            second: 0,
+            millisecond: 0,
+          }).toString(),
+          end: Temporal.PlainDateTime.from({
+            year: 2001,
+            month: 1,
+            day: 2,
+            hour: 22,
+            minute: 30,
+            second: 0,
+            millisecond: 0,
+          }).toString(),
+          color: myHexCode,
+          room: myRoom,
+          roomClarification: undefined,
+          activity: myCustomActivity,
+        },
+      ]);
+    });
+  });
 });
 
 describe("CustomActivity", () => {
diff --git a/tests/dates.test.ts b/tests/dates.test.ts
index 1d8c67d6..4c39beae 100644
--- a/tests/dates.test.ts
+++ b/tests/dates.test.ts
@@ -9,6 +9,10 @@ import {
 } from "../src/lib/dates";
 import { JSDOM } from "jsdom";
 
+if (!("Temporal" in globalThis)) {
+  await import("temporal-polyfill/global");
+}
+
 test("parseUrlName", () => {
   expect(parseUrlName("f22")).toStrictEqual({
     year: "22",
@@ -94,12 +98,24 @@ describe("Term", () => {
       });
       expect(myTerm.year).toBe("42");
       expect(myTerm.semester).toBe("f");
-      expect(myTerm.start).toStrictEqual(new Date(2042, 3, 20, 0));
-      expect(myTerm.h1End).toStrictEqual(new Date(2042, 3, 21, 0));
-      expect(myTerm.h2Start).toStrictEqual(new Date(2042, 3, 22, 0));
-      expect(myTerm.mondaySchedule).toStrictEqual(new Date(2042, 3, 23, 0));
-      expect(myTerm.holidays).toStrictEqual([new Date(2042, 3, 24, 0)]);
-      expect(myTerm.end).toStrictEqual(new Date(2042, 3, 25, 0));
+      expect(myTerm.start).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 20 }),
+      );
+      expect(myTerm.h1End).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 21 }),
+      );
+      expect(myTerm.h2Start).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 22 }),
+      );
+      expect(myTerm.mondaySchedule).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 23 }),
+      );
+      expect(myTerm.holidays).toStrictEqual([
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 24 }),
+      ]);
+      expect(myTerm.end).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 25 }),
+      );
     });
 
     test("no half", () => {
@@ -112,12 +128,20 @@ describe("Term", () => {
       });
       expect(myTerm.year).toBe("42");
       expect(myTerm.semester).toBe("f");
-      expect(myTerm.start).toStrictEqual(new Date(2042, 3, 20, 0));
+      expect(myTerm.start).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 20 }),
+      );
       expect(myTerm.h1End).toBeUndefined();
       expect(myTerm.h2Start).toBeUndefined();
-      expect(myTerm.mondaySchedule).toStrictEqual(new Date(2042, 3, 23, 0));
-      expect(myTerm.holidays).toStrictEqual([new Date(2042, 3, 24, 0)]);
-      expect(myTerm.end).toStrictEqual(new Date(2042, 3, 25, 0));
+      expect(myTerm.mondaySchedule).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 23 }),
+      );
+      expect(myTerm.holidays).toStrictEqual([
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 24 }),
+      ]);
+      expect(myTerm.end).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 4, day: 25 }),
+      );
     });
 
     test("no optional dates", () => {
@@ -126,12 +150,16 @@ describe("Term", () => {
       });
       expect(myTerm.year).toBe("42");
       expect(myTerm.semester).toBe("f");
-      expect(myTerm.start).toStrictEqual(new Date(2042, 0, 1, 0));
+      expect(myTerm.start).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 1, day: 1 }),
+      );
       expect(myTerm.h1End).toBeUndefined();
       expect(myTerm.h2Start).toBeUndefined();
       expect(myTerm.mondaySchedule).toBeUndefined();
       expect(myTerm.holidays).toStrictEqual([]);
-      expect(myTerm.end).toStrictEqual(new Date(2042, 11, 31, 0));
+      expect(myTerm.end).toStrictEqual(
+        Temporal.PlainDate.from({ year: 2042, month: 12, day: 31 }),
+      );
     });
   });
 
@@ -187,7 +215,15 @@ describe("Term", () => {
           false,
           undefined,
         ),
-      ).toStrictEqual(new Date(2044, 9, 19, 6, 30));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 10,
+          day: 19,
+          hour: 6,
+          minute: 30,
+        }),
+      );
     });
 
     test("secondHalf false, startDay undefined, slot.weekday doesn't match", () => {
@@ -198,7 +234,13 @@ describe("Term", () => {
           undefined,
         ),
       ).toStrictEqual(
-        new Date(2044, 9, 25, 19, 30), // bump to next Tuesday, October 25, 2044
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 10,
+          day: 25,
+          hour: 19,
+          minute: 30,
+        }),
       );
     });
 
@@ -209,7 +251,15 @@ describe("Term", () => {
           false,
           [11, 4], // this would mean Friday, November 4, 2044
         ),
-      ).toStrictEqual(new Date(2044, 10, 4, 22));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 4,
+          hour: 22,
+          minute: 0,
+        }),
+      );
     });
 
     test("secondHalf false, startDay defined, slot.weekday doesn't match", () => {
@@ -220,7 +270,13 @@ describe("Term", () => {
           [11, 4],
         ),
       ).toStrictEqual(
-        new Date(2044, 10, 7, 20), // bumps to next Monday, November 7, 2044
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 7,
+          hour: 20,
+          minute: 0,
+        }),
       );
     });
 
@@ -231,7 +287,15 @@ describe("Term", () => {
           true,
           undefined,
         ),
-      ).toStrictEqual(new Date(2044, 10, 21, 6, 30));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 21,
+          hour: 6,
+          minute: 30,
+        }),
+      );
     });
 
     test("secondHalf true, startDay undefined, slot.weekday doesn't match", () => {
@@ -242,7 +306,13 @@ describe("Term", () => {
           undefined,
         ),
       ).toStrictEqual(
-        new Date(2044, 10, 22, 6, 30), // bump to next day
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 22,
+          hour: 6,
+          minute: 30,
+        }), // bump to next day
       );
     });
 
@@ -253,7 +323,15 @@ describe("Term", () => {
           true,
           [11, 14], // Monday, November 14, 2044
         ),
-      ).toStrictEqual(new Date(2044, 10, 14, 6, 30));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 14,
+          hour: 6,
+          minute: 30,
+        }),
+      );
     });
 
     test("secondHalf true, startDay defined, slot.weekday doesn't match", () => {
@@ -264,7 +342,13 @@ describe("Term", () => {
           [11, 14],
         ),
       ).toStrictEqual(
-        new Date(2044, 10, 15, 6, 30), // bump to next day
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 15,
+          hour: 6,
+          minute: 30,
+        }), // bump to next day
       );
     });
   });
@@ -285,52 +369,114 @@ describe("Term", () => {
     test("firstHalf false, endDay undefined, slot.weekday matches", () => {
       expect(
         myTerm.endDateFor(new Slot(1), false, undefined), // NOTE: slot 1 = Monday at 6:30 AM
-      ).toStrictEqual(new Date(2044, 10, 22, 6, 30, 0, 0));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 22,
+          hour: 6,
+          minute: 30,
+        }),
+      );
     });
 
     test("firstHalf false, endDay undefined, slot.weekday doesn't match", () => {
       expect(
         myTerm.endDateFor(new Slot(68), false, undefined), // NOTE: slot 68 = Wednesday at 6:00 AM
       ).toStrictEqual(
-        new Date(2044, 10, 17, 6, 0, 0, 0), // NOTE: 2044-11-17 is a Thursday
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 11,
+          day: 17,
+          hour: 6,
+          minute: 0,
+        }),
       );
     });
 
     test("firstHalf true, endDay undefined, slot.weekday matches", () => {
       expect(
         myTerm.endDateFor(new Slot(94), true, undefined), // NOTE: slot 94 = Wednesday at 7:00 PM
-      ).toStrictEqual(new Date(2044, 9, 20, 19, 0, 0, 0));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 10,
+          day: 20,
+          hour: 19,
+          minute: 0,
+        }),
+      );
     });
 
     test("firstHalf true, endDay undefined, slot.weekday doesn't match", () => {
       expect(
         myTerm.endDateFor(new Slot(4), true, undefined), // NOTE: slot 4 = Monday at 8:00 PM
       ).toStrictEqual(
-        new Date(2044, 9, 18, 8, 0, 0, 0), // NOTE: 2044-10-18 is a Tuesday
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 10,
+          day: 18,
+          hour: 8,
+          minute: 0,
+        }), // NOTE: 2044-10-18 is a Tuesday
       );
     });
 
     test("firstHalf false, endDay defined, slot.weekday matches", () => {
       expect(
         myTerm.endDateFor(new Slot(0), false, [9, 5]), // NOTE: 2044-09-05 is a Monday
-      ).toStrictEqual(new Date(2044, 8, 6, 6, 0, 0, 0));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 9,
+          day: 6,
+          hour: 6,
+          minute: 0,
+        }),
+      );
     });
 
     test("firstHalf true, endDay defined, slot.weekday matches", () => {
       expect(myTerm.endDateFor(new Slot(0), true, [9, 5])).toStrictEqual(
-        new Date(2044, 8, 6, 6, 0, 0, 0),
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 9,
+          day: 6,
+          hour: 6,
+          minute: 0,
+          second: 0,
+          millisecond: 0,
+        }),
       );
     });
 
     test("firstHalf false, endDay defined, slot.weekday doesn't match", () => {
       expect(
         myTerm.endDateFor(new Slot(69), false, [9, 5]), // NOTE: slot 69 = Wednesday at 6:30 AM
-      ).toStrictEqual(new Date(2044, 8, 1, 6, 30, 0, 0));
+      ).toStrictEqual(
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 9,
+          day: 1,
+          hour: 6,
+          minute: 30,
+          second: 0,
+          millisecond: 0,
+        }),
+      );
     });
 
     test("firstHalf true, endDay defined, slot.weekday doesn't match", () => {
       expect(myTerm.endDateFor(new Slot(69), true, [9, 5])).toStrictEqual(
-        new Date(2044, 8, 1, 6, 30, 0, 0),
+        Temporal.PlainDateTime.from({
+          year: 2044,
+          month: 9,
+          day: 1,
+          hour: 6,
+          minute: 30,
+          second: 0,
+          millisecond: 0,
+        }),
       );
     });
   });
@@ -350,8 +496,20 @@ describe("Term", () => {
       expect(
         myTerm.exDatesFor(new Slot(40)), // NOTE: slot 40 = Tuesday at 9:00 AM
       ).toStrictEqual([
-        new Date(2079, 7, 8, 9, 0, 0, 0),
-        new Date(2079, 7, 11, 9, 0, 0, 0),
+        Temporal.PlainDateTime.from({
+          year: 2079,
+          month: 8,
+          day: 8,
+          hour: 9,
+          minute: 0,
+        }),
+        Temporal.PlainDateTime.from({
+          year: 2079,
+          month: 8,
+          day: 11,
+          hour: 9,
+          minute: 0,
+        }),
       ]);
     });
 
@@ -363,7 +521,15 @@ describe("Term", () => {
       });
       expect(
         myTerm.exDatesFor(new Slot(100)), // NOTE: slot 100 = Wednesday at 10:00 PM
-      ).toStrictEqual([new Date(2079, 7, 9, 22, 0, 0, 0)]);
+      ).toStrictEqual([
+        Temporal.PlainDateTime.from({
+          year: 2079,
+          month: 8,
+          day: 9,
+          hour: 22,
+          minute: 0,
+        }),
+      ]);
     });
 
     test("has non-matching holiday, tuesday on monday schedule", () => {
@@ -374,7 +540,15 @@ describe("Term", () => {
       });
       expect(
         myTerm.exDatesFor(new Slot(41)), // NOTE: slot 41 = Tuesday at 9:30 AM
-      ).toStrictEqual([new Date(2079, 7, 11, 9, 30, 0, 0)]);
+      ).toStrictEqual([
+        Temporal.PlainDateTime.from({
+          year: 2079,
+          month: 8,
+          day: 11,
+          hour: 9,
+          minute: 30,
+        }),
+      ]);
     });
 
     test("has non-matching holiday, not monday schedule", () => {
@@ -395,9 +569,15 @@ describe("Term", () => {
       });
       expect(
         myTerm.exDatesFor(new Slot(34)), // NOTE: slot 34 = Tuesday at 6:00 AM
-      ).toStrictEqual(
-        [new Date(2079, 0, 1, 6, 0, 0, 0)], // NOTE: in some timezones this shifts to 2000-01-01 so we hardcode "America/New_York" for reproducibility
-      );
+      ).toStrictEqual([
+        Temporal.PlainDateTime.from({
+          year: 2079,
+          month: 1,
+          day: 1,
+          hour: 6,
+          minute: 0,
+        }),
+      ]);
     });
 
     test("no holidays, not monday schedule", () => {
@@ -421,7 +601,13 @@ describe("Term", () => {
         mondayScheduleDate: "2056-04-24",
       });
       expect(myTerm.rDateFor(new Slot(0))).toStrictEqual(
-        new Date(2056, 3, 24, 6, 0, 0, 0),
+        Temporal.PlainDateTime.from({
+          year: 2056,
+          month: 4,
+          day: 24,
+          hour: 6,
+          minute: 0,
+        }),
       );
     });
 
@@ -449,13 +635,32 @@ describe("Slot", () => {
   /**
    * Test each method separately (most of them don't need to be partitioned)
    */
+
+  beforeEach(() => {
+    // Set fixed system time to ensure consistency
+    vi.setSystemTime("2001-01-01T12:00:00.000Z"); // January 1st, 2001 at noon
+  });
+
+  afterEach(() => {
+    // Restore the original system time after each test
+    vi.useRealTimers();
+  });
+
   test("Slot.fromSlotNumber", () => {
     const mySlot: Slot = Slot.fromSlotNumber(42);
     expect(mySlot.slot).toBe(42);
   });
 
   test("Slot.fromStartDate", () => {
-    const myDate: Date = new Date(2001, 6, 19, 22, 1, 52, 23); // randomly chosen date
+    const myDate = Temporal.PlainDateTime.from({
+      year: 2001,
+      month: 7,
+      day: 19,
+      hour: 22,
+      minute: 1,
+      second: 52,
+      millisecond: 23,
+    }); // randomly chosen date
     const mySlot: Slot = Slot.fromStartDate(myDate);
     expect(mySlot.slot).toBe(134); // note: this was a Thursday (July 19, 2001), slot number 32
   });
@@ -473,18 +678,46 @@ describe("Slot", () => {
 
   test("Slot.onDate", () => {
     const mySlot: Slot = new Slot(125); // Thursday, 5:30 PM
-    const myDate: Date = new Date(2068, 8, 6); // this is also a Thursday
-    expect(mySlot.onDate(myDate)).toStrictEqual(new Date(2068, 8, 6, 17, 30));
+    const myDate = Temporal.PlainDate.from({
+      year: 2068,
+      month: 9,
+      day: 6,
+    }); // this is also a Thursday
+    expect(mySlot.onDate(myDate)).toStrictEqual(
+      Temporal.PlainDateTime.from({
+        year: 2068,
+        month: 9,
+        day: 6,
+        hour: 17,
+        minute: 30,
+      }),
+    );
   });
 
   test("Slot.startDate", () => {
     const mySlot: Slot = new Slot(62); // Tuesday, 8:00 PM
-    expect(mySlot.startDate).toStrictEqual(new Date(2001, 0, 2, 20, 0));
+    expect(mySlot.startDate).toStrictEqual(
+      Temporal.PlainDateTime.from({
+        year: 2001,
+        month: 1,
+        day: 2,
+        hour: 20,
+        minute: 0,
+      }),
+    );
   });
 
   test("Slot.endDate", () => {
     const mySlot: Slot = new Slot(130); // Thursday, 8:00 PM
-    expect(mySlot.endDate).toStrictEqual(new Date(2001, 0, 4, 20, 30));
+    expect(mySlot.endDate).toStrictEqual(
+      Temporal.PlainDateTime.from({
+        year: 2001,
+        month: 1,
+        day: 4,
+        hour: 20,
+        minute: 30,
+      }),
+    );
   });
 
   test("Slot.weekday", () => {