docs: 同步缩放与横屏提示的组件化文档

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

README.md

@@ -164,8 +164,6 @@ src/
 ├── styles/       # 全局样式
 ├── types/        # TypeScript 类型
 └── utils/        # 工具函数
-    ├── useOrientation.ts # 横竖屏检测
-    ├── useScale.ts       # 1920x1080 整体缩放
     ├── vconsole.ts       # 调试工具
     └── yiban.ts          # 易班 API 封装
 ```
@@ -305,18 +303,16 @@ function MyComponent() {
 
 ### 课程画布适配
 
-模板采用 [src/app.config.ts](src/app.config.ts) 中的 `appConfig.design` 作为课程设计稿尺寸，默认是 `1920 x 1080`。页面内容按该设计稿开发，App 外层会通过整体缩放适配不同屏幕。
+模板按 `1920 x 1080` 设计稿开发，由 `src/course-runtime/canvas` 的 `CourseCanvas` 组件承担整体缩放。`CourseCanvas` 默认 `width=1920`、`height=1080`、`maxScale=1`，如需其他设计稿尺寸或放大比例，显式传入对应 props 即可。
 
 当前默认缩放策略：
 
 - PC 端：按可视区域等比缩放并居中显示
-- 大屏：`appConfig.scale.max` 默认为 `1`，不会超过设计稿原始尺寸，周围留白
-- 移动端：优先横屏访问，竖屏时显示横屏提示
+- 大屏：`maxScale` 默认为 `1`，不会超过设计稿原始尺寸，周围留白
+- 移动端：优先横屏访问，竖屏时由 `OrientationGuard` 显示横屏提示
 - 视口：缩放逻辑优先读取 `visualViewport`，移动端地址栏显示/隐藏时更稳定
 - 页面内容：按 `1920 x 1080` 设计稿进行开发，不使用 rem 适配
 
-整体缩放逻辑维护在 [src/utils/useScale.ts](src/utils/useScale.ts)。如需修改设计稿尺寸或最大放大比例，优先修改 [src/app.config.ts](src/app.config.ts)。
-
 本地运行 `bun dev` 后，可以访问标准课程页示例：
 
 ```text
@@ -451,10 +447,10 @@ toast.error("网络异常，请稍后重试");
 基础示例：
 
 ```tsx
-import { DragDropProvider, Draggable, Droppable } from "@/components/business";
-import { useScale } from "@/utils";
+import { DragDropProvider, Draggable, Droppable } from "@/components/course-interactions/drag-drop";
+import { useCourseCanvas } from "@/course-runtime/canvas";
 
-const scale = useScale();
+const { scale } = useCourseCanvas();
 
 <DragDropProvider
   scale={scale}