feat: enhance CI workflow and update webapp styles

- Added Node.js setup and webapp testing steps to the CI workflow for improved integration.
- Updated HTML to link multiple CSS files for better modularity and organization of styles.
- Removed deprecated `style.css` and introduced new CSS files for base styles, calendar, day detail, hints, markers, states, and duty list to enhance maintainability and readability.
- Implemented new styles for improved presentation of duty information and user interactions.
- Added unit tests for new API functions and contact link rendering to ensure functionality and reliability.

webapp/js/dom.js

@@ -1,39 +1,62 @@
 /**
  * DOM references and shared application state.
+ * Element refs are resolved lazily via getters so modules can be imported before DOM is ready.
  */
 
-/** @type {HTMLDivElement|null} */
-export const calendarEl = document.getElementById("calendar");
+/** @returns {HTMLDivElement|null} */
+export function getCalendarEl() {
+  return document.getElementById("calendar");
+}
 
-/** @type {HTMLElement|null} */
-export const monthTitleEl = document.getElementById("monthTitle");
+/** @returns {HTMLElement|null} */
+export function getMonthTitleEl() {
+  return document.getElementById("monthTitle");
+}
 
-/** @type {HTMLDivElement|null} */
-export const dutyListEl = document.getElementById("dutyList");
+/** @returns {HTMLDivElement|null} */
+export function getDutyListEl() {
+  return document.getElementById("dutyList");
+}
 
-/** @type {HTMLElement|null} */
-export const loadingEl = document.getElementById("loading");
+/** @returns {HTMLElement|null} */
+export function getLoadingEl() {
+  return document.getElementById("loading");
+}
 
-/** @type {HTMLElement|null} */
-export const errorEl = document.getElementById("error");
+/** @returns {HTMLElement|null} */
+export function getErrorEl() {
+  return document.getElementById("error");
+}
 
-/** @type {HTMLElement|null} */
-export const accessDeniedEl = document.getElementById("accessDenied");
+/** @returns {HTMLElement|null} */
+export function getAccessDeniedEl() {
+  return document.getElementById("accessDenied");
+}
 
-/** @type {HTMLElement|null} */
-export const headerEl = document.querySelector(".header");
+/** @returns {HTMLElement|null} */
+export function getHeaderEl() {
+  return document.querySelector(".header");
+}
 
-/** @type {HTMLElement|null} */
-export const weekdaysEl = document.querySelector(".weekdays");
+/** @returns {HTMLElement|null} */
+export function getWeekdaysEl() {
+  return document.querySelector(".weekdays");
+}
 
-/** @type {HTMLButtonElement|null} */
-export const prevBtn = document.getElementById("prevMonth");
+/** @returns {HTMLButtonElement|null} */
+export function getPrevBtn() {
+  return document.getElementById("prevMonth");
+}
 
-/** @type {HTMLButtonElement|null} */
-export const nextBtn = document.getElementById("nextMonth");
+/** @returns {HTMLButtonElement|null} */
+export function getNextBtn() {
+  return document.getElementById("nextMonth");
+}
 
-/** @type {HTMLDivElement|null} */
-export const currentDutyViewEl = document.getElementById("currentDutyView");
+/** @returns {HTMLDivElement|null} */
+export function getCurrentDutyViewEl() {
+  return document.getElementById("currentDutyView");
+}
 
 /** Currently viewed month (mutable). */
 export const state = {