Fix dark overlay caused by timestamp element stretching

Root cause: The timestamp element had both classes 'map-timestamp' and
'deckgl-timestamp'. These classes set conflicting positioning:
- .map-timestamp: bottom: 8px; right: 10px;
- .deckgl-timestamp: top: 10px; left: 50%;

When all four positioning values (top/bottom/left/right) are set on an
absolutely positioned element without explicit width/height, it stretches
to fill the space between those edges - creating a 724x315px dark overlay.

Fixes:
- Remove 'map-timestamp' class from timestamp element in DeckGLMap.ts
- Add explicit bottom: auto; right: auto; width: auto; height: auto;
  to .deckgl-timestamp CSS to prevent any accidental stretching

https://claude.ai/code/session_01GTanC7R6aSQNsnijqJRUFz

src/components/DeckGLMap.ts

@@ -1140,7 +1140,8 @@ export class DeckGLMap {
 
   private createTimestamp(): void {
     const timestamp = document.createElement('div');
-    timestamp.className = 'map-timestamp deckgl-timestamp';
+    // Only use deckgl-timestamp class - map-timestamp has conflicting positioning
+    timestamp.className = 'deckgl-timestamp';
     timestamp.id = 'deckglTimestamp';
     this.container.appendChild(timestamp);
 

src/styles/main.css

@@ -8840,6 +8840,11 @@ body.playback-mode .status-dot {
   position: absolute;
   top: 10px;
   left: 50%;
+  /* Explicitly unset bottom/right to prevent stretching if map-timestamp class is also applied */
+  bottom: auto !important;
+  right: auto !important;
+  width: auto;
+  height: auto;
   transform: translateX(-50%);
   z-index: 100;
   background: rgba(10, 15, 12, 0.8);