♻️ refactor(classroom): optimize video area rendering logic

- 将视频区域的条件渲染从外部容器移至 className 中的条件类
- 移除冗余的视频容器外层条件判断，使用 CSS 类控制显示/隐藏状态
- 保持原有的视频区域布局和尺寸计算逻辑不变

src/client/mobile/components/Classroom/ClassroomLayout.tsx

@@ -130,8 +130,7 @@ export const ClassroomLayout = ({ children, role }: ClassroomLayoutProps) => {
   return (
     <div className={`flex ${isLandscape ? 'flex-row' : 'flex-col'} md:flex-row h-screen bg-gray-100`}>
       {/* 视频区域 */}
-      {showVideo && (
-        <div className={`relative ${isLandscape ? 'flex-[3] h-auto' : 'h-[300px]'} md:flex-[3] md:h-auto bg-black`}>
+      <div className={`relative ${isLandscape ? 'flex-[3] h-auto' : 'h-[300px]'} md:flex-[3] md:h-auto bg-black ${showVideo ? 'block' : 'hidden'}`}>
           {/* 主屏幕共享容器 */}
           <div
             id="remoteScreenContainer"
@@ -171,7 +170,6 @@ export const ClassroomLayout = ({ children, role }: ClassroomLayoutProps) => {
             </div>
           )}
         </div>
-      )}
 
       {/* 消息和控制面板列 */}
       <div className={`${showVideo ? `${isLandscape ? 'w-96 flex-none h-screen' : 'w-full h-[calc(100vh-300px)]'}` : 'h-full'} md:w-96 md:flex-none flex flex-col overflow-hidden ${isLandscape ? 'max-h-screen' : ''}`}>