diff --git a/src/components/agents/config/__tests__/PolicyDataDiffers.spec.ts b/src/components/agents/config/__tests__/PolicyDataDiffers.spec.ts
new file mode 100644
index 00000000..38da7c20
--- /dev/null
+++ b/src/components/agents/config/__tests__/PolicyDataDiffers.spec.ts
@@ -0,0 +1,119 @@
+// policy_data lists whose value differs between the instances' files carry the same
+// "differs across instances" warning as the other editors (FieldHints): a list edit writes one
+// list for every instance.
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import {
+  enableAutoUnmount,
+  flushPromises,
+  mount,
+  type VueWrapper,
+} from '@vue/test-utils';
+import { resetAgentDrafts } from '@/composables/agent-config/draftRegistry';
+import type { AgentInstanceDetail, ConfigDoc } from '@/types/agent-config';
+import {
+  baseConfig,
+  configRev7,
+  instanceDetailA,
+  instanceIds,
+} from '@/composables/agent-config/__tests__/fixtures';
+import { clone } from '@/utils/agent-config/merge-patch';
+import {
+  ADMIN,
+  READER,
+  fakeApi,
+  globalWith,
+  piniaWith,
+  workspaceHost,
+} from './helpers';
+
+vi.mock('@/components/code-editor', () => import('./codeEditorMock'));
+
+import PolicyDataSection from '../effective/PolicyDataSection.vue';
+import PolicyDataTree from '../effective/PolicyDataTree.vue';
+
+enableAutoUnmount(afterEach);
+
+const PD = '/plugins/local-ssh/policy_data';
+const POLICY_DATA = {
+  max_auth_tries: 4,
+  users: ['root', 'admin'],
+  ports: [22],
+};
+
+function detailWith(policyData: Record<string, unknown>): AgentInstanceDetail {
+  const base = clone(baseConfig) as ConfigDoc;
+  base.plugins!['local-ssh']!.policy_data = clone(policyData);
+  return { ...instanceDetailA, base, effective: base };
+}
+
+async function mountSection(perms: Record<string, string[]>) {
+  // ip-b's file has another user list and another max_auth_tries; the ports agree.
+  const api = fakeApi({
+    getConfig: vi.fn().mockResolvedValue({ ...configRev7, overlay: {} }),
+    getInstance: vi.fn(async (_a: string, id: string) =>
+      id === instanceIds.b
+        ? detailWith({ ...POLICY_DATA, max_auth_tries: 6, users: ['root'] })
+        : detailWith(POLICY_DATA),
+    ),
+  });
+  const host = workspaceHost(api, PolicyDataSection, () => ({
+    plugin: 'local-ssh',
+    reported: POLICY_DATA,
+    provenance: 'file',
+  }));
+  const wrapper = mount(host, { global: globalWith(piniaWith(perms)) });
+  await flushPromises();
+  return wrapper;
+}
+
+const differs = (w: VueWrapper, rel: string) =>
+  w.find(`[data-test="pd-differs-${PD}/${rel}"]`);
+
+describe('policy_data: lists that differ across instances', () => {
+  beforeEach(() => resetAgentDrafts());
+
+  it('warns on a list whose value differs between the files', async () => {
+    const w = await mountSection(ADMIN);
+    expect(w.find(`[data-test="pd-node-${PD}/users"]`).exists()).toBe(true);
+    expect(differs(w, 'users').text()).toBe('differs across instances');
+    // A list the files agree on, and a scalar (written at its own pointer), carry no warning.
+    expect(w.find(`[data-test="pd-node-${PD}/ports"]`).exists()).toBe(true);
+    expect(differs(w, 'ports').exists()).toBe(false);
+    expect(differs(w, 'max_auth_tries').exists()).toBe(false);
+  });
+
+  it('a differing list shows the hint and no scalar value span', async () => {
+    const w = await mountSection(ADMIN);
+    expect(differs(w, 'users').exists()).toBe(true);
+    expect(w.find(`[data-test="pd-value-${PD}/users"]`).exists()).toBe(false);
+    // A scalar still renders its value.
+    expect(w.find(`[data-test="pd-value-${PD}/max_auth_tries"]`).exists()).toBe(
+      true,
+    );
+  });
+
+  it('a container node renders no scalar value span', () => {
+    const w = mount(PolicyDataTree, {
+      props: {
+        value: { rules: { a: 1 }, list: [1, 2] },
+        ptr: '/plugins/p/policy_data',
+      },
+      global: globalWith(piniaWith(READER)),
+    });
+    expect(
+      w.find('[data-test="pd-node-/plugins/p/policy_data/rules"]').exists(),
+    ).toBe(true);
+    expect(
+      w.find('[data-test="pd-value-/plugins/p/policy_data/rules"]').exists(),
+    ).toBe(false);
+    expect(
+      w.find('[data-test="pd-value-/plugins/p/policy_data/list"]').exists(),
+    ).toBe(false);
+  });
+
+  it('is an editing hint: readers do not see it', async () => {
+    const w = await mountSection(READER);
+    expect(w.find(`[data-test="pd-node-${PD}/users"]`).exists()).toBe(true);
+    expect(differs(w, 'users').exists()).toBe(false);
+  });
+});
diff --git a/src/components/agents/config/effective/PolicyDataAddForm.vue b/src/components/agents/config/effective/PolicyDataAddForm.vue
new file mode 100644
index 00000000..155db8c0
--- /dev/null
+++ b/src/components/agents/config/effective/PolicyDataAddForm.vue
@@ -0,0 +1,139 @@
+<template>
+  <div class="py-0.5">
+    <button
+      v-if="!open"
+      type="button"
+      class="text-xs text-sky-700 hover:underline dark:text-sky-300"
+      :data-test="`pd-add-${testKey}`"
+      @click="open = true"
+    >
+      <i class="pi pi-plus mr-1 text-[0.65rem]" />{{
+        inArray ? 'Add item' : 'Add key'
+      }}
+    </button>
+    <form
+      v-else
+      class="flex flex-wrap items-start gap-2"
+      :data-test="`pd-add-form-${testKey}`"
+      @submit.prevent="submit"
+      @keydown.esc.prevent="close"
+    >
+      <InputText
+        v-if="!inArray"
+        v-model="key"
+        size="small"
+        class="w-40 font-mono"
+        placeholder="key"
+        :aria-label="`New key in ${where}`"
+        data-test="pd-new-key"
+      />
+      <label
+        v-if="itemType === 'boolean'"
+        class="inline-flex items-center gap-1.5 text-xs"
+      >
+        <input
+          v-model="checked"
+          type="checkbox"
+          aria-label="New value"
+          data-test="pd-new-value"
+        />
+        {{ checked ? 'true' : 'false' }}
+      </label>
+      <InputText
+        v-else
+        v-model="text"
+        size="small"
+        class="min-w-32 flex-1 font-mono"
+        :placeholder="itemType ? `${itemType} value` : 'value'"
+        :inputmode="itemType === 'number' ? 'decimal' : undefined"
+        aria-label="New value"
+        data-test="pd-new-value"
+      />
+      <SecondaryButton
+        size="small"
+        type="submit"
+        :disabled="!!error"
+        data-test="pd-add-submit"
+        >Add</SecondaryButton
+      >
+      <TertiaryButton size="small" type="button" @click="close"
+        >Cancel</TertiaryButton
+      >
+      <p
+        v-if="!itemType"
+        class="w-full text-xs text-gray-500 dark:text-slate-400"
+      >
+        A JSON value (5, true, [], {}, "text") keeps its type; anything else is
+        text.
+      </p>
+      <p
+        v-if="error && (key || text)"
+        class="w-full text-xs text-red-600 dark:text-red-400"
+        data-test="pd-add-error"
+      >
+        {{ error }}
+      </p>
+    </form>
+  </div>
+</template>
+
+<script setup lang="ts">
+// "Add key" / "Add item" of one object / array in the structured policy_data editor. There is
+// no type selector: a list whose items share a scalar type takes new items of that type;
+// otherwise the value is read as a JSON literal when it parses, else as text.
+import { computed, ref } from 'vue';
+import InputText from '@/volt/InputText.vue';
+import SecondaryButton from '@/volt/SecondaryButton.vue';
+import TertiaryButton from '@/volt/TertiaryButton.vue';
+import { parseNewValue, type JsonType } from '@/utils/agent-config/policy-data';
+import { NULL_KEY_ERROR } from './nullKeys';
+
+const props = defineProps<{
+  /** Adding to an array (no key) rather than an object. */
+  inArray: boolean;
+  /** The scalar type the new value must have (an array's items), or null. */
+  itemType: JsonType | null;
+  /** Keys already in the object (duplicates are refused). */
+  existing: readonly string[];
+  /** Human name of the container, for labels. */
+  where: string;
+  testKey: string;
+}>();
+const emit = defineEmits<{ add: [key: string | null, value: unknown] }>();
+
+const open = ref(false);
+const key = ref('');
+const text = ref('');
+const checked = ref(false);
+
+const parsed = computed(() =>
+  props.itemType === 'boolean'
+    ? { value: checked.value, error: '' }
+    : parseNewValue(text.value, props.itemType),
+);
+const error = computed(() => {
+  if (!props.inArray) {
+    if (!key.value) return 'Enter a key';
+    if (props.existing.includes(key.value)) return 'This key exists';
+  }
+  if (parsed.value.error) return parsed.value.error;
+  // RFC 7396: null at a key means "delete" in the overlay. Arrays are written whole, so their
+  // items may be null.
+  if (!props.inArray && parsed.value.value === null)
+    return `${NULL_KEY_ERROR}; use Remove`;
+  return '';
+});
+
+function close() {
+  open.value = false;
+  key.value = '';
+  text.value = '';
+  checked.value = false;
+}
+
+function submit() {
+  if (error.value) return;
+  emit('add', props.inArray ? null : key.value, parsed.value.value);
+  close();
+}
+</script>
diff --git a/src/components/agents/config/effective/PolicyDataNode.vue b/src/components/agents/config/effective/PolicyDataNode.vue
new file mode 100644
index 00000000..5a1cce3e
--- /dev/null
+++ b/src/components/agents/config/effective/PolicyDataNode.vue
@@ -0,0 +1,430 @@
+<template>
+  <li
+    :data-test="`pd-node-${ptr}`"
+    :data-pending="isChanged ? 'true' : undefined"
+  >
+    <div class="flex flex-wrap items-center gap-1.5 py-0.5">
+      <button
+        v-if="container"
+        type="button"
+        class="w-4 text-gray-500 hover:text-sky-700 dark:text-slate-400 dark:hover:text-sky-300"
+        :aria-expanded="expanded"
+        :aria-label="`${expanded ? 'Collapse' : 'Expand'} ${label}`"
+        :data-test="`pd-toggle-${ptr}`"
+        @click="expanded = !expanded"
+      >
+        <i
+          class="pi text-[0.65rem]"
+          :class="expanded ? 'pi-chevron-down' : 'pi-chevron-right'"
+        />
+      </button>
+      <span v-else class="w-4" />
+      <span
+        class="min-w-0 font-mono text-xs break-all"
+        :class="
+          inArray
+            ? 'text-gray-400 dark:text-slate-500'
+            : 'text-gray-700 dark:text-slate-300'
+        "
+        >{{ label }}</span
+      >
+      <span
+        v-if="editable && !editing && !maskLocked"
+        class="inline-flex shrink-0 gap-0.5"
+        data-test="pd-actions"
+      >
+        <button
+          v-if="!container && type !== 'null'"
+          type="button"
+          class="rounded p-0.5 text-gray-500 hover:bg-slate-200 hover:text-sky-700 dark:text-slate-400 dark:hover:bg-slate-700 dark:hover:text-sky-300"
+          :aria-label="`Edit ${label}`"
+          :data-test="`pd-edit-${ptr}`"
+          @click="startEdit"
+        >
+          <i class="pi pi-pencil text-[0.65rem]" />
+        </button>
+        <button
+          type="button"
+          class="rounded p-0.5 text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-500/10"
+          :aria-label="`Remove ${label}`"
+          :data-test="`pd-remove-${ptr}`"
+          @click="$emit('remove', ptr)"
+        >
+          <i class="pi pi-trash text-[0.65rem]" />
+        </button>
+      </span>
+      <template v-if="!editing">
+        <template v-if="container">
+          <span class="text-xs text-gray-500 dark:text-slate-400">{{
+            summary
+          }}</span>
+          <span
+            v-if="differs"
+            class="text-[0.7rem] text-gray-500 dark:text-slate-400"
+            :data-test="`pd-differs-${ptr}`"
+            >differs across instances</span
+          >
+        </template>
+        <template v-else-if="masked">
+          <span class="font-mono text-xs text-gray-500 dark:text-slate-400">{{
+            value
+          }}</span>
+          <ConfigPill
+            v-tooltip.top="MASKED_TOOLTIP"
+            severity="secondary"
+            tabindex="0"
+            :aria-label="MASKED_TOOLTIP"
+            data-test="pd-masked"
+            >masked</ConfigPill
+          >
+        </template>
+        <span
+          v-else-if="typeof value === 'string'"
+          class="font-mono text-xs break-all text-gray-900 dark:text-slate-200"
+          :data-test="`pd-value-${ptr}`"
+          >"<template v-for="(seg, i) in segments" :key="i"
+            ><mark
+              v-if="seg.env"
+              class="rounded bg-violet-100 px-0.5 text-violet-800 dark:bg-violet-500/20 dark:text-violet-200"
+              data-test="pd-env"
+              >{{ seg.text }}</mark
+            ><template v-else>{{ seg.text }}</template></template
+          >"</span
+        >
+        <span
+          v-else
+          class="font-mono text-xs"
+          :class="SCALAR_CLASSES[type]"
+          :data-test="`pd-value-${ptr}`"
+          >{{ scalarText(value) }}</span
+        >
+        <ConfigPill
+          v-if="hasEnv"
+          v-tooltip.top="ENV_TOOLTIP"
+          severity="warn"
+          tabindex="0"
+          :aria-label="ENV_TOOLTIP"
+          data-test="pd-env-pill"
+          >env</ConfigPill
+        >
+      </template>
+      <i
+        v-if="listHasMask && !maskLocked"
+        v-tooltip.top="MASKED_LIST_TOOLTIP"
+        role="img"
+        tabindex="0"
+        class="pi pi-lock text-xs text-gray-400 dark:text-slate-500"
+        :aria-label="MASKED_LIST_TOOLTIP"
+        :data-test="`pd-masked-list-${ptr}`"
+      />
+      <AccessIcon
+        v-if="note"
+        :state="note.state"
+        :text="note.text"
+        :test-id="`pd-access-${ptr}`"
+      />
+      <PendingPill
+        v-if="isChanged"
+        compact
+        :undo-label="`Undo the pending change to ${label}`"
+        :test-id="`pd-pending-${ptr}`"
+        :undo-test-id="`pd-undo-${ptr}`"
+        @undo="tree!.revert(ptr)"
+      />
+    </div>
+
+    <form
+      v-if="editing"
+      class="ml-6 flex flex-wrap items-start gap-2 py-1"
+      :data-test="`pd-edit-form-${ptr}`"
+      @submit.prevent="apply"
+      @keydown.esc.prevent="editing = false"
+    >
+      <label
+        v-if="editType === 'boolean'"
+        class="inline-flex items-center gap-1.5 text-xs"
+      >
+        <input
+          v-model="checked"
+          type="checkbox"
+          :aria-label="`Value of ${label}`"
+          data-test="pd-edit-value"
+        />
+        {{ checked ? 'true' : 'false' }}
+      </label>
+      <InputText
+        v-else
+        v-model="text"
+        size="small"
+        class="min-w-40 flex-1 font-mono"
+        :inputmode="editType === 'number' ? 'decimal' : undefined"
+        :placeholder="masked ? 'masked; type a new value' : ''"
+        :aria-label="`Value of ${label}`"
+        data-test="pd-edit-value"
+      />
+      <PrimaryButton
+        size="small"
+        type="submit"
+        :disabled="!!editError"
+        data-test="pd-edit-apply"
+        >Apply</PrimaryButton
+      >
+      <TertiaryButton size="small" type="button" @click="editing = false"
+        >Cancel</TertiaryButton
+      >
+      <p
+        v-if="editError"
+        class="w-full text-xs text-red-600 dark:text-red-400"
+        data-test="pd-edit-error"
+      >
+        {{ editError }}
+      </p>
+    </form>
+
+    <template v-if="container && expanded">
+      <ul
+        class="ml-2 border-l border-ccf-300 pl-3 dark:border-slate-700"
+        :aria-label="label"
+      >
+        <PolicyDataNode
+          v-for="child in shownChildren"
+          :key="child.ptr"
+          :label="Array.isArray(value) ? `[${child.key}]` : String(child.key)"
+          :value="child.value"
+          :ptr="child.ptr"
+          :depth="depth + 1"
+          :in-array="Array.isArray(value)"
+          :mask-locked="maskLocked || listHasMask"
+          @set="onChildSet"
+          @remove="onChildRemove"
+        />
+        <li v-if="hiddenCount" class="py-0.5">
+          <button
+            type="button"
+            class="text-xs text-sky-700 hover:underline dark:text-sky-300"
+            :data-test="`pd-show-all-${ptr}`"
+            @click="showAll = true"
+          >
+            Show {{ hiddenCount }} more
+          </button>
+        </li>
+        <li
+          v-if="!children.length"
+          class="py-0.5 text-xs text-gray-500 dark:text-slate-400"
+        >
+          {{ Array.isArray(value) ? 'No items.' : 'No keys.' }}
+        </li>
+      </ul>
+      <div v-if="editable && !maskLocked && !listHasMask" class="ml-5">
+        <PolicyDataAddForm
+          :in-array="Array.isArray(value)"
+          :item-type="Array.isArray(value) ? itemType(value) : null"
+          :existing="children.map((c) => String(c.key))"
+          :where="label"
+          :test-key="ptr"
+          @add="addChild"
+        />
+      </div>
+    </template>
+  </li>
+</template>
+
+<script setup lang="ts">
+// One key / array item of the structured policy_data view (recursive), with its own pencil,
+// remove and (for objects / arrays) add actions. A value keeps its JSON type when edited
+// (text for strings, a number check for numbers, a checkbox for booleans); changing a type is
+// done in the raw JSON view. Object keys are written at their own pointer; an array item edit
+// is emitted as the whole new array at the array's pointer (RFC 7396), and the draft shows it
+// as an element change. Objects / arrays collapse beyond COLLAPSE_DEPTH or COLLAPSE_SIZE.
+import { computed, inject, ref, watch } from 'vue';
+import InputText from '@/volt/InputText.vue';
+import { TOOLTIPS } from '@/config/tooltips';
+import PrimaryButton from '@/volt/PrimaryButton.vue';
+import TertiaryButton from '@/volt/TertiaryButton.vue';
+import { escapeToken, parsePointer } from '@/utils/agent-config/json-pointer';
+import { clone, isPlainObject } from '@/utils/agent-config/merge-patch';
+import {
+  CHILD_PAGE,
+  containsMask,
+  envRefs,
+  envSegments,
+  isContainer,
+  isMasked,
+  itemType,
+  jsonType,
+  parseScalar,
+  removeIn,
+  scalarText,
+  setIn,
+  sizeOf,
+  startsCollapsed,
+  type JsonType,
+} from '@/utils/agent-config/policy-data';
+import ConfigPill from '../ConfigPill.vue';
+import AccessIcon from './AccessIcon.vue';
+import PendingPill from './PendingPill.vue';
+import PolicyDataAddForm from './PolicyDataAddForm.vue';
+import { POLICY_DATA_TREE_KEY } from './policyDataContext';
+
+const props = defineProps<{
+  label: string;
+  value: unknown;
+  ptr: string;
+  depth: number;
+  /** An array item (its label is the index). */
+  inArray: boolean;
+  /**
+   * Inside a list that holds a masked value: the list can only be written whole (RFC 7396),
+   * which would copy the mask, so its items are not edited here (the raw view can, by
+   * retyping the masked values).
+   */
+  maskLocked?: boolean;
+}>();
+const emit = defineEmits<{
+  set: [ptr: string, value: unknown];
+  remove: [ptr: string];
+}>();
+
+const tree = inject(POLICY_DATA_TREE_KEY, null);
+
+const MASKED_TOOLTIP = TOOLTIPS['agents.config.policyData.masked'];
+const ENV_TOOLTIP = TOOLTIPS['agents.config.policyData.env'];
+const MASKED_LIST_TOOLTIP = TOOLTIPS['agents.config.policyData.maskedList'];
+const SCALAR_CLASSES: Partial<Record<JsonType, string>> = {
+  number: 'text-sky-800 dark:text-sky-200',
+  boolean: 'text-amber-800 dark:text-amber-200',
+  null: 'text-gray-500 italic dark:text-slate-400',
+};
+
+const type = computed(() => jsonType(props.value));
+const container = computed(() => isContainer(props.value));
+const masked = computed(() => isMasked(props.value));
+const segments = computed(() =>
+  typeof props.value === 'string' ? envSegments(props.value) : [],
+);
+const hasEnv = computed(
+  () => typeof props.value === 'string' && envRefs(props.value).length > 0,
+);
+const summary = computed(() => {
+  const n = sizeOf(props.value);
+  return Array.isArray(props.value)
+    ? `${n} item${n === 1 ? '' : 's'}`
+    : `${n} key${n === 1 ? '' : 's'}`;
+});
+
+const editable = computed(() => !!tree && tree.canEdit(props.ptr));
+const note = computed(() => tree?.accessNote(props.ptr) ?? null);
+/** A list holding a masked value (at any depth): its items are locked (see maskLocked). */
+const listHasMask = computed(
+  () => Array.isArray(props.value) && containsMask(props.value),
+);
+const isChanged = computed(() => !!tree && tree.changed(props.ptr));
+/**
+ * An editable list whose value differs between the instances' files: any edit writes one list
+ * for every instance (RFC 7396), as PolicySourcesEditor warns for policies.
+ */
+const differs = computed(
+  () =>
+    Array.isArray(props.value) &&
+    editable.value &&
+    !!tree?.differs?.(props.ptr),
+);
+
+const expanded = ref(!startsCollapsed(props.depth, props.value));
+const showAll = ref(false);
+const children = computed(() => {
+  const v = props.value;
+  const at = (k: string | number) => `${props.ptr}/${escapeToken(String(k))}`;
+  if (Array.isArray(v)) {
+    return v.map((value, key) => ({ key, value, ptr: at(key) }));
+  }
+  if (isPlainObject(v)) {
+    return Object.entries(v).map(([key, value]) => ({
+      key,
+      value,
+      ptr: at(key),
+    }));
+  }
+  return [];
+});
+const shownChildren = computed(() =>
+  showAll.value ? children.value : children.value.slice(0, CHILD_PAGE),
+);
+const hiddenCount = computed(
+  () => children.value.length - shownChildren.value.length,
+);
+
+// ---- Editing one value, keeping its type ----
+const editing = ref(false);
+/** The type the editor keeps: a masked value is replaced by a string. */
+const editType = computed<JsonType>(() =>
+  masked.value ? 'string' : type.value,
+);
+const text = ref('');
+const checked = ref(false);
+
+// Array items are keyed by index: after a sibling is removed (or an undo splices the list)
+// this node shows another item, so an open editor would write the old text over it. Close it,
+// and re-derive the collapsed state when the value's kind changes.
+watch(
+  () => props.value,
+  (next, prev) => {
+    editing.value = false;
+    if (jsonType(next) !== jsonType(prev)) {
+      expanded.value = !startsCollapsed(props.depth, next);
+    }
+  },
+);
+
+function startEdit() {
+  text.value = masked.value ? '' : scalarText(props.value);
+  checked.value = props.value === true;
+  editing.value = true;
+}
+
+const editError = computed(() => {
+  if (editType.value === 'boolean') return '';
+  if (masked.value && !text.value) {
+    return 'Type a new value, or Cancel to keep the host value';
+  }
+  return parseScalar(text.value, editType.value).error;
+});
+
+function apply() {
+  if (editError.value) return;
+  const next =
+    editType.value === 'boolean'
+      ? checked.value
+      : parseScalar(text.value, editType.value).value;
+  editing.value = false;
+  emit('set', props.ptr, next);
+}
+
+// ---- Children: a change anywhere inside an array becomes the whole new array (RFC 7396) ----
+/** `childPtr` relative to this node, or null when this node is not an array. */
+function inside(childPtr: string): string[] | null {
+  if (!Array.isArray(props.value)) return null;
+  return parsePointer(childPtr).slice(parsePointer(props.ptr).length);
+}
+
+function onChildSet(childPtr: string, v: unknown) {
+  const rel = inside(childPtr);
+  if (!rel) emit('set', childPtr, v);
+  else emit('set', props.ptr, setIn(props.value as unknown[], rel, v));
+}
+
+function onChildRemove(childPtr: string) {
+  const rel = inside(childPtr);
+  if (!rel) emit('remove', childPtr);
+  else emit('set', props.ptr, removeIn(props.value as unknown[], rel));
+}
+
+function addChild(key: string | null, v: unknown) {
+  expanded.value = true;
+  if (Array.isArray(props.value)) {
+    emit('set', props.ptr, [...clone(props.value), v]);
+  } else {
+    emit('set', `${props.ptr}/${escapeToken(key ?? '')}`, v);
+  }
+}
+</script>
diff --git a/src/components/agents/config/effective/PolicyDataSection.vue b/src/components/agents/config/effective/PolicyDataSection.vue
new file mode 100644
index 00000000..e3226948
--- /dev/null
+++ b/src/components/agents/config/effective/PolicyDataSection.vue
@@ -0,0 +1,222 @@
+<template>
+  <div
+    class="min-w-0"
+    :data-test="`field-${ptr}`"
+    :data-state="access.state"
+    :data-pending="pending ? 'true' : undefined"
+  >
+    <div class="flex flex-wrap items-center gap-2">
+      <span class="text-gray-500 dark:text-slate-400">Policy data</span>
+      <span>{{ keyCount }} key{{ keyCount === 1 ? '' : 's' }}</span>
+      <ProvenanceBadge v-if="provenance !== 'file'" :provenance="provenance" />
+      <AccessIcon v-if="showAccess" :state="access.state" :text="accessText" />
+      <PendingPill
+        v-if="pending"
+        undo-label="Undo the pending changes to policy data"
+        :test-id="`pending-${ptr}`"
+        :undo-test-id="`undo-${ptr}`"
+        @undo="ws!.draft.revertPointer(ptr)"
+      />
+      <SelectButton
+        v-if="editable"
+        class="ml-auto"
+        :model-value="mode"
+        :options="modeOptions"
+        option-label="label"
+        option-value="value"
+        option-disabled="disabled"
+        :allow-empty="false"
+        :aria-label="`Policy data view for ${plugin}`"
+        data-test="policy-data-mode"
+        @update:model-value="setMode"
+      />
+    </div>
+    <PolicyDataTree
+      v-if="mode === 'structured' && (keyCount || editable)"
+      class="mt-1 pl-3"
+      :value="shown"
+      :ptr="ptr"
+      :label="`Policy data of ${plugin}`"
+      :test-id="`policy-data-view-${plugin}`"
+    />
+    <div v-else-if="mode === 'raw'" class="mt-2 space-y-1">
+      <CodeEditor
+        :model-value="text"
+        language="json"
+        min-height="140px"
+        max-height="320px"
+        :label="`Policy data for ${plugin}`"
+        @update:model-value="onInput"
+      />
+      <p
+        v-if="error"
+        class="text-xs text-red-600 dark:text-red-400"
+        data-test="policy-data-error"
+      >
+        {{ error }} Fix the JSON to switch back to the structured view.
+      </p>
+      <div>
+        <button
+          v-if="inOverlay"
+          type="button"
+          class="text-xs text-sky-700 hover:underline dark:text-sky-300"
+          data-test="policy-data-reset"
+          @click="reset"
+        >
+          Use the file value
+        </button>
+      </div>
+    </div>
+    <FieldIssues v-if="editable" :ptr="ptr" />
+  </div>
+</template>
+
+<script setup lang="ts">
+// A plugin's policy_data on the Effective view (R69, R71): a structured tree in which each key
+// and list item is edited, removed or added on its own (PolicyDataNode), and a raw JSON view
+// for type changes and bulk edits. Both record only the real changes as a minimal merge patch
+// (policy-data-patch.ts, through the draft's setValue / removeValue / applyOps); an untouched
+// masked report value never reaches the overlay (R25). Each pointer carries its R71 access
+// (the tree notes a pointer only where it differs from this section's state). Without a
+// workspace or agent:configure it is a read-only view of the reported value.
+import { computed, provide, ref, watch } from 'vue';
+import SelectButton from '@/volt/SelectButton.vue';
+import { CodeEditor } from '@/components/code-editor';
+import { useWorkspace } from '@/composables/agent-config/useConfigWorkspace';
+import { getAt, hasAt, pointer } from '@/utils/agent-config/json-pointer';
+import {
+  deepEqual,
+  isPlainObject,
+  type PlainObject,
+} from '@/utils/agent-config/merge-patch';
+import { diffOps } from '@/utils/agent-config/policy-data-patch';
+import { hasUnstorableNumber } from '@/utils/agent-config/policy-data';
+import { accessTooltip, fieldAccess } from '@/utils/agent-config/field-access';
+import type { Provenance } from '@/utils/agent-config/provenance';
+import ProvenanceBadge from '../ProvenanceBadge.vue';
+import FieldIssues from '../editor/FieldIssues.vue';
+import { useEditor } from '../editor/useEditor';
+import AccessIcon from './AccessIcon.vue';
+import PendingPill from './PendingPill.vue';
+import { NULL_KEY_ERROR, opsSetNullKey } from './nullKeys';
+import PolicyDataTree from './PolicyDataTree.vue';
+import { POLICY_DATA_TREE_KEY } from './policyDataContext';
+
+const props = defineProps<{
+  plugin: string;
+  /** The reported (effective) policy_data of the shown instance. */
+  reported: unknown;
+  provenance: Provenance;
+}>();
+
+const ws = useWorkspace();
+// The shared editor helpers need the workspace's draft and context (absent when read-only).
+const editor = ws ? useEditor() : null;
+const ptr = computed(() => pointer('plugins', props.plugin, 'policy_data'));
+
+const access = computed(() =>
+  ws ? ws.accessAt(ptr.value) : fieldAccess(ptr.value, []),
+);
+const accessText = computed(() => accessTooltip(access.value));
+const showAccess = computed(
+  () => !!ws && ws.ready.value && ws.canConfigure.value,
+);
+const editable = computed(
+  () => !!ws && ws.ready.value && ws.canEditPointer(ptr.value),
+);
+const pending = computed(() => !!ws && ws.draft.pendingAt(ptr.value));
+const inOverlay = computed(
+  () => !!ws && hasAt(ws.draft.overlay.value, ptr.value),
+);
+
+/** Editors see the draft's effective value (their edits included); readers the report. */
+const shown = computed<PlainObject>(() => {
+  const v = editable.value
+    ? getAt(ws!.draft.effectiveDraft.value, ptr.value)
+    : props.reported;
+  return isPlainObject(v) ? v : {};
+});
+const keyCount = computed(() => Object.keys(shown.value).length);
+
+provide(POLICY_DATA_TREE_KEY, {
+  canEdit: (p) => editable.value && ws!.canEditPointer(p),
+  accessNote: (p) => {
+    if (!showAccess.value) return null;
+    const a = ws!.accessAt(p);
+    if (a.state === access.value.state) return null;
+    if (a.state !== 'restricted' && a.state !== 'readonly') return null;
+    return { state: a.state, text: accessTooltip(a) };
+  },
+  changed: (p) => !!ws && ws.draft.changedPaths.value.includes(p),
+  revert: (p) => ws?.draft.revertPointer(p),
+  set: (p, v) => ws?.draft.setValue(p, v, ptr.value),
+  remove: (p) => ws?.draft.removeValue(p),
+  differs: (p) => !!editor && editor.differsAcrossInstances(p),
+});
+
+// ---- Structured / raw JSON ----
+const error = ref('');
+const mode = ref<'structured' | 'raw'>('structured');
+const modeOptions = computed(() => [
+  { label: 'Structured', value: 'structured', disabled: !!error.value },
+  { label: 'Raw JSON', value: 'raw', disabled: false },
+]);
+function currentText(): string {
+  return JSON.stringify(shown.value, null, 2);
+}
+const text = ref(currentText());
+
+function setMode(next: 'structured' | 'raw') {
+  if (next === 'structured' && error.value) return;
+  if (next === 'raw') text.value = currentText();
+  mode.value = next;
+}
+
+// Follow external changes (structured edits, undo, raw YAML) without clobbering in-progress
+// invalid text.
+watch(shown, (v) => {
+  if (error.value) return;
+  try {
+    if (deepEqual(JSON.parse(text.value), v)) return;
+  } catch {
+    return;
+  }
+  text.value = currentText();
+});
+
+function onInput(value: string) {
+  text.value = value;
+  let parsed: unknown;
+  try {
+    parsed = value.trim() ? JSON.parse(value) : {};
+  } catch (e) {
+    error.value = `Invalid JSON: ${(e as Error).message}.`;
+    return;
+  }
+  if (!isPlainObject(parsed)) {
+    error.value = 'Policy data must be a JSON object.';
+    return;
+  }
+  // 1e999 parses as Infinity (saved as null, an RFC 7396 delete) and big integers lose digits.
+  if (hasUnstorableNumber(parsed)) {
+    error.value =
+      'A number cannot be saved as typed (not finite, or more digits than 2^53); quote it to keep it as text.';
+    return;
+  }
+  // Only what really changed, at the pointers that changed.
+  const ops = diffOps(ptr.value, shown.value, parsed);
+  // A new null at a key would record a deletion (RFC 7396); nulls inside arrays are kept.
+  if (opsSetNullKey(ops)) {
+    error.value = `${NULL_KEY_ERROR}: delete the key instead.`;
+    return;
+  }
+  error.value = '';
+  ws?.draft.applyOps(ops, ptr.value);
+}
+
+function reset() {
+  ws?.draft.unset(ptr.value);
+  error.value = '';
+  text.value = currentText();
+}
+</script>
diff --git a/src/components/agents/config/effective/PolicyDataTree.vue b/src/components/agents/config/effective/PolicyDataTree.vue
new file mode 100644
index 00000000..19c803a9
--- /dev/null
+++ b/src/components/agents/config/effective/PolicyDataTree.vue
@@ -0,0 +1,54 @@
+<template>
+  <div class="text-sm" :data-test="testId">
+    <ul v-if="entries.length" :aria-label="label">
+      <PolicyDataNode
+        v-for="[key, value] in entries"
+        :key="key"
+        :label="key"
+        :value="value"
+        :ptr="`${ptr}/${escapeToken(key)}`"
+        :depth="0"
+        :in-array="false"
+        @set="(p, v) => tree?.set(p, v)"
+        @remove="(p) => tree?.remove(p)"
+      />
+    </ul>
+    <p v-else class="text-xs text-gray-500 dark:text-slate-400">No keys.</p>
+    <PolicyDataAddForm
+      v-if="tree?.canEdit(ptr)"
+      class="ml-5"
+      :in-array="false"
+      :item-type="null"
+      :existing="entries.map(([k]) => k)"
+      :where="label"
+      test-key="root"
+      @add="(k, v) => tree?.set(`${ptr}/${escapeToken(k ?? '')}`, v)"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+// Structured view of a plugin's policy_data: nested objects as collapsible key/value groups,
+// arrays as lists. With a PolicyDataTreeContext provided (PolicyDataSection) every key and
+// item is editable on its own; without one it only displays. Keys are used verbatim.
+import { computed, inject } from 'vue';
+import type { PlainObject } from '@/utils/agent-config/merge-patch';
+import { escapeToken } from '@/utils/agent-config/json-pointer';
+import PolicyDataNode from './PolicyDataNode.vue';
+import PolicyDataAddForm from './PolicyDataAddForm.vue';
+import { POLICY_DATA_TREE_KEY } from './policyDataContext';
+
+const props = withDefaults(
+  defineProps<{
+    value: PlainObject;
+    /** The policy_data pointer the keys live under. */
+    ptr: string;
+    label?: string;
+    testId?: string;
+  }>(),
+  { label: 'Policy data', testId: 'policy-data-tree' },
+);
+
+const tree = inject(POLICY_DATA_TREE_KEY, null);
+const entries = computed(() => Object.entries(props.value));
+</script>
diff --git a/src/components/agents/config/effective/policyDataContext.ts b/src/components/agents/config/effective/policyDataContext.ts
new file mode 100644
index 00000000..30e2f442
--- /dev/null
+++ b/src/components/agents/config/effective/policyDataContext.ts
@@ -0,0 +1,27 @@
+// What the structured policy_data tree needs from its owner (PolicyDataSection): per-pointer
+// edit rights and access notes, pending markers, and the edits themselves. Without a provider
+// (read-only contexts) the tree only displays.
+
+import type { InjectionKey } from 'vue';
+
+export interface PolicyDataTreeContext {
+  /** Whether the value at `ptr` may be edited (agent:configure and R71 access). */
+  canEdit(ptr: string): boolean;
+  /** R71 note for `ptr` when it differs from the section's own state ('' otherwise). */
+  accessNote(
+    ptr: string,
+  ): { state: 'restricted' | 'readonly'; text: string } | null;
+  /** The draft changes exactly this pointer (an element of a list included). */
+  changed(ptr: string): boolean;
+  /** Undo the pending change at `ptr`. */
+  revert(ptr: string): void;
+  /** Set the effective value at `ptr` (arrays are passed whole). */
+  set(ptr: string, value: unknown): void;
+  /** Remove the key at `ptr`. */
+  remove(ptr: string): void;
+  /** The instances' files differ at `ptr` (an array edit writes one list for all of them). */
+  differs?(ptr: string): boolean;
+}
+
+export const POLICY_DATA_TREE_KEY: InjectionKey<PolicyDataTreeContext> =
+  Symbol('policy-data-tree');