refactor(canvas): 浮层宽度 token 提取 — sidebar/panel-width 去硬编码 #126 (#130)

补齐审计第 5 项「配套 token 提取」遗留：

- 新增 --canvas-sidebar-width(232px) 与 --canvas-panel-width(min(332px,calc(100vw-24px)))
  两个布局 token，归入 globals.css Canvas 布局段
- canvas-project-sidebar 侧栏 w-[232px] → w-[var(--canvas-sidebar-width)]
- canvas-active-task-panel 浮动面板 w-[min(332px,calc(100vw-24px))] →
  w-[var(--canvas-panel-width)]，消除审计 P0-8.1 重复硬编码公式

助手面板已改用动态 width prop（320–760px 可调），不消费该静态 token。

Co-authored-by: sikongyue <3155157671@qq.com>

web/src/components/canvas/canvas-active-task-panel.tsx

@@ -41,7 +41,7 @@ export function CanvasActiveTaskPanel({ tasks }: { tasks: GenerationTask[] }) {
                 animate={{ opacity: 1, y: 0, scale: 1 }}
                 exit={{ opacity: 0, y: -8, scale: 0.98 }}
                 transition={motionTransition}
-                className="pointer-events-none absolute right-3 top-[72px] z-[var(--z-panel-floating)] w-[min(332px,calc(100vw-24px))]"
+                className="pointer-events-none absolute right-3 top-[72px] z-[var(--z-panel-floating)] w-[var(--canvas-panel-width)]"
             >
                 <LayoutGroup id="canvas-active-tasks">
                     <motion.section

web/src/components/canvas/canvas-project-sidebar.tsx

@@ -126,7 +126,7 @@ export function CanvasProjectSidebar({ projectId, detail, onAddChapter, onLocate
     }
 
     return (
-        <aside className="relative z-[var(--z-panel)] hidden w-[232px] shrink-0 flex-col border-r border-border bg-background/94 backdrop-blur-xl lg:flex">
+        <aside className="relative z-[var(--z-panel)] hidden w-[var(--canvas-sidebar-width)] shrink-0 flex-col border-r border-border bg-background/94 backdrop-blur-xl lg:flex">
             <header className="flex h-12 shrink-0 items-center justify-between gap-2 border-b border-border px-2.5">
                 <Link to={`/projects/${projectId}/canvases`} className="flex min-w-0 items-center gap-2 text-xs font-semibold" title="返回项目画布列表"><FolderKanban className="size-3.5 shrink-0" /><span className="truncate">{projectDetail?.project.name || "项目空间"}</span></Link>
                 <button type="button" className="grid size-7 shrink-0 place-items-center rounded-md text-foreground/45 hover:bg-foreground/[.06]" title="收起项目侧栏" aria-label="收起项目侧栏" onClick={() => setCollapsed(true)}><ChevronLeft className="size-4" /></button>

web/src/styles/globals.css

@@ -503,6 +503,10 @@
     --panel-shadow: var(--shadow-lg);
     --panel-section-gap: var(--space-3);  /* 12px */
 
+    /* Canvas 布局（画布页浮层定位，对应审计 P0-8.1/P1-2.1）*/
+    --canvas-sidebar-width: 232px;        /* 项目侧栏宽度（短剧模式）*/
+    --canvas-panel-width: min(332px, calc(100vw - 24px)); /* 浮动面板默认宽度（活动任务等）*/
+
     /* Prompt 面板（对应 #98 决策2 渐进式三区）*/
     --prompt-panel-max-height: min(70vh, 640px);
     --prompt-panel-input-min-height: 72px;