feat(canvas): 面板层级管理 — 五层Elevation体系+渐进式三区+z-index全量迁移 #98 (#102)

* feat(canvas): 面板层级管理优化 - 五层Elevation+渐进式三区+进度增强 #98 #94

基于 Wayfinder 地图 #98 决议执行面板层级管理优化：

1. 五层 Elevation 体系（决策1）
   - 画布组件 z-index 硬编码值全部迁移到 token
   - L0 画布层 → L1 工具层 → L2 面板层 → L3 对话框层 → L4 通知层
   - 涉及 14 个 .tsx 文件，0 处 z-[N] 硬编码残留

2. prompt 面板渐进式三区（决策2）
   - B区参数区改为手风琴折叠模式（默认折叠）
   - 新增 SlidersHorizontal + ChevronDown 图标切换
   - 点击展开 video 工具参数，收起后释放视觉空间
   - A区核心区（prompt+生成）始终展开

3. 任务进度条增强（决策3）
   - 进度条高度 1px→1.5px，视觉更醒目
   - 新增 shimmer 扫描动画（running 态，1.4s/cycle）
   - 新增百分比数字显示（tabular-nums 等宽数字）
   - 新增 indeterminate 模式（无百分比时循环扫描）
   - 尊重 prefers-reduced-motion（reducedMotion 时禁用动画）

4. CSS 动画
   - 新增 @keyframes canvas-task-progress-shimmer
   - .canvas-task-progress-shimmer 类

Closes #98

* refactor(canvas): z-index 全量迁移到五层Elevation token #98 #94

补全 #98 五层 Elevation 体系的剩余硬编码 z-index 清理：
- 三个设置弹层（图/音/视频）zIndex:1200 → var(--z-popover)
- model-setup-guide z-[900] → var(--z-toast)
- 项目侧栏 z-30 → var(--z-panel)，章节预览 z-50 → var(--z-panel-floating)
- shared 页头/缩放控件/访客提示 z-[80]/z-[70] → var(--z-panel-floating)，右键菜单 z-[90] → var(--z-modal)
- project 缩放控件容器 z-50 → var(--z-panel)，绘图加载遮罩 z-[500] → var(--z-toast)
- 反馈面板 z-[90] → var(--z-panel-floating)

共 16 处全局浮层 z-index 迁移到 token，消除层级冲突隐患。

---------

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

web/src/components/canvas/canvas-node-prompt-panel.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useState, type ReactNode } from "react";
-import { ArrowUp, AtSign, Boxes, FileText, ImageIcon, ImagePlus, Maximize2, Music2, Pencil, Square, UserRound, Video } from "lucide-react";
+import { ArrowUp, AtSign, Boxes, ChevronDown, FileText, ImageIcon, ImagePlus, Maximize2, Music2, Pencil, SlidersHorizontal, Square, UserRound, Video } from "lucide-react";
 import { Button, Modal, Tooltip } from "antd";
 
 import { ModelPicker } from "@/components/model-picker";
@@ -50,6 +50,7 @@ export function CanvasNodePromptPanel({ node, isRunning, onPromptChange, onConfi
     const [expandedPresetOpen, setExpandedPresetOpen] = useState(false);
     const [expandedPromptOpen, setExpandedPromptOpen] = useState(false);
     const [promptContentHeight, setPromptContentHeight] = useState(0);
+    const [paramsExpanded, setParamsExpanded] = useState(false); // #98 决策2：B区参数区折叠状态（手风琴）
     const generationCount = Math.max(1, Math.min(15, Math.floor(Math.abs(Number(config.count)) || 1)));
     const priceChannel = resolveModelChannel(config, config.model);
     const credits = requestCreditCost({ channelMode: priceChannel.scope === "system" ? "remote" : "local", modelCosts: priceChannel.modelCosts, model: modelOptionName(config.model), count: mode === "image" ? generationCount : 1, seconds: mode === "video" ? config.videoSeconds : 1 });
@@ -261,9 +262,26 @@ export function CanvasNodePromptPanel({ node, isRunning, onPromptChange, onConfi
                 />
             </div>
 
+            {/* B区 参数区（对应 #98 决策2：默认折叠，手风琴展开）*/}
             {mode === "video" && !simpleMode ? (
-                <div className="mt-1.5 rounded-md border p-0.5" style={{ background: controlSurface, borderColor: insetBorder }}>
-                    <CanvasVideoPromptTools metadata={node.metadata} frameOptions={videoFrameOptions} onMetadataChange={(patch) => onConfigChange(node.id, patch)} />
+                <div className="mt-1.5 overflow-hidden rounded-md border" style={{ background: controlSurface, borderColor: insetBorder }}>
+                    <button
+                        type="button"
+                        className="flex w-full items-center gap-1.5 px-2 py-1 text-[var(--fs-micro)] font-medium transition-colors hover:bg-white/[.04]"
+                        style={{ color: theme.node.muted }}
+                        onClick={() => setParamsExpanded(!paramsExpanded)}
+                        aria-expanded={paramsExpanded}
+                        aria-label={paramsExpanded ? "收起参数" : "展开参数"}
+                    >
+                        <SlidersHorizontal className="size-3" strokeWidth={1.8} />
+                        <span className="flex-1 text-left">参数</span>
+                        <ChevronDown className={`size-3 transition-transform duration-200 ${paramsExpanded ? "rotate-180" : ""}`} strokeWidth={1.8} />
+                    </button>
+                    {paramsExpanded ? (
+                        <div className="border-t p-0.5" style={{ borderColor: insetBorder }}>
+                            <CanvasVideoPromptTools metadata={node.metadata} frameOptions={videoFrameOptions} onMetadataChange={(patch) => onConfigChange(node.id, patch)} />
+                        </div>
+                    ) : null}
                 </div>
             ) : null}