filegrc 0.9.2 → 0.11.0

package/src/web.js

@@ -88,6 +88,7 @@ let onboardingSetupOnly = false;
 let onboardingStillWorkingTimer = null;
 let onboardingPendingDraft = false;
 const resourceDetailRequests = new Map();
+const stateSectionRequests = new Map();
 let resourceGuideCleanup = null;
 let repositorySyncPollTimer = null;
 let repositorySyncPollInFlight = false;
@@ -101,15 +102,20 @@ start().catch((error) => {
 
 async function start() {
   const embedded = document.querySelector("#filegrc-data");
-  state = embedded ? JSON.parse(embedded.textContent) : await fetchJson("/api/state");
-  window.addEventListener("hashchange", render);
+  state = normalizeAppState(embedded ? JSON.parse(embedded.textContent) : await fetchJson("/api/state/bootstrap"));
+  window.addEventListener("hashchange", handleRouteChange);
   window.addEventListener("resize", positionCurrentOnboarding);
   window.addEventListener("scroll", positionCurrentOnboarding, true);
   render();
+  loadStateForRoute();
   scheduleRepositorySyncPoll();
-  if (!state.readOnly && rendererSettingsEntry()?.record.showOnboarding === true && !initialSetupSystem()) {
-    queueMicrotask(requestOnboarding);
-  }
+  maybeRequestOnboarding();
+}
+
+function handleRouteChange() {
+  document.querySelectorAll("dialog.editor[open], dialog.commit-dialog[open], dialog.alert-dialog[open]").forEach((dialog) => dialog.close());
+  render();
+  loadStateForRoute();
 }
 
 function render() {
@@ -123,7 +129,9 @@ function render() {
   const nextNavigation = root.querySelector(".sidebar-nav");
   if (nextNavigation) nextNavigation.scrollTop = navigationScrollTop;
   const main = root.querySelector("main");
-  if (route.name === "home") renderHome(main);
+  const waitingFor = blockingStateSections(route).filter((section) => state.sections?.[section] !== "complete");
+  if (waitingFor.length) renderStateLoading(main, route, waitingFor);
+  else if (route.name === "home") renderHome(main);
   else if (route.name === "stage") renderStageOverview(main, route.stageId, route.params);
   else if (route.name === "obligations") renderObligations(main, route.params);
   else if (route.name === "audit-packet") renderAuditPacket(main, route.params);
@@ -135,6 +143,83 @@ function render() {
   bindCommon();
 }
 
+function normalizeAppState(next) {
+  if (next.sections) return next;
+  return {
+    ...next,
+    stateToken: null,
+    sections: {
+      repository: "complete",
+      program: "complete",
+      obligations: "complete",
+      audits: "complete",
+      workflow: "complete"
+    }
+  };
+}
+
+function blockingStateSections(route) {
+  if (route.name === "home") return ["program", "obligations", "workflow"];
+  if (route.name === "repository") return ["repository"];
+  if (route.name === "obligations" || route.name === "stage" && route.stageId === "run") return ["program", "obligations"];
+  if (route.name === "audit-packet") return ["repository", "program", "obligations", "audits"];
+  if (route.name === "stage" && route.stageId === "audit") return ["program", "workflow", "audits"];
+  if (route.name === "stage") return ["program", "workflow"];
+  return [];
+}
+
+function desiredStateSections(route) {
+  const sections = new Set(["repository", ...blockingStateSections(route)]);
+  if (route.name === "list" && (["requirement", "requirement-mapping"].includes(route.type) || state.model.collectionReviews?.[route.type])) sections.add("program");
+  if (route.name === "detail" && ["policy", "document", "training", "control", "component", "requirement-mapping", "retention-schedule-item"].includes(route.type)) sections.add("program");
+  if (route.name === "detail" && ["policy", "document", "framework", "requirement", "commitment", "system", "component", "vendor", "information-type", "source-coverage", "requirement-mapping", "retention-schedule-item"].includes(route.type)) sections.add("workflow");
+  if (route.name === "detail" && ["obligation", "action-item", "obligation-event"].includes(route.type)) sections.add("obligations");
+  if (route.name === "detail" && route.type === "audit") sections.add("audits");
+  return [...sections];
+}
+
+function renderStateLoading(main, route, sections) {
+  const failed = sections.find((section) => state.sections?.[section] === "error");
+  const title = failed ? "Could Not Finish Loading" : route.name === "home" ? "Loading Program Overview" : "Loading Current Workspace State";
+  const message = failed
+    ? state.sectionErrors?.[failed] || "Reload the workspace and try again."
+    : "Records are ready. FileGRC is calculating the information needed for this page.";
+  main.innerHTML = '<div class="page"><section class="panel state-loading" role="status" aria-live="polite"><p class="kicker">' + (failed ? "Loading error" : "One moment") + '</p><h2>' + esc(title) + '</h2><p>' + esc(message) + '</p></section></div>';
+}
+
+function loadStateForRoute() {
+  const route = parseRoute();
+  for (const section of desiredStateSections(route)) loadStateSection(section);
+}
+
+function loadStateSection(section) {
+  if (!state.stateToken || state.sections?.[section] === "complete") return Promise.resolve();
+  if (stateSectionRequests.has(section)) return stateSectionRequests.get(section);
+  state.sections[section] = "loading";
+  const token = state.stateToken;
+  const request = fetchJson("/api/state/" + encodeURIComponent(section) + "?token=" + encodeURIComponent(token))
+    .then((result) => {
+      if (state.stateToken !== result.stateToken) return;
+      Object.assign(state, result.state);
+      state.sections[section] = "complete";
+      render();
+      loadStateForRoute();
+      scheduleRepositorySyncPoll();
+      if (section === "repository") maybeRequestOnboarding();
+    })
+    .catch((error) => {
+      if (state.stateToken !== token) return;
+      state.sections[section] = "error";
+      state.sectionErrors = { ...(state.sectionErrors || {}), [section]: error.message };
+      render();
+    })
+    .finally(() => {
+      if (stateSectionRequests.get(section) === request) stateSectionRequests.delete(section);
+    });
+  stateSectionRequests.set(section, request);
+  return request;
+}
+
 function parseRoute() {
   const [path, query = ""] = location.hash.replace(/^#\/?/, "").split("?", 2);
   let parts;
@@ -249,16 +334,33 @@ function topbar(route) {
             : route.name === "list" && route.type === "document"
               ? documentListTitle(route.params)
               : state.model.resources[route.type]?.pluralTitle || "filegrc";
-  const repositoryLabel = state.repository?.mode === "trunk"
+  const repositoryLoading = state.sections?.repository !== "complete";
+  const repositoryError = state.sections?.repository === "error";
+  const repositoryLabel = repositoryError
+    ? "Git check failed"
+    : repositoryLoading
+    ? "Checking Git"
+    : state.repository?.mode === "trunk"
     ? state.repository.label
     : state.git.available ? ((state.git.branch || "detached") + " · " + state.git.shortCommit) : "Git unavailable";
-  const repositoryTone = state.repository?.mode === "trunk"
+  const repositoryTone = repositoryError
+    ? "warn"
+    : repositoryLoading
+    ? "neutral"
+    : state.repository?.mode === "trunk"
     ? repositoryStatusTone(state.repository.status)
     : state.git.clean ? "good" : "warn";
-  return '<button class="mobile-nav" type="button" aria-label="Open navigation" aria-controls="sidebar-navigation" aria-expanded="false">☰</button><div><small class="eyebrow">' + esc(state.workspace.organizationName) + '</small><h1>' + esc(titleCase(title)) + '</h1></div><div class="topbar-status">' + topbarProgramReadiness() + '<label class="search topbar-search"><span aria-hidden="true">⌕</span><input data-global-search type="search" placeholder="Search records" aria-label="Search records"><kbd>/</kbd></label><a class="validation-chip" href="#/repository"><span class="status-dot ' + (state.validation.ok ? "good" : "bad") + '"></span>' + (state.validation.ok ? "Data valid" : state.validation.counts.errors + " validation errors") + '</a><a class="repo-chip" href="#/repository"><span class="status-dot ' + repositoryTone + '"></span>' + esc(repositoryLabel) + '</a></div>';
+  const validationLoading = state.sections?.repository !== "complete";
+  const validationTone = repositoryError ? "warn" : validationLoading ? "neutral" : state.validation.ok ? "good" : "bad";
+  const validationLabel = repositoryError ? "Data check failed" : validationLoading ? "Checking data" : state.validation.ok ? "Data valid" : state.validation.counts.errors + " validation errors";
+  return '<button class="mobile-nav" type="button" aria-label="Open navigation" aria-controls="sidebar-navigation" aria-expanded="false">☰</button><div><small class="eyebrow">' + esc(state.workspace.organizationName) + '</small><h1>' + esc(titleCase(title)) + '</h1></div><div class="topbar-status">' + topbarProgramReadiness() + '<label class="search topbar-search"><span aria-hidden="true">⌕</span><input data-global-search type="search" placeholder="Search records" aria-label="Search records"><kbd>/</kbd></label><a class="validation-chip" href="#/repository"><span class="status-dot ' + validationTone + '"></span>' + validationLabel + '</a><a class="repo-chip" href="#/repository"><span class="status-dot ' + repositoryTone + '"></span>' + esc(repositoryLabel) + '</a></div>';
 }
 
 function topbarProgramReadiness() {
+  if (state.sections?.program !== "complete") {
+    const label = state.sections?.program === "loading" ? "…" : "View";
+    return '<a class="topbar-readiness" href="#/"><span class="topbar-readiness-copy"><span>Program readiness</span><strong>' + label + '</strong></span><span class="progress" aria-hidden="true"><span style="width:0%"></span></span></a>';
+  }
   const progress = dashboardProgramReadiness(state.programReadiness);
   const detail = progress.complete + " of " + progress.total + " readiness items complete";
   return '<a class="topbar-readiness" href="' + nextProgramStageHref() + '" aria-label="' + esc("Program readiness: " + progress.percent + "%. " + detail + ". " + progress.status + ".") + '"><span class="topbar-readiness-copy"><span>Program readiness</span><strong>' + progress.percent + '%</strong></span><span class="progress" aria-hidden="true"><span style="width:' + progress.percent + '%"></span></span></a>';
@@ -287,20 +389,25 @@ function renderHome(main) {
   const setupPending = !setupSystem
     || setupSystem.status !== "active"
     || activeProgram().assuranceGoal === "none";
-  const acceptedEventTriggers = state.obligations.triggers.filter(({ programStatus }) => programStatus !== "proposed");
-  const openObligations = state.obligations.items.filter((item) => item.status !== "complete");
+  const acceptedEventTriggers = activePolicyEventTriggers(state.obligations.triggers);
+  const openObligations = activeOperationItems(state.obligations.items);
   const previewObligations = distinctObligationPreviews(openObligations, 3);
-  const obligationHeading = openObligations.some((item) => item.status !== "proposed") ? "Due Windows" : "Starter Proposals";
   const setupBanner = setupPending ? initialSetupBanner() : "";
   const auditPanel = program.evidenceReady
     ? '<section class="panel audit-panel"><div class="panel-head"><div><p class="kicker">Optional next phase</p><h3>' + esc(activeFirm ? titleCase(activeAudit.record.title) : "Target: " + program.target.label) + '</h3></div>' + (activeAudit ? '<a href="#/resource/audit/' + encodeURIComponent(activeAudit.record.id) + '">Open audit</a>' : '<a href="#/resources/audit">Engagements</a>') + '</div>' +
       (activeAudit ? auditProgress(activeAudit.record) + auditEngagementPrompt(activeAudit.record) : auditEngagementPrompt()) + '</section>'
     : "";
+  const obligationPanel = program.evidenceReady || openObligations.length
+    ? '<section class="panel obligation-panel"><div class="panel-head"><div><p class="kicker">Policy obligations</p><h3>Due Windows</h3></div><a href="#/stage/run">Open board</a></div>' + obligationPreview(previewObligations) + '</section>'
+    : "";
+  const eventPanel = acceptedEventTriggers.length
+    ? '<section class="panel event-reminder-panel"><div class="panel-head"><div><p class="kicker">Event reminders</p><h3>Did Something Change?</h3></div><a href="#/stage/run?section=events">Trigger work</a></div>' + eventReminderPreview(orderedPolicyEventTriggers(acceptedEventTriggers).slice(0, 4)) + '</section>'
+    : "";
+  const operationPanels = obligationPanel + eventPanel;
+  const overviewPanels = operationPanels + auditPanel;
   main.innerHTML = '<div class="page home-page"><section class="hero overview-hero"><div><p class="kicker">Current program state</p><h2>' + esc(titleCase(state.workspace.title)) + '</h2><p>' + esc(state.workspace.description || "Governance, risk, controls, evidence, and audit work maintained as plain files in Git.") + '</p></div></section>' + setupBanner + readinessOverview() +
-    '<div class="overview-grid"><section class="panel obligation-panel"><div class="panel-head"><div><p class="kicker">Policy obligations</p><h3>' + obligationHeading + '</h3></div><a href="#/stage/run">Open board</a></div>' + obligationPreview(previewObligations) + '</section>' +
-    '<section class="panel event-reminder-panel"><div class="panel-head"><div><p class="kicker">Event reminders</p><h3>Did Something Change?</h3></div><a href="#/stage/run?section=events">' + (acceptedEventTriggers.length ? "Trigger work" : "Review proposals") + '</a></div>' + eventReminderPreview(orderedPolicyEventTriggers(state.obligations.triggers).slice(0, 4)) + '</section>' +
-    auditPanel + '</div></div>';
-  main.querySelector("#resume-setup")?.addEventListener("click", () => requestOnboarding({ setupOnly: Boolean(initialSetupSystem()) }));
+    (overviewPanels ? '<div class="overview-grid">' + overviewPanels + '</div>' : '') + '</div>';
+  main.querySelector("#resume-setup")?.addEventListener("click", () => requestOnboarding({ setupOnly: true }));
 }
 
 function initialSetupSystem() {
@@ -359,7 +466,7 @@ function renderStageOverview(main, stageId, params = new URLSearchParams()) {
   const progress = stageProgress(stage);
   main.innerHTML = '<div class="page stage-overview-page"><nav class="breadcrumbs"><a href="#/">Overview</a><span>/</span><span>' + esc(stage.title) + '</span></nav>' +
     '<section class="stage-overview-hero"><div><p class="kicker">Step ' + esc(stage.number) + ' of 5</p><h2>' + esc(stage.title) + '</h2><p>' + esc(stage.summary) + '</p></div>' + stageProgressCard(progress) + '</section>' +
-    (stage.id === "policies" ? renderPolicyApprovalGuidance() + renderPoliciesTable() : renderStagePageIndex(stage)) + (stage.id === "controls" ? renderDocumentActivationAssessments() + renderPolicyActivationAssessments() + renderEvidenceReadiness() : "") + (stage.id === "audit" ? renderAuditDocumentActivationAssessments() : "") + '</div>';
+    (stage.id === "policies" ? renderPolicyApprovalGuidance() + renderPoliciesTable() : renderStagePageIndex(stage)) + (stage.id === "controls" ? renderDocumentActivationAssessments() + renderPolicyActivationAssessments() + renderRetentionReadiness() + renderEvidenceReadiness() : "") + (stage.id === "audit" ? renderAuditDocumentActivationAssessments() : "") + '</div>';
   main.querySelector("[data-show-evidence-families]")?.addEventListener("click", (event) => {
     main.querySelectorAll("[data-evidence-family-extra]").forEach((card) => { card.hidden = false; });
     event.currentTarget.remove();
@@ -767,7 +874,8 @@ function recordWorkflowItems(type, id) {
   const activeStates = new Set(["blocked", "due", "open", "overdue", "ready", "scheduled", "upcoming", "waiting-external"]);
   return [
     ...(state.workflow?.findings || []),
-    ...(state.workflow?.workItems || [])
+    ...(state.workflow?.workItems || []),
+    ...programReadinessWorkflowItems()
   ].filter((item) => (
     activeStates.has(item.state)
     && (
@@ -782,6 +890,9 @@ function recordWorkflowItems(type, id) {
 }
 
 function recordWorkflowCell(type, entry) {
+  if (state.sections?.workflow !== "complete") {
+    return '<button class="text-button record-workflow-clear" type="button" data-load-workflow>Calculate action</button>';
+  }
   const items = recordWorkflowItems(type, entry.record.id);
   if (!items.length) return '<span class="record-workflow-clear">No calculated action</span>';
   const item = items[0];
@@ -876,6 +987,14 @@ function workflowItemHref(item) {
     ...(item.actions || []).map((action) => action.command),
     item.nextAction?.command
   ].filter(Boolean);
+  if (item.createResourceType && state.model.resources[item.createResourceType]) {
+    const params = new URLSearchParams({ new: "1" });
+    if (item.title) params.set("title", item.createResourceType === "commitment"
+      ? item.title.replace(/^Record commitments from\s+/i, "Commitment from ")
+      : item.title.replace(/^Map commitments affected by\s+/i, "Mapping for "));
+    for (const id of item.sourceResourceIds || []) params.append("sourceResourceId", id);
+    return "#/resources/" + encodeURIComponent(item.createResourceType) + "?" + params;
+  }
   const applicabilityCommand = commands.find((command) => command.includes(" review-applicability "));
   const applicabilityType = applicabilityCommand?.match(/--type\s+([a-z0-9-]+)/)?.[1];
   if (
@@ -886,6 +1005,9 @@ function workflowItemHref(item) {
   ) {
     return "#/resource/" + encodeURIComponent(applicabilityType) + "/" + encodeURIComponent(item.subject.id);
   }
+  if (commands.some((command) => command.includes(" scaffold retention-schedule-item"))) {
+    return retentionScheduleItemHref(item);
+  }
   if (applicabilityType && state.model.resources[applicabilityType]) {
     return "#/resources/" + encodeURIComponent(applicabilityType) + "?review=1";
   }
@@ -936,6 +1058,21 @@ function workflowItemHref(item) {
   return stage ? "#/stage/" + stage : "";
 }
 
+function retentionScheduleItemHref(item) {
+  const params = new URLSearchParams({ new: "1" });
+  if (item.informationTypeId) params.set("informationTypeId", item.informationTypeId);
+  if (item.resourceId || item.subject?.id) params.set("scopeResourceId", item.resourceId || item.subject.id);
+  const informationTypeTitle = String(item.title || "").replace(/^Decide retention for\s+/i, "").trim();
+  if (informationTypeTitle && informationTypeTitle !== item.title) params.set("title", "Retention for " + informationTypeTitle);
+  const scheduleDocuments = resourcesOfType("document").filter(({ record }) => (
+    record.documentKind === "schedule"
+    && record.workflowScope !== "engagement"
+    && !["superseded", "retired"].includes(record.status)
+  ));
+  if (scheduleDocuments.length === 1) params.set("scheduleDocumentId", scheduleDocuments[0].record.id);
+  return "#/resources/retention-schedule-item?" + params;
+}
+
 function workflowItemDetail(item) {
   if (item.dueOn) return "Due " + item.dueOn;
   if (item.availableOn) return "Available " + item.availableOn;
@@ -1010,6 +1147,59 @@ function renderEvidenceReadiness() {
   return '<section class="evidence-map"><div class="evidence-map-head"><div><p class="kicker">Control implementation</p><h2>' + completeCount + ' of ' + items.length + ' evidence ' + (items.length === 1 ? "family" : "families") + ' ready</h2><p>Connect each Control to the ' + sourceLabel + ' that produce its evidence.</p></div><div class="evidence-map-actions"><a class="button" href="#/resources/' + sourceType + '">Review ' + sourceLabel + '</a><a class="button primary" href="#/resources/control">Review Controls</a></div></div>' + (cards || empty) + more + '</section>';
 }
 
+function retentionReviewItems() {
+  return (state.programReadiness?.stages || []).flatMap((stage) => (
+    (stage.items || []).filter((item) => (
+      item.id?.startsWith("retention-")
+      || item.id?.startsWith("requirement-mapping-")
+      || ["collection-review-information-type", "collection-review-retention-schedule-item"].includes(item.id)
+    )).map((item) => ({ ...item, stage: stage.id }))
+  ));
+}
+
+function programReadinessWorkflowItems() {
+  if (state.sections?.workflow === "complete") return [];
+  return retentionReviewItems()
+    .filter((item) => item.status === "action")
+    .map((item) => ({
+      ...item,
+      key: "program-readiness." + item.id,
+      state: "ready",
+      subject: item.resourceId && item.resourceType ? { type: item.resourceType, id: item.resourceId } : { type: item.resourceType || "unknown" }
+    }));
+}
+
+function renderRetentionReadiness() {
+  const items = retentionReviewItems();
+  if (!items.length) return "";
+  const actions = items.filter((item) => item.status === "action");
+  const cards = actions.map((item) => {
+    const ids = [...new Set([
+      item.resourceId,
+      item.informationTypeId,
+      ...(item.retentionScheduleItemIds || []),
+      ...(item.staleResourceIds || [])
+    ].filter(Boolean))];
+    const references = ids.length
+      ? '<div class="evidence-map-references">' + ids.map((id) => formatReference(id)).join("") + '</div>'
+      : "";
+    const href = item.id?.startsWith("retention-use-")
+      ? retentionScheduleItemHref(item)
+      : item.id?.startsWith("collection-review-")
+      ? '#/resources/' + encodeURIComponent(item.resourceType)
+      : item.resourceId && item.resourceType
+      ? '#/resource/' + encodeURIComponent(item.resourceType) + '/' + encodeURIComponent(item.resourceId)
+      : '#/resources/' + encodeURIComponent(item.resourceType || "retention-schedule-item");
+    return '<article class="evidence-map-card"><div class="evidence-map-card-head"><div><span class="badge warn">Review</span><h3><a href="' + href + '">' + esc(item.title) + '</a></h3></div></div><p>' + esc(item.message) + '</p>' + references + '</article>';
+  });
+  const visibleCount = 6;
+  const visibleCards = cards.slice(0, visibleCount).join("");
+  const moreCards = cards.length > visibleCount
+    ? '<details class="workflow-guidance-more retention-readiness-more"><summary>Show ' + (cards.length - visibleCount) + ' more retention and mapping items</summary><div class="policy-activation-grid workflow-findings-more">' + cards.slice(visibleCount).join("") + '</div></details>'
+    : "";
+  return '<section class="evidence-map retention-readiness"><div class="evidence-map-head"><div><p class="kicker">Information lifecycle</p><h2>' + (items.length - actions.length) + ' of ' + items.length + ' retention and mapping checks current</h2><p>Review Information Types, schedule coverage, and mappings here when source records or processing uses change.</p></div><div class="evidence-map-actions"><a class="button" href="#/resources/requirement-mapping">Review mappings</a><a class="button primary" href="#/resources/retention-schedule-item">Review schedule</a></div></div>' + (cards.length ? '<div class="policy-activation-grid">' + visibleCards + '</div>' + moreCards : '<article class="evidence-map-card complete"><span class="badge good">Current</span><p>Every retention decision and Requirement Mapping is bound to its current sources.</p></article>') + '</section>';
+}
+
 function evidenceSourceCheckLabel(name) {
   return ({
     active: "activate source",
@@ -1112,11 +1302,12 @@ function stagePageItems(stage, destination) {
   const activeStates = new Set(["blocked", "due", "open", "overdue", "ready"]);
   const items = [
     ...(state.workflow?.findings || []),
-    ...(state.workflow?.workItems || [])
+    ...(state.workflow?.workItems || []),
+    ...programReadinessWorkflowItems()
   ].filter((item) => (
     activeStates.has(item.state)
     && (
-      item.stage === stage.id
+      workflowUiStage(item.stage) === stage.id
       || stage.id === "scope"
         && destination.type === "appointment"
         && item.code === "governance.appointment.independent-policy-reviewer"
@@ -1130,6 +1321,7 @@ function stagePageItems(stage, destination) {
     ));
   }
   return items.filter((item) => {
+    if (destination.type === "program" && item.key === "program.scope.criteria") return false;
     if (
       destination.type === "requirement"
       && item.subject?.type === "requirement"
@@ -1162,6 +1354,10 @@ function stagePageItems(stage, destination) {
   ));
 }
 
+function workflowUiStage(stageId) {
+  return stageId === "operation" ? "run" : stageId;
+}
+
 function operationProgress() {
   const program = state.programReadiness;
   const goal = program?.target?.goal || activeProgram().assuranceGoal || "none";
@@ -1173,7 +1369,7 @@ function operationProgress() {
       : Boolean(program?.evidenceReady);
   const overdue = state.obligations.counts.overdue || 0;
   const blocked = state.obligations.counts.blocked || 0;
-  const complete = Boolean(program?.evidenceReady && candidateStarted && overdue === 0 && blocked === 0);
+  const complete = Boolean(program?.operating);
   if (complete) {
     return {
       percent: 100,
@@ -1214,6 +1410,19 @@ function operationProgress() {
       detail: "Record the management candidate period start when evidence collection begins."
     };
   }
+  if (program?.evidenceReady && candidateStarted) {
+    const actions = program?.stages?.find((stage) => stage.id === "operation")?.counts?.action || 0;
+    return {
+      percent: 0,
+      complete: 0,
+      total: 1,
+      status: "Needs work",
+      tone: "warn",
+      detail: actions
+        ? actions + " Step 4 " + pluralize("item", actions) + (actions === 1 ? " needs" : " need") + " work."
+        : "Complete the current Step 4 readiness work."
+    };
+  }
   return {
     percent: 0,
     complete: 0,
@@ -1278,42 +1487,67 @@ function renderExternalEvidenceSection() {
 function renderObligations(main, params = new URLSearchParams()) {
   const stage = READINESS_STAGES.find((candidate) => candidate.id === "run");
   const plan = state.obligations;
+  const operationLocked = !state.programReadiness?.evidenceReady;
   const visibleCardLimit = 6;
-  const sections = ["proposed", "upcoming", "blocked", "due", "overdue"].map((status) => {
-    const items = obligationBoardItems(plan.items, status);
-    const cards = items.map((item, index) => obligationCard(item, index >= visibleCardLimit)).join("");
-    const more = items.length > visibleCardLimit
-      ? '<button class="button obligation-more" type="button" data-expand-obligations="' + status + '" data-total="' + items.length + '" aria-expanded="false">Show ' + (items.length - visibleCardLimit) + ' more</button>'
+  const renderBoard = (items, statuses) => statuses.map((status) => {
+    const statusItems = obligationBoardItems(items, status);
+    const cards = statusItems.map((item, index) => obligationCard(item, index >= visibleCardLimit)).join("");
+    const more = statusItems.length > visibleCardLimit
+      ? '<button class="button obligation-more" type="button" data-expand-obligations="' + status + '" data-total="' + statusItems.length + '" aria-expanded="false">Show ' + (statusItems.length - visibleCardLimit) + ' more</button>'
       : "";
-    return '<section class="obligation-column" data-obligation-column="' + status + '"><div class="obligation-column-head"><span class="badge status-' + status + '">' + esc(properCase(status)) + '</span><strong>' + items.length + '</strong></div><div class="obligation-cards">' + (items.length ? cards : empty("Nothing " + status + ".")) + '</div>' + more + '</section>';
+    return '<section class="obligation-column" data-obligation-column="' + status + '"><div class="obligation-column-head"><span class="badge status-' + status + '">' + esc(properCase(status)) + '</span><strong>' + statusItems.length + '</strong></div><div class="obligation-cards">' + (statusItems.length ? cards : empty("Nothing " + status + ".")) + '</div>' + more + '</section>';
   }).join("");
   const eventTriggerLimit = 6;
   const orderedTriggers = orderedPolicyEventTriggers(plan.triggers);
-  const triggers = orderedTriggers.map((trigger, index) => policyEventTrigger(trigger, index, index >= eventTriggerLimit)).join("");
-  const eventMore = orderedTriggers.length > eventTriggerLimit
-    ? '<button class="button policy-event-more" type="button" data-expand-policy-events aria-expanded="false">Show ' + (orderedTriggers.length - eventTriggerLimit) + ' more events</button>'
-    : "";
+  const acceptedTriggers = activePolicyEventTriggers(orderedTriggers);
+  const proposedTriggers = orderedTriggers.filter(({ programStatus }) => programStatus === "proposed");
+  const currentItems = activeOperationItems(plan.items);
+  const proposedItems = plan.items.filter(({ status }) => status === "proposed");
+  const renderEvents = (items, scope, description) => {
+    const triggers = items.map((trigger, index) => policyEventTrigger(trigger, index, index >= eventTriggerLimit, scope)).join("");
+    const eventMore = items.length > eventTriggerLimit
+      ? '<button class="button policy-event-more" type="button" data-expand-policy-events="' + scope + '" data-total="' + items.length + '" aria-expanded="false">Show ' + (items.length - eventTriggerLimit) + ' more events</button>'
+      : "";
+    return '<section class="workflow-section event-reminders" data-policy-event-section="' + scope + '"><div class="section-head"><div><p class="kicker">Changes that create work</p><h2>Policy Events</h2><p>' + description + '</p></div></div><div class="policy-event-list">' + (triggers || empty("No event-driven obligations are configured.")) + '</div>' + eventMore + '</section>';
+  };
+  const renderQueue = (items, statuses, description) => '<section class="workflow-section work-queue-section"><div class="section-head"><div><p class="kicker">Recurring, event, and assigned work</p><h2>Work Queue</h2><p>' + description + '</p></div><div class="page-actions">' + (!state.readOnly ? '<button class="button" type="button" data-new-action-item>New task</button>' : "") + '<a class="button" href="#/resources/obligation">Edit schedules</a></div></div><div class="obligation-board">' + renderBoard(items, statuses) + '</div></section>';
   const feedback = policyEventFeedback
     ? '<section class="policy-event-feedback" role="status" aria-live="polite"><span class="status-dot good"></span><div><strong>Work added to the Work Queue</strong><p>' + esc(policyEventFeedback.name + " created " + policyEventFeedback.taskCount + " " + pluralize("task", policyEventFeedback.taskCount) + ".") + '</p></div><button class="button" type="button" data-view-added-work>View Work Queue</button><button class="icon-button" type="button" data-dismiss-policy-event-feedback aria-label="Dismiss confirmation">×</button></section>'
     : "";
+  const operationGate = operationLocked
+    ? '<section class="workflow-section operation-gate"><div><p class="kicker">Finish Step 3 first</p><h2>Get the program Evidence Ready</h2><p>Confirm the remaining Controls, schedules, evidence sources, and governed content. Any adopted work and Policy Events that can happen now stay available below.</p></div><a class="button primary" href="#/stage/controls">Continue Evidence Ready work</a></section>'
+    : "";
+  const activeOperation = operationLocked
+    ? (acceptedTriggers.length ? renderEvents(acceptedTriggers, "active", "Trigger the matching workflow when an event occurs. filegrc adds every required action to the Work Queue with its owner and deadline.") : "") +
+      (currentItems.length ? renderQueue(currentItems, ["upcoming", "blocked", "due", "overdue"], "Complete work the program has already adopted. Each card shows its due window, source, and next action.") : "")
+    : "";
+  const setupTriggers = operationLocked ? proposedTriggers : orderedTriggers;
+  const setupItems = operationLocked ? proposedItems : plan.items;
+  const setupStatuses = operationLocked ? ["proposed"] : ["proposed", "upcoming", "blocked", "due", "overdue"];
+  const operationSetupOpen = operationLocked ? "" : " open";
+  const operationSetupSummary = operationLocked
+    ? '<summary>Preview ' + proposedTriggers.length + ' proposed Policy Events and ' + proposedItems.length + ' proposed Work Queue items</summary>'
+    : "";
   main.innerHTML = '<div class="page obligation-board-page stage-overview-page"><nav class="breadcrumbs"><a href="#/">Overview</a><span>/</span><span>' + esc(stage.title) + '</span></nav>' +
     '<section class="stage-overview-hero"><div><p class="kicker">Step ' + esc(stage.number) + ' of 5</p><h2>' + esc(stage.title) + '</h2><p>' + esc(stage.summary) + '</p></div>' + stageProgressCard(stageProgress(stage)) + '</section>' +
     feedback +
-    '<section class="workflow-section event-reminders"><div class="section-head"><div><p class="kicker">Changes that create work</p><h2>Policy Events</h2><p>Trigger the matching workflow when an event occurs. filegrc adds every required action to the Work Queue with its owner and deadline.</p></div></div><div class="policy-event-list">' + (triggers || empty("No event-driven obligations are configured.")) + '</div>' + eventMore + '</section>' +
-    '<section class="workflow-section work-queue-section"><div class="section-head"><div><p class="kicker">Recurring, event, and assigned work</p><h2>Work Queue</h2><p>Complete scheduled work and assigned follow-up here. Each card shows its due window, source, and next action.</p></div><div class="page-actions">' + (!state.readOnly ? '<button class="button" type="button" data-new-action-item>New task</button>' : "") + '<a class="button" href="#/resources/obligation">Edit schedules</a></div></div>' +
-    '<div class="obligation-board">' + sections + '</div>' +
-    '</section>' + renderExternalEvidenceSection() + '</div>';
+    operationGate +
+    activeOperation +
+    '<details class="operation-setup-preview"' + operationSetupOpen + '>' + operationSetupSummary +
+    renderEvents(setupTriggers, "setup", operationLocked ? "Review these starter workflows. They become available when their governing work is adopted." : "Trigger the matching workflow when an event occurs. filegrc adds every required action to the Work Queue with its owner and deadline.") +
+    renderQueue(setupItems, setupStatuses, operationLocked ? "Review proposed schedules before adopting them." : "Complete scheduled work and assigned follow-up here. Each card shows its due window, source, and next action.") +
+    renderExternalEvidenceSection() + '</details></div>';
   main.querySelectorAll("[data-start-event]").forEach((button) => button.addEventListener("click", () => {
     const trigger = plan.triggers.find((item) => item.eventType === button.dataset.startEvent);
     if (trigger) openObligationEventDialog(trigger);
   }));
-  main.querySelector("[data-expand-policy-events]")?.addEventListener("click", (event) => {
+  main.querySelectorAll("[data-expand-policy-events]").forEach((button) => button.addEventListener("click", (event) => {
     const button = event.currentTarget;
     const expanded = button.getAttribute("aria-expanded") === "true";
-    main.querySelectorAll(".policy-event-row[data-collapsed]").forEach((row) => { row.hidden = expanded; });
+    button.closest("[data-policy-event-section]").querySelectorAll(".policy-event-row[data-collapsed]").forEach((row) => { row.hidden = expanded; });
     button.setAttribute("aria-expanded", String(!expanded));
-    button.textContent = expanded ? "Show " + (orderedTriggers.length - eventTriggerLimit) + " more events" : "Show fewer events";
-  });
+    button.textContent = expanded ? "Show " + (Number(button.dataset.total) - eventTriggerLimit) + " more events" : "Show fewer events";
+  }));
   main.querySelector("[data-view-added-work]")?.addEventListener("click", () => main.querySelector(".work-queue-section")?.scrollIntoView({ behavior: "smooth", block: "start" }));
   main.querySelector("[data-dismiss-policy-event-feedback]")?.addEventListener("click", (event) => {
     policyEventFeedback = null;
@@ -1336,9 +1570,9 @@ function renderObligations(main, params = new URLSearchParams()) {
     const item = plan.items.find((candidate) => candidate.key === button.dataset.completeAction);
     if (item) openActionCompletion(item);
   }));
-  main.querySelector("[data-new-action-item]")?.addEventListener("click", () => openEditor("action-item", null, {
+  main.querySelectorAll("[data-new-action-item]").forEach((button) => button.addEventListener("click", () => openEditor("action-item", null, {
     description: "Create a task only when follow-up from another record needs its own assignee, deadline, and completion proof. Point it to that source record; it will remain in Work Queue until done or canceled."
-  }));
+  })));
   const requestedEvent = params.get("event");
   if (requestedEvent || params.get("section") === "events") {
     queueMicrotask(() => {
@@ -1391,8 +1625,16 @@ function orderedPolicyEventTriggers(triggers) {
   ));
 }
 
-function policyEventTrigger(trigger, index, collapsed = false) {
-  const tooltipId = "policy-event-tooltip-" + index;
+function activePolicyEventTriggers(triggers) {
+  return triggers.filter(({ programStatus }) => programStatus === "accepted");
+}
+
+function activeOperationItems(items) {
+  return items.filter(({ status }) => ["upcoming", "blocked", "due", "overdue"].includes(status));
+}
+
+function policyEventTrigger(trigger, index, collapsed = false, scope = "events") {
+  const tooltipId = "policy-event-tooltip-" + scope + "-" + index;
   const proposed = trigger.programStatus === "proposed";
   const unavailable = state.readOnly || proposed;
   const availability = proposed
@@ -1473,7 +1715,7 @@ function actionCompletionPlan(item) {
       href: "#/resource/action-item/" + encodeURIComponent(action.record.id)
     };
   }
-  const type = state.model.obligationActivities?.[obligation.record.activityType]?.completionType;
+  const type = item.completionType || state.model.obligationActivities?.[obligation.record.activityType]?.completionType;
   if (!type) {
     return {
       blocked: "Review completion type",
@@ -1484,7 +1726,7 @@ function actionCompletionPlan(item) {
 }
 
 function obligationCompletionPlan(item) {
-  const type = state.model.obligationActivities?.[item.activityType]?.completionType || "evidence";
+  const type = item.completionType || state.model.obligationActivities?.[item.activityType]?.completionType || "evidence";
   if (!currentPeopleForParties(item.ownerIds || []).length) {
     return { type, blocked: "Assign current owner", href: "#/resource/obligation/" + encodeURIComponent(item.obligationId) };
   }
@@ -1552,10 +1794,13 @@ function obligationCompletionSeed(type, item, obligation) {
     return { ...common, status: "complete", scopeResourceIds: obligation.scopeResourceIds || [], reviewerIds: reviewerPeople, completedOn: date, outcome: "passed", changesRequired: false, evidenceIds: [], coverage: rangeCoverage(item.dueWindowStart, item.dueWindowEnd) };
   }
   if (type === "risk-assessment") {
-    return { ...common, status: "complete", completedOn: date, assessmentKind: "enterprise-risk", scope: "In-scope SOC 2 systems and dependencies", assessorIds: responsiblePeople, reviewerIds: reviewerPeople, methodology: state.workspace.riskMethodology?.method || "Documented risk methodology", summary: "Assessment completed; link the supporting evidence and resulting risks.", evidenceIds: [], approvedOn: date };
+    return { ...common, status: "complete", completedOn: date, assessmentKind: "enterprise-risk", scope: "In-scope SOC 2 systems and dependencies", assessorIds: responsiblePeople, reviewerIds: reviewerPeople, methodology: activeProgram().riskMethodology?.method || "Documented risk methodology", summary: "Assessment completed; link the supporting evidence and resulting risks.", evidenceIds: [], approvedOn: date };
   }
   if (type === "attestation") {
-    return { ...common, status: "completed", subjectResourceIds: [...new Set([obligation.templateResourceId, ...(obligation.scopeResourceIds || [])].filter(Boolean))], personId: responsiblePeople[0], attestationKind: item.activityType || "completion", assignedOn: item.dueWindowStart, dueOn: item.dueWindowEnd, completedOn: date, attestationMethod: "git-approval" };
+    const personId = [...(item.subjectResourceIds || []), ...(obligation.scopeResourceIds || [])].find((id) => state.resources.some(({ record }) => record.id === id && record.type === "person"));
+    const primarySubjectIds = [...new Set([obligation.templateResourceId, ...(obligation.scopeResourceIds || [])].filter((id) => state.resources.some(({ record }) => record.id === id && ["policy", "document", "training", "action-item"].includes(record.type))))];
+    const subjectResourceIds = primarySubjectIds.length ? primarySubjectIds : [...(obligation.policyIds || [])];
+    return { ...common, status: "completed", subjectResourceIds, personId, attestationKind: item.activityType || "completion", assignedOn: item.dueWindowStart, dueOn: item.dueWindowEnd, completedOn: date, attestationMethod: "git-approval" };
   }
   if (type === "access-review") {
     return { ...common, status: "complete", completedOn: date, reviewerIds: responsiblePeople, systemIds: inScopeSystems, scope: "Privileged, production, and important-system access", outcome: "passed", evidenceIds: [], approvedByIds: reviewerPeople, approvedOn: date, coverage: rangeCoverage(item.dueWindowStart, item.dueWindowEnd) };
@@ -1570,15 +1815,23 @@ function obligationCompletionSeed(type, item, obligation) {
     return { ...common, status: "complete", controlId: obligation.controlIds?.[0] || "", testKinds: [item.activityType || "control-operation"], performedBy: "management", testerIds: responsiblePeople, reviewerIds: reviewerPeople, completedOn: date, reviewedOn: date, outcome: "passed", evidenceIds: [], coverage: rangeCoverage(item.dueWindowStart, item.dueWindowEnd) };
   }
   if (type === "control-activity") {
+    const allowedScopeTypes = new Set(state.model.relationGroups?.["obligation-scope"] || []);
+    const requestedScopeIds = item.subjectResourceIds || item.scopeResourceIds || obligation.scopeResourceIds || [];
+    const validScopeIds = requestedScopeIds.filter((id) => state.resources.some(({ record }) => (
+      record.id === id && allowedScopeTypes.has(record.type)
+    )));
+    const fallbackScopeIds = inScopeSystems.length
+      ? inScopeSystems
+      : (item.controlIds || obligation.controlIds || []).length
+        ? (item.controlIds || obligation.controlIds)
+        : [state.workspace.id];
     return {
       ...common,
       status: "complete",
       profileId: item.completionProfile || item.activityType,
       obligationId: item.obligationId,
       controlIds: item.controlIds || obligation.controlIds || [],
-      scopeResourceIds: (item.subjectResourceIds || item.scopeResourceIds || obligation.scopeResourceIds || []).length
-        ? (item.subjectResourceIds || item.scopeResourceIds || obligation.scopeResourceIds)
-        : [state.workspace.id],
+      scopeResourceIds: validScopeIds.length ? validScopeIds : fallbackScopeIds,
       performerIds: responsiblePeople,
       completedAt: timestamp,
       method: "",
@@ -2223,9 +2476,26 @@ function renderList(main, type, params = new URLSearchParams()) {
   renderRows();
   syncRoute();
   main.querySelector("#new-resource")?.addEventListener("click", () => openEditor(type));
+  main.querySelector("#record-rows").addEventListener("click", (event) => {
+    if (event.target.closest("[data-load-workflow]")) loadStateSection("workflow");
+  });
   main.querySelector("#review-applicability")?.addEventListener("click", () => openApplicabilityReviewDialog(type, entries));
   main.querySelector("[data-review-collection]")?.addEventListener("click", () => openCollectionReviewDialog(type));
-  if (params.get("new") === "1" && !state.readOnly && !definition.singleton && resourceCreationAllowed(type)) queueMicrotask(() => openEditor(type));
+  if (params.get("new") === "1" && !state.readOnly && !definition.singleton && resourceCreationAllowed(type)) {
+    const relationshipSeed = params.getAll("sourceResourceId").length
+      ? { sourceResourceIds: params.getAll("sourceResourceId") }
+      : {};
+    const seed = type === "retention-schedule-item" ? {
+      ...(params.get("title") ? { title: params.get("title") } : {}),
+      ...(params.get("informationTypeId") ? { informationTypeIds: [params.get("informationTypeId")] } : {}),
+      ...(params.get("scopeResourceId") ? { scopeResourceIds: [params.get("scopeResourceId")] } : {}),
+      ...(params.get("scheduleDocumentId") ? { scheduleDocumentId: params.get("scheduleDocumentId") } : {})
+    } : {
+      ...(params.get("title") ? { title: params.get("title") } : {}),
+      ...relationshipSeed
+    };
+    queueMicrotask(() => openEditor(type, null, { seed }));
+  }
   if (params.get("review") === "1" && !state.readOnly) {
     queueMicrotask(() => main.querySelector("#review-applicability")?.click());
   }
@@ -2888,6 +3158,12 @@ function rendererSettingsEntry() {
   return state.resources.find(({ record }) => record.type === "renderer-settings");
 }
 
+function maybeRequestOnboarding() {
+  if (!state.readOnly && rendererSettingsEntry()?.record.showOnboarding === true && !initialSetupSystem()) {
+    queueMicrotask(requestOnboarding);
+  }
+}
+
 function requestOnboarding({ setupOnly = false } = {}) {
   if (state.readOnly || onboardingDialog || !rendererSettingsEntry()) return;
   if (parseRoute().name !== "home") {
@@ -3089,7 +3365,7 @@ async function saveOnboarding(draft = false) {
   try {
     const response = await localFetch("/api/setup", {
       method: "POST",
-      headers: { "content-type": "application/json" },
+      headers: { "content-type": "application/json", prefer: "respond-async" },
       body: JSON.stringify({
         serviceName: onboardingDraft.serviceName,
         boundary: onboardingDraft.scope,
@@ -3335,6 +3611,7 @@ function openEditor(type, entry = null, options = {}) {
     ...required,
     ...(definition.listFields || []),
     ...(definition.formFields || []),
+    ...Object.entries(fields).filter(([, field]) => field.relation || field.relationGroup).map(([name]) => name),
     ...Object.entries(fields).filter(([, field]) => field.requiredWhen).map(([name]) => name),
     ...oneOf
   ])].filter((name) => !["id", "type"].includes(name) && fields[name]);
@@ -3602,27 +3879,29 @@ function editorField(type, name, field, value, required, editing, oneOfRequired
   const requiredMark = required || field.requiredWhen || oneOfRequired
     ? '<span class="required-mark" ' + (required || oneOfActive ? "" : "hidden") + '>' + (oneOfRequired ? "One Required" : "Required") + '</span>'
     : "";
+  const relation = field.relation || state.model.relationGroups?.[field.relationGroup];
+  const relationField = relation ? { ...field, relation } : field;
   const help = name === "title"
     ? (editing ? "Renaming this record will not change its stable ID." : "A stable ID and file name will be generated from this value.")
-    : field.relation ? relationHelp(field)
+    : relation ? relationHelp(relationField)
     : "";
   let control;
   if (field.managed) {
     control = '<textarea readonly spellcheck="false" placeholder="Filled when approval is saved">' + esc(value === undefined ? "" : JSON.stringify(value, null, 2)) + '</textarea>';
     return fieldWrap(name, "object", label, requiredMark, control, "Managed by filegrc from the exact companion Markdown revisions", false);
   }
-  if (field.relation && field.type === "array") {
-    const candidates = relationCandidates(field);
+  if (relation && field.type === "array") {
+    const candidates = relationCandidates(relationField, type, name);
     control = candidates.length
       ? '<div class="checkbox-list">' + candidates.map(({ record }) => '<label><input type="checkbox" value="' + esc(record.id) + '" ' + ((value || []).includes(record.id) ? "checked" : "") + '><span>' + esc(record.title) + '<small>' + esc(state.model.resources[record.type].title) + '</small></span></label>').join("") + '</div>'
-      : required ? '<select><option value="">No matching ' + esc(relationTypeLabel(field, true).toLowerCase()) + ' yet</option></select>' : '<div class="missing-options">No matching ' + esc(relationTypeLabel(field, true).toLowerCase()) + ' yet.</div>';
+      : required ? '<select><option value="">No matching ' + esc(relationTypeLabel(relationField, true).toLowerCase()) + ' yet</option></select>' : '<div class="missing-options">No matching ' + esc(relationTypeLabel(relationField, true).toLowerCase()) + ' yet.</div>';
     return fieldWrap(name, "relation-array", label, requiredMark, control, help, required);
   }
-  if (field.relation) {
-    const candidates = relationCandidates(field);
+  if (relation) {
+    const candidates = relationCandidates(relationField, type, name);
     control = candidates.length
-      ? '<select><option value="">Select ' + esc(relationTypeLabel(field).toLowerCase()) + '</option>' + candidates.map(({ record }) => '<option value="' + esc(record.id) + '" ' + (value === record.id ? "selected" : "") + '>' + esc(record.title) + ' · ' + esc(state.model.resources[record.type].title) + '</option>').join("") + '</select>'
-      : required ? '<select><option value="">No matching ' + esc(relationTypeLabel(field, true).toLowerCase()) + ' yet</option></select>' : '<div class="missing-options">No matching ' + esc(relationTypeLabel(field, true).toLowerCase()) + ' yet.</div>';
+      ? '<select><option value="">Select ' + esc(relationTypeLabel(relationField).toLowerCase()) + '</option>' + candidates.map(({ record }) => '<option value="' + esc(record.id) + '" ' + (value === record.id ? "selected" : "") + '>' + esc(record.title) + ' · ' + esc(state.model.resources[record.type].title) + '</option>').join("") + '</select>'
+      : required ? '<select><option value="">No matching ' + esc(relationTypeLabel(relationField, true).toLowerCase()) + ' yet</option></select>' : '<div class="missing-options">No matching ' + esc(relationTypeLabel(relationField, true).toLowerCase()) + ' yet.</div>';
     return fieldWrap(name, "relation", label, requiredMark, control, help, required);
   }
   if (name === "classificationId") {
@@ -3658,6 +3937,13 @@ function editorField(type, name, field, value, required, editing, oneOfRequired
       control = '<div class="structured-object-fields" data-object-type="' + esc(field.objectType) + '">' + objectPropertyFields(schema, value || {}) + '</div>';
       return fieldWrap(name, "structured-object", label, requiredMark, control, "Fill only the details that apply.", required);
     }
+    if (schema?.additionalProperties?.type === "string") {
+      control = stringMapEditor(value || {}, name, name === "reviewedSourceRevisions");
+      const mapHelp = name === "reviewedSourceRevisions"
+        ? "Bind the exact current JSON and Markdown revisions after reviewing every selected record."
+        : "Add one named value per row.";
+      return fieldWrap(name, "string-map", label, requiredMark, control, mapHelp, required);
+    }
     control = '<textarea spellcheck="false" placeholder="{ }">' + esc(value === undefined ? "" : JSON.stringify(value, null, 2)) + '</textarea>';
     return fieldWrap(name, "object", label, requiredMark, control, "JSON object", required);
   }
@@ -3752,10 +4038,11 @@ function objectArrayItem(schema, value = {}) {
   return '<fieldset class="object-array-item"><legend>' + esc(humanize(schema?.title || "Relationship")) + '</legend><div class="structured-object-fields">' + objectPropertyFields(schema, value) + '</div><button type="button" class="text-button" data-remove-object-item>Remove</button></fieldset>';
 }
 
-function stringMapEditor(value = {}, name = "item") {
+function stringMapEditor(value = {}, name = "item", bindCurrent = false) {
   const entries = Object.entries(value);
   const row = ([key = "", item = ""] = []) => '<div class="string-map-row"><input data-map-key value="' + esc(key) + '" placeholder="Name"><input data-map-value value="' + esc(item) + '" placeholder="Value"><button type="button" class="text-button" data-remove-string-map aria-label="Remove ' + esc(humanize(name).toLowerCase()) + '">Remove</button></div>';
-  return '<div class="string-map-editor"><div class="string-map-items">' + (entries.length ? entries.map(row).join("") : row()) + '</div><button type="button" class="button" data-add-string-map>Add ' + esc(humanize(name).replace(/s$/, "").toLowerCase()) + '</button><template>' + row() + '</template></div>';
+  const bind = bindCurrent ? '<button type="button" class="button" data-bind-review-revisions>Bind current revisions</button>' : "";
+  return '<div class="string-map-editor"><div class="string-map-items">' + (entries.length ? entries.map(row).join("") : row()) + '</div><div class="string-map-actions">' + bind + '<button type="button" class="button" data-add-string-map>Add ' + esc(humanize(name).replace(/s$/, "").toLowerCase()) + '</button></div><template>' + row() + '</template></div>';
 }
 
 function wireStructuredObjectEditors(dialog) {
@@ -3772,6 +4059,17 @@ function wireStructuredObjectEditors(dialog) {
     });
   });
   dialog.querySelector("form").addEventListener("click", (event) => {
+    const bind = event.target.closest("[data-bind-review-revisions]");
+    if (bind) {
+      const previousLabel = bind.textContent;
+      bindCurrentReviewRevisions(dialog, bind).catch((error) => {
+        dialog.querySelector(".dialog-error").textContent = error.message;
+      }).finally(() => {
+        bind.disabled = false;
+        if (bind.textContent === "Binding…") bind.textContent = previousLabel;
+      });
+      return;
+    }
     const add = event.target.closest("[data-add-string-map]");
     if (add) {
       const editor = add.closest(".string-map-editor");
@@ -3830,6 +4128,60 @@ function wireStructuredObjectEditors(dialog) {
   });
 }
 
+async function bindCurrentReviewRevisions(dialog, button) {
+  const selected = Object.fromEntries(["sourceResourceIds", "targetResourceIds", "informationTypeIds", "scopeResourceIds"].map((name) => [
+    name,
+    [...dialog.querySelectorAll('[data-field-group="' + name + '"] input[type="checkbox"]:checked')].map((input) => input.value)
+  ]));
+  const scheduleDocumentId = dialog.querySelector('[data-field-group="scheduleDocumentId"] select')?.value || "";
+  const mapping = Boolean(dialog.querySelector('[data-field-group="targetResourceIds"]'));
+  if (mapping && (!selected.sourceResourceIds.length || !selected.targetResourceIds.length)) {
+    throw new Error("Select records on both sides of the Requirement Mapping before binding their current revisions.");
+  }
+  if (!mapping && (!scheduleDocumentId || !selected.informationTypeIds.length || !selected.scopeResourceIds.length)) {
+    throw new Error("Select the retention schedule, Information Types, and operational scope before binding their current revisions.");
+  }
+  const ids = [...new Set(Object.values(selected).flat().concat(scheduleDocumentId, retentionUseReviewIds(dialog)).filter(Boolean))];
+  button.disabled = true;
+  button.textContent = "Binding…";
+  const query = ids.map((id) => "id=" + encodeURIComponent(id)).join("&");
+  const response = await localFetch("/api/review-revisions?" + query);
+  if (!response.ok) throw new Error(await responseMessage(response));
+  const { revisions } = await response.json();
+  const editor = button.closest(".string-map-editor");
+  const items = editor.querySelector(".string-map-items");
+  items.replaceChildren();
+  for (const [key, value] of Object.entries(revisions)) {
+    items.append(editor.querySelector("template").content.cloneNode(true));
+    const row = items.lastElementChild;
+    row.querySelector("[data-map-key]").value = key;
+    row.querySelector("[data-map-value]").value = value;
+  }
+  button.textContent = "Refresh current revisions";
+  dialog.querySelector(".dialog-error").textContent = "";
+}
+
+function retentionUseReviewIds(dialog) {
+  if (!dialog.querySelector('[data-field-group="scheduleDocumentId"]')) return [];
+  const informationTypeIds = new Set([...dialog.querySelectorAll('[data-field-group="informationTypeIds"] input:checked')].map(({ value }) => value));
+  const scopeIds = new Set([...dialog.querySelectorAll('[data-field-group="scopeResourceIds"] input:checked')].map(({ value }) => value));
+  const records = state.resources.map(({ record }) => record);
+  const programs = records.filter((record) => record.type === "program" && scopeIds.has(record.id));
+  const useIds = [];
+  for (const program of programs) {
+    const systemIds = new Set(program.systemIds || []);
+    const vendorIds = new Set(program.vendorIds || records
+      .filter((record) => record.type === "vendor" && record.status !== "retired")
+      .map(({ id }) => id));
+    for (const record of records) {
+      if (record.type === "system" && systemIds.has(record.id) && (record.informationTypeIds || []).some((id) => informationTypeIds.has(id))) useIds.push(record.id);
+      if (record.type === "component" && record.status !== "retired" && (record.systemUses || []).some(({ systemId }) => systemIds.has(systemId)) && (record.informationUses || []).some(({ informationTypeId }) => informationTypeIds.has(informationTypeId))) useIds.push(record.id);
+      if (record.type === "vendor" && vendorIds.has(record.id) && (record.informationTypeIds || []).some((id) => informationTypeIds.has(id))) useIds.push(record.id);
+    }
+  }
+  return useIds;
+}
+
 function readObjectProperty(field) {
   if (field.hidden) return undefined;
   const kind = field.dataset.objectKind;
@@ -4002,6 +4354,7 @@ function readGuidedRecord(dialog, base, fields) {
           .filter((item) => Object.keys(item).length);
       }
       else if (kind === "structured-object") value = readStructuredObject(group.querySelector(":scope > .structured-object-fields"));
+      else if (kind === "string-map") value = readStringMap(group.querySelector(":scope > .string-map-editor"));
       else if (kind === "object") value = raw.trim() ? JSON.parse(raw) : undefined;
       else if (kind === "boolean") value = raw === "" ? undefined : raw === "true";
       else if (kind === "integer") value = raw === "" ? undefined : Number(raw);
@@ -4018,8 +4371,16 @@ function readGuidedRecord(dialog, base, fields) {
   return record;
 }
 
-function relationCandidates(field) {
-  return state.resources.filter(({ record }) => field.relation.includes("*") || field.relation.includes(record.type));
+function relationCandidates(field, resourceType, fieldName) {
+  return state.resources.filter(({ record }) => {
+    if (!(field.relation.includes("*") || field.relation.includes(record.type))) return false;
+    if (resourceType === "retention-schedule-item" && fieldName === "scheduleDocumentId") {
+      return record.documentKind === "schedule"
+        && record.workflowScope === "program"
+        && !["superseded", "retired"].includes(record.status);
+    }
+    return true;
+  });
 }
 
 function relationTypeLabel(field, plural = false) {
@@ -4515,7 +4876,7 @@ function renderNotFound(main) {
 }
 function applyMutationState(result) {
   if (result?.state) {
-    state = result.state;
+    state = normalizeAppState(result.state);
   } else if (result?.stateRefresh) {
     applyFastMutationPatch(result);
     scheduleMutationStateRefresh();
@@ -4526,6 +4887,7 @@ function applyMutationState(result) {
 }
 
 function applyFastMutationPatch(result) {
+  state.stateToken = null;
   if (result.operation === "collection-review" && result.assessment?.resourceType) {
     state.collectionReviews[result.assessment.resourceType] = result.assessment;
   }
@@ -4538,6 +4900,12 @@ function applyFastMutationPatch(result) {
       state.resources.push({ record, content: {}, history: [], detailsLoaded: false });
     }
   }
+  for (const record of [result.workspace, result.program, result.system, result.renderer, result.commitment].filter(Boolean)) {
+    const entry = state.resources.find(({ record: current }) => current.id === record.id);
+    if (entry) entry.record = record;
+    else state.resources.push({ record, content: {}, history: [], detailsLoaded: false });
+    if (record.type === "workspace") state.workspace = record;
+  }
   if (result.synchronization) {
     state.repository = {
       ...state.repository,
@@ -4548,7 +4916,7 @@ function applyFastMutationPatch(result) {
       backgroundSynchronization: result.synchronization.status === "syncing" ? result.synchronization : null
     };
   }
-  state.readOnly = true;
+  if (result.synchronization?.status === "syncing") state.readOnly = true;
 }
 
 function scheduleMutationStateRefresh(delay = 0) {
@@ -4562,10 +4930,12 @@ async function refreshMutationState() {
   mutationStateRefreshInFlight = true;
   let retry = false;
   try {
-    const response = await fetch("/api/state");
+    const response = await fetch("/api/state/bootstrap");
     if (!response.ok) throw new Error(await responseMessage(response));
-    state = await response.json();
+    state = normalizeAppState(await response.json());
+    stateSectionRequests.clear();
     render();
+    loadStateForRoute();
     scheduleRepositorySyncPoll();
   } catch {
     retry = true;
@@ -4652,7 +5022,7 @@ function setMutationBusy(dialog, busy, label, idleLabel) {
   if (status) status.textContent = "";
   if (busy) {
     dialog._stillWorkingTimer = setTimeout(() => {
-      if (status) status.textContent = "Still working. Git sync and workspace checks can take a moment.";
+      if (status) status.textContent = "Still working. Recalculating readiness and repository state.";
     }, 1_500);
   }
 }
@@ -4860,7 +5230,7 @@ dialog::backdrop{background:rgba(0,0,24,.62)}
 .onboarding-git-status{display:flex;align-items:flex-start;gap:9px;margin:14px 25px 0;padding:10px 12px;border:1px solid var(--line);border-radius:7px;background:var(--surface-soft)}.onboarding-git-status .status-dot{margin-top:4px}.onboarding-git-status strong,.onboarding-git-status small{display:block}.onboarding-git-status strong{font-size:12px}.onboarding-git-status small{color:var(--muted);font-size:10.8px;line-height:1.45;margin-top:3px}.onboarding-git-status code{font-size:10.8px}
 .badge.status-overdue,.badge.status-blocked{background:#f7dfdc;color:#873027}.badge.status-due{background:#f6e8c9;color:#79500f}.badge.status-upcoming,.badge.status-proposed{background:var(--accent-soft);color:var(--accent)}.badge.status-complete{background:#dcefe4;color:#125733}
 .obligation-preview,.event-reminder-preview{display:grid;gap:8px}.obligation-preview a{display:flex;align-items:flex-start;gap:9px;text-decoration:none;padding:7px 0;border-top:1px solid var(--line)}.obligation-preview a:first-child{border-top:0;padding-top:0}.obligation-preview strong,.obligation-preview small,.event-reminder-preview strong,.event-reminder-preview small{display:block}.obligation-preview strong,.event-reminder-preview strong{font-size:12px}.obligation-preview small,.event-reminder-preview small{font-size:10.8px;color:var(--muted);margin-top:2px}.event-reminder-preview{grid-template-columns:repeat(2,minmax(0,1fr))}.event-reminder-preview a{padding:10px;border-radius:7px;background:var(--surface-soft);text-decoration:none}
-.obligation-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;align-items:start}.obligation-column{min-width:0}.obligation-column-head{display:flex;align-items:center;justify-content:space-between;margin:5px 1px 10px}.obligation-column-head>strong{font:500 26.4px Georgia,serif}.obligation-cards{display:grid;gap:9px}.obligation-card{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--accent-light);border-radius:9px;padding:14px;box-shadow:0 2px 8px rgba(21,40,33,.025)}.obligation-card.status-overdue,.obligation-card.status-blocked{border-left-color:var(--red)}.obligation-card.status-due{border-left-color:#d89021}.obligation-card-head{display:flex;justify-content:space-between;gap:8px;text-transform:uppercase;letter-spacing:.06em;font-size:9.6px;color:var(--muted)}.obligation-card-head strong{color:var(--ink);text-align:right}.obligation-card h3{font-size:14.4px;margin:9px 0 7px}.obligation-card h3 a{text-decoration:none}.obligation-card p{font-size:10.8px;line-height:1.5;color:var(--muted);margin:0}.obligation-links{margin-top:10px}.workflow-section{margin-top:30px}.section-head{display:flex;justify-content:space-between;margin-bottom:13px}.section-head h2{font:500 28.8px Georgia,serif;margin:6px 0}.section-head p:not(.kicker){font-size:13.2px;color:var(--muted);margin:0;max-width:720px}.policy-event-feedback{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;align-items:center;margin-top:14px;padding:12px 14px;border:1px solid #9ccfb2;border-radius:8px;background:#e7f5ec}.policy-event-feedback .status-dot{align-self:start;margin-top:4px}.policy-event-feedback strong,.policy-event-feedback p{display:block}.policy-event-feedback strong{font-size:12px}.policy-event-feedback p{margin:3px 0 0;color:#315d44;font-size:10.8px}.policy-event-feedback .icon-button{width:30px;height:30px}.policy-event-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.policy-event-more{margin-top:10px}.policy-event-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.policy-event-row[hidden]{display:none}.policy-event-name{min-width:0}.policy-event-title{display:flex;align-items:center;gap:6px;min-width:0}.policy-event-title>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.policy-event-guide{display:inline-flex;flex:0 0 auto}.policy-event-guide .guide-trigger{width:20px;height:20px}.policy-event-guide .guide-trigger svg{width:14px;height:14px}.policy-event-name strong,.policy-event-name>small{display:block}.policy-event-name strong{font-size:12px}.policy-event-name>small{margin-top:2px;color:var(--muted);font-size:9.6px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.policy-event-row>.button{flex:none;padding:7px 9px;font-size:10.8px}.policy-event-tooltip{position:absolute;z-index:8;top:calc(100% + 7px);left:0;width:min(420px,calc(100vw - 48px));padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(-3px);transition:opacity .12s,transform .12s,visibility 0s .12s;pointer-events:none}.policy-event-row:nth-child(3n) .policy-event-tooltip{right:0;left:auto}.policy-event-row:hover,.policy-event-row:focus-within{z-index:9}.policy-event-guide:hover .policy-event-tooltip,.policy-event-guide:focus-within .policy-event-tooltip{opacity:1;visibility:visible;transform:none;transition-delay:0s}.policy-event-tooltip>strong{font-size:12px}.policy-event-tooltip ol{display:grid;gap:7px;margin:9px 0 0;padding-left:20px}.policy-event-tooltip li span,.policy-event-tooltip li small{display:block}.policy-event-tooltip li span{font-size:10.8px}.policy-event-tooltip li small{margin-top:2px;color:var(--muted);font-size:9.6px;line-height:1.4}
+.obligation-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;align-items:start}.obligation-column{min-width:0}.obligation-column-head{display:flex;align-items:center;justify-content:space-between;margin:5px 1px 10px}.obligation-column-head>strong{font:500 26.4px Georgia,serif}.obligation-cards{display:grid;gap:9px}.obligation-card{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--accent-light);border-radius:9px;padding:14px;box-shadow:0 2px 8px rgba(21,40,33,.025)}.obligation-card.status-overdue,.obligation-card.status-blocked{border-left-color:var(--red)}.obligation-card.status-due{border-left-color:#d89021}.obligation-card-head{display:flex;justify-content:space-between;gap:8px;text-transform:uppercase;letter-spacing:.06em;font-size:9.6px;color:var(--muted)}.obligation-card-head strong{color:var(--ink);text-align:right}.obligation-card h3{font-size:14.4px;margin:9px 0 7px}.obligation-card h3 a{text-decoration:none}.obligation-card p{font-size:10.8px;line-height:1.5;color:var(--muted);margin:0}.obligation-links{margin-top:10px}.workflow-section{margin-top:30px}.operation-gate{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px;border:1px solid var(--accent-light);border-radius:12px;background:var(--accent-wash)}.operation-gate h2{margin:5px 0 7px;font:500 25px Georgia,serif}.operation-gate p:not(.kicker){margin:0;max-width:680px;color:var(--muted)}.operation-setup-preview>summary{margin-top:18px;padding:14px 16px;border:1px solid var(--line);border-radius:9px;background:var(--panel);font-weight:700;cursor:pointer}.operation-setup-preview[open]>summary{margin-bottom:0}.section-head{display:flex;justify-content:space-between;margin-bottom:13px}.section-head h2{font:500 28.8px Georgia,serif;margin:6px 0}.section-head p:not(.kicker){font-size:13.2px;color:var(--muted);margin:0;max-width:720px}.policy-event-feedback{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;align-items:center;margin-top:14px;padding:12px 14px;border:1px solid #9ccfb2;border-radius:8px;background:#e7f5ec}.policy-event-feedback .status-dot{align-self:start;margin-top:4px}.policy-event-feedback strong,.policy-event-feedback p{display:block}.policy-event-feedback strong{font-size:12px}.policy-event-feedback p{margin:3px 0 0;color:#315d44;font-size:10.8px}.policy-event-feedback .icon-button{width:30px;height:30px}.policy-event-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.policy-event-more{margin-top:10px}.policy-event-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.policy-event-row[hidden]{display:none}.policy-event-name{min-width:0}.policy-event-title{display:flex;align-items:center;gap:6px;min-width:0}.policy-event-title>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.policy-event-guide{display:inline-flex;flex:0 0 auto}.policy-event-guide .guide-trigger{width:20px;height:20px}.policy-event-guide .guide-trigger svg{width:14px;height:14px}.policy-event-name strong,.policy-event-name>small{display:block}.policy-event-name strong{font-size:12px}.policy-event-name>small{margin-top:2px;color:var(--muted);font-size:9.6px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.policy-event-row>.button{flex:none;padding:7px 9px;font-size:10.8px}.policy-event-tooltip{position:absolute;z-index:8;top:calc(100% + 7px);left:0;width:min(420px,calc(100vw - 48px));padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(-3px);transition:opacity .12s,transform .12s,visibility 0s .12s;pointer-events:none}.policy-event-row:nth-child(3n) .policy-event-tooltip{right:0;left:auto}.policy-event-row:hover,.policy-event-row:focus-within{z-index:9}.policy-event-guide:hover .policy-event-tooltip,.policy-event-guide:focus-within .policy-event-tooltip{opacity:1;visibility:visible;transform:none;transition-delay:0s}.policy-event-tooltip>strong{font-size:12px}.policy-event-tooltip ol{display:grid;gap:7px;margin:9px 0 0;padding-left:20px}.policy-event-tooltip li span,.policy-event-tooltip li small{display:block}.policy-event-tooltip li span{font-size:10.8px}.policy-event-tooltip li small{margin-top:2px;color:var(--muted);font-size:9.6px;line-height:1.4}
 .obligation-card-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:9px;margin-top:10px}.obligation-card-foot .obligation-links{margin-top:0;min-width:0}.obligation-action{flex:0 0 auto;border:0;border-radius:6px;background:var(--accent-soft);color:var(--accent);padding:7px 9px;font-family:inherit;font-size:10.8px;font-weight:700;line-height:1;text-decoration:none;cursor:pointer}.obligation-action:hover{filter:brightness(1.08)}.obligation-action.blocked{background:var(--surface-muted);color:var(--muted)}.obligation-more{width:100%;margin-top:9px}.workflow-section{scroll-margin-top:92px}
 .event-dialog label{display:block;margin-top:13px}.event-dialog label[hidden]{display:none}.event-dialog label>span{display:block;font-size:12px;font-weight:720;margin-bottom:6px}.event-dialog input,.event-dialog select,.event-dialog textarea{width:100%;min-height:40px;border:1px solid var(--line);border-radius:7px;background:var(--field);color:var(--ink);padding:9px 10px;font-size:14.4px}.event-dialog textarea{resize:vertical}.commit-dialog .form-grid label.full{grid-column:1/-1}.workflow-preview{margin-top:14px;padding:0 12px;border-radius:7px;background:var(--surface-soft)}.workflow-preview:not(:empty){padding-top:10px;padding-bottom:10px}.workflow-preview strong,.workflow-preview p{display:block;margin:0}.workflow-preview p{margin-top:5px;color:var(--muted);font-size:12px;line-height:1.5}.event-dialog-steps{display:grid;gap:6px;margin-top:15px;padding:10px;background:var(--surface-soft);border-radius:7px}.event-dialog-steps strong,.event-dialog-steps small{display:block}.event-dialog-steps strong{font-size:12px}.event-dialog-steps small{font-size:9.6px;color:var(--muted);margin-top:2px}
 .applicability-dialog{width:min(980px,calc(100vw - 30px));max-height:calc(100vh - 32px);border:0;border-radius:12px;padding:0;background:var(--panel);color:var(--ink);box-shadow:0 25px 80px rgba(0,0,24,.28)}.applicability-dialog form{padding:23px}.applicability-dialog form>p{color:var(--muted);font-size:13.2px}.applicability-dialog form>.applicability-baseline-note{padding:10px 12px;border-radius:7px;background:var(--accent-soft);color:var(--ink)}.review-context label>span{display:block;font-size:12px;font-weight:720;margin-bottom:6px}.review-context input,.review-context select,.applicability-row input,.applicability-row select{width:100%;min-height:38px;border:1px solid var(--line);border-radius:7px;background:var(--field);color:var(--ink);padding:8px 9px;font-size:13.2px}.review-context label.full{grid-column:1/-1}.applicability-rows{display:grid;gap:7px;max-height:46vh;overflow:auto;margin-top:16px;padding-right:4px}.applicability-row{display:grid;grid-template-columns:minmax(210px,1fr) 180px minmax(240px,1.3fr);gap:9px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:8px}.applicability-row strong,.applicability-row small{display:block}.applicability-row small{margin-top:3px;color:var(--muted);font-size:10.8px}.applicability-row .applicability-constraint{color:var(--accent);line-height:1.35}
@@ -4878,6 +5248,7 @@ dialog::backdrop{background:rgba(0,0,24,.62)}
 @media(max-width:520px){.applicability-dialog form{padding:18px}.applicability-row{grid-template-columns:1fr}.applicability-rows{max-height:42vh}}
 @media(max-width:760px){.workflow-findings{grid-template-columns:1fr}}
 .choice-tag{overflow-wrap:normal;font-size:10px}.form-field[data-kind="structured-object"],.string-map-property{grid-column:1/-1}.string-map-row .text-button{text-transform:none;letter-spacing:0;color:var(--muted);font-size:11px}
+.form-field[data-kind="string-map"]{grid-column:1/-1}.string-map-actions{display:flex;flex-wrap:wrap;gap:7px}
 @media(max-width:760px){.setup-banner>.button{justify-self:start}.setup-draft-state{justify-content:flex-start;flex-wrap:wrap;gap:12px 22px}.setup-draft-state .button{width:100%}}
 @media(max-width:760px){.string-map-row{grid-template-columns:1fr 1fr}.string-map-row .text-button{grid-column:1/-1;justify-self:start}}