fix: 修复纵向模式右侧详情面板滚动问题

问题描述：
- 纵向模式下，展开"相关股票"等内容后，整个页面滚动而不是右侧详情面板内部滚动
- 右侧详情面板没有独立的滚动条

根本原因：
- 外层容器没有高度限制，随内容无限增长
- Grid 使用 minH/maxH 而非固定高度
- 内层 Box 的 overflow 样式被 Chakra UI 默认样式覆盖

解决方案：
1. 外层容器（line 160）：添加纵向模式的最大高度限制 820px
2. Grid（line 293）：使用固定高度 h="800px" 替代 minH/maxH
3. 右侧 Box（line 315-337）：
   - 使用 sx prop + !important 强制应用 overflow 和 height 样式
   - 滚动条宽度优化为 3px（原 1px 太细，临时 8px 太粗）
   - 使用动态颜色变量保持主题一致性

修改文件：
- src/views/Community/components/DynamicNewsCard/EventScrollList.js

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

src/views/Community/components/DynamicNewsCard/EventScrollList.js

@@ -157,7 +157,7 @@ const EventScrollList = ({
         ref={scrollContainerRef}
         overflowX={mode === 'carousel' ? 'auto' : 'hidden'}
         overflowY={mode === 'four-row' || mode === 'vertical' ? 'hidden' : 'auto'}
-        maxH={mode === 'four-row' || mode === 'vertical' ? 'none' : '800px'}
+        maxH={mode === 'vertical' ? '820px' : (mode === 'four-row' ? 'none' : '800px')}
         pt={0}
         pb={4}
         px={2}
@@ -290,7 +290,7 @@ const EventScrollList = ({
 
         {/* 模式4: 纵向分栏模式 - 横向布局（时间在左，卡片在右） */}
         {mode === 'vertical' && (
-          <Grid templateColumns="1fr 2fr" gap={6} minH="500px" maxH="800px">
+          <Grid templateColumns="1fr 2fr" gap={6} h="800px">
             {/* 左侧：事件列表 (33.3%) - 使用虚拟滚动 + 双向无限滚动 */}
             <GridItem>
               <VirtualizedFourRowGrid
@@ -313,15 +313,15 @@ const EventScrollList = ({
             {/* 右侧：事件详情 (66.7%) */}
             <GridItem h="100%">
               <Box
-                overflowY="auto"
-                h="100%"
                 pl={2}
                 position="relative"
-                css={{
-                  overscrollBehavior: 'contain',
-                  overflow: 'auto !important',
+                sx={{
+                  height: '100% !important',
+                  maxHeight: '800px !important',
+                  overflowY: 'scroll !important',
+                  overflowX: 'hidden !important',
                   '&::-webkit-scrollbar': {
-                    width: '1px',
+                    width: '3px',
                   },
                   '&::-webkit-scrollbar-track': {
                     background: scrollbarTrackBg,