Improve RMC mobile header layout to preserve right-side controls and Export Video action

[Copilot]

On narrow/mobile screens in Rail Map Chronicle, header actions in the top-right were collapsing into each other and the Export video action could be visually pushed out. This PR makes the timeline header layout responsive so controls remain reachable and readable at small widths.

• Responsive header structure (timeline window header)

  • Switch header container to responsive flow:
    • base: stacked sections (column)
    • md+: single-row layout (row)
  • This separates primary project actions from utility controls instead of forcing both into one compressed row.

• Overflow handling for dense action groups

  • Enable horizontal overflow on both action clusters (maxW="100%", overflowX="auto").
  • Keep right-side control alignment responsive (flex-end on base, flex-start on md+) so buttons remain accessible without overlap.

• Targeted regression coverage

  • Add a focused test case asserting narrow-viewport stacked layout behavior in timeline-window-header.test.tsx.

<Flex
  direction={{ base: 'column', md: 'row' }}
  align={{ base: 'stretch', md: 'center' }}
>
  <HStack minW={0} overflowX="auto" maxW="100%">...</HStack>
  <HStack
    ml={{ base: 0, md: 'auto' }}
    overflowX="auto"
    maxW="100%"
    justifyContent={{ base: 'flex-end', md: 'flex-start' }}
  >
    ...
  </HStack>
</Flex>

• Fixes Enhance mobile experience in RMC #1582

[langonginc]

@copilot rmc界面下左上角和右上角图标容易重叠到一起，能够针对屏幕宽度自适应是否显示左上角的菜单文字，如果宽度还是不够则自动分成两行。

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.