Enhance calendar duty display and tooltip functionality

- Updated the calendar rendering to use a duty marker with improved accessibility attributes for duty names and titles.
- Introduced a new function `bindDutyMarkerTooltips` to display tooltips with duty names on hover over duty markers.
- Enhanced CSS styles for duty markers to improve visibility and user interaction.
- Ensured tooltips are dynamically positioned and hidden appropriately to enhance user experience.

webapp/style.css

@@ -90,6 +90,9 @@ body {
   border-radius: 8px;
   font-size: 0.85rem;
   background: var(--surface);
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
 }
 
 .day.other-month {
@@ -161,14 +164,19 @@ body {
   transform: none;
 }
 
-.day-duties {
-  font-size: 0.6rem;
-  color: var(--duty);
+.duty-marker {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
   margin-top: 2px;
-  max-width: 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
+  font-size: 0.65rem;
+  font-weight: 700;
+  color: var(--duty);
+  background: rgba(158, 206, 106, 0.25);
+  border-radius: 50%;
+  flex-shrink: 0;
 }
 
 .duty-list {