[eric] tree: group Dashboard canvas surface into canvas/

frontend/src/app/pages/Dashboard/Dashboard.tsx

@@ -3,7 +3,7 @@ import SelectionOverlay from '@/app/components/SelectionOverlay';
 import { ElementSelectionProvider } from '@/app/components/ElementSelectionContext';
 import { useDomElementSelector } from '@/app/components/useDomElementSelector';
 import { useDashboardController } from './useDashboardController';
-import DashboardCanvas from './DashboardCanvas';
+import DashboardCanvas from './canvas/DashboardCanvas';
 
 const DashboardSelectionOverlay: React.FC = () => {
   const { overlay, dragRect, dragPreview } = useDomElementSelector();

frontend/src/app/pages/Dashboard/canvas/DashboardCanvas.tsx

@@ -14,9 +14,9 @@ import type {
   NotePosition,
 } from '@/shared/state/dashboardLayoutSlice';
 import type { Output } from '@/shared/state/outputsSlice';
-import type { CardType, useDashboardSelection } from './useDashboardSelection';
-import type { useCanvasControls } from './useCanvasControls';
-import type { Tether } from './geometry/dashboardTethers';
+import type { CardType, useDashboardSelection } from '../useDashboardSelection';
+import type { useCanvasControls } from '../useCanvasControls';
+import type { Tether } from '../geometry/dashboardTethers';
 
 type Selection = ReturnType<typeof useDashboardSelection>;
 type Canvas = ReturnType<typeof useCanvasControls>;

frontend/src/app/pages/Dashboard/canvas/DashboardCardLayer.tsx

@@ -1,9 +1,9 @@
 import React, { type RefObject } from 'react';
 import { AnimatePresence } from 'framer-motion';
-import AgentCard from './cards/AgentCard';
-import DashboardViewCard from './cards/DashboardViewCard';
-import BrowserCard from './cards/BrowserCard';
-import NoteCard from './cards/NoteCard';
+import AgentCard from '../cards/AgentCard';
+import DashboardViewCard from '../cards/DashboardViewCard';
+import BrowserCard from '../cards/BrowserCard';
+import NoteCard from '../cards/NoteCard';
 import {
   EXPANDED_CARD_MIN_H,
   DEFAULT_CARD_W,
@@ -14,7 +14,7 @@ import {
   type NotePosition,
 } from '@/shared/state/dashboardLayoutSlice';
 import type { Output } from '@/shared/state/outputsSlice';
-import type { CardType, useDashboardSelection } from './useDashboardSelection';
+import type { CardType, useDashboardSelection } from '../useDashboardSelection';
 
 type Selection = ReturnType<typeof useDashboardSelection>;
 type SpawnOrigin = { x: number; y: number; type?: 'branch' };

frontend/src/app/pages/Dashboard/canvas/DashboardHeader.tsx

@@ -10,7 +10,7 @@ import { useClaudeTokens } from '@/shared/styles/ThemeContext';
 import type { AgentSession } from '@/shared/state/agentsSlice';
 import type { CardPosition, ViewCardPosition, BrowserCardPosition } from '@/shared/state/dashboardLayoutSlice';
 import type { Output } from '@/shared/state/outputsSlice';
-import type { CanvasActions } from './useCanvasControls';
+import type { CanvasActions } from '../useCanvasControls';
 
 interface DashboardHeaderProps {
   dashboardName: string | undefined;

frontend/src/app/pages/Dashboard/canvas/DashboardOverlays.tsx

@@ -1,16 +1,16 @@
 import React, { type RefObject } from 'react';
 import Box from '@mui/material/Box';
-import DashboardToolbar from './DashboardToolbar';
-import CanvasControls from './controls/CanvasControls';
-import CardSearchPalette from './controls/CardSearchPalette';
-import DirectionHints from './controls/DirectionHints';
+import DashboardToolbar from '../DashboardToolbar';
+import CanvasControls from '../controls/CanvasControls';
+import CardSearchPalette from '../controls/CardSearchPalette';
+import DirectionHints from '../controls/DirectionHints';
 import type { AgentSession } from '@/shared/state/agentsSlice';
 import type {
   CardPosition,
   ViewCardPosition,
   BrowserCardPosition,
 } from '@/shared/state/dashboardLayoutSlice';
-import type { useCanvasControls } from './useCanvasControls';
+import type { useCanvasControls } from '../useCanvasControls';
 
 type Canvas = ReturnType<typeof useCanvasControls>;
 type Direction = 'left' | 'right' | 'up' | 'down';

frontend/src/app/pages/Dashboard/canvas/TetherLayer.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { ClaudeTokens } from '@/shared/styles/claudeTokens';
-import type { Tether } from './geometry/dashboardTethers';
+import type { Tether } from '../geometry/dashboardTethers';
 
 const TETHER_FADE_MS = 2500;