用途：这是 Remotion 官方关于编写 React 标记（Markup）的指导文档，面向用 Remotion 制作视频的开发者，说明内容、动画与特效的最佳实践。若与当前任务无关，官方建议改加载 Remotion Best Practices。
主要能力与规则：在 composition 或 scene 组件内用 useVideoConfig() 获取 fps，所有秒到帧的换算（含 from、trimBefore、durationInFrames 等时间属性）都基于它，并把表达式留在 JSX 节点上，如 trimBefore={4 * fps}，便于 Studio 编辑且帧率变化时保持正确。动画用 useCurrentFrame() 与 interpolate() 驱动；CSS transition/animation 和 Tailwind 动画类不会正确渲染，需要重构。用 Easing.bezier() 与 Easing.spring() 定制时间曲线。interpolate() 调用应内联在 style 属性中，优先使用 scale、translate、rotate 等 CSS 属性而非 transform 字符串。
结构与可编辑性：按 Remotion Interactivity Best Practices 组织标记；带可编辑属性的场景优先用 Interactive.withSchema({wrapInSequence: true, layout: 'absolute-fill'})，内部可返回 fragment，由包装器处理布局与实例样式。可复用场景注册为 connected composition。时间属性直接放在支持它的组件上，避免多余的 <Sequence> 包装。Studio 编辑的是创建条目的 JSX 源节点，因此每个应独立编辑的注册、片段、场景、图层和序列都要写成独立 JSX 节点并内联可编辑属性；程序化循环适合把生成实例作为单一模板统一控制，不适合需要分别编辑实例的场景。
资源与媒体：资源放在项目根目录 public/ 文件夹，用 staticFile() 引用。视频和音频用 @remotion/media 的 <Video>、<Audio>；图片用 <CanvasImage>；动图用 <AnimatedImage>，非 Chrome 环境用 @remotion/gif。
特效：先确定特效作用的目标元素；若目标组件支持内置特效且匹配需求，优先使用内置特效而非 CSS 近似。支持直接接收 effects 的组件包括 remotion 的 <Img>、<CanvasImage>、<AnimatedImage>、<Solid>、<HtmlInCanvas>，@remotion/media 的 <Video>，@remotion/gif 的 <Gif>，@remotion/rive 的 <RemotionRiveCanvas>，以及 @remotion/shapes 的多种形状。普通 HTML 元素、<Interactive.*>、<AbsoluteFill>、<Sequence> 不直接接收特效，需包在 <HtmlInCanvas> 中。@remotion/effects 提供颜色色调、模糊拖尾、光照、扭曲变换、纹理图案、边缘、像素化与转场等大量内置特效。
其它主题：文档还指向多场景视频、转场、运动模糊、3D、音效、音频可视化、地图、字幕、Google Fonts 与本地字体、GIF、Lottie、参数化视频、测量 DOM 与文本、FFmpeg、静音检测、动态时长尺寸、compositions 与 stills、高级序列等子文档。安装模块用 npx remotion add @remotion/media。视觉检查可打开 Remotion Studio 交互预览，也可渲染单帧或多帧图像。
限制：资料未提供收费、价格、平台支持范围等具体信息，暂未提供。