FN-5992: improve workflow editor mobile responsiveness

Make the workflow editor and related settings panels usable on narrow screens.

- add mobile-specific full-screen layout overrides for the workflow editor, create dialog, sidebar, inspector, settings panel, and AI panel
- stack workflow selector, workflow settings, and workflow fields controls for phone-sized viewports
- document the workflow editor mobile behavior in the dashboard guide
- add CSS contract tests covering the new mobile workflow editor and panel rules

Files changed:
 docs/dashboard-guide.md                            |  13 +++
 .../app/components/WorkflowFieldsPanel.css         |  15 +++
 .../app/components/WorkflowNodeEditor.css          |  94 ++++++++++++++++++
 .../dashboard/app/components/WorkflowSelector.css  |  16 ++++
 .../app/components/WorkflowSettingsPanel.css       |  20 ++++
 .../__tests__/WorkflowNodeEditor.css.test.ts       | 105 +++++++++++++++++++++
 6 files changed, 263 insertions(+)

Fusion-Task-Id: FN-5992

Fusion-Task-Lineage: c92396dc-88e5-4da0-be3f-687e7bd10972

packages/dashboard/app/components/WorkflowNodeEditor.css

@@ -1145,3 +1145,97 @@
   background: var(--bg);
   box-shadow: var(--shadow-md);
 }
+
+@media (max-width: 768px) {
+  .modal-overlay:has(.wf-editor-modal),
+  .modal-overlay:has(.wf-create-modal) {
+    padding-top: 0;
+    align-items: stretch;
+    justify-content: stretch;
+  }
+
+  .wf-editor-modal,
+  .wf-create-modal {
+    width: 100vw;
+    min-width: 0;
+    max-width: 100vw;
+    height: 100vh;
+    height: 100dvh;
+    min-height: 0;
+    max-height: 100dvh;
+    margin: 0;
+    border: none;
+    border-radius: 0;
+    resize: none;
+    flex: 1 1 auto;
+  }
+
+  .wf-editor-header,
+  .wf-migration-notice,
+  .wf-editor-readonly-banner {
+    flex-wrap: wrap;
+  }
+
+  .wf-migration-notice,
+  .wf-editor-readonly-banner {
+    gap: var(--space-sm);
+  }
+
+  .wf-editor-body {
+    flex-direction: column;
+  }
+
+  .wf-editor-sidebar {
+    width: 100%;
+    max-height: 30vh;
+    border-right: none;
+    border-bottom: 1px solid var(--border);
+    overflow-y: auto;
+  }
+
+  .wf-editor-sidebar .wf-column-panel {
+    width: 100%;
+    min-width: 0;
+    border-left: none;
+    border-top: 1px solid var(--border);
+  }
+
+  .wf-editor-body .wf-settings-panel {
+    width: 100%;
+    min-width: 0;
+    max-height: 50vh;
+    border-left: none;
+    border-top: 1px solid var(--border);
+    overflow-y: auto;
+  }
+
+  .wf-editor-canvas-wrap {
+    flex: 1 1 auto;
+    min-height: 40vh;
+  }
+
+  .wf-template-list {
+    max-height: 40vh;
+  }
+
+  .wf-editor-toolbar {
+    overflow-x: auto;
+  }
+
+  .wf-ai-panel {
+    position: fixed;
+    inset: var(--space-sm);
+    top: auto;
+    right: auto;
+    z-index: 30;
+    width: auto;
+  }
+
+  .wf-editor-inspector {
+    width: 100%;
+    max-height: 40vh;
+    border-left: none;
+    border-top: 1px solid var(--border);
+    overflow-y: auto;
+  }
+}