feat(org-chart): finalize chart features and AI generation rules

src/org-chart/department-colors-preview.css

@@ -0,0 +1,43 @@
+/* Department Colors Storybook adapter only. The actual Tunnel sample/stage
+   frame comes from center-stories.css; this sheet never selects employee cards. */
+.hm-orgchart-department-preview .hm-orgchart-department-colors-design {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: var(--sb-center-column-gap);
+}
+
+.hm-orgchart-department-preview .hm-orgchart-color-preview {
+  grid-template-rows: auto 1fr;
+  grid-row: auto;
+}
+
+.hm-orgchart-department-preview .hm-orgchart-representative-preview {
+  grid-column: 1 / -1;
+}
+
+/* Group titles are OrgChart artwork. Preserve their established typography,
+   white text and organization gradient within the common review header. */
+.hm-orgchart-department-preview .hm-orgchart-color-preview > header > .hm-orgchart-color-department-name {
+  box-sizing: border-box;
+  width: 100%;
+  color: var(--hm-orgchart-current-department-color);
+  font-size: var(--hm-orgchart-title-font-size, 18px);
+  line-height: var(--hm-orgchart-title-line-height, 26px);
+  font-weight: var(--hm-orgchart-resolved-font-weight-bold);
+}
+
+.hm-orgchart-department-preview .hm-orgchart-department-stage {
+  display: grid;
+  justify-items: safe center;
+  align-items: center;
+}
+
+.hm-orgchart-department-preview .hm-orgchart-preview-grid {
+  margin-top: 0;
+  gap: var(--sb-center-column-gap);
+}
+
+@media (max-width: 760px) {
+  .hm-orgchart-department-preview .hm-orgchart-department-colors-design {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}