Use viewport-relative min-height for Now marker centering on mobile

Replace the fragile flex chain (body → main → exportArea → timeline)
with a direct min-height: calc(100dvh - 320px) on the empty timeline.
This ensures the Now marker is vertically centered in the remaining
viewport space regardless of intermediate DOM elements.

https://claude.ai/code/session_01Ri4kZdxskLfNEG6pVgyj3f

Author: claude

src/styles/Chooser.module.css

@@ -218,14 +218,6 @@
   padding-bottom: 24px;
 }
 
-@media (max-width: 640px) {
-  .exportArea {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-  }
-}
-
 /* Hide action buttons during image export */
 .exportArea[data-exporting] [data-hide-on-export] {
   display: none !important;

src/styles/Timeline.module.css

@@ -179,12 +179,10 @@ a.marker:focus-visible {
   }
 
   .timelineEmpty {
-    flex: 1;
     justify-content: center;
     align-items: center;
-    min-height: unset;
-    margin-top: 0;
-    margin-left: 0;
+    min-height: calc(100dvh - 320px);
+    margin: 0;
   }
 
   .timelineEmpty .marker {

src/styles/globals.css

@@ -66,12 +66,6 @@ body {
     flex-direction: column;
     min-height: 100dvh;
   }
-
-  #main-content {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-  }
 }
 
 a {