Add floating canvas panels, theme settings, and SVG line-spacing analysis.

Canvas Studio now uses dockable floating panels, app settings/help navigation, and improved SVG export; the backend adds an SVG line-spacing analysis API with SciPy acceleration and new design templates.

frontend/src/components/CanvasArea.tsx

@@ -1,18 +1,18 @@
 import { useRef, useEffect, useState } from 'react';
 import { NameLocation, JobResult } from '../types';
+import { apiUrl } from '../lib/api';
 import { IconCloudy } from './Icons';
 
 interface CanvasAreaProps {
   maskFile: File | null;
   jobResult: JobResult | null;
-  apiBase: string;
   viewMode: '2d' | '3d';
   zoom: number;
   highlightLocation: NameLocation | null;
 }
 
 export default function CanvasArea({
-  maskFile, jobResult, apiBase, viewMode, zoom, highlightLocation
+  maskFile, jobResult, viewMode, zoom, highlightLocation
 }: CanvasAreaProps) {
   const [maskPreviewUrl, setMaskPreviewUrl] = useState<string | null>(null);
   const wrapperRef = useRef<HTMLDivElement>(null);
@@ -24,16 +24,12 @@ export default function CanvasArea({
     return () => URL.revokeObjectURL(url);
   }, [maskFile]);
 
-  // 图片 URL 处理：
-  // - 若已是完整 http URL 直接使用
-  // - 若是 /api/... 路径则拼接 apiBase
-  // - 否则回退到 /api/jobs/{id}/files/png
+  // 图片 URL 可能来自后端相对路径，也可能是本地预览地址。
   const resolveImageUrl = (): string | null => {
     if (!jobResult) return maskPreviewUrl;
     const raw = jobResult.image_url;
     if (!raw || !jobResult.job_id) return maskPreviewUrl;
-    if (raw.startsWith('http')) return raw;
-    return `${apiBase}${raw}`;
+    return apiUrl(raw);
   };
 
   const displayUrl = resolveImageUrl();