fix: prevent ride count overflow in park column on smaller displays

Let the park name side flex-shrink (minWidth:0, flex:1) so the ride count
always fits in the row without overflowing its column.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

components/WeekCalendar.tsx

@@ -228,7 +228,7 @@ function ParkRow({
           padding: "10px 14px",
           gap: 10,
         }}>
-          <div>
+          <div style={{ minWidth: 0, flex: 1 }}>
             <div style={{ display: "flex", alignItems: "center", gap: 6 }}>
               <span style={{ fontWeight: 500, fontSize: "0.85rem", lineHeight: 1.2, color: "var(--color-text)" }}>
                 {park.name}
@@ -251,7 +251,7 @@ function ParkRow({
             </div>
           </div>
           {rideCounts?.[park.id] !== undefined && (
-            <div style={{ fontSize: "0.72rem", color: isClosing ? "var(--color-closing-hours)" : "var(--color-open-hours)", fontWeight: 600, whiteSpace: "nowrap", flexShrink: 0 }}>
+            <div style={{ fontSize: "0.72rem", color: isClosing ? "var(--color-closing-hours)" : "var(--color-open-hours)", fontWeight: 600, flexShrink: 0, textAlign: "right" }}>
               {rideCounts[park.id]} {coastersOnly
                 ? (rideCounts[park.id] === 1 ? "coaster" : "coasters")
                 : (rideCounts[park.id] === 1 ? "ride" : "rides")} operating