refactor: 右栏拆成属性区与工具面板两层

改成 Figma 布局后旧的四个面板没有挂载点，功能在界面上不可达。
右栏上半给选中对象的属性，下半给背景/滤镜/文字/导出，
两条开发线各占一个文件，互不重叠。

src/App.vue

@@ -3,6 +3,7 @@ import TopBar from "./components/TopBar.vue";
 import LayersPanel from "./components/LayersPanel.vue";
 import Workspace from "./components/Workspace.vue";
 import Inspector from "./components/Inspector.vue";
+import ToolPanels from "./components/ToolPanels.vue";
 import BottomDock from "./components/BottomDock.vue";
 import SelectionMenu from "./components/SelectionMenu.vue";
 import ContextMenu from "./components/ContextMenu.vue";
@@ -32,7 +33,12 @@ useShortcuts();
       <ContextMenu />
     </div>
 
-    <Inspector class="area-right" />
+    <!-- 右栏分两层：上半是选中对象的属性（T8），下半是背景 / 滤镜 / 文字 / 导出
+         这些工具面板（T10）。分开是为了让两条开发线各占一个文件，互不干扰。 -->
+    <div class="area-right">
+      <Inspector class="right-top" />
+      <ToolPanels class="right-bottom" />
+    </div>
   </div>
 </template>
 
@@ -56,6 +62,22 @@ useShortcuts();
 }
 .area-right {
   grid-area: right;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  border-left: 1px solid var(--line);
+  background: var(--bg2);
+}
+
+/* 属性区按内容高度，工具面板吃掉剩下的并自己滚动。 */
+.right-top {
+  flex: 0 0 auto;
+}
+.right-bottom {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow-y: auto;
+  border-top: 1px solid var(--line);
 }
 
 /* 画布区是浮层的定位上下文：选中菜单、底部胶囊、右键菜单都绝对定位在它里面。 */

src/components/Inspector.vue

@@ -25,9 +25,6 @@
 
 <style scoped>
 .inspector {
-  border-left: 1px solid var(--line);
-  background: var(--bg2);
-  overflow-y: auto;
   padding: 10px 0;
 }
 .inspector h2 {

src/components/ToolPanels.vue

@@ -0,0 +1,30 @@
+<script setup lang="ts">
+/**
+ * 【T10 待实现 — 工具面板的重新安置】
+ *
+ * 旧版把所有东西塞在一个右侧栏里。改成 Figma 式布局之后，那四个面板
+ * （背景 / 滤镜 / 文字 / 导出与模板）需要重新安置，它们的功能都还在，
+ * 只是现在没有任何地方挂载它们——**改造之后这些功能在界面上不可达**，
+ * 这条线就是来补上的。
+ *
+ * 现有实现在 `components/panels/`：SourcePanel / FilterPanel / TextPanel /
+ * ExportPanel / CanvasPanel。逻辑是好的，验收过，**不要重写**，只搬和收。
+ */
+</script>
+
+<template>
+  <div class="tool-panels">
+    <p class="todo">T10 待实现：背景 / 滤镜 / 文字 / 导出与模板</p>
+  </div>
+</template>
+
+<style scoped>
+.tool-panels {
+  padding: 10px 0;
+}
+.todo {
+  color: var(--fg-dim);
+  margin: 0 12px;
+  line-height: 1.6;
+}
+</style>