diff --git a/apps/editor/src/app/App.tsx b/apps/editor/src/app/App.tsx
index e54c7ad..7eeaf37 100644
--- a/apps/editor/src/app/App.tsx
+++ b/apps/editor/src/app/App.tsx
@@ -10,7 +10,7 @@ import { getAppConfig } from '@/app/config'
 import { CaseApiClient, type CfDocumentSummary } from '@/infrastructure/caseApi/CaseApiClient'
 import { createFetchHttpClient } from '@/infrastructure/caseApi/http'
 import { loadFrameworkFromCfPackage } from '@/application/framework/services/FrameworkLoader'
-import { toReactFlowGraph, extractLayoutFromCfPackage, extractEditorSettingsFromCfPackage } from '@/ui/editor/reactflow/mapping'
+import { toReactFlowGraph, extractLayoutFromCfPackage, extractEditorSettingsFromCfPackage, extractRemoteFrameworkDataFromCfPackage, normalizeLinkedFrameworkColors } from '@/ui/editor/reactflow/mapping'
 import { frameworkToCfPackage, toOpenCaseFormat } from '@/application/framework/mappers/case/toCasePackage'
 import type { LayoutState } from '@/ui/editor/reactflow/mapping'
 import type { CaseVersion } from '@/application/framework/mappers/case/CasePackageSnapshot'
@@ -201,6 +201,19 @@ function AppInner() {
     setRoute('login')
   }, [authStatus, route])
 
+  // SSO: ensure default tenant membership when org_id claim matches (idempotent).
+  const ensureSelfAttempted = useRef<string | null>(null)
+  useEffect(() => {
+    if (authStatus !== 'authenticated' || !tenantId) return
+    const key = tenantId
+    if (ensureSelfAttempted.current === key) return
+    ensureSelfAttempted.current = key
+    void api.ensureSelfMembership({ tenantId }).catch((err: unknown) => {
+      // Expected when org_id claim is absent (non-SSO / local users).
+      console.debug('[App] ensure-self skipped or failed:', err)
+    })
+  }, [authStatus, tenantId, api])
+
   // Fetch the full definitions catalogue from the management endpoint once authenticated.
   useEffect(() => {
     if (authStatus !== 'authenticated' || !tenantId) return
@@ -371,6 +384,9 @@ function AppInner() {
 
         // Create a HomeFramework entry from the domain Framework
         const fw = createHomeFrameworkFromDomain(framework, mirrorStatus)
+        if (pkg.CFDocument?.extensions) {
+          fw.cfDocument = { ...fw.cfDocument, extensions: pkg.CFDocument.extensions }
+        }
 
         // Store the extracted layout
         if (layout) {
@@ -459,7 +475,13 @@ function AppInner() {
 
     // Get the stored layout for this framework (from CASE extensions)
     const layout = frameworkLayouts[activeFramework.id]
-    const graph = toReactFlowGraph({ framework: activeFramework.framework, layout })
+    const remoteEditorData = extractRemoteFrameworkDataFromCfPackage({
+      CFDocument: activeFramework.cfDocument,
+      CFItems: [],
+      CFAssociations: [],
+    })
+    remoteEditorData.linkedFrameworks = normalizeLinkedFrameworkColors(remoteEditorData.linkedFrameworks)
+    const graph = toReactFlowGraph({ framework: activeFramework.framework, layout, remoteEditorData })
 
     // If no saved layout, detect topology and apply appropriate layout
     if (!layout) {
diff --git a/apps/editor/src/application/framework/mappers/case/toCasePackage.ts b/apps/editor/src/application/framework/mappers/case/toCasePackage.ts
index 81f64b3..a1ed9d6 100644
--- a/apps/editor/src/application/framework/mappers/case/toCasePackage.ts
+++ b/apps/editor/src/application/framework/mappers/case/toCasePackage.ts
@@ -82,14 +82,12 @@ function makePackageUri(uuid: string): string {
 type OpencaseExtension = {
   layout?: NodeLayout
   notes?: string
-  /** Persisted handle ID on the origin (from) node — preserves user-defined edge anchors */
   originHandle?: string
-  /** Persisted handle ID on the destination (to) node — preserves user-defined edge anchors */
   destinationHandle?: string
-  /** Edge rendering style for this framework (e.g. 'default', 'smoothstep', 'straight') */
   edgeType?: string
-  /** Visual color band hex color for item nodes */
   colorBand?: string
+  linkedFrameworks?: unknown[]
+  remoteItemLinks?: unknown[]
 }
 
 /**
@@ -103,7 +101,7 @@ function mergeOpencaseExtension(
   const extensions = { ...base }
   
   // Only add if there's data to store
-  if (opencaseData.layout || opencaseData.notes || opencaseData.originHandle || opencaseData.destinationHandle || opencaseData.edgeType || opencaseData.colorBand) {
+  if (opencaseData.layout || opencaseData.notes || opencaseData.originHandle || opencaseData.destinationHandle || opencaseData.edgeType || opencaseData.colorBand || opencaseData.linkedFrameworks || opencaseData.remoteItemLinks) {
     const existing = (extensions[OPENCASE_EXT_KEY] as OpencaseExtension | undefined) ?? {}
     extensions[OPENCASE_EXT_KEY] = {
       ...existing,
@@ -121,7 +119,7 @@ function frameworkToCfDocument(
   framework: Framework,
   caseVersion: CaseVersion,
   layout?: NodeLayout,
-  options?: { edgeType?: string }
+  options?: { edgeType?: string; linkedFrameworks?: unknown[]; remoteItemLinks?: unknown[] }
 ): CFDocument {
   const meta = framework.metadata
   const fwId = String(framework.id)
@@ -156,8 +154,13 @@ function frameworkToCfDocument(
       title: docTitle,
       identifier: fwId,
     },
-    extensions: (layout || options?.edgeType)
-      ? mergeOpencaseExtension(undefined, { layout, edgeType: options?.edgeType })
+    extensions: (layout || options?.edgeType || options?.linkedFrameworks || options?.remoteItemLinks)
+      ? mergeOpencaseExtension(undefined, {
+          layout,
+          edgeType: options?.edgeType,
+          linkedFrameworks: options?.linkedFrameworks,
+          remoteItemLinks: options?.remoteItemLinks,
+        })
       : undefined,
   }
 
@@ -264,6 +267,7 @@ function associationToCfAssociation(
   }
 
   const existingExtensions = (md.extensions as CaseExtensions | undefined) ?? undefined
+  const remoteExt = (existingExtensions?.[OPENCASE_EXT_KEY] as { remoteLink?: boolean; remoteItemUri?: string; remoteItemIdentifier?: string; remoteLabel?: string; localItemUri?: string } | undefined)
 
   // Persist user-defined edge handle positions in ext:opencase
   const originHandle = s('originHandle')
@@ -272,21 +276,35 @@ function associationToCfAssociation(
     ? mergeOpencaseExtension(existingExtensions, { originHandle, destinationHandle })
     : existingExtensions
 
+  const isRemoteLink = remoteExt?.remoteLink === true
+
   const cfAssociation: CFAssociation & { sourcedId: string } = {
     identifier: assocId,
     sourcedId: assocId, // OpenCASE requires sourcedId
     uri: s('caseUri') ?? `urn:case:association:${assocId}`,
     associationType: assoc.associationType,
-    originNodeURI: {
-      identifier: fromId,
-      uri: s('originUri') ?? `urn:case:item:${fromId}`,
-      title: fromTitle,
-    },
-    destinationNodeURI: {
-      identifier: toId,
-      uri: s('destinationUri') ?? `urn:case:item:${toId}`,
-      title: toTitle,
-    },
+    originNodeURI: isRemoteLink
+      ? {
+          identifier: fromId,
+          uri: remoteExt?.localItemUri ?? s('originUri') ?? `urn:case:item:${fromId}`,
+          title: fromTitle,
+        }
+      : {
+          identifier: fromId,
+          uri: s('originUri') ?? `urn:case:item:${fromId}`,
+          title: fromTitle,
+        },
+    destinationNodeURI: isRemoteLink
+      ? {
+          identifier: remoteExt?.remoteItemIdentifier ?? toId,
+          uri: remoteExt?.remoteItemUri ?? s('destinationUri') ?? `urn:case:item:${toId}`,
+          title: remoteExt?.remoteLabel ?? toTitle,
+        }
+      : {
+          identifier: toId,
+          uri: s('destinationUri') ?? `urn:case:item:${toId}`,
+          title: toTitle,
+        },
     sequenceNumber: n('sequenceNumber'),
     CFAssociationGroupingURI: s('CFAssociationGroupingIdentifier')
       ? {
@@ -334,13 +352,19 @@ export function frameworkToCfPackage(params: {
   cfAssociationGroupings?: CFAssociationGrouping[]
   /** CFLicense definitions to include in CFDefinitions (from editor state) */
   cfLicenses?: CFLicense[]
+  /** Remote framework editor data from canvas */
+  remoteEditorData?: { linkedFrameworks: unknown[]; remoteItemLinks: unknown[] }
 }): CFPackage {
-  const { framework, caseVersion, layout, edgeType, cfItemTypes, cfSubjects, cfConcepts, cfAssociationGroupings, cfLicenses } = params
+  const { framework, caseVersion, layout, edgeType, cfItemTypes, cfSubjects, cfConcepts, cfAssociationGroupings, cfLicenses, remoteEditorData } = params
   const fwId = String(framework.id)
 
   // Build CFDocument
   const documentLayout = layout?.byNodeId?.[fwId]
-  const document = frameworkToCfDocument(framework, caseVersion, documentLayout, { edgeType })
+  const document = frameworkToCfDocument(framework, caseVersion, documentLayout, {
+    edgeType,
+    linkedFrameworks: remoteEditorData?.linkedFrameworks,
+    remoteItemLinks: remoteEditorData?.remoteItemLinks,
+  })
 
   // Build CFItems
   const itemIds = Array.from(framework.items.keys()).map(String)
diff --git a/apps/editor/src/infrastructure/auth/tokenScopes.test.ts b/apps/editor/src/infrastructure/auth/tokenScopes.test.ts
new file mode 100644
index 0000000..c3017c9
--- /dev/null
+++ b/apps/editor/src/infrastructure/auth/tokenScopes.test.ts
@@ -0,0 +1,36 @@
+import { describe, expect, it } from 'vitest'
+import { tokenHasCaseOwner } from './tokenScopes'
+
+function makeToken (payload: Record<string, unknown>): string {
+  const header = Buffer.from(JSON.stringify({ alg: 'none' })).toString('base64url')
+  const body = Buffer.from(JSON.stringify(payload)).toString('base64url')
+  return `${header}.${body}.sig`
+}
+
+describe('tokenScopes', () => {
+  it('detects case.owner from scope claim', () => {
+    expect(tokenHasCaseOwner(makeToken({ scope: 'case.read case.owner' }))).toBe(true)
+  })
+
+  it('detects admin membership role as tenant admin', () => {
+    expect(tokenHasCaseOwner(makeToken({
+      resource_access: { 'tenant-demo': { roles: ['admin'] } },
+    }))).toBe(true)
+  })
+
+  it('detects case.owner from resource_access roles', () => {
+    expect(tokenHasCaseOwner(makeToken({
+      resource_access: { 'tenant-demo': { roles: ['case.owner'] } },
+    }))).toBe(true)
+  })
+
+  it('returns false for author-only tokens', () => {
+    expect(tokenHasCaseOwner(makeToken({ scope: 'case.read case.write author' }))).toBe(false)
+  })
+
+  it('detects case.admin (system admin) as tenant admin for UI', () => {
+    expect(tokenHasCaseOwner(makeToken({
+      resource_access: { 'tenant-system': { roles: ['case.admin'] } },
+    }))).toBe(true)
+  })
+})
diff --git a/apps/editor/src/infrastructure/auth/tokenScopes.ts b/apps/editor/src/infrastructure/auth/tokenScopes.ts
new file mode 100644
index 0000000..eb27897
--- /dev/null
+++ b/apps/editor/src/infrastructure/auth/tokenScopes.ts
@@ -0,0 +1,71 @@
+/**
+ * Decode a JWT payload without verifying signature (UI gating only).
+ * Server always enforces scopes.
+ */
+export function decodeJwtPayload (accessToken: string | null | undefined): Record<string, unknown> | null {
+  if (!accessToken) return null
+  const parts = accessToken.split('.')
+  if (parts.length < 2) return null
+  try {
+    const json = base64UrlDecode(parts[1])
+    return JSON.parse(json) as Record<string, unknown>
+  } catch {
+    return null
+  }
+}
+
+function base64UrlDecode (input: string): string {
+  let base64 = input.replaceAll('-', '+').replaceAll('_', '/')
+  const pad = base64.length % 4
+  if (pad === 2) base64 += '=='
+  else if (pad === 3) base64 += '='
+  else if (pad === 1) base64 += '===' // invalid length; atob may still throw
+  return atob(base64)
+}
+
+function collectScopes (payload: Record<string, unknown>): Set<string> {
+  const scopes = new Set<string>()
+  const raw = payload.scope
+  if (typeof raw === 'string') {
+    for (const s of raw.split(' ').filter(Boolean)) scopes.add(s)
+  } else if (Array.isArray(raw)) {
+    for (const s of raw) if (typeof s === 'string') scopes.add(s)
+  }
+
+  const realmAccess = payload.realm_access as { roles?: unknown } | undefined
+  if (Array.isArray(realmAccess?.roles)) {
+    for (const r of realmAccess.roles) if (typeof r === 'string') scopes.add(r)
+  }
+
+  const resourceAccess = payload.resource_access
+  if (resourceAccess && typeof resourceAccess === 'object') {
+    for (const client of Object.values(resourceAccess as Record<string, { roles?: unknown }>)) {
+      const roles = client?.roles
+      if (Array.isArray(roles)) {
+        for (const r of roles) if (typeof r === 'string') scopes.add(r)
+      }
+    }
+  }
+
+  // Membership labels + case.* hierarchy (matches OpenCASE middleware)
+  if (scopes.has('admin') || scopes.has('case.owner')) {
+    scopes.add('case.owner')
+    scopes.add('case.write')
+    scopes.add('case.read')
+  } else if (scopes.has('author') || scopes.has('case.write')) {
+    scopes.add('case.write')
+    scopes.add('case.read')
+  } else if (scopes.has('viewer') || scopes.has('case.read')) {
+    scopes.add('case.read')
+  }
+
+  return scopes
+}
+
+/** True when the access token can manage tenant members/keys (owner, membership admin, or system case.admin). */
+export function tokenHasCaseOwner (accessToken: string | null | undefined): boolean {
+  const payload = decodeJwtPayload(accessToken)
+  if (!payload) return false
+  const scopes = collectScopes(payload)
+  return scopes.has('case.owner') || scopes.has('admin') || scopes.has('case.admin')
+}
diff --git a/apps/editor/src/infrastructure/caseApi/CaseApiClient.ts b/apps/editor/src/infrastructure/caseApi/CaseApiClient.ts
index 8eeebf1..27d15d8 100644
--- a/apps/editor/src/infrastructure/caseApi/CaseApiClient.ts
+++ b/apps/editor/src/infrastructure/caseApi/CaseApiClient.ts
@@ -1,5 +1,8 @@
 import type { CFDocument, CFLicense, CFPackage, CFDefinition } from '@/domain/case/types'
 import type { HttpClient } from './http'
+import type { CgeImportResult, CachedFrameworkItemSummary } from './cgeTypes'
+export type { CgeImportResult, CachedFrameworkItemSummary, CgeFrameworkSummary, CgeSubscriptionSummary } from './cgeTypes'
+export { normalizeCgeFrameworkList, normalizeCgeSubscriptionList } from './cgeTypes'
 
 export type OpenCaseCfPackageResponse = { CFPackage: CFPackage }
 
@@ -51,6 +54,8 @@ export type CfDocumentSummary = {
   caseVersion?: string
   /** Server-level archive flag — independent of CASE adoptionStatus */
   archived?: boolean
+  readOnly?: boolean
+  cgeFrameworkId?: string
   /** OpenCASE-proprietary data (e.g. sourcePackageURI/isModifiedFromSource for the mirror/fork badge) — only present when the request sends X-CASE-EDITOR. */
   extensions?: { 'ext:opencase'?: OpenCaseListExtensions }
 }
@@ -68,15 +73,61 @@ export class CaseApiClient {
     return {}
   }
 
-  async listManagementCfPackages(params: { tenantId: string; caseVersion?: '1.0' | '1.1' }): Promise<OpenCaseManagementCfPackageSummary[]> {
+  async lookupTenantByOrgId(params: { orgId: string }): Promise<{ tenantId?: string } | null> {
+    const orgId = params.orgId.trim()
+    if (!orgId) return null
+    const res = (await this._http.get(`/public/tenant-lookup?orgId=${encodeURIComponent(orgId)}`)) as unknown
+    if (!res || typeof res !== 'object') return null
+    const any = res as { tenantId?: unknown }
+    if (typeof any.tenantId === 'string' && any.tenantId.trim()) return { tenantId: any.tenantId.trim() }
+    return {}
+  }
+
+  /**
+   * SSO first-login: assign default author roles when org_id claim matches tenant.
+   * Idempotent. Caller should re-authenticate if status is `assigned`.
+   */
+  async ensureSelfMembership(params: { tenantId: string }): Promise<{
+    status: string
+    role?: string
+    scopes?: string[]
+    note?: string
+  }> {
+    return (await this._http.post(
+      `/management/tenants/${encodeURIComponent(params.tenantId)}/members/ensure-self`,
+      {},
+    )) as { status: string; role?: string; scopes?: string[]; note?: string }
+  }
+
+  async listManagementCfPackages(params: { tenantId: string; caseVersion?: '1.0' | '1.1' }): Promise<CfDocumentSummary[]> {
     const caseVersion = params.caseVersion ?? '1.1'
     const res = (await this._http.get(`/management/tenants/${encodeURIComponent(params.tenantId)}/CFPackages?caseVersion=${encodeURIComponent(caseVersion)}`)) as unknown
 
-    // Be tolerant of shape differences: `{ CFPackages: [...] }` or `[...]`.
-    if (Array.isArray(res)) return res as OpenCaseManagementCfPackageSummary[]
+    if (res && typeof res === 'object' && 'frameworks' in res && Array.isArray((res as { frameworks: unknown }).frameworks)) {
+      return ((res as { frameworks: Array<Record<string, unknown>> }).frameworks).map((f) => ({
+        identifier: String(f.sourcedId ?? f.identifier ?? ''),
+        title: typeof f.title === 'string' ? f.title : undefined,
+        creator: typeof f.creator === 'string' ? f.creator : undefined,
+        description: typeof f.description === 'string' ? f.description : undefined,
+        frameworkType: typeof f.frameworkType === 'string' ? f.frameworkType : undefined,
+        adoptionStatus: typeof f.adoptionStatus === 'string' ? f.adoptionStatus : undefined,
+        subject: typeof f.subject === 'string' ? f.subject : undefined,
+        version: typeof f.version === 'string' ? f.version : undefined,
+        lastChangeDateTime: typeof f.lastChangeDateTime === 'string' ? f.lastChangeDateTime : undefined,
+        caseVersion: typeof f.caseVersion === 'string' ? f.caseVersion : undefined,
+        readOnly: f.readOnly === true,
+        cgeFrameworkId: typeof f.cgeFrameworkId === 'string' ? f.cgeFrameworkId : undefined,
+        extensions: (f.extensions && typeof f.extensions === 'object')
+          ? f.extensions as { 'ext:opencase'?: OpenCaseListExtensions }
+          : undefined,
+      }))
+    }
+
+    // Legacy tolerance
+    if (Array.isArray(res)) return res as CfDocumentSummary[]
     if (res && typeof res === 'object' && 'CFPackages' in res) {
       const any = res as { CFPackages?: unknown }
-      if (Array.isArray(any.CFPackages)) return any.CFPackages as OpenCaseManagementCfPackageSummary[]
+      if (Array.isArray(any.CFPackages)) return any.CFPackages as CfDocumentSummary[]
     }
     return []
   }
@@ -380,6 +431,321 @@ export class CaseApiClient {
     const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/api-keys/${encodeURIComponent(params.keyId)}`
     await this._http.delete(url)
   }
+
+  // ── Member Management ───────────────────────────────────────────
+
+  /**
+   * List tenant members (Keycloak users with client roles).
+   * Requires `case.owner` scope.
+   */
+  async listMembers(params: { tenantId: string }): Promise<TenantMember[]> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/members`
+    const res = (await this._http.get(url)) as unknown
+    if (res && typeof res === 'object' && 'members' in res) {
+      const obj = res as { members?: unknown }
+      if (Array.isArray(obj.members)) return obj.members as TenantMember[]
+    }
+    return []
+  }
+
+  /**
+   * Add or ensure a member by email and assign a role.
+   * New users get a temporary password (returned once) and must change it on first login.
+   * Requires `case.owner` scope.
+   */
+  async createMember(params: {
+    tenantId: string
+    email: string
+    role: TenantMemberRole
+  }): Promise<TenantMember & {
+    temporaryPassword: string | null
+    mustChangePassword: boolean
+    created: boolean
+  }> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/members`
+    const res = (await this._http.post(url, {
+      email: params.email,
+      role: params.role,
+    })) as unknown
+    if (res && typeof res === 'object') {
+      const obj = res as {
+        userId?: string
+        email?: string
+        role?: TenantMemberRole
+        scopes?: string[]
+        temporaryPassword?: string | null
+        mustChangePassword?: boolean
+        created?: boolean
+      }
+      if (obj.userId && obj.role) {
+        return {
+          userId: obj.userId,
+          email: obj.email ?? params.email,
+          username: null,
+          role: obj.role,
+          scopes: obj.scopes ?? [],
+          temporaryPassword: obj.temporaryPassword ?? null,
+          mustChangePassword: obj.mustChangePassword === true,
+          created: obj.created === true,
+        }
+      }
+    }
+    throw new Error('Unexpected create member response')
+  }
+
+  /**
+   * Update a member's role.
+   * Requires `case.owner` scope.
+   */
+  async updateMember(params: {
+    tenantId: string
+    userId: string
+    role: TenantMemberRole
+  }): Promise<TenantMember> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/members/${encodeURIComponent(params.userId)}`
+    const res = (await this._http.patch(url, { role: params.role })) as unknown
+    if (res && typeof res === 'object') {
+      const obj = res as { userId?: string; email?: string | null; role?: TenantMemberRole; scopes?: string[] }
+      if (obj.userId && obj.role) {
+        return {
+          userId: obj.userId,
+          email: obj.email ?? null,
+          username: null,
+          role: obj.role,
+          scopes: obj.scopes ?? [],
+        }
+      }
+    }
+    throw new Error('Unexpected update member response')
+  }
+
+  /**
+   * Remove a member's roles for this tenant.
+   * Requires `case.owner` scope.
+   */
+  async deleteMember(params: { tenantId: string; userId: string }): Promise<void> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/members/${encodeURIComponent(params.userId)}`
+    await this._http.delete(url)
+  }
+
+  // ── CASE Global (CGE) credentials ───────────────────────────────
+
+  /**
+   * Get public CGE credential status for a tenant (never returns the secret).
+   * Requires `case.owner` (or `case.admin`).
+   */
+  async getCgeCredentials(params: { tenantId: string }): Promise<CgeCredentialsPublic> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/credentials`
+    const res = (await this._http.get(url)) as unknown
+    if (res && typeof res === 'object') {
+      const obj = res as CgeCredentialsPublic
+      return {
+        configured: obj.configured === true,
+        clientIdMasked: obj.clientIdMasked ?? null,
+        discoveryUrl: obj.discoveryUrl ?? null,
+        updatedAt: obj.updatedAt ?? null,
+      }
+    }
+    return {
+      configured: false,
+      clientIdMasked: null,
+      discoveryUrl: null,
+      updatedAt: null,
+    }
+  }
+
+  /**
+   * Store / replace CGE org API key and OpenID discovery URL.
+   * Requires `case.owner` (or `case.admin`).
+   * Omit `clientSecret` (or pass empty) when updating discovery/clientId and keeping the existing secret.
+   */
+  async putCgeCredentials(params: {
+    tenantId: string
+    clientId: string
+    clientSecret?: string
+    discoveryUrl: string
+  }): Promise<CgeCredentialsPublic> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/credentials`
+    const res = (await this._http.put(url, {
+      clientId: params.clientId,
+      clientSecret: params.clientSecret ?? '',
+      discoveryUrl: params.discoveryUrl,
+    })) as unknown
+    if (res && typeof res === 'object') {
+      const obj = res as CgeCredentialsPublic
+      return {
+        configured: obj.configured === true,
+        clientIdMasked: obj.clientIdMasked ?? null,
+        discoveryUrl: obj.discoveryUrl ?? null,
+        updatedAt: obj.updatedAt ?? null,
+      }
+    }
+    throw new Error('Unexpected CGE credentials response')
+  }
+
+  /**
+   * Delete stored CGE credentials for a tenant.
+   * Requires `case.owner` (or `case.admin`).
+   */
+  async deleteCgeCredentials(params: { tenantId: string }): Promise<void> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/credentials`
+    await this._http.delete(url)
+  }
+
+  /**
+   * Test CGE credentials by minting a client_credentials token.
+   * Requires `case.owner` (or `case.admin`).
+   */
+  async testCgeCredentials(params: { tenantId: string }): Promise<{ ok: boolean; message: string }> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/credentials/test`
+    const res = (await this._http.post(url, {})) as unknown
+    if (res && typeof res === 'object') {
+      const obj = res as { ok?: boolean; message?: string }
+      return { ok: obj.ok === true, message: obj.message ?? '' }
+    }
+    return { ok: false, message: 'Unexpected test response' }
+  }
+
+  // ── CASE Global (CGE) framework discovery + cache ─────────────────
+
+  async listCgeFrameworks(params: {
+    tenantId: string
+    /** Coalition API `search` param (title/id text search). */
+    search?: string
+    /** @deprecated Use `search` — kept for backward compatibility. */
+    q?: string
+    limit?: number
+    page?: number
+    /** @deprecated Use `page` — converted server-side when present. */
+    offset?: number
+    region?: string
+    sector?: string
+    sort?: 'title' | 'published_at' | 'created_at'
+    order?: 'asc' | 'desc'
+  }): Promise<unknown> {
+    const qs = new URLSearchParams()
+    const search = params.search ?? params.q
+    if (search) qs.set('search', search)
+    if (params.limit != null) qs.set('limit', String(params.limit))
+    if (params.page != null) qs.set('page', String(params.page))
+    if (params.offset != null) qs.set('offset', String(params.offset))
+    if (params.region) qs.set('region', params.region)
+    if (params.sector) qs.set('sector', params.sector)
+    if (params.sort) qs.set('sort', params.sort)
+    if (params.order) qs.set('order', params.order)
+    const query = qs.toString()
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/frameworks${query ? `?${query}` : ''}`
+    return await this._http.get(url)
+  }
+
+  async getCgeFramework(params: { tenantId: string; frameworkId: string }): Promise<unknown> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/frameworks/${encodeURIComponent(params.frameworkId)}`
+    return await this._http.get(url)
+  }
+
+  async listCgeSubscriptions(params: { tenantId: string }): Promise<unknown> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/subscriptions`
+    return await this._http.get(url)
+  }
+
+  async createCgeSubscription(params: {
+    tenantId: string
+    frameworkId: string
+  }): Promise<unknown> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/subscriptions`
+    return await this._http.post(url, { frameworkId: params.frameworkId })
+  }
+
+  async importCgeFramework(params: {
+    tenantId: string
+    frameworkId: string
+    sourceUri?: string
+    registryId?: string
+    readOnly?: boolean
+    subscribe?: boolean
+    refresh?: boolean
+    linkedFromDocId?: string
+    caseVersion?: '1.0' | '1.1'
+    skipPublisherAuth?: boolean
+  }): Promise<CgeImportResult> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/import`
+    const res = (await this._http.post(url, {
+      frameworkId: params.frameworkId,
+      sourceUri: params.sourceUri,
+      registryId: params.registryId,
+      readOnly: params.readOnly ?? true,
+      subscribe: params.subscribe ?? false,
+      refresh: params.refresh ?? false,
+      linkedFromDocId: params.linkedFromDocId,
+      caseVersion: params.caseVersion ?? '1.1',
+      skipPublisherAuth: params.skipPublisherAuth ?? false,
+    })) as unknown
+    if (res && typeof res === 'object') {
+      const obj = res as CgeImportResult
+      return {
+        status: obj.status ?? 'imported',
+        id: obj.id ?? obj.docId ?? '',
+        docId: obj.docId ?? obj.id ?? '',
+        version: obj.version,
+        cgeFrameworkId: obj.cgeFrameworkId,
+        title: obj.title,
+        sourceUri: obj.sourceUri,
+        itemCount: obj.itemCount,
+        cachedAt: obj.cachedAt,
+        readOnly: obj.readOnly,
+        fromCache: obj.fromCache,
+      }
+    }
+    throw new Error('Unexpected CGE import response')
+  }
+
+  async refreshCgeCache(params: {
+    tenantId: string
+    frameworkId: string
+    skipPublisherAuth?: boolean
+  }): Promise<CgeImportResult> {
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/frameworks/${encodeURIComponent(params.frameworkId)}/refresh`
+    const res = (await this._http.post(url, {
+      skipPublisherAuth: params.skipPublisherAuth ?? false,
+    })) as unknown
+    if (res && typeof res === 'object') {
+      const obj = res as CgeImportResult
+      return {
+        status: obj.status ?? 'refreshed',
+        id: obj.id ?? obj.docId ?? '',
+        docId: obj.docId ?? obj.id ?? '',
+        cgeFrameworkId: obj.cgeFrameworkId,
+        title: obj.title,
+        sourceUri: obj.sourceUri,
+        itemCount: obj.itemCount,
+        cachedAt: obj.cachedAt,
+      }
+    }
+    throw new Error('Unexpected CGE refresh response')
+  }
+
+  async searchCachedFrameworkItems(params: {
+    tenantId: string
+    docId: string
+    q?: string
+    limit?: number
+    caseVersion?: '1.0' | '1.1'
+  }): Promise<{ items: CachedFrameworkItemSummary[] }> {
+    const qs = new URLSearchParams()
+    if (params.q) qs.set('q', params.q)
+    if (params.limit != null) qs.set('limit', String(params.limit))
+    if (params.caseVersion) qs.set('caseVersion', params.caseVersion)
+    const query = qs.toString()
+    const url = `/management/tenants/${encodeURIComponent(params.tenantId)}/cge/cache/${encodeURIComponent(params.docId)}/items${query ? `?${query}` : ''}`
+    const res = (await this._http.get(url)) as unknown
+    if (res && typeof res === 'object') {
+      const items = (res as Record<string, unknown>).items
+      if (Array.isArray(items)) {
+        return { items: items as CachedFrameworkItemSummary[] }
+      }
+    }
+    return { items: [] }
+  }
 }
 
 /** Summary of an API key returned by the list endpoint. */
@@ -389,3 +755,20 @@ export type ApiKeySummary = {
   description: string
 }
 
+export type TenantMemberRole = 'viewer' | 'author' | 'admin'
+
+export type TenantMember = {
+  userId: string
+  email: string | null
+  username?: string | null
+  role: TenantMemberRole | null
+  scopes: string[]
+}
+
+export type CgeCredentialsPublic = {
+  configured: boolean
+  clientIdMasked: string | null
+  discoveryUrl: string | null
+  updatedAt: string | null
+}
+
diff --git a/apps/editor/src/infrastructure/caseApi/cgeTypes.test.ts b/apps/editor/src/infrastructure/caseApi/cgeTypes.test.ts
new file mode 100644
index 0000000..85f20d6
--- /dev/null
+++ b/apps/editor/src/infrastructure/caseApi/cgeTypes.test.ts
@@ -0,0 +1,50 @@
+import { describe, expect, it } from 'vitest'
+import { normalizeCgeFrameworkList, normalizeCgeSubscriptionList } from './cgeTypes'
+
+describe('normalizeCgeFrameworkList', () => {
+  it('reads coalition list responses wrapped in data', () => {
+    const result = normalizeCgeFrameworkList({
+      data: [
+        {
+          id: '4d669795-c669-46a0-9527-50b360911230',
+          frameworkId: '094a6795-78f7-454b-8d68-32b97a88b0cf',
+          title: 'Skills-First Roles',
+          providerName: '1EdTech',
+          sourceUri: 'https://example.com/pkg',
+          version: null,
+        },
+      ],
+      pagination: { page: 1, limit: 30, total: 1, totalPages: 1 },
+    })
+
+    expect(result).toEqual([
+      {
+        frameworkId: '094a6795-78f7-454b-8d68-32b97a88b0cf',
+        registryId: '4d669795-c669-46a0-9527-50b360911230',
+        title: 'Skills-First Roles',
+        publisher: '1EdTech',
+        version: undefined,
+        sourceUri: 'https://example.com/pkg',
+        subscribed: false,
+        description: undefined,
+      },
+    ])
+  })
+
+  it('supports legacy frameworks array shape', () => {
+    const result = normalizeCgeFrameworkList({
+      frameworks: [{ frameworkId: 'fw-1', title: 'Legacy', publisher: 'Org' }],
+    })
+    expect(result).toHaveLength(1)
+    expect(result[0]?.frameworkId).toBe('fw-1')
+  })
+})
+
+describe('normalizeCgeSubscriptionList', () => {
+  it('reads subscriptions wrapped in data', () => {
+    const result = normalizeCgeSubscriptionList({
+      data: [{ frameworkId: 'fw-1', status: 'active' }],
+    })
+    expect(result).toEqual([{ frameworkId: 'fw-1', status: 'active', subscribedAt: undefined }])
+  })
+})
diff --git a/apps/editor/src/infrastructure/caseApi/cgeTypes.ts b/apps/editor/src/infrastructure/caseApi/cgeTypes.ts
new file mode 100644
index 0000000..895946c
--- /dev/null
+++ b/apps/editor/src/infrastructure/caseApi/cgeTypes.ts
@@ -0,0 +1,99 @@
+/** Coalition framework summary from CGE search/list APIs. */
+export type CgeFrameworkSummary = {
+  /** CASE framework identifier (CFDocument id / coalition frameworkId). */
+  frameworkId: string
+  /** Coalition registry entry UUID (GET /frameworks/{id}). */
+  registryId?: string
+  title: string
+  publisher?: string
+  version?: string
+  sourceUri?: string
+  subscribed?: boolean
+  description?: string
+}
+
+export type CgeSubscriptionSummary = {
+  frameworkId: string
+  status?: string
+  subscribedAt?: string
+}
+
+export type CgeImportResult = {
+  status: string
+  id: string
+  docId: string
+  version?: number
+  cgeFrameworkId?: string
+  title?: string
+  sourceUri?: string
+  itemCount?: number
+  cachedAt?: string
+  readOnly?: boolean
+  fromCache?: boolean
+}
+
+export type CachedFrameworkItemSummary = {
+  identifier: string
+  uri?: string
+  fullStatement?: string
+  abbreviatedStatement?: string
+  humanCodingScheme?: string
+  CFItemType?: string
+}
+
+function optionalText (value: unknown): string | undefined {
+  if (value == null) return undefined
+  return typeof value === 'string' ? value : String(value)
+}
+
+function firstText (...values: unknown[]): string | undefined {
+  for (const value of values) {
+    if (value != null) return optionalText(value)
+  }
+  return undefined
+}
+
+/** Extract an array from heterogeneous CGE list responses. */
+function extractCgeListArray (data: unknown, keys: string[]): unknown[] {
+  if (!data) return []
+  if (Array.isArray(data)) return data
+  if (typeof data !== 'object') return []
+  const obj = data as Record<string, unknown>
+  for (const key of keys) {
+    const value = obj[key]
+    if (Array.isArray(value)) return value
+  }
+  return []
+}
+
+/** Normalize heterogeneous CGE API responses into framework summaries. */
+export function normalizeCgeFrameworkList (data: unknown): CgeFrameworkSummary[] {
+  const raw = extractCgeListArray(data, ['data', 'frameworks', 'items', 'results'])
+
+  return raw.map((item) => {
+    const row = (item && typeof item === 'object' ? item : {}) as Record<string, unknown>
+    return {
+      frameworkId: String(row.frameworkId ?? row.identifier ?? ''),
+      registryId: row.id ? String(row.id) : undefined,
+      title: String(row.title ?? row.name ?? 'Untitled framework'),
+      publisher: firstText(row.publisher, row.providerName, row.organization, row.creator),
+      version: optionalText(row.version),
+      sourceUri: firstText(row.sourceUri, row.source_uri, row.uri, row.packageUri),
+      subscribed: row.subscribed === true || row.isSubscribed === true || row.subscriptionStatus === 'active',
+      description: optionalText(row.description),
+    }
+  }).filter(f => f.frameworkId)
+}
+
+export function normalizeCgeSubscriptionList (data: unknown): CgeSubscriptionSummary[] {
+  const raw = extractCgeListArray(data, ['data', 'subscriptions'])
+
+  return raw.map((item) => {
+    const row = (item && typeof item === 'object' ? item : {}) as Record<string, unknown>
+    return {
+      frameworkId: String(row.frameworkId ?? row.id ?? ''),
+      status: optionalText(row.status),
+      subscribedAt: firstText(row.subscribedAt, row.createdAt),
+    }
+  }).filter(s => s.frameworkId)
+}
diff --git a/apps/editor/src/infrastructure/caseApi/http.ts b/apps/editor/src/infrastructure/caseApi/http.ts
index 848fe82..c1dbfd6 100644
--- a/apps/editor/src/infrastructure/caseApi/http.ts
+++ b/apps/editor/src/infrastructure/caseApi/http.ts
@@ -2,6 +2,7 @@ export type HttpClient = {
   get: (_url: string) => Promise<unknown>
   post: (_url: string, _body: unknown) => Promise<unknown>
   put: (_url: string, _body: unknown) => Promise<unknown>
+  patch: (_url: string, _body: unknown) => Promise<unknown>
   delete: (_url: string) => Promise<unknown>
 }
 
@@ -25,6 +26,19 @@ export class HttpError extends Error {
   }
 }
 
+/** Extract a user-facing message from OpenCASE management API error bodies. */
+export function formatApiErrorMessage (error: unknown, fallback: string): string {
+  if (error instanceof HttpError && error.body && typeof error.body === 'object') {
+    const body = error.body as Record<string, unknown>
+    if (typeof body.message === 'string' && body.message.trim()) return body.message
+    if (typeof body.error === 'string' && body.error.trim() && body.error !== 'cge_import_failed') {
+      return body.error
+    }
+  }
+  if (error instanceof Error && error.message) return error.message
+  return fallback
+}
+
 function joinUrl(baseUrl: string, url: string) {
   const b = baseUrl.replace(/\/+$/, '')
   const u = url.startsWith('/') ? url : `/${url}`
@@ -70,6 +84,7 @@ export function createFetchHttpClient(baseUrl: string, options: FetchHttpClientO
     get: (url) => doRequest('GET', url),
     post: (url, body) => doRequest('POST', url, body),
     put: (url, body) => doRequest('PUT', url, body),
+    patch: (url, body) => doRequest('PATCH', url, body),
     delete: (url) => doRequest('DELETE', url),
   }
 }
diff --git a/apps/editor/src/ui/auth/LoginScreen.tsx b/apps/editor/src/ui/auth/LoginScreen.tsx
index 3183168..3166891 100644
--- a/apps/editor/src/ui/auth/LoginScreen.tsx
+++ b/apps/editor/src/ui/auth/LoginScreen.tsx
@@ -11,6 +11,8 @@ export default function LoginScreen() {
   const publicApi = useMemo(() => new CaseApiClient(createFetchHttpClient(cfg.opencaseBaseUrl)), [cfg.opencaseBaseUrl])
 
   const [email, setEmail] = useState('')
+  const [orgId, setOrgId] = useState('')
+  const [mode, setMode] = useState<'email' | 'org'>('org')
   const [uiState, setUiState] = useState<'idle' | 'loading'>('idle')
   const [hint, setHint] = useState<string | null>(null)
 
@@ -49,6 +51,27 @@ export default function LoginScreen() {
     }
   }, [email, publicApi, setTenantId, signIn])
 
+  const continueWithOrgId = useCallback(async () => {
+    const trimmed = orgId.trim()
+    if (!trimmed) return
+    setUiState('loading')
+    setHint(null)
+    try {
+      const res = await publicApi.lookupTenantByOrgId({ orgId: trimmed })
+      const resolvedTenantId = res?.tenantId
+      if (resolvedTenantId) {
+        setTenantId(resolvedTenantId)
+        await signIn(resolvedTenantId)
+        return
+      }
+      setHint("If your organization is recognized, you'll be redirected to sign in.")
+    } catch {
+      setHint("If your organization is recognized, you'll be redirected to sign in.")
+    } finally {
+      setUiState('idle')
+    }
+  }, [orgId, publicApi, setTenantId, signIn])
+
   // Single-tenant mode: show a direct sign-in button (no email/tenant lookup)
   if (cfg.defaultTenantId) {
     return (
@@ -75,45 +98,74 @@ export default function LoginScreen() {
       <div className="mx-auto flex w-full max-w-md flex-col px-5 py-14">
         <div className="rounded-3xl border border-black/10 bg-white p-6 shadow-sm">
           <div className="text-lg font-semibold text-slate-900">Sign in</div>
-          <div className="mt-1 text-sm text-slate-600">Enter your email to continue to your organization’s sign-in.</div>
+          <div className="mt-1 text-sm text-slate-600">
+            {mode === 'org'
+              ? 'Enter your organization ID to continue to your organization’s sign-in.'
+              : 'Enter your email to continue to your organization’s sign-in.'}
+          </div>
 
-          <div className="mt-5">
-            <label className="text-xs font-semibold text-slate-700">Email</label>
-            <input
-              className="mt-1 w-full rounded-xl border border-black/10 bg-white px-3 py-2 text-sm text-slate-900 focus:outline-2 focus:outline-violet-700/30"
-              value={email}
-              onChange={(e) => setEmail(e.target.value)}
-              placeholder="you@example.org"
-              autoComplete="email"
-              inputMode="email"
-              onKeyDown={(e) => {
-                if (e.key === 'Enter') void continueWithEmail()
-              }}
-            />
+          <div className="mt-4 flex gap-2 text-xs">
+            <button
+              type="button"
+              className={`rounded-lg px-2 py-1 ${mode === 'org' ? 'bg-slate-900 text-white' : 'bg-slate-100 text-slate-700'}`}
+              onClick={() => { setMode('org'); setHint(null) }}
+            >
+              Organization ID
+            </button>
+            <button
+              type="button"
+              className={`rounded-lg px-2 py-1 ${mode === 'email' ? 'bg-slate-900 text-white' : 'bg-slate-100 text-slate-700'}`}
+              onClick={() => { setMode('email'); setHint(null) }}
+            >
+              Email
+            </button>
           </div>
 
+          {mode === 'org' ? (
+            <div className="mt-5">
+              <label className="text-xs font-semibold text-slate-700">Organization ID</label>
+              <input
+                className="mt-1 w-full rounded-xl border border-black/10 bg-white px-3 py-2 text-sm text-slate-900 focus:outline-2 focus:outline-violet-700/30"
+                value={orgId}
+                onChange={(e) => setOrgId(e.target.value)}
+                placeholder="your-org-id"
+                autoComplete="organization"
+                onKeyDown={(e) => {
+                  if (e.key === 'Enter') void continueWithOrgId()
+                }}
+              />
+            </div>
+          ) : (
+            <div className="mt-5">
+              <label className="text-xs font-semibold text-slate-700">Email</label>
+              <input
+                className="mt-1 w-full rounded-xl border border-black/10 bg-white px-3 py-2 text-sm text-slate-900 focus:outline-2 focus:outline-violet-700/30"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                placeholder="you@example.org"
+                autoComplete="email"
+                inputMode="email"
+                onKeyDown={(e) => {
+                  if (e.key === 'Enter') void continueWithEmail()
+                }}
+              />
+            </div>
+          )}
+
           {hint ? <div className="mt-3 text-sm text-slate-600">{hint}</div> : null}
           {status === 'error' && error ? <div className="mt-3 text-sm text-red-700">{error}</div> : null}
 
           <div className="mt-5">
-            <Button className="w-full" onClick={() => void continueWithEmail()} disabled={uiState === 'loading'}>
+            <Button
+              className="w-full"
+              onClick={() => void (mode === 'org' ? continueWithOrgId() : continueWithEmail())}
+              disabled={uiState === 'loading'}
+            >
               {uiState === 'loading' ? 'Continuing…' : 'Continue'}
             </Button>
           </div>
-
-          <div className="mt-4 text-center">
-            <a
-              href={`${cfg.oidcAuthority}/login-actions/reset-credentials`}
-              className="text-sm text-violet-700 hover:underline"
-            >
-              Forgot password?
-            </a>
-          </div>
-
-          <div className="mt-4 text-xs text-slate-500">API: {cfg.opencaseBaseUrl}</div>
         </div>
       </div>
     </div>
   )
 }
-
diff --git a/apps/editor/src/ui/editor/EditorCanvas.tsx b/apps/editor/src/ui/editor/EditorCanvas.tsx
index acd0299..a30f27e 100644
--- a/apps/editor/src/ui/editor/EditorCanvas.tsx
+++ b/apps/editor/src/ui/editor/EditorCanvas.tsx
@@ -1,8 +1,8 @@
-import { memo, useCallback, useEffect, useMemo, useRef, useState, type MouseEvent as ReactMouseEvent, type PointerEvent as ReactPointerEvent } from 'react'
+import { memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, type MouseEvent as ReactMouseEvent, type PointerEvent as ReactPointerEvent } from 'react'
 import type { ReactFlowInstance, Connection, Edge, NodeChange, EdgeChange } from '@xyflow/react'
 import type { OnBeforeDelete } from '@xyflow/react'
 import type { OnSelectionChangeFunc } from '@xyflow/react'
-import { Background, BackgroundVariant, ConnectionMode, Controls, MiniMap, ReactFlow, SelectionMode } from '@xyflow/react'
+import { Background, BackgroundVariant, ConnectionMode, Controls, MiniMap, ReactFlow, SelectionMode, useUpdateNodeInternals } from '@xyflow/react'
 import { nodeTypes } from '@/ui/editor/reactflow/nodeTypes'
 import { edgeTypes } from '@/ui/editor/reactflow/edgeTypes'
 import CanvasHeader from '@/ui/editor/components/CanvasHeader'
@@ -14,9 +14,20 @@ import ConfirmActionDialog from '@/ui/editor/components/ConfirmActionDialog'
 import ConfirmLeaveDialog from '@/ui/editor/components/ConfirmLeaveDialog'
 import SettingsModal from '@/ui/editor/components/SettingsModal'
 import FloatingAddButton from '@/ui/editor/components/FloatingAddButton'
-import AddExternalFrameworkDialog from '@/ui/editor/components/AddExternalFrameworkDialog'
+import CgeFrameworkSearchPanel from '@/ui/editor/components/CgeFrameworkSearchPanel'
+import RemoteFrameworkItemsPanel from '@/ui/editor/components/RemoteFrameworkItemsPanel'
+import AssociationTypePickerDialog from '@/ui/editor/components/AssociationTypePickerDialog'
 import ViewCFPackageDialog from '@/ui/editor/components/ViewCFPackageDialog'
 import TreePanelView from '@/ui/editor/treePanel/TreePanelView'
+import { CaseApiClient } from '@/infrastructure/caseApi/CaseApiClient'
+import { createFetchHttpClient, formatApiErrorMessage } from '@/infrastructure/caseApi/http'
+import { getAppConfig } from '@/app/config'
+import type { CgeFrameworkSummary } from '@/infrastructure/caseApi/cgeTypes'
+import { REMOTE_ITEM_MIME, parseRemoteItemDragPayload, type RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+import {
+  buildRemoteLinkEdges,
+  remoteLinkIdFromEdgeId,
+} from '@/ui/editor/remoteFramework/buildRemoteLinkGraph'
 import { useEditor } from '@/ui/editor/state/EditorContext'
 import { isFrameworkNode, getNodeSize } from '@/ui/editor/state/helpers/nodeGeometry'
 import type { CaseEditorNodeType, CaseEditorEdge } from '@/ui/editor/reactflow/types'
@@ -52,10 +63,13 @@ type ReactFlowGraphProps = {
   visible: boolean
   nodes: CaseEditorNodeType[]
   edges: CaseEditorEdge[]
+  /** Cross-framework links — drive handle-position resyncs via RemoteLinkInternalsSync */
+  remoteLinks: RemoteItemLink[]
   onNodesChange: (changes: NodeChange<CaseEditorNodeType>[]) => void
   onEdgesChange: (changes: EdgeChange[]) => void
   onConnect: (connection: Connection) => void
   onNodeClick: (event: ReactMouseEvent, node: CaseEditorNodeType) => void
+  onNodeDoubleClick: (event: ReactMouseEvent, node: CaseEditorNodeType) => void
   onNodeDragStart: (event: ReactMouseEvent, node: CaseEditorNodeType) => void
   onNodeDragStop: () => void
   onEdgeClick: (event: ReactMouseEvent, edge: Edge) => void
@@ -69,6 +83,8 @@ type ReactFlowGraphProps = {
   onReconnectEnd: (_: unknown, edge: Edge) => void
   onInit: (instance: ReactFlowInstance<CaseEditorNodeType>) => void
   onPointerDownCapture: (event: ReactPointerEvent<HTMLDivElement>) => void
+  onDragOver: (event: React.DragEvent) => void
+  onDrop: (event: React.DragEvent) => void
 }
 
 /**
@@ -85,10 +101,12 @@ const ReactFlowGraph = memo(function ReactFlowGraph({
   visible,
   nodes,
   edges,
+  remoteLinks,
   onNodesChange,
   onEdgesChange,
   onConnect,
   onNodeClick,
+  onNodeDoubleClick,
   onNodeDragStart,
   onNodeDragStop,
   onEdgeClick,
@@ -102,9 +120,17 @@ const ReactFlowGraph = memo(function ReactFlowGraph({
   onReconnectEnd,
   onInit,
   onPointerDownCapture,
+  onDragOver,
+  onDrop,
 }: ReactFlowGraphProps) {
   return (
-    <div ref={wrapRef} className={visible ? 'h-full w-full' : 'hidden'} onPointerDownCapture={onPointerDownCapture}>
+    <div
+      ref={wrapRef}
+      className={visible ? 'h-full w-full' : 'hidden'}
+      onPointerDownCapture={onPointerDownCapture}
+      onDragOver={onDragOver}
+      onDrop={onDrop}
+    >
       <ReactFlow<CaseEditorNodeType>
         nodes={nodes}
         edges={edges}
@@ -112,6 +138,7 @@ const ReactFlowGraph = memo(function ReactFlowGraph({
         onEdgesChange={onEdgesChange}
         onConnect={onConnect}
         onNodeClick={onNodeClick}
+        onNodeDoubleClick={onNodeDoubleClick}
         onNodeDragStart={onNodeDragStart}
         onNodeDragStop={onNodeDragStop}
         onEdgeClick={onEdgeClick}
@@ -140,6 +167,7 @@ const ReactFlowGraph = memo(function ReactFlowGraph({
         proOptions={REACT_FLOW_PRO_OPTIONS}
         onInit={onInit}
       >
+        <RemoteLinkInternalsSync remoteLinks={remoteLinks} nodes={nodes} />
         <Background color="#c8c8ca" gap={20} size={1.5} variant={BackgroundVariant.Dots} style={REACT_FLOW_BACKGROUND_STYLE} />
         <Controls />
         <MiniMap
@@ -187,6 +215,35 @@ type EditorCanvasProps = {
   mirrorStatus?: MirrorStatus
 }
 
+function RemoteLinkInternalsSync({
+  remoteLinks,
+  nodes,
+}: {
+  remoteLinks: RemoteItemLink[]
+  nodes: CaseEditorNodeType[]
+}) {
+  const updateNodeInternals = useUpdateNodeInternals()
+
+  useLayoutEffect(() => {
+    const frameworkRefIds = new Set(remoteLinks.map((l) => l.remoteFrameworkRefId))
+    const frameworkNodeIds = nodes
+      .filter((n) => n.type === 'externalFrameworkNode' && frameworkRefIds.has((n.data as { refId?: string }).refId ?? ''))
+      .map((n) => n.id)
+
+    const raf = requestAnimationFrame(() => {
+      for (const link of remoteLinks) {
+        updateNodeInternals(link.localItemId)
+      }
+      for (const nodeId of frameworkNodeIds) {
+        updateNodeInternals(nodeId)
+      }
+    })
+    return () => cancelAnimationFrame(raf)
+  }, [remoteLinks, nodes, updateNodeInternals])
+
+  return null
+}
+
 export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpenCase, onArchiveFramework, onFetchCfPackage, availableFrameworks, serverFrameworks, onLoadTargetFramework, onSaveAlignments, onLoadAlignmentsForTarget, onDiscoverAlignedTargets, mirrorStatus }: Readonly<EditorCanvasProps>) {
   const { status: authStatus, userName, tenantId, signOut, changePassword } = useAuth()
   const {
@@ -230,10 +287,30 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
     updateSettings,
     addDetachedItem,
     addExternalFramework,
+    remoteLinks,
+    addRemoteLink,
+    removeRemoteLink,
+    updateRemoteLinkType,
+    removeRemoteFramework,
+    openCgeSearchPanel,
+    openRemoteItemsPanel,
+    closeSidePanel,
+    openExternalFrameworkSettings,
+    sidePanelMode,
+    setSidePanelMode,
+    activeRemoteFrameworkNodeId,
+    setActiveRemoteFrameworkNodeId,
     applyHierarchyLayout,
     applyStarLayout,
   } = useEditor()
 
+  const cfg = getAppConfig()
+  const { getAccessToken } = useAuth()
+  const api = useMemo(
+    () => new CaseApiClient(createFetchHttpClient(cfg.opencaseBaseUrl, { getAccessToken })),
+    [cfg.opencaseBaseUrl, getAccessToken],
+  )
+
   const reactFlowWrapRef = useRef<HTMLDivElement | null>(null)
   const reactFlowRef = useRef<ReactFlowInstance<CaseEditorNodeType> | null>(null)
   const [rfReady, setRfReady] = useState(false)
@@ -241,13 +318,25 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
   const prevLayoutVersionRef = useRef<number | null>(null)
   const [leaveOpen, setLeaveOpen] = useState(false)
   const [settingsOpen, setSettingsOpen] = useState(false)
-  const [externalFwDialogOpen, setExternalFwDialogOpen] = useState(false)
-  const [externalFwViewportCenter, setExternalFwViewportCenter] = useState<{ x: number; y: number } | undefined>(undefined)
+  const [pendingRemoteDrop, setPendingRemoteDrop] = useState<{ localItemId: string; payload: ReturnType<typeof parseRemoteItemDragPayload> } | null>(null)
+  const [remoteFrameworkRefreshing, setRemoteFrameworkRefreshing] = useState(false)
   const [cfPackageDialogOpen, setCfPackageDialogOpen] = useState(false)
   const [generatedCfPackage, setGeneratedCfPackage] = useState<CFPackage | null>(null)
   const [viewCaseLoading, setViewCaseLoading] = useState(false)
   const [saveStatus, setSaveStatus] = useState<'idle' | 'saving' | 'success' | 'error'>('idle')
   const [saveError, setSaveError] = useState<string | null>(null)
+  const [selectedRemoteEdgeIds, setSelectedRemoteEdgeIds] = useState<string[]>([])
+
+  const remoteLinkEdges = useMemo(
+    () => buildRemoteLinkEdges(nodesWithCallbacks, remoteLinks, selectedRemoteEdgeIds),
+    [nodesWithCallbacks, remoteLinks, selectedRemoteEdgeIds],
+  )
+
+  const allEditorEdges = useMemo(
+    () => [...editorEdges, ...remoteLinkEdges],
+    [editorEdges, remoteLinkEdges],
+  )
+
   const [activeView, setActiveView] = useState<'canvas' | 'tree'>('tree')
   const [forkWarningOpen, setForkWarningOpen] = useState(false)
 
@@ -304,8 +393,8 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
   const edgeReconnectSuccessful = useRef(true)
 
   // ── Refs for save/export (keeps callbacks stable, avoids re-renders) ──
-  const graphRef = useRef({ nodes, edges: editorEdges })
-  graphRef.current = { nodes, edges: editorEdges }
+  const graphRef = useRef({ nodes, edges: editorEdges, remoteLinks })
+  graphRef.current = { nodes, edges: editorEdges, remoteLinks }
   const saveCtxRef = useRef({ caseVersion, edgeType: settings.edgeType, cfItemTypes, cfSubjects, cfConcepts, cfLicenses, cfAssociationGroupings })
   saveCtxRef.current = { caseVersion, edgeType: settings.edgeType, cfItemTypes, cfSubjects, cfConcepts, cfLicenses, cfAssociationGroupings }
 
@@ -322,14 +411,15 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         setViewCaseLoading(false)
       }
     } else {
-      const { nodes: n, edges: e } = graphRef.current
+      const { nodes: n, edges: e, remoteLinks: rl } = graphRef.current
       const ctx = saveCtxRef.current
-      const { framework, layout } = fromEditorGraph({ graph: { nodes: n, edges: e } })
+      const { framework, layout, remoteEditorData } = fromEditorGraph({ graph: { nodes: n, edges: e, remoteLinks: rl } })
       const cfPackage = frameworkToCfPackage({
         framework, layout,
         caseVersion: ctx.caseVersion, edgeType: ctx.edgeType,
         cfItemTypes: ctx.cfItemTypes, cfSubjects: ctx.cfSubjects,
         cfConcepts: ctx.cfConcepts, cfLicenses: ctx.cfLicenses, cfAssociationGroupings: ctx.cfAssociationGroupings,
+        remoteEditorData,
       })
       const caseJson = toOpenCaseFormat(cfPackage)
       setGeneratedCfPackage(absolutizeCaseUris(caseJson, window.location.origin))
@@ -368,14 +458,15 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
   // data (not just canvas layout), in which case warn first: saving will
   // fork it into an independent local copy.
   const handleSave = useCallback(async () => {
-    const { nodes: n, edges: e } = graphRef.current
+    const { nodes: n, edges: e, remoteLinks: rl } = graphRef.current
     const ctx = saveCtxRef.current
-    const { framework, layout } = fromEditorGraph({ graph: { nodes: n, edges: e } })
+    const { framework, layout, remoteEditorData } = fromEditorGraph({ graph: { nodes: n, edges: e, remoteLinks: rl } })
     const cfPackage = frameworkToCfPackage({
       framework, layout,
       caseVersion: ctx.caseVersion, edgeType: ctx.edgeType,
       cfItemTypes: ctx.cfItemTypes, cfSubjects: ctx.cfSubjects,
       cfConcepts: ctx.cfConcepts, cfLicenses: ctx.cfLicenses, cfAssociationGroupings: ctx.cfAssociationGroupings,
+      remoteEditorData,
     })
     const openCasePackage = toOpenCaseFormat(cfPackage)
     console.log('[Save] Generated OpenCASE package:', openCasePackage)
@@ -430,7 +521,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
     // Group edges by node pair (direction-agnostic) to fan out parallel labels.
     // This keeps multiple associations (e.g. precedes + exactMatchOf) readable.
     const byPair = new Map<string, CaseEditorEdge[]>()
-    for (const edge of editorEdges) {
+    for (const edge of allEditorEdges) {
       const pairKey =
         edge.source < edge.target
           ? `${edge.source}__${edge.target}`
@@ -453,7 +544,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         })
     }
 
-    const result = editorEdges.map((edge) => {
+    const result = allEditorEdges.map((edge) => {
       const cached = prev.get(edge.id)
       const parallel = parallelOffsetsByEdgeId.get(edge.id)
       const parallelIndex = parallel?.parallelIndex ?? 0
@@ -482,7 +573,8 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         cached.parallelIndex === parallelIndex &&
         cached.parallelCount === parallelCount
       ) {
-        const output: CaseEditorEdge = { ...edge, type: 'labeled' as const, data: cached.output.data, style: cached.output.style }
+        const resolvedType = edge.data?.isRemoteLink ? 'remoteLink' as const : 'labeled' as const
+        const output: CaseEditorEdge = { ...edge, type: resolvedType, data: cached.output.data, style: cached.output.style }
         next.set(edge.id, { input: edge, edgeType: globalEdgeType, filter: effectiveGroupingFilter, parallelIndex, parallelCount, output })
         return output
       }
@@ -496,7 +588,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       }
       let style = edge.style
 
-      if (effectiveGroupingFilter) {
+      if (effectiveGroupingFilter && !edge.data?.isRemoteLink) {
         const edgeGroupId = edge.data?.cfAssociation?.CFAssociationGroupingURI?.identifier
         const isRootEdge = edge.data?.isFrameworkRootConnection
         const matches = edgeGroupId === effectiveGroupingFilter
@@ -510,14 +602,15 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         }
       }
 
-      const output: CaseEditorEdge = { ...edge, type: 'labeled' as const, data: baseData, style }
+      const resolvedType = edge.data?.isRemoteLink ? 'remoteLink' as const : 'labeled' as const
+      const output: CaseEditorEdge = { ...edge, type: resolvedType, data: baseData, style }
       next.set(edge.id, { input: edge, edgeType: globalEdgeType, filter: effectiveGroupingFilter, parallelIndex, parallelCount, output })
       return output
     })
 
     edgesCacheRef.current = next
     return result
-  }, [editorEdges, settings.edgeType, effectiveGroupingFilter])
+  }, [allEditorEdges, settings.edgeType, effectiveGroupingFilter])
 
   // React Flow stays MOUNTED (just CSS-hidden) while Tree View is active, so
   // that pan/zoom/selection state survives switching views. But feeding it a
@@ -757,7 +850,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       Date.now() <= preserveDuringDrag.until &&
       hasSelectChanges
     ) {
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select')
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select')
       const reassertSelected = selectedNodeIds.map((id) => ({ type: 'select' as const, id, selected: true }))
       logSelectionDebug('onNodesChange/preserveMultiSelectionDuringDrag', {
         selectCount: selectChanges.length,
@@ -830,7 +923,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         }
       }
 
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select')
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select')
       const reassertSelected = selectedNodeIds.map((id) => ({ type: 'select' as const, id, selected: true }))
       suppressSelectEchoRef.current = { until: Date.now() + 300 }
       logSelectionDebug('onNodesChange/blockedShiftDeselectAllBatch', {
@@ -852,7 +945,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       selectChanges.some((c) => c.selected === true) &&
       selectChanges.some((c) => c.selected === false)
     ) {
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select') as NodeChange<CaseEditorNodeType>[]
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select') as NodeChange<CaseEditorNodeType>[]
       suppressSelectEchoRef.current = { until: Date.now() + 300 }
       logSelectionDebug('onNodesChange/ignoredShiftMixedBatch', {
         originalCount: changes.length,
@@ -865,7 +958,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
     }
 
     if (suppressEcho && Date.now() <= suppressEcho.until && hasSelectChanges) {
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select')
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select')
       logSelectionDebug('onNodesChange/suppressedSelectEcho', { forwardedNonSelectCount: nonSelectChanges.length })
       if (nonSelectChanges.length > 0) onNodesChange(nonSelectChanges)
       return
@@ -875,10 +968,59 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
     logSelectionDebug('onNodesChange/forwarded', { changeCount: changes.length })
   }, [logSelectionDebug, onNodesChange, selectedNodeIds])
 
+  const handleRemoteEdgeChanges = useCallback((changes: EdgeChange[]) => {
+    for (const change of changes) {
+      if (!('id' in change) || !change.id.startsWith('remote_link_')) continue
+
+      if (change.type === 'remove') {
+        const linkId = remoteLinkIdFromEdgeId(change.id)
+        if (linkId) removeRemoteLink(linkId)
+        setSelectedRemoteEdgeIds((prev) => prev.filter((id) => id !== change.id))
+        continue
+      }
+
+      if (change.type === 'select') {
+        if (change.selected) {
+          setSelectedRemoteEdgeIds((prev) =>
+            shiftHeldRef.current
+              ? [...prev.filter((id) => id !== change.id), change.id]
+              : [change.id],
+          )
+          const linkId = remoteLinkIdFromEdgeId(change.id)
+          const link = remoteLinks.find((l) => l.id === linkId)
+          if (link && !shiftHeldRef.current) {
+            onNodesChange([
+              ...nodesWithCallbacks
+                .filter((n) => n.selected)
+                .map((n) => ({ type: 'select' as const, id: n.id, selected: false })),
+              { type: 'select', id: link.localItemId, selected: true },
+            ])
+          }
+        } else {
+          setSelectedRemoteEdgeIds((prev) => prev.filter((id) => id !== change.id))
+        }
+      }
+    }
+  }, [nodesWithCallbacks, onNodesChange, remoteLinks, removeRemoteLink])
+
   const onEdgesChangeWithSelectionGuard = useCallback((changes: EdgeChange[]) => {
+    const remoteChanges = changes.filter((c) => 'id' in c && c.id.startsWith('remote_link_'))
+    const normalChanges = changes.filter((c) => !('id' in c) || !c.id.startsWith('remote_link_'))
+
+    if (remoteChanges.length > 0) {
+      handleRemoteEdgeChanges(remoteChanges)
+    }
+
+    if (normalChanges.length === 0) return
+
+    if (normalChanges.some((c) => c.type === 'select' && c.selected === true)) {
+      setSelectedRemoteEdgeIds([])
+    }
+
+    const changesToProcess = normalChanges
     const suppressEcho = suppressSelectEchoRef.current
     const preserveDuringDrag = preserveSelectionDuringDragRef.current
-    const selectChanges = changes.filter((c): c is Extract<EdgeChange, { type: 'select' }> => c.type === 'select')
+    const selectChanges = changesToProcess.filter((c): c is Extract<EdgeChange, { type: 'select' }> => c.type === 'select')
     const hasSelectChanges = selectChanges.length > 0
     logSelectionDebug('onEdgesChange/received', {
       hasSelectChanges,
@@ -896,7 +1038,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       Date.now() <= preserveDuringDrag.until &&
       hasSelectChanges
     ) {
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select')
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select')
       const reassertSelected = selectedEdgeIds.map((id) => ({ type: 'select' as const, id, selected: true }))
       logSelectionDebug('onEdgesChange/preserveMultiSelectionDuringDrag', {
         selectCount: selectChanges.length,
@@ -914,7 +1056,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       selectChanges.length > 1 &&
       selectChanges.every((c) => c.selected === false)
     ) {
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select')
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select')
       const reassertSelected = selectedEdgeIds.map((id) => ({ type: 'select' as const, id, selected: true }))
       suppressSelectEchoRef.current = { until: Date.now() + 300 }
       logSelectionDebug('onEdgesChange/blockedShiftDeselectAllBatch', {
@@ -933,7 +1075,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       selectChanges.some((c) => c.selected === true) &&
       selectChanges.some((c) => c.selected === false)
     ) {
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select') as EdgeChange[]
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select') as EdgeChange[]
       suppressSelectEchoRef.current = { until: Date.now() + 300 }
       logSelectionDebug('onEdgesChange/ignoredShiftMixedBatch', {
         originalCount: changes.length,
@@ -946,15 +1088,15 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
     }
 
     if (suppressEcho && Date.now() <= suppressEcho.until && hasSelectChanges) {
-      const nonSelectChanges = changes.filter((c) => c.type !== 'select')
+      const nonSelectChanges = changesToProcess.filter((c) => c.type !== 'select')
       logSelectionDebug('onEdgesChange/suppressedSelectEcho', { forwardedNonSelectCount: nonSelectChanges.length })
       if (nonSelectChanges.length > 0) onEdgesChange(nonSelectChanges)
       return
     }
 
-    onEdgesChange(changes)
-    logSelectionDebug('onEdgesChange/forwarded', { changeCount: changes.length })
-  }, [logSelectionDebug, onEdgesChange, selectedEdgeIds])
+    onEdgesChange(changesToProcess)
+    logSelectionDebug('onEdgesChange/forwarded', { changeCount: changesToProcess.length })
+  }, [handleRemoteEdgeChanges, logSelectionDebug, onEdgesChange, selectedEdgeIds])
 
   const onPaneClick = useCallback((event: ReactMouseEvent) => {
     // Ignore Shift-modified pane clicks (they may occur as part of add-to-selection gestures).
@@ -974,6 +1116,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       return
     }
     suppressSelectEchoRef.current = null
+    setSelectedRemoteEdgeIds([])
     if (selectedNodeIds.length + selectedEdgeIds.length > 0) {
       logSelectionDebug('onPaneClick/clearSelection')
       clearSelection()
@@ -1009,7 +1152,191 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
     return { x: centerX, y: centerY }
   }, [])
 
-  // Keyboard shortcuts for adding items and external frameworks
+  const linkedFrameworkNodes = useMemo(
+    () => nodesWithCallbacks.filter((n) => n.type === 'externalFrameworkNode'),
+    [nodesWithCallbacks],
+  )
+
+  const hasSelection = Boolean(selectedNode || selectedEdge || (selectedNodeIds.length + selectedEdgeIds.length > 1))
+  const showBrowsePanel = sidePanelMode === 'cgeSearch' || sidePanelMode === 'remoteItems'
+  const showPropertiesPanel = hasSelection && !showBrowsePanel
+  const sidePanelOpen = showBrowsePanel || showPropertiesPanel
+
+  const handleAddCgeFrameworkToCanvas = useCallback(async (fw: CgeFrameworkSummary) => {
+    if (!tenantId) throw new Error('Sign in required')
+
+    const existing = linkedFrameworkNodes.find((n) => n.data.cgeFrameworkId === fw.frameworkId)
+    if (existing) {
+      if (existing.data.cacheDocId && !existing.data.cacheError) {
+        openRemoteItemsPanel(existing.id)
+      } else {
+        openExternalFrameworkSettings(existing.id)
+      }
+      return
+    }
+
+    const refId = globalThis.crypto?.randomUUID?.() ?? `${Date.now()}`
+    const viewportCenter = getViewportCenter()
+    const nodeId = addExternalFramework({
+      refId,
+      title: fw.title,
+      cgeFrameworkId: fw.frameworkId,
+      color: '',
+      sourceUri: fw.sourceUri,
+      uri: fw.sourceUri,
+      source: fw.publisher,
+      cacheLoading: true,
+    }, viewportCenter)
+
+    try {
+      const result = await api.importCgeFramework({
+        tenantId,
+        frameworkId: fw.frameworkId,
+        sourceUri: fw.sourceUri,
+        registryId: fw.registryId,
+        readOnly: true,
+        subscribe: false,
+      })
+      updateNodeData(nodeId, {
+        title: result.title ?? fw.title,
+        cacheDocId: result.docId,
+        itemCount: result.itemCount,
+        cachedAt: result.cachedAt,
+        sourceUri: result.sourceUri ?? fw.sourceUri,
+        cacheError: null,
+        cacheLoading: false,
+      })
+      setActiveRemoteFrameworkNodeId(nodeId)
+      setSidePanelMode('remoteItems')
+    } catch (e) {
+      updateNodeData(nodeId, {
+        cacheError: formatApiErrorMessage(e, 'Failed to download framework from publisher'),
+        cacheLoading: false,
+      })
+      openExternalFrameworkSettings(nodeId)
+    }
+  }, [
+    tenantId,
+    linkedFrameworkNodes,
+    getViewportCenter,
+    addExternalFramework,
+    api,
+    updateNodeData,
+    openRemoteItemsPanel,
+    openExternalFrameworkSettings,
+    setActiveRemoteFrameworkNodeId,
+    setSidePanelMode,
+  ])
+
+  const handleRefreshActiveRemoteFramework = useCallback(async () => {
+    const nodeId = activeRemoteFrameworkNodeId ?? selectedNode?.id
+    const node = linkedFrameworkNodes.find((n) => n.id === nodeId) ?? selectedNode
+    if (!tenantId || !node || node.type !== 'externalFrameworkNode') return
+    const cgeFrameworkId = node.data.cgeFrameworkId
+    if (!cgeFrameworkId) return
+    setRemoteFrameworkRefreshing(true)
+    updateNodeData(node.id, { cacheLoading: true, cacheError: null })
+    try {
+      const result = node.data.cacheDocId
+        ? await api.refreshCgeCache({
+            tenantId,
+            frameworkId: cgeFrameworkId,
+            skipPublisherAuth: node.data.skipPublisherAuth,
+          })
+        : await api.importCgeFramework({
+            tenantId,
+            frameworkId: cgeFrameworkId,
+            sourceUri: node.data.sourceUri ?? node.data.uri,
+            readOnly: true,
+            subscribe: false,
+            skipPublisherAuth: node.data.skipPublisherAuth,
+          })
+      updateNodeData(node.id, {
+        title: result.title ?? node.data.title,
+        itemCount: result.itemCount,
+        cachedAt: result.cachedAt,
+        cacheDocId: result.docId ?? node.data.cacheDocId,
+        sourceUri: result.sourceUri ?? node.data.sourceUri,
+        cacheError: null,
+        cacheLoading: false,
+      })
+    } catch (e) {
+      updateNodeData(node.id, {
+        cacheError: formatApiErrorMessage(e, 'Failed to download framework from publisher'),
+        cacheLoading: false,
+      })
+    } finally {
+      setRemoteFrameworkRefreshing(false)
+    }
+  }, [tenantId, activeRemoteFrameworkNodeId, selectedNode, linkedFrameworkNodes, api, updateNodeData])
+
+  const handleRemoveActiveRemoteFramework = useCallback(() => {
+    const nodeId = activeRemoteFrameworkNodeId ?? selectedNode?.id
+    if (nodeId) removeRemoteFramework(nodeId)
+  }, [activeRemoteFrameworkNodeId, selectedNode?.id, removeRemoteFramework])
+
+  // Double-clicking a linked CASE Global framework opens its item browser once
+  // its cache has downloaded, or its settings panel when the download failed /
+  // hasn't happened yet. `useCallback` keeps ReactFlowGraph's memo intact.
+  const onNodeDoubleClick = useCallback((_: ReactMouseEvent, node: CaseEditorNodeType) => {
+    if (node.type !== 'externalFrameworkNode') return
+    const ext = node.data
+    if (ext.cacheDocId && !ext.cacheError) {
+      openRemoteItemsPanel(node.id)
+    } else {
+      openExternalFrameworkSettings(node.id)
+    }
+  }, [openRemoteItemsPanel, openExternalFrameworkSettings])
+
+  const handleRemoteDrop = useCallback((localItemId: string, raw: string) => {
+    const payload = parseRemoteItemDragPayload(raw)
+    if (!payload) return
+    setPendingRemoteDrop({ localItemId, payload })
+  }, [])
+
+  const confirmRemoteLink = useCallback((associationType: string) => {
+    if (!pendingRemoteDrop?.payload) return
+    const p = pendingRemoteDrop.payload
+    const linkId = globalThis.crypto?.randomUUID?.() ?? `link_${Date.now()}`
+    const link: RemoteItemLink = {
+      id: linkId,
+      localItemId: pendingRemoteDrop.localItemId,
+      remoteItemUri: p.uri ?? p.identifier,
+      remoteItemIdentifier: p.identifier,
+      remoteFrameworkRefId: p.remoteFrameworkRefId,
+      associationType,
+      remoteLabel: p.label,
+      remoteHumanCodingScheme: p.humanCodingScheme,
+      remoteFrameworkTitle: p.remoteFrameworkTitle,
+      remoteFrameworkColor: p.remoteFrameworkColor,
+      cfAssociationId: linkId,
+    }
+    addRemoteLink(link)
+    setPendingRemoteDrop(null)
+  }, [pendingRemoteDrop, addRemoteLink])
+
+  const onPaneDragOver = useCallback((e: React.DragEvent) => {
+    if (e.dataTransfer.types.includes(REMOTE_ITEM_MIME)) {
+      e.preventDefault()
+      e.dataTransfer.dropEffect = 'link'
+    }
+  }, [])
+
+  const onPaneDrop = useCallback((e: React.DragEvent) => {
+    const raw = e.dataTransfer.getData(REMOTE_ITEM_MIME)
+    if (!raw) return
+    e.preventDefault()
+    const instance = reactFlowRef.current
+    if (!instance) return
+    const position = instance.screenToFlowPosition({ x: e.clientX, y: e.clientY })
+    const targetNode = instance.getIntersectingNodes({ x: position.x, y: position.y, width: 1, height: 1 })
+      .find((n) => n.type === 'caseItemNode')
+    if (targetNode) {
+      handleRemoteDrop(targetNode.id, raw)
+    }
+  }, [handleRemoteDrop])
+
+  // Keyboard shortcuts for adding items and remote frameworks
   useEffect(() => {
     const handleKeyDown = (e: KeyboardEvent) => {
       // Check if user is typing in an input field
@@ -1034,19 +1361,17 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         return
       }
 
-      // Cmd/Ctrl + F: Add external framework
+      // Cmd/Ctrl + F: Search CASE Global frameworks
       if (e.key.toLowerCase() === 'f') {
         e.preventDefault()
-        const viewportCenter = getViewportCenter()
-        setExternalFwViewportCenter(viewportCenter)
-        setExternalFwDialogOpen(true)
+        openCgeSearchPanel()
         return
       }
     }
 
     globalThis.addEventListener('keydown', handleKeyDown)
     return () => globalThis.removeEventListener('keydown', handleKeyDown)
-  }, [addDetachedItem, getViewportCenter])
+  }, [addDetachedItem, getViewportCenter, openCgeSearchPanel])
 
   const onBeforeDelete: OnBeforeDelete<CaseEditorNodeType> = useCallback(
     async ({ nodes, edges: deletedEdges }) => {
@@ -1417,7 +1742,7 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         userName={userName ?? undefined}
         tenantId={tenantId ?? undefined}
         onChangePassword={authStatus === 'authenticated' && changePassword ? () => void changePassword() : undefined}
-        reserveRightForPanel={Boolean(selectedNode || selectedEdge || (selectedNodeIds.length + selectedEdgeIds.length > 1))}
+        reserveRightForPanel={sidePanelOpen}
         showSettings
         isDirty={isDirty}
         saveStatus={saveStatus}
@@ -1468,10 +1793,12 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         visible={activeView !== 'tree'}
         nodes={canvasNodes}
         edges={canvasEdges}
+        remoteLinks={remoteLinks}
         onNodesChange={onNodesChangeWithSelectionGuard}
         onEdgesChange={onEdgesChangeWithSelectionGuard}
         onConnect={onConnect}
         onNodeClick={onNodeClick}
+        onNodeDoubleClick={onNodeDoubleClick}
         onNodeDragStart={onNodeDragStart}
         onNodeDragStop={onNodeDragStop}
         onEdgeClick={onEdgeClick}
@@ -1485,11 +1812,13 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         onReconnectEnd={onReconnectEnd}
         onInit={onReactFlowInit}
         onPointerDownCapture={onCanvasPointerDownCapture}
+        onDragOver={onPaneDragOver}
+        onDrop={onPaneDrop}
       />
 
       <NodePropertiesPanel
-        node={selectedNode}
-        onClose={clearSelection}
+        node={showPropertiesPanel ? selectedNode : null}
+        onClose={() => { clearSelection(); closeSidePanel() }}
         onChangeNode={updateNodeData}
         hideColorBand={activeView === 'tree'}
         onViewCFPackage={handleViewCFPackage}
@@ -1501,12 +1830,19 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         ensureCfSubject={ensureCfSubject}
         cfConcepts={cfConcepts}
         ensureCfConcept={ensureCfConcept}
+        remoteLinks={remoteLinks}
+        onRemoveRemoteLink={removeRemoteLink}
+        onUpdateRemoteLinkType={updateRemoteLinkType}
+        onRemoveRemoteFramework={removeRemoteFramework}
+        onBrowseRemoteItems={openRemoteItemsPanel}
+        onRefreshRemoteFramework={selectedNode?.type === 'externalFrameworkNode' && selectedNode.data.cgeFrameworkId ? handleRefreshActiveRemoteFramework : undefined}
+        remoteFrameworkRefreshing={remoteFrameworkRefreshing}
       />
 
       <EdgePropertiesPanel
-        edge={selectedEdge}
+        edge={showPropertiesPanel ? selectedEdge : null}
         nodes={nodesWithCallbacks}
-        onClose={clearSelection}
+        onClose={() => { clearSelection(); closeSidePanel() }}
         onChangeEdge={updateEdgeData}
         onFlipEdge={flipEdge}
         cfAssociationGroupings={cfAssociationGroupings}
@@ -1514,11 +1850,11 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
       />
 
       <MultiSelectionPanel
-        selectedNodeIds={selectedNodeIds}
-        selectedEdgeIds={selectedEdgeIds}
+        selectedNodeIds={showPropertiesPanel ? selectedNodeIds : []}
+        selectedEdgeIds={showPropertiesPanel ? selectedEdgeIds : []}
         nodes={nodesWithCallbacks}
         edges={editorEdges}
-        onClose={clearSelection}
+        onClose={() => { clearSelection(); closeSidePanel() }}
         onDeleteSelected={() => {
           const selectedNodes = nodesWithCallbacks.filter((n) => selectedNodeIds.includes(n.id))
           const selectedEdgesForDelete = editorEdges.filter((e) => selectedEdgeIds.includes(e.id))
@@ -1617,30 +1953,59 @@ export default function EditorCanvas({ onBack, onSaveToServer, isPublishedToOpen
         onSave={updateSettings}
       />
 
+      {showBrowsePanel ? (
+        <div className="fixed right-0 top-0 z-20 h-screen w-[min(460px,92vw)] border-l border-black/10 bg-white shadow-xl">
+          {sidePanelMode === 'cgeSearch' && tenantId ? (
+            <CgeFrameworkSearchPanel
+              tenantId={tenantId}
+              api={api}
+              onClose={closeSidePanel}
+              onAddToCanvas={handleAddCgeFrameworkToCanvas}
+            />
+          ) : null}
+          {sidePanelMode === 'remoteItems' && tenantId ? (
+            <RemoteFrameworkItemsPanel
+              tenantId={tenantId}
+              api={api}
+              linkedFrameworkNodes={linkedFrameworkNodes as import('@/ui/editor/reactflow/types').ExternalFrameworkNodeType[]}
+              activeNodeId={activeRemoteFrameworkNodeId ?? linkedFrameworkNodes[0]?.id ?? null}
+              onSelectFramework={setActiveRemoteFrameworkNodeId}
+              onClose={closeSidePanel}
+              onRefreshFramework={
+                (linkedFrameworkNodes.find((n) => n.id === (activeRemoteFrameworkNodeId ?? linkedFrameworkNodes[0]?.id))?.data.cgeFrameworkId)
+                  ? handleRefreshActiveRemoteFramework
+                  : undefined
+              }
+              onRemoveFramework={handleRemoveActiveRemoteFramework}
+              frameworkRefreshing={remoteFrameworkRefreshing}
+              onOpenFrameworkSettings={() => {
+                const nodeId = activeRemoteFrameworkNodeId ?? linkedFrameworkNodes[0]?.id
+                if (nodeId) {
+                  setSelectedRemoteEdgeIds([])
+                  openExternalFrameworkSettings(nodeId)
+                }
+              }}
+            />
+          ) : null}
+        </div>
+      ) : null}
+
+      <AssociationTypePickerDialog
+        open={Boolean(pendingRemoteDrop)}
+        remoteLabel={pendingRemoteDrop?.payload?.label ?? ''}
+        onCancel={() => setPendingRemoteDrop(null)}
+        onConfirm={confirmRemoteLink}
+      />
+
       <FloatingAddButton
         onAddItem={() => {
           const viewportCenter = getViewportCenter()
           addDetachedItem(viewportCenter)
         }}
         onAddExternalFramework={() => {
-          const viewportCenter = getViewportCenter()
-          setExternalFwViewportCenter(viewportCenter)
-          setExternalFwDialogOpen(true)
-        }}
-        sidePanelOpen={Boolean(selectedNode || selectedEdge || (selectedNodeIds.length + selectedEdgeIds.length > 1))}
-      />
-
-      <AddExternalFrameworkDialog
-        open={externalFwDialogOpen}
-        onCancel={() => {
-          setExternalFwDialogOpen(false)
-          setExternalFwViewportCenter(undefined)
-        }}
-        onCreate={(draft) => {
-          setExternalFwDialogOpen(false)
-          addExternalFramework(draft, externalFwViewportCenter)
-          setExternalFwViewportCenter(undefined)
+          openCgeSearchPanel()
         }}
+        sidePanelOpen={sidePanelOpen}
       />
 
       <ViewCFPackageDialog
diff --git a/apps/editor/src/ui/editor/components/AssociationTypePickerDialog.tsx b/apps/editor/src/ui/editor/components/AssociationTypePickerDialog.tsx
new file mode 100644
index 0000000..868e6bb
--- /dev/null
+++ b/apps/editor/src/ui/editor/components/AssociationTypePickerDialog.tsx
@@ -0,0 +1,52 @@
+import { Button } from '@/ui/shared/components/ui/button'
+import { CASE_ASSOCIATION_TYPES } from '@/ui/editor/reactflow/types'
+
+type Props = {
+  open: boolean
+  defaultType?: string
+  remoteLabel: string
+  onCancel: () => void
+  onConfirm: (associationType: string) => void
+}
+
+export default function AssociationTypePickerDialog({
+  open,
+  defaultType = 'isRelatedTo',
+  remoteLabel,
+  onCancel,
+  onConfirm,
+}: Readonly<Props>) {
+  if (!open) return null
+
+  const options = CASE_ASSOCIATION_TYPES.filter((t) => t !== 'isChildOf')
+
+  return (
+    <div className="fixed inset-0 z-[60] flex items-center justify-center">
+      <div className="absolute inset-0 bg-black/40 backdrop-blur-sm" onClick={onCancel} aria-hidden="true" />
+      <div
+        role="dialog"
+        aria-modal="true"
+        className="relative z-10 w-full max-w-sm rounded-2xl border border-black/10 bg-white p-5 shadow-2xl"
+      >
+        <h3 className="text-lg font-semibold text-slate-900">Link association type</h3>
+        <p className="mt-1 text-sm text-slate-600">
+          Link to: <span className="font-medium">{remoteLabel}</span>
+        </p>
+        <div className="mt-4 space-y-2">
+          {options.map((type) => (
+            <Button
+              key={type}
+              type="button"
+              variant={type === defaultType ? 'default' : 'outline'}
+              className="w-full justify-start"
+              onClick={() => onConfirm(type)}
+            >
+              {type}
+            </Button>
+          ))}
+        </div>
+        <Button type="button" variant="ghost" className="mt-3 w-full" onClick={onCancel}>Cancel</Button>
+      </div>
+    </div>
+  )
+}
diff --git a/apps/editor/src/ui/editor/components/CgeFrameworkSearchPanel.tsx b/apps/editor/src/ui/editor/components/CgeFrameworkSearchPanel.tsx
new file mode 100644
index 0000000..be62f87
--- /dev/null
+++ b/apps/editor/src/ui/editor/components/CgeFrameworkSearchPanel.tsx
@@ -0,0 +1,153 @@
+import { useCallback, useEffect, useMemo, useState } from 'react'
+import { Button } from '@/ui/shared/components/ui/button'
+import { Input } from '@/ui/shared/components/ui/input'
+import type { CaseApiClient } from '@/infrastructure/caseApi/CaseApiClient'
+import { normalizeCgeFrameworkList, normalizeCgeSubscriptionList } from '@/infrastructure/caseApi/CaseApiClient'
+import type { CgeFrameworkSummary } from '@/infrastructure/caseApi/cgeTypes'
+import { formatApiErrorMessage } from '@/infrastructure/caseApi/http'
+
+type Props = {
+  tenantId: string
+  api: CaseApiClient
+  onClose: () => void
+  onAddToCanvas: (framework: CgeFrameworkSummary) => Promise<void>
+}
+
+export default function CgeFrameworkSearchPanel({ tenantId, api, onClose, onAddToCanvas }: Readonly<Props>) {
+  const [query, setQuery] = useState('')
+  const [debouncedQuery, setDebouncedQuery] = useState('')
+  const [frameworks, setFrameworks] = useState<CgeFrameworkSummary[]>([])
+  const [subscribedIds, setSubscribedIds] = useState<Set<string>>(new Set())
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+  const [busyId, setBusyId] = useState<string | null>(null)
+  const [addingId, setAddingId] = useState<string | null>(null)
+
+  useEffect(() => {
+    const t = globalThis.setTimeout(() => setDebouncedQuery(query.trim()), 300)
+    return () => globalThis.clearTimeout(t)
+  }, [query])
+
+  const load = useCallback(async () => {
+    setLoading(true)
+    setError(null)
+    try {
+      const [fwRes, subRes] = await Promise.all([
+        api.listCgeFrameworks({ tenantId, search: debouncedQuery || undefined, limit: 30 }),
+        api.listCgeSubscriptions({ tenantId }).catch(() => null),
+      ])
+      const list = normalizeCgeFrameworkList(fwRes)
+      const subs = normalizeCgeSubscriptionList(subRes)
+      const subSet = new Set(subs.map((s) => s.frameworkId))
+      for (const f of list) {
+        if (f.subscribed) subSet.add(f.frameworkId)
+      }
+      setFrameworks(list)
+      setSubscribedIds(subSet)
+    } catch (e) {
+      setError(formatApiErrorMessage(e, 'Search failed'))
+      setFrameworks([])
+    } finally {
+      setLoading(false)
+    }
+  }, [api, tenantId, debouncedQuery])
+
+  useEffect(() => {
+    void load()
+  }, [load])
+
+  const handleSubscribe = async (frameworkId: string) => {
+    setBusyId(frameworkId)
+    setError(null)
+    try {
+      await api.createCgeSubscription({ tenantId, frameworkId })
+      setSubscribedIds((prev) => new Set(prev).add(frameworkId))
+    } catch (e) {
+      setError(formatApiErrorMessage(e, 'Subscribe failed'))
+    } finally {
+      setBusyId(null)
+    }
+  }
+
+  const handleAdd = async (fw: CgeFrameworkSummary) => {
+    setAddingId(fw.frameworkId)
+    setError(null)
+    try {
+      await onAddToCanvas(fw)
+    } catch (e) {
+      setError(formatApiErrorMessage(e, 'Add to canvas failed'))
+    } finally {
+      setAddingId(null)
+    }
+  }
+
+  const rows = useMemo(() => frameworks, [frameworks])
+
+  return (
+    <div className="flex h-full flex-col">
+      <div className="border-b border-black/10 px-4 py-3">
+        <div className="flex items-center justify-between gap-2">
+          <div>
+            <h2 className="text-base font-semibold text-slate-900">Add remote framework</h2>
+            <p className="text-xs text-slate-500">Search CASE Global registered frameworks</p>
+          </div>
+          <Button type="button" variant="ghost" size="sm" onClick={onClose}>Close</Button>
+        </div>
+        <Input
+          value={query}
+          onChange={(e) => setQuery(e.target.value)}
+          placeholder="Search frameworks…"
+          className="mt-3"
+          autoFocus
+        />
+      </div>
+
+      <div className="flex-1 overflow-y-auto p-4">
+        {error ? (
+          <p className="mb-3 rounded-lg bg-rose-50 px-3 py-2 text-sm text-rose-700">{error}</p>
+        ) : null}
+        {loading ? (
+          <p className="text-sm text-slate-500">Searching…</p>
+        ) : rows.length === 0 ? (
+          <p className="text-sm text-slate-500">No frameworks found.</p>
+        ) : (
+          <ul className="space-y-3">
+            {rows.map((fw) => {
+              const subscribed = subscribedIds.has(fw.frameworkId)
+              return (
+                <li key={fw.frameworkId} className="rounded-xl border border-black/10 bg-white p-3 shadow-sm">
+                  <div className="font-medium text-slate-900">{fw.title}</div>
+                  {fw.publisher ? <div className="text-xs text-slate-500">{fw.publisher}</div> : null}
+                  {fw.version ? <div className="text-xs text-slate-400">v{fw.version}</div> : null}
+                  <div className="mt-2 flex flex-wrap gap-2">
+                    {subscribed ? (
+                      <span className="rounded-full bg-emerald-100 px-2 py-0.5 text-xs font-medium text-emerald-800">Subscribed</span>
+                    ) : (
+                      <Button
+                        type="button"
+                        size="sm"
+                        variant="outline"
+                        disabled={busyId === fw.frameworkId}
+                        onClick={() => void handleSubscribe(fw.frameworkId)}
+                      >
+                        Subscribe
+                      </Button>
+                    )}
+                    <Button
+                      type="button"
+                      size="sm"
+                      disabled={!subscribed || addingId === fw.frameworkId}
+                      onClick={() => void handleAdd(fw)}
+                    >
+                      Add to canvas
+                    </Button>
+                  </div>
+                </li>
+              )
+            })}
+          </ul>
+        )}
+      </div>
+    </div>
+  )
+}
diff --git a/apps/editor/src/ui/editor/components/NodePropertiesPanel.tsx b/apps/editor/src/ui/editor/components/NodePropertiesPanel.tsx
index 347074f..18df491 100644
--- a/apps/editor/src/ui/editor/components/NodePropertiesPanel.tsx
+++ b/apps/editor/src/ui/editor/components/NodePropertiesPanel.tsx
@@ -1,5 +1,8 @@
 import { memo, useEffect, useMemo, useState } from 'react'
+import type { CheckedState } from '@radix-ui/react-checkbox'
 import { Button } from '@/ui/shared/components/ui/button'
+import { Checkbox } from '@/ui/shared/components/ui/checkbox'
+import { Label } from '@/ui/shared/components/ui/label'
 import { ComboboxInput } from '@/ui/shared/components/ui/combobox-input'
 import { TagComboboxInput } from '@/ui/shared/components/ui/tag-combobox-input'
 import type { TagComboboxOption } from '@/ui/shared/components/ui/tag-combobox-input'
@@ -19,6 +22,9 @@ import type { EducationLevelOption } from '@/ui/editor/terminology/educationLeve
 import { getAppConfig } from '@/app/config'
 import ColorBandPicker from '@/ui/editor/components/ColorBandPicker'
 import SidebarSection from './SidebarSection'
+import type { RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+import { CASE_ASSOCIATION_TYPES } from '../reactflow/types'
+import { ArrowPathIcon } from '@heroicons/react/24/solid'
 
 /* ── Shared styling constants ── */
 const INPUT_CLS = 'w-full rounded-xl border border-black/15 bg-white px-3 py-2.5 text-base text-slate-900 focus-visible:outline-2 focus-visible:outline-violet-700/40 focus-visible:outline-offset-2'
@@ -38,12 +44,21 @@ type Props = {
   ensureCfSubject?: (_title: string) => CFSubject | null
   cfConcepts?: CFConcept[]
   ensureCfConcept?: (_title: string) => CFConcept | null
+  remoteLinks?: RemoteItemLink[]
+  onRemoveRemoteLink?: (_linkId: string) => void
+  onUpdateRemoteLinkType?: (_linkId: string, _associationType: string) => void
+  onRemoveRemoteFramework?: (_nodeId: string) => void
+  onBrowseRemoteItems?: (_nodeId: string) => void
+  onRefreshRemoteFramework?: () => Promise<void>
+  remoteFrameworkRefreshing?: boolean
   hideColorBand?: boolean
 }
 
 export default memo(function NodePropertiesPanel({
   node, onClose, onChangeNode, onViewCFPackage, isPublishedToOpenCase, availableLicenses,
   cfItemTypes = [], ensureCfItemType, cfSubjects = [], ensureCfSubject, cfConcepts = [], ensureCfConcept,
+  remoteLinks = [], onRemoveRemoteLink, onUpdateRemoteLinkType,
+  onRemoveRemoteFramework, onBrowseRemoteItems, onRefreshRemoteFramework, remoteFrameworkRefreshing,
   hideColorBand = false,
 }: Readonly<Props>) {
   const [copied, setCopied] = useState<null | 'code' | 'uri' | 'opencase'>(null)
@@ -146,11 +161,21 @@ export default memo(function NodePropertiesPanel({
       : (cfItem?.humanCodingScheme ?? cfItem?.alternativeLabel ?? cfItem?.CFItemType ?? 'Untitled item')
 
   const headerSubtitle = isExternalFramework
-    ? 'External reference'
+    ? (externalData?.cacheError
+        ? 'Cache unavailable'
+        : externalData?.cacheDocId
+          ? 'Cached remote framework'
+          : externalData?.cacheLoading
+            ? 'Downloading cache…'
+            : 'Remote framework (not cached)')
     : isFramework
       ? 'Framework'
       : (cfItem?.CFItemType ?? 'Item')
 
+  const itemRemoteLinks = node && isItemNode(node)
+    ? remoteLinks.filter((l) => l.localItemId === node.id)
+    : []
+
   return (
     <aside
       className={[
@@ -207,6 +232,94 @@ export default memo(function NodePropertiesPanel({
               <textarea id="ext-description" rows={4} className={`${INPUT_CLS} resize-y`} value={externalData?.description ?? ''} onChange={(e) => updateExternalFramework({ description: e.target.value })} placeholder="Add notes about this external framework..." />
             </SidebarSection>
 
+            <SidebarSection title="Appearance" subtitle="Color used on the canvas and link bars." accentColor={externalData?.color ?? '#d97706'}>
+              <ColorBandPicker
+                value={externalData?.color}
+                onChange={(color) => updateExternalFramework({ color: color ?? externalData?.color ?? '#64748b' })}
+                label="Theme color"
+                labelClassName={LABEL_CLS}
+              />
+            </SidebarSection>
+
+            {externalData?.cgeFrameworkId ? (
+              <SidebarSection title="Cache" subtitle="Read-only copy stored in OpenCASE for browsing and linking." accentColor={externalData?.color ?? '#d97706'}>
+                <div className="space-y-3 text-sm text-slate-600">
+                  {externalData.cacheError ? (
+                    <div className="rounded-xl border border-rose-200 bg-rose-50 px-3 py-2.5 text-sm text-rose-800">
+                      <div className="font-medium">Could not download framework</div>
+                      <div className="mt-1 text-xs leading-relaxed text-rose-700">{externalData.cacheError}</div>
+                      <div className="mt-2 text-xs text-rose-600">
+                        Try enabling &quot;Open publisher (no auth)&quot; below, then download again.
+                      </div>
+                    </div>
+                  ) : null}
+                  {externalData.cacheLoading ? (
+                    <div className="text-sm text-slate-500">Downloading from publisher…</div>
+                  ) : null}
+                  {!externalData.cacheDocId && !externalData.cacheError && !externalData.cacheLoading ? (
+                    <div className="text-sm text-slate-500">No cached copy yet. Download to browse items and create links.</div>
+                  ) : null}
+                  {externalData.itemCount != null ? (
+                    <div>{externalData.itemCount} items cached</div>
+                  ) : null}
+                  {externalData.cachedAt ? (
+                    <div>Last refreshed: {formatDateTime(externalData.cachedAt)}</div>
+                  ) : null}
+                  {externalData.cacheDocId ? (
+                    <div className="font-mono text-xs text-slate-500">Doc: {externalData.cacheDocId}</div>
+                  ) : null}
+                  <div className="rounded-xl border border-black/10 bg-white p-3">
+                    <div className="flex items-start gap-3">
+                      <Checkbox
+                        id="ext-skip-publisher-auth"
+                        checked={Boolean(externalData.skipPublisherAuth)}
+                        onCheckedChange={(v: CheckedState) => updateExternalFramework({ skipPublisherAuth: Boolean(v) })}
+                      />
+                      <div className="grid gap-1">
+                        <Label htmlFor="ext-skip-publisher-auth" className="text-sm font-medium text-slate-900">
+                          Open publisher (no auth)
+                        </Label>
+                        <div className={HINT_CLS}>
+                          Skip the CGE bearer token when refreshing from the publisher. Use when the framework is publicly accessible but rejects CASE Global credentials.
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div className="flex flex-wrap gap-2">
+                    {onBrowseRemoteItems && node && externalData.cacheDocId ? (
+                      <Button type="button" variant="secondary" size="sm" onClick={() => onBrowseRemoteItems(node.id)}>
+                        Browse items
+                      </Button>
+                    ) : null}
+                    {onRefreshRemoteFramework ? (
+                      <Button
+                        type="button"
+                        variant="secondary"
+                        size="sm"
+                        disabled={remoteFrameworkRefreshing || externalData.cacheLoading}
+                        onClick={() => void onRefreshRemoteFramework()}
+                      >
+                        <ArrowPathIcon className={`mr-1.5 h-4 w-4 ${remoteFrameworkRefreshing || externalData.cacheLoading ? 'animate-spin' : ''}`} aria-hidden="true" />
+                        {remoteFrameworkRefreshing || externalData.cacheLoading
+                          ? 'Downloading…'
+                          : externalData.cacheDocId
+                            ? 'Refresh cache'
+                            : 'Download cache'}
+                      </Button>
+                    ) : null}
+                  </div>
+                </div>
+              </SidebarSection>
+            ) : null}
+
+            <SidebarSection title="Actions" subtitle="Manage this remote framework on the canvas." accentColor={externalData?.color ?? '#d97706'} defaultOpen={false}>
+              {onRemoveRemoteFramework && node ? (
+                <Button type="button" variant="destructive" size="sm" onClick={() => onRemoveRemoteFramework(node.id)}>
+                  Remove from canvas
+                </Button>
+              ) : null}
+            </SidebarSection>
+
             <div className="mx-4 my-2 flex items-start gap-3 rounded-xl border border-amber-200 bg-amber-50 p-4">
               <svg className="mt-0.5 h-5 w-5 shrink-0 text-amber-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                 <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
@@ -434,6 +547,47 @@ export default memo(function NodePropertiesPanel({
               )}
             </SidebarSection>
 
+            {/* ── Remote links (items only) ── */}
+            {!isFramework && !isExternalFramework && itemRemoteLinks.length > 0 ? (
+              <SidebarSection title="Remote links" subtitle="Associations to items in cached frameworks." accentColor={accentColor} defaultOpen>
+                <div className="space-y-3">
+                  {itemRemoteLinks.map((link) => (
+                    <div key={link.id} className="rounded-xl border border-black/10 bg-white p-3">
+                      <div className="flex items-start gap-2">
+                        <div className="mt-1 h-3 w-3 shrink-0 rounded-full" style={{ backgroundColor: link.remoteFrameworkColor ?? '#64748b' }} />
+                        <div className="min-w-0 flex-1">
+                          <div className="text-xs font-medium text-slate-500">{link.remoteFrameworkTitle ?? 'Remote framework'}</div>
+                          <div className="truncate text-sm font-medium text-slate-900">
+                            {link.remoteHumanCodingScheme ? (
+                              <span className="font-mono text-xs text-slate-600">{link.remoteHumanCodingScheme}</span>
+                            ) : null}
+                            {link.remoteHumanCodingScheme && link.remoteLabel ? ' — ' : null}
+                            {link.remoteLabel}
+                          </div>
+                          <div className="mt-2">
+                            <label className="sr-only" htmlFor={`remote-link-type-${link.id}`}>Association type</label>
+                            <select
+                              id={`remote-link-type-${link.id}`}
+                              className={INPUT_CLS}
+                              value={link.associationType}
+                              onChange={(e) => onUpdateRemoteLinkType?.(link.id, e.target.value)}
+                            >
+                              {CASE_ASSOCIATION_TYPES.map((t) => (
+                                <option key={t} value={t}>{t}</option>
+                              ))}
+                            </select>
+                          </div>
+                        </div>
+                      </div>
+                      <Button type="button" variant="ghost" size="sm" className="mt-2 w-full text-rose-700 hover:text-rose-800" onClick={() => onRemoveRemoteLink?.(link.id)}>
+                        Remove link
+                      </Button>
+                    </div>
+                  ))}
+                </div>
+              </SidebarSection>
+            ) : null}
+
             {/* ── Item lifecycle (items only) ── */}
             {!isFramework && !isExternalFramework && cfItem ? (
               <SidebarSection title="Lifecycle" subtitle="Validity dates and license for this item." accentColor={accentColor} defaultOpen={false}>
diff --git a/apps/editor/src/ui/editor/components/RemoteFrameworkItemsPanel.tsx b/apps/editor/src/ui/editor/components/RemoteFrameworkItemsPanel.tsx
new file mode 100644
index 0000000..df3d685
--- /dev/null
+++ b/apps/editor/src/ui/editor/components/RemoteFrameworkItemsPanel.tsx
@@ -0,0 +1,184 @@
+import { useCallback, useEffect, useState } from 'react'
+import { Cog6ToothIcon } from '@heroicons/react/24/solid'
+import { Button } from '@/ui/shared/components/ui/button'
+import { Input } from '@/ui/shared/components/ui/input'
+import type { CaseApiClient } from '@/infrastructure/caseApi/CaseApiClient'
+import type { CachedFrameworkItemSummary } from '@/infrastructure/caseApi/cgeTypes'
+import type { ExternalFrameworkNodeType } from '@/ui/editor/reactflow/types'
+import { REMOTE_ITEM_MIME, type RemoteItemDragPayload } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+
+type Props = {
+  tenantId: string
+  api: CaseApiClient
+  linkedFrameworkNodes: ExternalFrameworkNodeType[]
+  activeNodeId: string | null
+  onSelectFramework: (nodeId: string) => void
+  onClose: () => void
+  onRefreshFramework?: () => Promise<void>
+  onRemoveFramework?: () => void
+  frameworkRefreshing?: boolean
+  onOpenFrameworkSettings?: () => void
+}
+
+export default function RemoteFrameworkItemsPanel({
+  tenantId,
+  api,
+  linkedFrameworkNodes,
+  activeNodeId,
+  onSelectFramework,
+  onClose,
+  onRefreshFramework,
+  onRemoveFramework,
+  frameworkRefreshing = false,
+  onOpenFrameworkSettings,
+}: Readonly<Props>) {
+  const activeNode = linkedFrameworkNodes.find((n) => n.id === activeNodeId) ?? linkedFrameworkNodes[0] ?? null
+  const [query, setQuery] = useState('')
+  const [debouncedQuery, setDebouncedQuery] = useState('')
+  const [items, setItems] = useState<CachedFrameworkItemSummary[]>([])
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+
+  useEffect(() => {
+    const t = globalThis.setTimeout(() => setDebouncedQuery(query.trim()), 250)
+    return () => globalThis.clearTimeout(t)
+  }, [query])
+
+  const loadItems = useCallback(async () => {
+    if (!activeNode?.data.cacheDocId) return
+    setLoading(true)
+    setError(null)
+    try {
+      const res = await api.searchCachedFrameworkItems({
+        tenantId,
+        docId: activeNode.data.cacheDocId,
+        q: debouncedQuery || undefined,
+        limit: 80,
+      })
+      setItems(res.items)
+    } catch (e) {
+      setError(e instanceof Error ? e.message : 'Failed to load items')
+      setItems([])
+    } finally {
+      setLoading(false)
+    }
+  }, [api, tenantId, activeNode?.data.cacheDocId, debouncedQuery])
+
+  useEffect(() => {
+    void loadItems()
+  }, [loadItems])
+
+  const onDragStart = (item: CachedFrameworkItemSummary) => (e: React.DragEvent) => {
+    if (!activeNode) return
+    const payload: RemoteItemDragPayload = {
+      identifier: item.identifier,
+      uri: item.uri,
+      label: item.abbreviatedStatement ?? item.fullStatement ?? item.humanCodingScheme ?? item.identifier,
+      humanCodingScheme: item.humanCodingScheme,
+      remoteFrameworkRefId: activeNode.data.refId,
+      remoteFrameworkNodeId: activeNode.id,
+      remoteFrameworkTitle: activeNode.data.title,
+      remoteFrameworkColor: activeNode.data.color,
+    }
+    e.dataTransfer.setData(REMOTE_ITEM_MIME, JSON.stringify(payload))
+    e.dataTransfer.effectAllowed = 'link'
+  }
+
+  if (!activeNode) {
+    return (
+      <div className="p-4 text-sm text-slate-500">
+        Add a remote framework to browse its items.
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex h-full flex-col">
+      <div className="border-b border-black/10 px-4 py-3">
+        <div className="flex items-center justify-between gap-2">
+          <div>
+            <h2 className="text-base font-semibold text-slate-900">Remote items</h2>
+            <p className="text-xs text-slate-500">Drag onto a local item to link</p>
+          </div>
+          <Button type="button" variant="ghost" size="sm" onClick={onClose}>Close</Button>
+        </div>
+
+        <div className="mt-2 flex flex-wrap gap-1.5">
+          {linkedFrameworkNodes.map((n) => (
+            <button
+              key={n.id}
+              type="button"
+              className={[
+                'rounded-full px-2.5 py-1 text-xs font-medium text-white shadow-sm',
+                n.id === activeNode.id ? 'ring-2 ring-offset-1 ring-slate-400' : 'opacity-80',
+              ].join(' ')}
+              style={{ backgroundColor: n.data.color }}
+              onClick={() => onSelectFramework(n.id)}
+            >
+              {n.data.title}
+            </button>
+          ))}
+        </div>
+
+        <Input
+          value={query}
+          onChange={(e) => setQuery(e.target.value)}
+          placeholder="Filter items…"
+          className="mt-3"
+        />
+
+        {activeNode.data.cgeFrameworkId && (onRefreshFramework || onRemoveFramework || onOpenFrameworkSettings) ? (
+          <div className="mt-2 flex flex-wrap gap-2">
+            {onOpenFrameworkSettings ? (
+              <Button type="button" variant="outline" size="sm" onClick={onOpenFrameworkSettings}>
+                <Cog6ToothIcon className="mr-1.5 h-4 w-4" aria-hidden="true" />
+                Framework settings
+              </Button>
+            ) : null}
+            {onRefreshFramework ? (
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                disabled={frameworkRefreshing}
+                onClick={() => void onRefreshFramework()}
+              >
+                {frameworkRefreshing ? 'Refreshing…' : 'Refresh cache'}
+              </Button>
+            ) : null}
+            {onRemoveFramework ? (
+              <Button type="button" variant="ghost" size="sm" className="text-rose-700" onClick={onRemoveFramework}>
+                Remove from canvas
+              </Button>
+            ) : null}
+          </div>
+        ) : null}
+      </div>
+
+      <div className="flex-1 overflow-y-auto p-3">
+        {error ? <p className="mb-2 text-sm text-rose-600">{error}</p> : null}
+        {loading ? (
+          <p className="text-sm text-slate-500">Loading…</p>
+        ) : items.length === 0 ? (
+          <p className="text-sm text-slate-500">No items match.</p>
+        ) : (
+          <ul className="space-y-2">
+            {items.map((item) => (
+              <li
+                key={item.identifier}
+                draggable
+                onDragStart={onDragStart(item)}
+                className="cursor-grab rounded-lg border border-black/10 bg-white px-3 py-2 text-sm shadow-sm active:cursor-grabbing hover:border-violet-300"
+              >
+                {item.humanCodingScheme ? (
+                  <div className="font-mono text-xs text-slate-500">{item.humanCodingScheme}</div>
+                ) : null}
+                <div className="text-slate-900">{item.abbreviatedStatement ?? item.fullStatement ?? item.identifier}</div>
+              </li>
+            ))}
+          </ul>
+        )}
+      </div>
+    </div>
+  )
+}
diff --git a/apps/editor/src/ui/editor/components/RemoteLinkPopover.tsx b/apps/editor/src/ui/editor/components/RemoteLinkPopover.tsx
new file mode 100644
index 0000000..f7d0025
--- /dev/null
+++ b/apps/editor/src/ui/editor/components/RemoteLinkPopover.tsx
@@ -0,0 +1,42 @@
+import { Button } from '@/ui/shared/components/ui/button'
+import type { RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+
+type Props = {
+  link: RemoteItemLink
+  anchorRect: DOMRect | null
+  onClose: () => void
+  onRemove: () => void
+}
+
+export default function RemoteLinkPopover({ link, anchorRect, onClose, onRemove }: Readonly<Props>) {
+  if (!anchorRect) return null
+
+  const top = anchorRect.bottom + 8
+  const left = Math.max(8, anchorRect.left)
+
+  return (
+    <>
+      <div className="fixed inset-0 z-40" onClick={onClose} aria-hidden="true" />
+      <div
+        className="fixed z-50 w-72 rounded-xl border border-black/10 bg-white p-3 shadow-xl"
+        style={{ top, left }}
+        role="dialog"
+      >
+        <div className="text-xs font-medium uppercase tracking-wide text-slate-500">
+          {link.remoteFrameworkTitle ?? 'Remote framework'}
+        </div>
+        <div className="mt-1 text-sm font-medium text-slate-900">
+          {link.remoteHumanCodingScheme ? (
+            <span className="font-mono text-xs text-slate-600">{link.remoteHumanCodingScheme}</span>
+          ) : null}
+          {link.remoteHumanCodingScheme && link.remoteLabel ? ' — ' : null}
+          {link.remoteLabel}
+        </div>
+        <div className="mt-1 text-xs text-slate-500">Type: {link.associationType}</div>
+        <Button type="button" variant="destructive" size="sm" className="mt-3 w-full" onClick={onRemove}>
+          Remove link
+        </Button>
+      </div>
+    </>
+  )
+}
diff --git a/apps/editor/src/ui/editor/reactflow/edgeTypes/RemoteLinkEdge.tsx b/apps/editor/src/ui/editor/reactflow/edgeTypes/RemoteLinkEdge.tsx
new file mode 100644
index 0000000..fb1a030
--- /dev/null
+++ b/apps/editor/src/ui/editor/reactflow/edgeTypes/RemoteLinkEdge.tsx
@@ -0,0 +1,132 @@
+import { memo, useMemo } from 'react'
+import {
+  BaseEdge,
+  EdgeLabelRenderer,
+  getBezierPath,
+  getSmoothStepPath,
+  getStraightPath,
+  Position,
+  useInternalNode,
+  type EdgeProps,
+} from '@xyflow/react'
+import { formatAssociationType } from '@/ui/editor/state/editorFactories'
+
+const BAR_HEIGHT = 20
+
+type RemoteLinkEdgeData = {
+  associationType?: string
+  remoteBarIndex?: number
+  remoteBarCount?: number
+  parallelIndex?: number
+  parallelCount?: number
+  edgeType?: 'default' | 'straight' | 'step' | 'smoothstep'
+}
+
+function nodeSize(node: {
+  measured?: { width?: number; height?: number }
+  width?: number
+  height?: number
+  style?: { width?: number; height?: number }
+}) {
+  const w = node.measured?.width ?? node.width ?? (typeof node.style?.width === 'number' ? node.style.width : 280)
+  const h = node.measured?.height ?? node.height ?? (typeof node.style?.height === 'number' ? node.style.height : 160)
+  return { w: Number(w), h: Number(h) }
+}
+
+function RemoteLinkEdge(props: EdgeProps) {
+  const { id, source, target, data, style, markerEnd, markerStart, selected } = props
+  const edgeData = data as RemoteLinkEdgeData | undefined
+  const edgeType = edgeData?.edgeType ?? 'default'
+
+  const sourceNode = useInternalNode(source)
+  const targetNode = useInternalNode(target)
+
+  const geometry = useMemo(() => {
+    if (!sourceNode?.internals?.positionAbsolute || !targetNode?.internals?.positionAbsolute) return null
+
+    const src = nodeSize(sourceNode)
+    const tgt = nodeSize(targetNode)
+    const barCount = edgeData?.remoteBarCount ?? 1
+    const barIndex = edgeData?.remoteBarIndex ?? 0
+
+    const sourceX = sourceNode.internals.positionAbsolute.x + src.w
+    const sourceY = sourceNode.internals.positionAbsolute.y + src.h - (barCount - barIndex) * BAR_HEIGHT + BAR_HEIGHT / 2
+    const targetX = targetNode.internals.positionAbsolute.x
+    const targetY = targetNode.internals.positionAbsolute.y + tgt.h / 2
+
+    const pathArgs = {
+      sourceX,
+      sourceY,
+      sourcePosition: Position.Right,
+      targetX,
+      targetY,
+      targetPosition: Position.Left,
+    }
+
+    if (edgeType === 'straight') {
+      const [path, labelX, labelY] = getStraightPath(pathArgs)
+      return { path, labelX, labelY }
+    }
+    if (edgeType === 'step' || edgeType === 'smoothstep') {
+      const [path, labelX, labelY] = getSmoothStepPath(pathArgs)
+      return { path, labelX, labelY }
+    }
+    const [path, labelX, labelY] = getBezierPath(pathArgs)
+    return { path, labelX, labelY }
+  }, [sourceNode, targetNode, edgeData?.remoteBarCount, edgeData?.remoteBarIndex, edgeType])
+
+  if (!geometry) return null
+
+  const associationType = edgeData?.associationType ?? 'isRelatedTo'
+  const typeLabel = formatAssociationType(associationType)
+  const parallelIndex = edgeData?.parallelIndex ?? 0
+  const parallelCount = edgeData?.parallelCount ?? 1
+  const parallelOffsetY = parallelCount > 1 ? parallelIndex * 22 : 0
+  const stroke = (style?.stroke as string | undefined) ?? '#662F90'
+
+  return (
+    <>
+      <BaseEdge
+        id={id}
+        path={geometry.path}
+        markerEnd={markerEnd}
+        markerStart={markerStart}
+        style={{
+          ...style,
+          stroke,
+          strokeWidth: 1.5,
+        }}
+      />
+      <EdgeLabelRenderer>
+        <div
+          style={{
+            position: 'absolute',
+            transform: `translate(-50%, -50%) translate(${geometry.labelX}px,${geometry.labelY + parallelOffsetY}px)`,
+            pointerEvents: 'all',
+          }}
+          className="nodrag nopan"
+        >
+          <div
+            style={{
+              background: 'white',
+              borderRadius: '10px',
+              padding: '5px 10px',
+              boxShadow: selected
+                ? '0 0 0 2px rgba(124, 58, 237, 0.3), 0 2px 8px rgba(0,0,0,0.15)'
+                : '0 1px 4px rgba(0,0,0,0.1)',
+              border: selected ? '2px solid #7c3aed' : '1px solid #e2e8f0',
+              fontSize: '10px',
+              fontWeight: 500,
+              color: selected ? '#7c3aed' : '#64748b',
+              textTransform: 'lowercase',
+            }}
+          >
+            {typeLabel}
+          </div>
+        </div>
+      </EdgeLabelRenderer>
+    </>
+  )
+}
+
+export default memo(RemoteLinkEdge)
diff --git a/apps/editor/src/ui/editor/reactflow/edgeTypes/index.ts b/apps/editor/src/ui/editor/reactflow/edgeTypes/index.ts
index 9f535b7..f2a313a 100644
--- a/apps/editor/src/ui/editor/reactflow/edgeTypes/index.ts
+++ b/apps/editor/src/ui/editor/reactflow/edgeTypes/index.ts
@@ -1,7 +1,9 @@
 import LabeledEdge from './LabeledEdge'
+import RemoteLinkEdge from './RemoteLinkEdge'
 
 export const edgeTypes = {
   labeled: LabeledEdge,
+  remoteLink: RemoteLinkEdge,
 }
 
 export { LabeledEdge }
diff --git a/apps/editor/src/ui/editor/reactflow/mapping/extractRemoteFrameworkFromCfPackage.ts b/apps/editor/src/ui/editor/reactflow/mapping/extractRemoteFrameworkFromCfPackage.ts
new file mode 100644
index 0000000..ba8166c
--- /dev/null
+++ b/apps/editor/src/ui/editor/reactflow/mapping/extractRemoteFrameworkFromCfPackage.ts
@@ -0,0 +1,31 @@
+import type { CFPackage } from '@/domain/case/types'
+import type { LinkedFrameworkRef, RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+import { nextRemoteFrameworkColor } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+
+const OPENCASE_EXT_KEY = 'ext:opencase'
+
+export type ExtractedRemoteFrameworkData = {
+  linkedFrameworks: LinkedFrameworkRef[]
+  remoteItemLinks: RemoteItemLink[]
+}
+
+export function extractRemoteFrameworkDataFromCfPackage(cfPackage: CFPackage): ExtractedRemoteFrameworkData {
+  const docExtensions = cfPackage.CFDocument?.extensions as Record<string, unknown> | undefined
+  const ext = docExtensions?.[OPENCASE_EXT_KEY] as {
+    linkedFrameworks?: LinkedFrameworkRef[]
+    remoteItemLinks?: RemoteItemLink[]
+  } | undefined
+
+  return {
+    linkedFrameworks: Array.isArray(ext?.linkedFrameworks) ? ext!.linkedFrameworks : [],
+    remoteItemLinks: Array.isArray(ext?.remoteItemLinks) ? ext!.remoteItemLinks : [],
+  }
+}
+
+/** Assign colors to linked frameworks that lack one. */
+export function normalizeLinkedFrameworkColors(refs: LinkedFrameworkRef[]): LinkedFrameworkRef[] {
+  return refs.map((ref, i) => ({
+    ...ref,
+    color: ref.color || nextRemoteFrameworkColor(i),
+  }))
+}
diff --git a/apps/editor/src/ui/editor/reactflow/mapping/fromEditorGraph.ts b/apps/editor/src/ui/editor/reactflow/mapping/fromEditorGraph.ts
index a10d1af..947c8ee 100644
--- a/apps/editor/src/ui/editor/reactflow/mapping/fromEditorGraph.ts
+++ b/apps/editor/src/ui/editor/reactflow/mapping/fromEditorGraph.ts
@@ -3,9 +3,12 @@ import type { Framework, FrameworkMetadata, Item, Association, AssociationType,
 import type { AssociationId, FrameworkId, ItemId } from '@/domain/shared/types'
 import type { LayoutState } from './types'
 import type { CFDocument, CFItem } from '@/domain/case/types'
+import type { ExternalFrameworkNodeData } from '@/ui/editor/reactflow/types'
+import type { LinkedFrameworkRef, RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
 
 const isFrameworkNode = (n: EditorGraph['nodes'][number]) => n.type === 'caseFrameworkNode'
 const isItemNode = (n: EditorGraph['nodes'][number]) => n.type === 'caseItemNode'
+const isExternalFrameworkNode = (n: EditorGraph['nodes'][number]) => n.type === 'externalFrameworkNode'
 
 function mapItemType(rawType?: string): ItemType | undefined {
   const raw = (rawType ?? '').toLowerCase()
@@ -39,7 +42,12 @@ function readCfItem(node: EditorGraph['nodes'][number]): CFItem | null {
   return any?.cfItem ?? null
 }
 
-export function fromEditorGraph(params: { graph: EditorGraph }): { framework: Framework; layout: LayoutState } {
+export type RemoteEditorData = {
+  linkedFrameworks: LinkedFrameworkRef[]
+  remoteItemLinks: RemoteItemLink[]
+}
+
+export function fromEditorGraph(params: { graph: EditorGraph }): { framework: Framework; layout: LayoutState; remoteEditorData: RemoteEditorData } {
   const { graph } = params
   const fwNode = graph.nodes.find(isFrameworkNode)
   const fwId = (fwNode?.id ?? 'fw') as unknown as FrameworkId
@@ -219,6 +227,71 @@ export function fromEditorGraph(params: { graph: EditorGraph }): { framework: Fr
     }
   }
 
-  return { framework, layout: { byNodeId } }
+  const linkedFrameworks: LinkedFrameworkRef[] = graph.nodes
+    .filter(isExternalFrameworkNode)
+    .map((n) => {
+      const d = n.data as ExternalFrameworkNodeData
+      return {
+        id: d.refId,
+        cgeFrameworkId: d.cgeFrameworkId ?? '',
+        cacheDocId: d.cacheDocId ?? '',
+        title: d.title,
+        color: d.color,
+        sourceUri: d.sourceUri ?? d.uri,
+        nodePosition: { x: n.position.x, y: n.position.y },
+        itemCount: d.itemCount,
+        cachedAt: d.cachedAt,
+        skipPublisherAuth: d.skipPublisherAuth,
+        cacheError: d.cacheError ?? undefined,
+      }
+    })
+
+  const remoteItemLinks = (graph.remoteLinks ?? []).map((link) => {
+    const fw = graph.nodes.find(
+      (n) => n.type === 'externalFrameworkNode' && (n.data as ExternalFrameworkNodeData).refId === link.remoteFrameworkRefId,
+    )
+    const fwData = fw?.data as ExternalFrameworkNodeData | undefined
+    return {
+      ...link,
+      remoteFrameworkColor: fwData?.color ?? link.remoteFrameworkColor,
+      remoteFrameworkTitle: fwData?.title ?? link.remoteFrameworkTitle,
+    }
+  })
+
+  // Add cross-framework associations for remote links
+  for (const link of remoteItemLinks) {
+    if (!items.has(link.localItemId as unknown as ItemId)) continue
+    const localItem = items.get(link.localItemId as unknown as ItemId)!
+    const localUri = (localItem.metadata?.caseUri as string | undefined) ?? link.localItemId
+    const assocId = (link.cfAssociationId ?? link.id) as unknown as AssociationId
+    const assoc: Association = {
+      id: assocId,
+      fromItemId: link.localItemId as unknown as ItemId,
+      toItemId: link.localItemId as unknown as ItemId,
+      associationType: link.associationType as AssociationType,
+      metadata: {
+        caseUri: link.remoteItemUri,
+        extensions: {
+          'ext:opencase': {
+            remoteLink: true,
+            remoteItemUri: link.remoteItemUri,
+            remoteItemIdentifier: link.remoteItemIdentifier,
+            remoteFrameworkRefId: link.remoteFrameworkRefId,
+            localItemUri: localUri,
+            remoteLabel: link.remoteLabel,
+            remoteHumanCodingScheme: link.remoteHumanCodingScheme,
+            remoteFrameworkTitle: link.remoteFrameworkTitle,
+          },
+        },
+      },
+    }
+    associations.set(assoc.id, assoc)
+  }
+
+  return {
+    framework,
+    layout: { byNodeId },
+    remoteEditorData: { linkedFrameworks, remoteItemLinks },
+  }
 }
 
diff --git a/apps/editor/src/ui/editor/reactflow/mapping/index.ts b/apps/editor/src/ui/editor/reactflow/mapping/index.ts
index f898846..fdac2bf 100644
--- a/apps/editor/src/ui/editor/reactflow/mapping/index.ts
+++ b/apps/editor/src/ui/editor/reactflow/mapping/index.ts
@@ -2,4 +2,5 @@ export * from './types'
 export * from './toReactFlow'
 export * from './fromEditorGraph'
 export * from './extractLayoutFromCfPackage'
+export * from './extractRemoteFrameworkFromCfPackage'
 
diff --git a/apps/editor/src/ui/editor/reactflow/mapping/toReactFlow.ts b/apps/editor/src/ui/editor/reactflow/mapping/toReactFlow.ts
index 7ef4852..b86a027 100644
--- a/apps/editor/src/ui/editor/reactflow/mapping/toReactFlow.ts
+++ b/apps/editor/src/ui/editor/reactflow/mapping/toReactFlow.ts
@@ -6,6 +6,10 @@ import type { CaseEditorEdge, CaseEditorNodeType, CaseFrameworkNodeType, CaseIte
 import { FRAMEWORK_ROOT_ASSOCIATION_TYPE } from '@/ui/editor/reactflow/types'
 import type { CFAssociation, CFDocument, CFItem } from '@/domain/case/types'
 import type { LayoutState } from './types'
+import type { ExternalFrameworkNodeType } from '@/ui/editor/reactflow/types'
+import type { RemoteEditorData } from './fromEditorGraph'
+import { normalizeLinkedFrameworkColors } from './extractRemoteFrameworkFromCfPackage'
+import { nextRemoteFrameworkColor } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
 
 const DEFAULT_NODE_WIDTH = 280
 const DEFAULT_NODE_HEIGHT = 140
@@ -207,8 +211,8 @@ function getLayout(layout: LayoutState | undefined, nodeId: string, fallback: {
  * The returned nodes use the existing CASE-shaped `cfDocument` / `cfItem` payloads
  * so we can migrate incrementally without rewriting all node/panel UI at once.
  */
-export function toReactFlowGraph(params: { framework: Framework; layout?: LayoutState }): EditorGraph {
-  const { framework, layout } = params
+export function toReactFlowGraph(params: { framework: Framework; layout?: LayoutState; remoteEditorData?: RemoteEditorData }): EditorGraph {
+  const { framework, layout, remoteEditorData } = params
   const fwId = framework.id as unknown as string
 
   const cfDocument = mapDomainFrameworkToCfDocument(framework)
@@ -405,6 +409,41 @@ export function toReactFlowGraph(params: { framework: Framework; layout?: Layout
   const nodeIdSet = new Set(nodes.map((n) => n.id))
   const safeEdges = edges.filter((e) => nodeIdSet.has(e.source) && nodeIdSet.has(e.target))
 
-  return { nodes: nodes as CaseEditorNodeType[], edges: safeEdges }
+  const linked = normalizeLinkedFrameworkColors(remoteEditorData?.linkedFrameworks ?? [])
+  let extIndex = 0
+  for (const lf of linked) {
+    const nodeId = `ext_${lf.id}`
+    const pos = lf.nodePosition ?? { x: 520 + extIndex * 40, y: HEADER_SAFE_Y + extIndex * 30 }
+    const extNode: ExternalFrameworkNodeType = {
+      id: nodeId,
+      type: 'externalFrameworkNode',
+      position: pos,
+      style: { width: 280, height: 120 },
+      data: {
+        refId: lf.id,
+        title: lf.title,
+        cgeFrameworkId: lf.cgeFrameworkId,
+        cacheDocId: lf.cacheDocId,
+        color: lf.color || nextRemoteFrameworkColor(extIndex),
+        sourceUri: lf.sourceUri,
+        uri: lf.sourceUri,
+        itemCount: lf.itemCount,
+        cachedAt: lf.cachedAt,
+        skipPublisherAuth: lf.skipPublisherAuth,
+        cacheError: lf.cacheError ?? null,
+      },
+      className: wrapperNodeClassName,
+    }
+    nodes.push(extNode)
+    extIndex += 1
+  }
+
+  const remoteLinks = (remoteEditorData?.remoteItemLinks ?? []).map((link) => ({
+    ...link,
+    remoteFrameworkColor: linked.find((l) => l.id === link.remoteFrameworkRefId)?.color,
+    remoteFrameworkTitle: linked.find((l) => l.id === link.remoteFrameworkRefId)?.title,
+  }))
+
+  return { nodes: nodes as CaseEditorNodeType[], edges: safeEdges, remoteLinks }
 }
 
diff --git a/apps/editor/src/ui/editor/reactflow/nodeTypes/CaseItemNode.tsx b/apps/editor/src/ui/editor/reactflow/nodeTypes/CaseItemNode.tsx
index 061a644..47d12ca 100644
--- a/apps/editor/src/ui/editor/reactflow/nodeTypes/CaseItemNode.tsx
+++ b/apps/editor/src/ui/editor/reactflow/nodeTypes/CaseItemNode.tsx
@@ -1,10 +1,17 @@
 import { Handle, Position, type NodeProps, NodeResizer, useReactFlow, useConnection } from '@xyflow/react'
 import { PlusIcon, XMarkIcon } from '@heroicons/react/24/solid'
+import { useState } from 'react'
 import type { CaseItemNodeType } from '../types'
 import type { CaseEditorNodeType } from '@/ui/editor/reactflow/types'
+import { useEditor } from '@/ui/editor/state/EditorContext'
+import RemoteLinkPopover from '@/ui/editor/components/RemoteLinkPopover'
 
 export default function CaseItemNode({ id, data, selected }: NodeProps<CaseItemNodeType>) {
   const rf = useReactFlow<CaseEditorNodeType>()
+  const { remoteLinks, removeRemoteLink } = useEditor()
+  const itemRemoteLinks = remoteLinks.filter((l) => l.localItemId === id)
+  const [activePopover, setActivePopover] = useState<{ linkId: string; rect: DOMRect } | null>(null)
+  const popoverLink = activePopover ? itemRemoteLinks.find((l) => l.id === activePopover.linkId) : undefined
   
   // Get connection state to show visual feedback during drag (React Flow v12+)
   const connection = useConnection()
@@ -232,6 +239,51 @@ export default function CaseItemNode({ id, data, selected }: NodeProps<CaseItemN
         }`}
       />
 
+      {itemRemoteLinks.length > 0 ? (
+        <div className="flex w-full flex-col gap-px rounded-b-lg overflow-hidden">
+          {itemRemoteLinks.map((link) => {
+            const itemTitle = link.remoteLabel || link.remoteHumanCodingScheme || 'Remote item'
+            const itemCode = link.remoteHumanCodingScheme
+            const showCode = Boolean(itemCode && itemCode !== itemTitle)
+            return (
+              <div key={link.id} className="relative">
+                <button
+                  type="button"
+                  className="nodrag nopan flex min-h-5 w-full items-center gap-1.5 px-2 py-0.5 text-left text-[10px] leading-tight text-white hover:brightness-95"
+                  style={{ backgroundColor: link.remoteFrameworkColor ?? '#64748b' }}
+                  title={`${itemTitle}${showCode ? ` (${itemCode})` : ''}${link.remoteFrameworkTitle ? ` — ${link.remoteFrameworkTitle}` : ''} (${link.associationType})`}
+                  onClick={(e) => {
+                    e.stopPropagation()
+                    const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()
+                    setActivePopover({ linkId: link.id, rect })
+                  }}
+                >
+                  <span className="min-w-0 flex-1 truncate font-semibold">{itemTitle}</span>
+                  {showCode ? (
+                    <>
+                      <span className="shrink-0 opacity-70">·</span>
+                      <span className="shrink-0 truncate font-mono font-medium">{itemCode}</span>
+                    </>
+                  ) : null}
+                </button>
+              </div>
+            )
+          })}
+        </div>
+      ) : null}
+
+      {popoverLink && activePopover ? (
+        <RemoteLinkPopover
+          link={popoverLink}
+          anchorRect={activePopover.rect}
+          onClose={() => setActivePopover(null)}
+          onRemove={() => {
+            removeRemoteLink(popoverLink.id)
+            setActivePopover(null)
+          }}
+        />
+      ) : null}
+
       <div className="pointer-events-none absolute bottom-2 right-3 text-[10px] font-medium text-slate-400 opacity-0 transition-opacity group-hover:opacity-100 group-focus-within:opacity-100">
         Select to edit
       </div>
diff --git a/apps/editor/src/ui/editor/reactflow/nodeTypes/ExternalFrameworkNode.tsx b/apps/editor/src/ui/editor/reactflow/nodeTypes/ExternalFrameworkNode.tsx
index 0023e9f..be9d7c2 100644
--- a/apps/editor/src/ui/editor/reactflow/nodeTypes/ExternalFrameworkNode.tsx
+++ b/apps/editor/src/ui/editor/reactflow/nodeTypes/ExternalFrameworkNode.tsx
@@ -1,20 +1,14 @@
-import { Handle, Position, type NodeProps, NodeResizer, useReactFlow, useConnection } from '@xyflow/react'
-import { XMarkIcon, LinkIcon } from '@heroicons/react/24/solid'
+import { Handle, Position, type NodeProps, NodeResizer, useConnection } from '@xyflow/react'
+import { Cog6ToothIcon, LinkIcon, XMarkIcon } from '@heroicons/react/24/solid'
 import type { ExternalFrameworkNodeType } from '../types'
-import type { CaseEditorNodeType } from '@/ui/editor/reactflow/types'
 
 export default function ExternalFrameworkNode({ id, data, selected }: NodeProps<ExternalFrameworkNodeType>) {
-  const rf = useReactFlow<CaseEditorNodeType>()
-  // Get connection state to show visual feedback during drag (React Flow v12+)
   const connection = useConnection()
   const connectionInProgress = connection.inProgress
   const connectionNodeId = connection.fromNode?.id ?? null
   
-  // Check if the node being dragged from is a framework
   const sourceNodeType = connection.fromNode?.type
   const isSourceFramework = sourceNodeType === 'caseFrameworkNode' || sourceNodeType === 'externalFrameworkNode'
-  
-  // This framework is an invalid target if dragging from another framework
   const isInvalidTarget = connectionInProgress && isSourceFramework && connectionNodeId !== id
 
   const typedData = data as unknown as {
@@ -22,12 +16,24 @@ export default function ExternalFrameworkNode({ id, data, selected }: NodeProps<
     uri?: string
     description?: string
     source?: string
+    color?: string
+    itemCount?: number
+    cachedAt?: string
+    cacheDocId?: string
+    cacheError?: string | null
+    cacheLoading?: boolean
+    onRemoveRemoteFramework?: (_nodeId: string) => void
+    onOpenExternalFrameworkSettings?: (_nodeId: string) => void
   }
 
-  const title = typedData?.title ?? 'External Framework'
+  const title = typedData?.title ?? 'Remote Framework'
   const uri = typedData?.uri
   const description = typedData?.description
   const source = typedData?.source
+  const color = typedData?.color ?? '#64748b'
+  const hasCacheError = Boolean(typedData?.cacheError)
+  const isUncached = !typedData?.cacheDocId
+  const borderColor = hasCacheError ? '#f87171' : color
 
   return (
     <div className="group relative h-full w-full">
@@ -42,45 +48,54 @@ export default function ExternalFrameworkNode({ id, data, selected }: NodeProps<
           width: 8, 
           height: 8, 
           borderRadius: 4, 
-          backgroundColor: 'rgb(100, 116, 139)',
+          backgroundColor: color,
           borderColor: 'white',
           borderWidth: 2,
         }}
       />
 
-      {/* Action buttons */}
       <div
         className={[
           'nodrag nopan absolute left-full top-2 ml-2 flex flex-col gap-2 transition-opacity',
           selected ? 'opacity-100' : 'opacity-0 group-hover:opacity-100 group-focus-within:opacity-100',
         ].join(' ')}
       >
+        <button
+          type="button"
+          className="inline-flex shrink-0 items-center gap-1 whitespace-nowrap rounded-full border border-slate-300 bg-white px-3 py-1 text-xs font-semibold text-slate-700 shadow-sm hover:bg-slate-50 focus-visible:outline-2 focus-visible:outline-slate-700/40 focus-visible:outline-offset-2"
+          onClick={(e) => {
+            e.stopPropagation()
+            typedData.onOpenExternalFrameworkSettings?.(id)
+          }}
+          aria-label="Framework settings"
+          title="Framework settings"
+        >
+          <Cog6ToothIcon className="h-3.5 w-3.5" aria-hidden="true" />
+          Settings
+        </button>
         <button
           type="button"
           className="inline-flex shrink-0 items-center gap-1 whitespace-nowrap rounded-full border border-rose-300 bg-white px-3 py-1 text-xs font-semibold text-rose-700 shadow-sm hover:bg-rose-50 focus-visible:outline-2 focus-visible:outline-rose-700/40 focus-visible:outline-offset-2"
           onClick={(e) => {
             e.stopPropagation()
-            const node = rf.getNode(id)
-            if (!node) return
-            rf.deleteElements({ nodes: [node], edges: [] })
+            typedData.onRemoveRemoteFramework?.(id)
           }}
-          aria-label="Remove external framework"
-          title="Remove external framework"
+          aria-label="Remove remote framework"
+          title="Remove remote framework"
         >
           <XMarkIcon className="h-3.5 w-3.5" aria-hidden="true" />
           Remove
         </button>
       </div>
 
-      {/* Card content - grey themed to indicate external */}
       <div
         className={[
-          'relative flex h-full w-full flex-col rounded-xl border-2 border-dashed bg-gradient-to-br from-slate-50 to-slate-100 p-4 shadow-sm transition-all',
-          selected ? 'border-slate-500 shadow-md ring-2 ring-slate-400/20' : 'border-slate-300',
+          'relative flex h-full w-full flex-col rounded-xl border-2 bg-gradient-to-br from-white to-slate-50 p-4 shadow-sm transition-all',
+          selected ? 'shadow-md ring-2 ring-offset-1' : '',
           isInvalidTarget ? 'opacity-40 grayscale ring-2 ring-red-300' : '',
         ].join(' ')}
+        style={{ borderColor: borderColor, ...(selected ? { ringColor: `${borderColor}33` } : {}) }}
       >
-        {/* Invalid target indicator */}
         {isInvalidTarget && (
           <div className="absolute inset-0 z-10 flex items-center justify-center rounded-xl bg-red-50/50">
             <div className="rounded-full bg-red-100 px-3 py-1 text-xs font-medium text-red-600">
@@ -89,94 +104,70 @@ export default function ExternalFrameworkNode({ id, data, selected }: NodeProps<
           </div>
         )}
         
-        {/* Header with icon */}
         <div className="mb-2 flex items-center gap-2">
-          <div className="grid h-8 w-8 shrink-0 place-items-center rounded-lg bg-slate-200 text-slate-600">
+          <div className="grid h-8 w-8 shrink-0 place-items-center rounded-lg text-white" style={{ backgroundColor: color }}>
             <LinkIcon className="h-4 w-4" />
           </div>
           <div className="min-w-0 flex-1">
-            <div className="truncate text-sm font-semibold text-slate-700">{title}</div>
+            <div className="truncate text-sm font-semibold text-slate-800">{title}</div>
             {source ? (
               <div className="truncate text-xs text-slate-500">{source}</div>
             ) : null}
           </div>
         </div>
 
-        {/* Description */}
         {description ? (
           <p className="mb-2 line-clamp-2 text-xs text-slate-600">{description}</p>
         ) : null}
 
-        {/* URI */}
+        {typedData.cacheLoading ? (
+          <div className="text-xs text-slate-500">Downloading cache…</div>
+        ) : hasCacheError ? (
+          <div className="rounded-md border border-rose-200 bg-rose-50 px-2 py-1 text-xs text-rose-700">
+            Cache unavailable — open settings to retry
+          </div>
+        ) : typedData.itemCount != null ? (
+          <div className="text-xs text-slate-500">{typedData.itemCount} items cached</div>
+        ) : isUncached ? (
+          <div className="text-xs text-amber-700">Not cached — open settings to download</div>
+        ) : null}
+
         {uri ? (
-          <div className="mt-auto truncate rounded bg-slate-200/50 px-2 py-1 font-mono text-xs text-slate-500">
+          <div className="mt-auto truncate rounded bg-slate-100 px-2 py-1 font-mono text-xs text-slate-500">
             {uri}
           </div>
         ) : null}
 
-        {/* Badge indicating external */}
         <div className="absolute right-3 top-3">
-          <span className="rounded-full bg-slate-200 px-2 py-0.5 text-xs font-medium text-slate-600">
-            External
+          <span
+            className="rounded-full px-2 py-0.5 text-xs font-medium text-white"
+            style={{ backgroundColor: hasCacheError ? '#dc2626' : isUncached ? '#d97706' : color }}
+          >
+            {hasCacheError ? 'Error' : isUncached ? 'Uncached' : 'Remote'}
           </span>
         </div>
 
-        {/* Hint when not selected */}
         {!selected && !isInvalidTarget && (
           <div className="absolute bottom-2 right-3 text-xs text-slate-400">
-            Select to edit
+            Click for properties · double-click to browse
           </div>
         )}
 
-        {/* Bidirectional handles on all four sides - graph style connections */}
-        <Handle
-          id="top"
-          position={Position.Top}
-          type="source"
-          isConnectableStart={true}
-          isConnectableEnd={!isInvalidTarget}
-          className={`!h-2.5 !w-2.5 !rounded-full !border-2 transition-colors ${
-            isInvalidTarget 
-              ? '!border-red-300 !bg-red-100' 
-              : '!border-slate-400 !bg-slate-200 hover:!border-slate-600 hover:!bg-slate-300'
-          }`}
-        />
-        <Handle
-          id="bottom"
-          position={Position.Bottom}
-          type="source"
-          isConnectableStart={true}
-          isConnectableEnd={!isInvalidTarget}
-          className={`!h-2.5 !w-2.5 !rounded-full !border-2 transition-colors ${
-            isInvalidTarget 
-              ? '!border-red-300 !bg-red-100' 
-              : '!border-slate-400 !bg-slate-200 hover:!border-slate-600 hover:!bg-slate-300'
-          }`}
-        />
-        <Handle
-          id="left"
-          position={Position.Left}
-          type="source"
-          isConnectableStart={true}
-          isConnectableEnd={!isInvalidTarget}
-          className={`!h-2.5 !w-2.5 !rounded-full !border-2 transition-colors ${
-            isInvalidTarget 
-              ? '!border-red-300 !bg-red-100' 
-              : '!border-slate-400 !bg-slate-200 hover:!border-slate-600 hover:!bg-slate-300'
-          }`}
-        />
-        <Handle
-          id="right"
-          position={Position.Right}
-          type="source"
-          isConnectableStart={true}
-          isConnectableEnd={!isInvalidTarget}
-          className={`!h-2.5 !w-2.5 !rounded-full !border-2 transition-colors ${
-            isInvalidTarget 
-              ? '!border-red-300 !bg-red-100' 
-              : '!border-slate-400 !bg-slate-200 hover:!border-slate-600 hover:!bg-slate-300'
-          }`}
-        />
+        {(['top', 'bottom', 'left', 'right'] as const).map((side) => (
+          <Handle
+            key={side}
+            id={side}
+            position={side === 'top' ? Position.Top : side === 'bottom' ? Position.Bottom : side === 'left' ? Position.Left : Position.Right}
+            type="source"
+            isConnectableStart={true}
+            isConnectableEnd={!isInvalidTarget}
+            className="!h-2.5 !w-2.5 !rounded-full !border-2 transition-colors"
+            style={{
+              borderColor: isInvalidTarget ? '#fca5a5' : color,
+              backgroundColor: isInvalidTarget ? '#fee2e2' : `${color}22`,
+            }}
+          />
+        ))}
       </div>
     </div>
   )
diff --git a/apps/editor/src/ui/editor/reactflow/types.ts b/apps/editor/src/ui/editor/reactflow/types.ts
index 24b2597..a63363b 100644
--- a/apps/editor/src/ui/editor/reactflow/types.ts
+++ b/apps/editor/src/ui/editor/reactflow/types.ts
@@ -20,14 +20,34 @@ export type CaseFrameworkNodeType = Node<CaseFrameworkNodeData, 'caseFrameworkNo
 
 /** Data for external/remote framework reference nodes */
 export type ExternalFrameworkNodeData = {
+  /** Stable ref id for persistence (linkedFrameworks[].id) */
+  refId: string
   /** Title of the external framework */
   title: string
   /** URI or identifier of the external framework */
   uri?: string
   /** Description or notes about this external reference */
   description?: string
-  /** Source system or origin (e.g., "OpenCASE", "State Standards") */
+  /** Source system or origin (e.g., publisher name) */
   source?: string
+  /** CASE Global coalition registry ID */
+  cgeFrameworkId?: string
+  /** OpenCASE doc id of the read-only cached CFPackage */
+  cacheDocId?: string
+  /** Theme color for this framework (border, link bars) */
+  color: string
+  sourceUri?: string
+  itemCount?: number
+  cachedAt?: string
+  /** When true, refresh/import fetches omit the CGE bearer token on the publisher host. */
+  skipPublisherAuth?: boolean
+  /** User-facing message when publisher cache download or refresh failed. */
+  cacheError?: string | null
+  /** Transient UI flag while a cache download/refresh is in progress. */
+  cacheLoading?: boolean
+  /** Injected by EditorContext — avoids useEditor() inside React Flow node components. */
+  onRemoveRemoteFramework?: (_nodeId: string) => void
+  onOpenExternalFrameworkSettings?: (_nodeId: string) => void
 }
 
 export type ExternalFrameworkNodeType = Node<ExternalFrameworkNodeData, 'externalFrameworkNode'>
@@ -123,6 +143,10 @@ export type CaseEdgeData = {
    * Used only for rendering (not persisted into CASE semantics).
    */
   parallelCount?: number
+  /** True when this edge is a derived projection of a remoteItemLink */
+  isRemoteLink?: boolean
+  /** Underlying remote link id (for delete / properties) */
+  remoteLinkId?: string
 }
 
 export type CaseEditorEdge = Edge<CaseEdgeData>
diff --git a/apps/editor/src/ui/editor/remoteFramework/buildRemoteLinkGraph.test.ts b/apps/editor/src/ui/editor/remoteFramework/buildRemoteLinkGraph.test.ts
new file mode 100644
index 0000000..4f8d7ba
--- /dev/null
+++ b/apps/editor/src/ui/editor/remoteFramework/buildRemoteLinkGraph.test.ts
@@ -0,0 +1,56 @@
+import { describe, expect, it } from 'vitest'
+import { buildRemoteLinkEdges } from './buildRemoteLinkGraph'
+import type { RemoteItemLink } from './remoteFrameworkTypes'
+import type { ExternalFrameworkNodeType } from '@/ui/editor/reactflow/types'
+
+describe('buildRemoteLinkGraph', () => {
+  const extNode: ExternalFrameworkNodeType = {
+    id: 'ext_fw1',
+    type: 'externalFrameworkNode',
+    position: { x: 500, y: 100 },
+    style: { width: 280, height: 120 },
+    data: {
+      refId: 'fw1',
+      title: 'Remote FW',
+      color: '#0ea5e9',
+    },
+  }
+
+  const link: RemoteItemLink = {
+    id: 'link1',
+    localItemId: 'item1',
+    remoteItemUri: 'urn:case:item:remote1',
+    remoteItemIdentifier: 'remote1',
+    remoteFrameworkRefId: 'fw1',
+    associationType: 'isRelatedTo',
+    remoteLabel: 'Remote statement',
+    remoteHumanCodingScheme: 'R.1',
+    remoteFrameworkColor: '#0ea5e9',
+  }
+
+  it('creates edges from local item to external framework node', () => {
+    const localItem = {
+      id: 'item1',
+      type: 'caseItemNode' as const,
+      position: { x: 0, y: 0 },
+      data: { cfItem: { identifier: 'item1', uri: 'urn:case:item:item1' } },
+    }
+    const edges = buildRemoteLinkEdges([localItem, extNode], [link])
+    expect(edges).toHaveLength(1)
+    expect(edges[0]?.type).toBe('remoteLink')
+    expect(edges[0]?.source).toBe('item1')
+    expect(edges[0]?.target).toBe('ext_fw1')
+    expect(edges[0]?.style?.stroke).toBe('#0ea5e9')
+  })
+
+  it('skips edges when external framework node is missing', () => {
+    const localItem = {
+      id: 'item1',
+      type: 'caseItemNode' as const,
+      position: { x: 0, y: 0 },
+      data: { cfItem: { identifier: 'item1', uri: 'urn:case:item:item1' } },
+    }
+    const edges = buildRemoteLinkEdges([localItem], [link])
+    expect(edges).toHaveLength(0)
+  })
+})
diff --git a/apps/editor/src/ui/editor/remoteFramework/buildRemoteLinkGraph.ts b/apps/editor/src/ui/editor/remoteFramework/buildRemoteLinkGraph.ts
new file mode 100644
index 0000000..69a971f
--- /dev/null
+++ b/apps/editor/src/ui/editor/remoteFramework/buildRemoteLinkGraph.ts
@@ -0,0 +1,103 @@
+import type { CSSProperties } from 'react'
+import type { CaseEditorEdge, CaseEditorNodeType, ExternalFrameworkNodeData } from '@/ui/editor/reactflow/types'
+import type { RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+import { getEdgeMarkers, getEdgeStyle, makeEdgeLabel } from '@/ui/editor/state/editorFactories'
+
+export function remoteLinkEdgeId(linkId: string): string {
+  return `remote_link_${linkId}`
+}
+
+export function remoteLinkIdFromEdgeId(edgeId: string): string | null {
+  if (!edgeId.startsWith('remote_link_')) return null
+  return edgeId.slice('remote_link_'.length)
+}
+
+function coloredMarkers(associationType: string, color: string) {
+  const markers = getEdgeMarkers(associationType)
+  const tint = (marker: typeof markers.markerEnd) =>
+    marker ? { ...marker, color } : undefined
+  return {
+    markerEnd: tint(markers.markerEnd),
+    markerStart: tint(markers.markerStart),
+  }
+}
+
+function remoteEdgeStyle(associationType: string, color: string): CSSProperties {
+  const base = getEdgeStyle(associationType)
+  return {
+    ...base,
+    stroke: color,
+    strokeWidth: 1.5,
+    strokeDasharray: base.strokeDasharray ?? '6,4',
+  }
+}
+
+function colorForLink(nodes: CaseEditorNodeType[], link: RemoteItemLink): string {
+  const ext = nodes.find(
+    (n) => n.type === 'externalFrameworkNode' && (n.data as ExternalFrameworkNodeData).refId === link.remoteFrameworkRefId,
+  )
+  return (ext?.data as ExternalFrameworkNodeData | undefined)?.color ?? link.remoteFrameworkColor ?? '#64748b'
+}
+
+function findExternalFrameworkNodeId(nodes: CaseEditorNodeType[], refId: string): string | undefined {
+  return nodes.find(
+    (n) => n.type === 'externalFrameworkNode' && (n.data as ExternalFrameworkNodeData).refId === refId,
+  )?.id
+}
+
+function remoteBarIndexForLink(links: RemoteItemLink[], linkId: string): { index: number; count: number } {
+  const byItem = new Map<string, RemoteItemLink[]>()
+  for (const link of links) {
+    const list = byItem.get(link.localItemId) ?? []
+    list.push(link)
+    byItem.set(link.localItemId, list)
+  }
+  for (const list of byItem.values()) {
+    const index = list.findIndex((l) => l.id === linkId)
+    if (index >= 0) return { index, count: list.length }
+  }
+  return { index: 0, count: 1 }
+}
+
+export function buildRemoteLinkEdges(
+  nodes: CaseEditorNodeType[],
+  remoteLinks: RemoteItemLink[],
+  selectedEdgeIds: string[] = [],
+): CaseEditorEdge[] {
+  const nodeIds = new Set(nodes.map((n) => n.id))
+
+  return remoteLinks.flatMap((link) => {
+    if (!nodeIds.has(link.localItemId)) return []
+
+    const targetId = findExternalFrameworkNodeId(nodes, link.remoteFrameworkRefId)
+    if (!targetId || !nodeIds.has(targetId)) return []
+
+    const color = colorForLink(nodes, link)
+    const edgeId = remoteLinkEdgeId(link.id)
+    const markers = coloredMarkers(link.associationType, color)
+    const { index: remoteBarIndex, count: remoteBarCount } = remoteBarIndexForLink(remoteLinks, link.id)
+
+    return [{
+      id: edgeId,
+      source: link.localItemId,
+      target: targetId,
+      type: 'remoteLink',
+      label: makeEdgeLabel(link.associationType),
+      style: remoteEdgeStyle(link.associationType, color),
+      ...(markers.markerEnd ? { markerEnd: markers.markerEnd } : {}),
+      ...(markers.markerStart ? { markerStart: markers.markerStart } : {}),
+      selectable: true,
+      focusable: true,
+      reconnectable: false,
+      selected: selectedEdgeIds.includes(edgeId),
+      zIndex: 1000,
+      data: {
+        associationType: link.associationType,
+        isRemoteLink: true,
+        remoteLinkId: link.id,
+        remoteBarIndex,
+        remoteBarCount,
+      },
+    } satisfies CaseEditorEdge]
+  })
+}
diff --git a/apps/editor/src/ui/editor/remoteFramework/remoteFrameworkTypes.ts b/apps/editor/src/ui/editor/remoteFramework/remoteFrameworkTypes.ts
new file mode 100644
index 0000000..0b2c962
--- /dev/null
+++ b/apps/editor/src/ui/editor/remoteFramework/remoteFrameworkTypes.ts
@@ -0,0 +1,70 @@
+/** MIME type for drag-and-drop of remote CFItems from the browse panel. */
+export const REMOTE_ITEM_MIME = 'application/x-opencase-remote-item'
+
+export const REMOTE_FRAMEWORK_COLORS = [
+  '#0ea5e9', // sky
+  '#d97706', // amber
+  '#059669', // emerald
+  '#7c3aed', // violet
+  '#db2777', // pink
+  '#0891b2', // cyan
+  '#ca8a04', // yellow
+  '#dc2626', // red
+] as const
+
+export type SidePanelMode = 'closed' | 'properties' | 'cgeSearch' | 'remoteItems'
+
+export type LinkedFrameworkRef = {
+  id: string
+  cgeFrameworkId: string
+  cacheDocId: string
+  title: string
+  color: string
+  sourceUri?: string
+  nodePosition?: { x: number; y: number }
+  itemCount?: number
+  cachedAt?: string
+  /** When true, publisher fetches omit the CGE bearer token (open CASE servers). */
+  skipPublisherAuth?: boolean
+  /** Last cache download/refresh error, if any. */
+  cacheError?: string
+}
+
+export type RemoteItemLink = {
+  id: string
+  localItemId: string
+  remoteItemUri: string
+  remoteItemIdentifier: string
+  remoteFrameworkRefId: string
+  associationType: string
+  remoteLabel: string
+  remoteHumanCodingScheme?: string
+  remoteFrameworkTitle?: string
+  remoteFrameworkColor?: string
+  cfAssociationId?: string
+}
+
+export type RemoteItemDragPayload = {
+  identifier: string
+  uri?: string
+  label: string
+  humanCodingScheme?: string
+  remoteFrameworkRefId: string
+  remoteFrameworkNodeId: string
+  remoteFrameworkTitle: string
+  remoteFrameworkColor: string
+}
+
+export function nextRemoteFrameworkColor(index: number): string {
+  return REMOTE_FRAMEWORK_COLORS[index % REMOTE_FRAMEWORK_COLORS.length] ?? REMOTE_FRAMEWORK_COLORS[0]
+}
+
+export function parseRemoteItemDragPayload(data: string): RemoteItemDragPayload | null {
+  try {
+    const parsed = JSON.parse(data) as RemoteItemDragPayload
+    if (!parsed?.identifier || !parsed.remoteFrameworkRefId) return null
+    return parsed
+  } catch {
+    return null
+  }
+}
diff --git a/apps/editor/src/ui/editor/state/EditorContext.tsx b/apps/editor/src/ui/editor/state/EditorContext.tsx
index 6b8cbcf..a14ef36 100644
--- a/apps/editor/src/ui/editor/state/EditorContext.tsx
+++ b/apps/editor/src/ui/editor/state/EditorContext.tsx
@@ -16,6 +16,8 @@ import type {
   CaseItemNodeType,
   ExternalFrameworkNodeData,
 } from '@/ui/editor/reactflow/types'
+import type { SidePanelMode, RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+import { nextRemoteFrameworkColor } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
 import type { CFAssociationGrouping, CFDocument, CFItem, CFItemType, CFLicense, CFSubject, CFConcept } from '@/domain/case/types'
 import type { FrameworkEdgeRecord } from '@/domain/framework/treeDerivation'
 import type { AddItemDraft } from '@/ui/editor/components/AddItemDialog'
@@ -27,7 +29,7 @@ import type { CaseVersion } from '@/application/framework/mappers/case/CasePacka
 // ── Extracted domain modules ───────────────────────────────────────────
 import { editorReducer } from '@/ui/editor/state/editorReducer'
 import type { EditorState } from '@/ui/editor/state/editorReducer'
-import { isFrameworkNode, isItemNode, WRAPPER_NODE_CLASS } from '@/ui/editor/state/helpers/nodeGeometry'
+import { isFrameworkNode, isItemNode, isExternalFrameworkNode, WRAPPER_NODE_CLASS } from '@/ui/editor/state/helpers/nodeGeometry'
 import { computeHierarchyLayout } from '@/ui/editor/layout/hierarchyLayout'
 import { computeStarLayout } from '@/ui/editor/layout/starLayout'
 import { computeTreeLayout } from '@/ui/editor/layout/treeLayout'
@@ -82,7 +84,22 @@ type EditorContextValue = {
   reconnectEdge: (_edgeId: string, _newSource: string, _newTarget: string, _newSourceHandle?: string, _newTargetHandle?: string) => void
   addChild: (_parentId: string) => void
   addDetachedItem: (_viewportCenter?: { x: number; y: number }) => void
-  addExternalFramework: (_data: ExternalFrameworkNodeData, _viewportCenter?: { x: number; y: number }) => void
+  addExternalFramework: (_data: ExternalFrameworkNodeData, _viewportCenter?: { x: number; y: number }) => string
+  remoteLinks: RemoteItemLink[]
+  addRemoteLink: (_link: RemoteItemLink) => void
+  removeRemoteLink: (_linkId: string) => void
+  updateRemoteLinkType: (_linkId: string, _associationType: string) => void
+  removeRemoteFramework: (_nodeId: string) => void
+  sidePanelMode: SidePanelMode
+  setSidePanelMode: (_mode: SidePanelMode) => void
+  previousSidePanelMode: SidePanelMode | null
+  activeRemoteFrameworkNodeId: string | null
+  setActiveRemoteFrameworkNodeId: (_nodeId: string | null) => void
+  openCgeSearchPanel: () => void
+  openRemoteItemsPanel: (_nodeId: string) => void
+  closeSidePanel: () => void
+  /** Select an external framework node and open the properties panel (from browse panel or node gear). */
+  openExternalFrameworkSettings: (_nodeId: string) => void
   addItemDialog: {
     open: boolean
     parentId: string | null
@@ -281,10 +298,48 @@ export function EditorProvider({
   // ── Active grouping filter (UI-only, not persisted) ──────────────────
   const [activeGroupingFilter, setActiveGroupingFilter] = useState<string | null>(null)
 
+  // ── Side panel (CGE search / remote items) ─────────────────────────────
+  const [sidePanelMode, setSidePanelModeState] = useState<SidePanelMode>('closed')
+  const [previousSidePanelMode, setPreviousSidePanelMode] = useState<SidePanelMode | null>(null)
+  const [activeRemoteFrameworkNodeId, setActiveRemoteFrameworkNodeId] = useState<string | null>(null)
+
+  const setSidePanelMode = useCallback((mode: SidePanelMode) => {
+    setSidePanelModeState((prev) => {
+      if (mode === 'properties' && (prev === 'cgeSearch' || prev === 'remoteItems')) {
+        setPreviousSidePanelMode(prev)
+      }
+      if (mode === 'closed') {
+        setPreviousSidePanelMode(null)
+      }
+      return mode
+    })
+  }, [])
+
+  const openCgeSearchPanel = useCallback(() => {
+    setPreviousSidePanelMode(null)
+    setSidePanelModeState('cgeSearch')
+  }, [])
+
+  const openRemoteItemsPanel = useCallback((nodeId: string) => {
+    setActiveRemoteFrameworkNodeId(nodeId)
+    setPreviousSidePanelMode(null)
+    setSidePanelModeState('remoteItems')
+  }, [])
+
+  const closeSidePanel = useCallback(() => {
+    if (sidePanelMode === 'properties' && previousSidePanelMode) {
+      setSidePanelModeState(previousSidePanelMode)
+      setPreviousSidePanelMode(null)
+      return
+    }
+    setSidePanelModeState('closed')
+    setPreviousSidePanelMode(null)
+  }, [sidePanelMode, previousSidePanelMode])
+
   // ── Reducer state ────────────────────────────────────────────────────
   const seed = useMemo(() => initialGraph ?? DEFAULT_GRAPH, [initialGraph])
   const initialState: EditorState = useMemo(
-    () => ({ nodes: seed.nodes, edges: seed.edges, selectedNodeId: null, selectedEdgeId: null, selectedNodeIds: [], selectedEdgeIds: [], layoutVersion: 0, dirty: false }),
+    () => ({ nodes: seed.nodes, edges: seed.edges, remoteLinks: seed.remoteLinks ?? [], selectedNodeId: null, selectedEdgeId: null, selectedNodeIds: [], selectedEdgeIds: [], layoutVersion: 0, dirty: false }),
     [seed],
   )
   const [state, dispatch] = useReducer(editorReducer, initialState)
@@ -439,7 +494,30 @@ export function EditorProvider({
     const uuid = globalThis.crypto?.randomUUID?.()
     const fallbackId = `${Date.now()}_${Math.random().toString(16).slice(2)}`
     const nodeId = `ext_${uuid ?? fallbackId}`
-    dispatch({ type: 'node/addExternalFramework', nodeId, data, viewportCenter })
+    const extCount = state.nodes.filter((n) => n.type === 'externalFrameworkNode').length
+    const fullData: ExternalFrameworkNodeData = {
+      ...data,
+      refId: data.refId || (uuid ?? fallbackId),
+      color: data.color || nextRemoteFrameworkColor(extCount),
+    }
+    dispatch({ type: 'node/addExternalFramework', nodeId, data: fullData, viewportCenter })
+    return nodeId
+  }, [state.nodes])
+
+  const addRemoteLink = useCallback((link: RemoteItemLink) => {
+    dispatch({ type: 'remoteLink/add', link })
+  }, [])
+
+  const removeRemoteLink = useCallback((linkId: string) => {
+    dispatch({ type: 'remoteLink/remove', linkId })
+  }, [])
+
+  const updateRemoteLinkType = useCallback((linkId: string, associationType: string) => {
+    dispatch({ type: 'remoteLink/updateType', linkId, associationType })
+  }, [])
+
+  const removeRemoteFramework = useCallback((nodeId: string) => {
+    dispatch({ type: 'node/removeRemoteFramework', nodeId })
   }, [])
 
   const setAddItemDraft = useCallback((patch: Partial<AddItemDraft>) => {
@@ -539,6 +617,33 @@ export function EditorProvider({
     [updateNodeData],
   )
 
+  // Refs for selection helpers (keeps callbacks stable without state deps)
+  const nodesRef = useRef(state.nodes)
+  nodesRef.current = state.nodes
+  const edgesRef = useRef(state.edges)
+  edgesRef.current = state.edges
+
+  const openExternalFrameworkSettings = useCallback((nodeId: string) => {
+    setActiveRemoteFrameworkNodeId(nodeId)
+    const nodeChanges: NodeChange<CaseEditorNodeType>[] = []
+    for (const n of nodesRef.current) {
+      const shouldSelect = n.id === nodeId
+      if (n.selected !== shouldSelect) {
+        nodeChanges.push({ type: 'select', id: n.id, selected: shouldSelect })
+      }
+    }
+    if (nodeChanges.length > 0) {
+      dispatch({ type: 'nodes/applyChanges', changes: nodeChanges })
+    }
+    const edgeDeselects: EdgeChange[] = edgesRef.current
+      .filter((e) => e.selected)
+      .map((e) => ({ type: 'select' as const, id: e.id, selected: false }))
+    if (edgeDeselects.length > 0) {
+      dispatch({ type: 'edges/applyChanges', changes: edgeDeselects })
+    }
+    setSidePanelMode('properties')
+  }, [setSidePanelMode])
+
   // ── Nodes with callbacks ─────────────────────────────────────────────
   // Per-element cache: only create new objects for nodes whose *data* actually
   // changed. Selection/position-only changes reuse the previous output's data
@@ -580,21 +685,29 @@ export function EditorProvider({
         return output
       }
 
+      if (isExternalFrameworkNode(n)) {
+        const reuseData = cached && (cached.input as ExternalFrameworkNodeType).data === n.data
+        const data = reuseData
+          ? (cached!.output as ExternalFrameworkNodeType).data
+          : {
+              ...n.data,
+              onRemoveRemoteFramework: removeRemoteFramework,
+              onOpenExternalFrameworkSettings: openExternalFrameworkSettings,
+            }
+        const output: CaseEditorNodeType = { ...n, className: WRAPPER_NODE_CLASS, data }
+        next.set(n.id, { input: n, output })
+        return output
+      }
+
       return n
     })
 
     nodesCacheRef.current = next
     return result
-  }, [state.nodes, addChild, updateItem, updateDocument])
+  }, [state.nodes, addChild, updateItem, updateDocument, removeRemoteFramework, openExternalFrameworkSettings])
 
   // ── React Flow event handlers ────────────────────────────────────────
 
-  // Refs for clearSelection (keeps the callback stable without state deps)
-  const nodesRef = useRef(state.nodes)
-  nodesRef.current = state.nodes
-  const edgesRef = useRef(state.edges)
-  edgesRef.current = state.edges
-
   // onSelectionChange no longer dispatches anything — selection state is
   // derived purely from `selected` flags managed by onNodesChange/onEdgesChange.
   // This callback is only used for the auto-pan-to-node behavior in EditorCanvas.
@@ -634,6 +747,7 @@ export function EditorProvider({
       dispatch({ type: 'edges/applyChanges', changes: edgeDeselects })
     }
   }, [])
+
   const clearDirty = useCallback(() => dispatch({ type: 'dirty/clear' }), [])
 
   // ── Domain accessors (memoized, always in sync with reducer state) ────
@@ -700,6 +814,7 @@ export function EditorProvider({
     () => ({
       nodes: state.nodes,
       edges: state.edges,
+      remoteLinks: state.remoteLinks,
       selectedNodeId: selectedNodeIds.length === 1 ? selectedNodeIds[0] : null,
       selectedEdgeId: selectedEdgeIds.length === 1 ? selectedEdgeIds[0] : null,
       selectedNodeIds,
@@ -742,6 +857,19 @@ export function EditorProvider({
       addChild,
       addDetachedItem,
       addExternalFramework,
+      addRemoteLink,
+      removeRemoteLink,
+      updateRemoteLinkType,
+      removeRemoteFramework,
+      sidePanelMode,
+      setSidePanelMode,
+      previousSidePanelMode,
+      activeRemoteFrameworkNodeId,
+      setActiveRemoteFrameworkNodeId,
+      openCgeSearchPanel,
+      openRemoteItemsPanel,
+      closeSidePanel,
+      openExternalFrameworkSettings,
       addItemDialog,
       setAddItemDraft,
       cancelAddItem,
@@ -756,7 +884,7 @@ export function EditorProvider({
       rootItemIds,
     }),
     [
-      state.nodes, state.edges, selectedNodeIds, selectedEdgeIds,
+      state.nodes, state.edges, state.remoteLinks, selectedNodeIds, selectedEdgeIds,
       selectedNode, selectedEdge, nodesWithCallbacks, frameworkInfo,
       state.layoutVersion, state.dirty, clearDirty,
       caseVersion, cfItemTypes, addCfItemType, ensureCfItemType,
@@ -768,6 +896,10 @@ export function EditorProvider({
       onSelectionChange, onNodesChange, onEdgesChange, onConnect,
       clearSelection, updateNodeData, updateEdgeData, flipEdge, reconnectEdge,
       addChild, addDetachedItem, addExternalFramework,
+      addRemoteLink, removeRemoteLink, updateRemoteLinkType, removeRemoteFramework,
+      sidePanelMode, setSidePanelMode, previousSidePanelMode,
+      activeRemoteFrameworkNodeId, setActiveRemoteFrameworkNodeId,
+      openCgeSearchPanel, openRemoteItemsPanel, closeSidePanel, openExternalFrameworkSettings,
       addItemDialog, setAddItemDraft, cancelAddItem, confirmAddItem,
       deleteElements, applyHierarchyLayout, applyStarLayout,
       cfDocument, frameworkNodeId, cfItems, frameworkEdges, rootItemIds,
diff --git a/apps/editor/src/ui/editor/state/editorFactories.ts b/apps/editor/src/ui/editor/state/editorFactories.ts
index f076e8d..e74ac74 100644
--- a/apps/editor/src/ui/editor/state/editorFactories.ts
+++ b/apps/editor/src/ui/editor/state/editorFactories.ts
@@ -2,11 +2,13 @@ import type { CSSProperties } from 'react'
 import { MarkerType } from '@xyflow/react'
 import type { CFDocument, CFItem } from '@/domain/case/types'
 import type { CaseEditorEdge, CaseEditorNodeType, CaseFrameworkNodeType, CaseItemNodeType } from '@/ui/editor/reactflow/types'
+import type { RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
 import { FRAMEWORK_ROOT_ASSOCIATION_TYPE } from '@/ui/editor/reactflow/types'
 
 export type EditorGraph = {
   nodes: CaseEditorNodeType[]
   edges: CaseEditorEdge[]
+  remoteLinks?: RemoteItemLink[]
 }
 
 /** Default arrow marker for edges - solid filled arrow */
diff --git a/apps/editor/src/ui/editor/state/editorReducer.test.ts b/apps/editor/src/ui/editor/state/editorReducer.test.ts
index 47dd677..fded6b0 100644
--- a/apps/editor/src/ui/editor/state/editorReducer.test.ts
+++ b/apps/editor/src/ui/editor/state/editorReducer.test.ts
@@ -8,6 +8,7 @@ function makeState(overrides: Partial<EditorState> = {}): EditorState {
   return {
     nodes: [makeFrameworkNode(), makeItemNode('item-1'), makeItemNode('item-2')],
     edges: [makeEdge('fw-1', 'item-1'), makeEdge('fw-1', 'item-2')],
+    remoteLinks: [],
     selectedNodeId: null,
     selectedEdgeId: null,
     selectedNodeIds: [],
@@ -263,6 +264,42 @@ describe('node/updateData', () => {
     expect((item?.data as { cfItem: { fullStatement: string } }).cfItem.fullStatement).toBe('Updated statement')
     expect(next.dirty).toBe(true)
   })
+
+  it('syncs remote link banner colors when external framework color changes', () => {
+    const state = makeState({
+      nodes: [
+        ...makeState().nodes,
+        {
+          id: 'ext-1',
+          type: 'externalFrameworkNode',
+          position: { x: 500, y: 0 },
+          data: { refId: 'fw-ref-1', title: 'Remote', color: '#0ea5e9' },
+        },
+      ],
+      remoteLinks: [
+        {
+          id: 'link-1',
+          localItemId: 'item-1',
+          remoteItemUri: 'urn:case:item:r1',
+          remoteItemIdentifier: 'r1',
+          remoteFrameworkRefId: 'fw-ref-1',
+          associationType: 'isRelatedTo',
+          remoteLabel: 'Remote item',
+          remoteFrameworkColor: '#0ea5e9',
+          remoteFrameworkTitle: 'Remote',
+        },
+      ],
+    })
+
+    const next = editorReducer(state, {
+      type: 'node/updateData',
+      nodeId: 'ext-1',
+      patch: { color: '#dc2626' },
+    })
+
+    expect(next.remoteLinks[0]?.remoteFrameworkColor).toBe('#dc2626')
+    expect((next.nodes.find((n) => n.id === 'ext-1')?.data as { color: string }).color).toBe('#dc2626')
+  })
 })
 
 describe('edge/updateData', () => {
@@ -405,7 +442,7 @@ describe('referential identity', () => {
     const next = editorReducer(state, {
       type: 'node/addExternalFramework',
       nodeId: 'ext-1',
-      data: { title: 'External' },
+      data: { refId: 'ext-ref-1', title: 'External', color: '' },
     })
 
     expect(next.nodes.find((n) => n.id === 'item-2')).toBe(untouchedItem)
diff --git a/apps/editor/src/ui/editor/state/editorReducer.ts b/apps/editor/src/ui/editor/state/editorReducer.ts
index 07b6f1c..c0a0d32 100644
--- a/apps/editor/src/ui/editor/state/editorReducer.ts
+++ b/apps/editor/src/ui/editor/state/editorReducer.ts
@@ -19,23 +19,15 @@ import { FRAMEWORK_ROOT_ASSOCIATION_TYPE } from '@/ui/editor/reactflow/types'
 import type { CFItem } from '@/domain/case/types'
 import type { EditorGraph } from '@/ui/editor/state/editorFactories'
 import { DEFAULT_EDGE_MARKER, getEdgeMarkers, getEdgeStyle, makeEdgeLabel } from '@/ui/editor/state/editorFactories'
-import {
-  DEFAULT_NODE_HEIGHT,
-  DEFAULT_NODE_WIDTH,
-  HEADER_SAFE_Y,
-  WRAPPER_NODE_CLASS,
-  findNonOverlappingPosition,
-  getClosestHandles,
-  getNodeSize,
-  isFrameworkNode,
-  isItemNode,
-} from '@/ui/editor/state/helpers/nodeGeometry'
+import type { RemoteItemLink } from '@/ui/editor/remoteFramework/remoteFrameworkTypes'
+import { DEFAULT_NODE_HEIGHT, DEFAULT_NODE_WIDTH, HEADER_SAFE_Y, WRAPPER_NODE_CLASS, findNonOverlappingPosition, getClosestHandles, getNodeSize, isFrameworkNode, isItemNode } from '@/ui/editor/state/helpers/nodeGeometry'
 
 // ── State ──────────────────────────────────────────────────────────────
 
 export type EditorState = {
   nodes: CaseEditorNodeType[]
   edges: CaseEditorEdge[]
+  remoteLinks: RemoteItemLink[]
   selectedNodeId: string | null
   selectedEdgeId: string | null
   /** IDs of all selected nodes (for multi-selection) */
@@ -63,6 +55,10 @@ export type Action =
   | { type: 'node/addChild'; parentId: string; childId: string; cfItem: CFItem }
   | { type: 'node/addDetachedItem'; nodeId: string; cfItem: CFItem; viewportCenter?: { x: number; y: number } }
   | { type: 'node/addExternalFramework'; nodeId: string; data: ExternalFrameworkNodeData; viewportCenter?: { x: number; y: number } }
+  | { type: 'node/removeRemoteFramework'; nodeId: string }
+  | { type: 'remoteLink/add'; link: RemoteItemLink }
+  | { type: 'remoteLink/remove'; linkId: string }
+  | { type: 'remoteLink/updateType'; linkId: string; associationType: string }
   | { type: 'graph/delete'; nodeIds: string[]; edgeIds: string[]; reattachChildren: boolean }
   | { type: 'layout/apply'; positions: Record<string, { x: number; y: number }> }
   | { type: 'layout/applyHierarchy'; positions: Record<string, { x: number; y: number }>; edgeHandles: Record<string, { sourceHandle: string; targetHandle: string; edgeType?: string; labelPosition?: 'center' | 'target' }> }
@@ -193,6 +189,7 @@ export function editorReducer(state: EditorState, action: Action): EditorState {
     }
     case 'node/updateData': {
       const { nodeId, patch } = action
+      const targetNode = state.nodes.find((n) => n.id === nodeId)
       const nodes = state.nodes.map((n) => {
         if (n.id !== nodeId) return n
         if (isItemNode(n) && 'cfItem' in patch && patch.cfItem) {
@@ -206,7 +203,21 @@ export function editorReducer(state: EditorState, action: Action): EditorState {
         }
         return n
       })
-      return { ...state, nodes, dirty: true }
+
+      let remoteLinks = state.remoteLinks
+      if (targetNode?.type === 'externalFrameworkNode' && (patch.color !== undefined || patch.title !== undefined)) {
+        const refId = (targetNode.data as ExternalFrameworkNodeData).refId
+        remoteLinks = state.remoteLinks.map((l) => {
+          if (l.remoteFrameworkRefId !== refId) return l
+          return {
+            ...l,
+            ...(patch.color !== undefined ? { remoteFrameworkColor: patch.color } : {}),
+            ...(patch.title !== undefined ? { remoteFrameworkTitle: patch.title } : {}),
+          }
+        })
+      }
+
+      return { ...state, nodes, remoteLinks, dirty: true }
     }
     case 'edge/updateData': {
       const { edgeId, patch } = action
@@ -495,6 +506,50 @@ export function editorReducer(state: EditorState, action: Action): EditorState {
       const nextNodes = [...deselectExcept(state.nodes, state.selectedNodeIds), { ...newNode, selected: true }]
       return { ...state, nodes: nextNodes, selectedNodeId: action.nodeId, selectedEdgeId: null, selectedNodeIds: [action.nodeId], selectedEdgeIds: [], dirty: true }
     }
+    case 'node/removeRemoteFramework': {
+      const refId = state.nodes.find((n) => n.id === action.nodeId && n.type === 'externalFrameworkNode')
+        ? (state.nodes.find((n) => n.id === action.nodeId)?.data as ExternalFrameworkNodeData | undefined)?.refId
+        : undefined
+      const nextNodes = state.nodes.filter((n) => n.id !== action.nodeId)
+      const nextLinks = refId
+        ? state.remoteLinks.filter((l) => l.remoteFrameworkRefId !== refId)
+        : state.remoteLinks
+      const nextEdges = state.edges.filter((e) => e.source !== action.nodeId && e.target !== action.nodeId)
+      return {
+        ...state,
+        nodes: nextNodes,
+        edges: nextEdges,
+        remoteLinks: nextLinks,
+        selectedNodeId: state.selectedNodeId === action.nodeId ? null : state.selectedNodeId,
+        selectedNodeIds: state.selectedNodeIds.filter((id) => id !== action.nodeId),
+        dirty: true,
+      }
+    }
+    case 'remoteLink/add': {
+      const exists = state.remoteLinks.some(
+        (l) => l.localItemId === action.link.localItemId &&
+          l.remoteItemIdentifier === action.link.remoteItemIdentifier &&
+          l.remoteFrameworkRefId === action.link.remoteFrameworkRefId
+      )
+      if (exists) return state
+      return { ...state, remoteLinks: [...state.remoteLinks, action.link], dirty: true }
+    }
+    case 'remoteLink/remove': {
+      return {
+        ...state,
+        remoteLinks: state.remoteLinks.filter((l) => l.id !== action.linkId),
+        dirty: true,
+      }
+    }
+    case 'remoteLink/updateType': {
+      return {
+        ...state,
+        remoteLinks: state.remoteLinks.map((l) =>
+          l.id === action.linkId ? { ...l, associationType: action.associationType } : l
+        ),
+        dirty: true,
+      }
+    }
     case 'node/addExternalFramework': {
       const existingNodes = state.nodes
       const nodeSize = { w: 280, h: 120 }
@@ -595,6 +650,7 @@ export function editorReducer(state: EditorState, action: Action): EditorState {
       const selectedEdgeId = state.selectedEdgeId && deleteEdgeIds.has(state.selectedEdgeId) ? null : state.selectedEdgeId
       const selectedNodeIds = state.selectedNodeIds.filter((id) => !deleteNodeIds.has(id))
       const selectedEdgeIds = state.selectedEdgeIds.filter((id) => !deleteEdgeIds.has(id))
+      const remainingRemoteLinks = state.remoteLinks.filter((l) => !deleteNodeIds.has(l.localItemId))
       return {
         ...state,
         selectedNodeId,
@@ -613,6 +669,7 @@ export function editorReducer(state: EditorState, action: Action): EditorState {
           const shouldBeSelected = selectedEdgeId ? e.id === selectedEdgeId : false
           return Boolean(e.selected) === shouldBeSelected ? e : { ...e, selected: shouldBeSelected }
         }) as CaseEditorEdge[],
+        remoteLinks: remainingRemoteLinks,
         dirty: true,
       }
     }
@@ -646,6 +703,7 @@ export function editorReducer(state: EditorState, action: Action): EditorState {
       return {
         nodes: action.graph.nodes,
         edges: action.graph.edges,
+        remoteLinks: action.graph.remoteLinks ?? [],
         selectedNodeId: null,
         selectedEdgeId: null,
         selectedNodeIds: [],
diff --git a/apps/editor/src/ui/editor/state/helpers/nodeGeometry.ts b/apps/editor/src/ui/editor/state/helpers/nodeGeometry.ts
index c12290e..9b32bc5 100644
--- a/apps/editor/src/ui/editor/state/helpers/nodeGeometry.ts
+++ b/apps/editor/src/ui/editor/state/helpers/nodeGeometry.ts
@@ -9,6 +9,7 @@ import type {
   CaseEditorNodeType,
   CaseFrameworkNodeType,
   CaseItemNodeType,
+  ExternalFrameworkNodeType,
 } from '@/ui/editor/reactflow/types'
 
 // ── Layout constants ───────────────────────────────────────────────────
@@ -44,6 +45,9 @@ export const isFrameworkNode = (n: CaseEditorNodeType): n is CaseFrameworkNodeTy
 export const isItemNode = (n: CaseEditorNodeType): n is CaseItemNodeType =>
   n.type === 'caseItemNode'
 
+export const isExternalFrameworkNode = (n: CaseEditorNodeType): n is ExternalFrameworkNodeType =>
+  n.type === 'externalFrameworkNode'
+
 // ── Node size ──────────────────────────────────────────────────────────
 
 export function getNodeSize(n: CaseEditorNodeType): { w: number; h: number } {
diff --git a/apps/editor/src/ui/home/CgeCredentialsDialog.tsx b/apps/editor/src/ui/home/CgeCredentialsDialog.tsx
new file mode 100644
index 0000000..890085d
--- /dev/null
+++ b/apps/editor/src/ui/home/CgeCredentialsDialog.tsx
@@ -0,0 +1,326 @@
+import { useCallback, useEffect, useState } from 'react'
+import { Button } from '@/ui/shared/components/ui/button'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/ui/shared/components/ui/dialog'
+import { Input } from '@/ui/shared/components/ui/input'
+import { Label } from '@/ui/shared/components/ui/label'
+import type { CaseApiClient, CgeCredentialsPublic } from '@/infrastructure/caseApi/CaseApiClient'
+
+const DISCOVERY_PLACEHOLDER =
+  'https://caseglobal-preview.1edtech.org/auth/realms/caseglobal/.well-known/openid-configuration'
+
+export default function CgeCredentialsDialog({
+  open,
+  onClose,
+  api,
+  tenantId,
+}: Readonly<{
+  open: boolean
+  onClose: () => void
+  api: CaseApiClient
+  tenantId: string
+}>) {
+  const [status, setStatus] = useState<CgeCredentialsPublic | null>(null)
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+  const [success, setSuccess] = useState<string | null>(null)
+
+  const [discoveryUrl, setDiscoveryUrl] = useState('')
+  const [clientId, setClientId] = useState('')
+  const [clientSecret, setClientSecret] = useState('')
+  const [saving, setSaving] = useState(false)
+  const [testing, setTesting] = useState(false)
+  const [deleting, setDeleting] = useState(false)
+  const [confirmDelete, setConfirmDelete] = useState(false)
+
+  const loadStatus = useCallback(async () => {
+    setLoading(true)
+    setError(null)
+    try {
+      const result = await api.getCgeCredentials({ tenantId })
+      setStatus(result)
+      if (result.configured) {
+        setDiscoveryUrl(result.discoveryUrl ?? '')
+      }
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setLoading(false)
+    }
+  }, [api, tenantId])
+
+  useEffect(() => {
+    if (open) {
+      setClientId('')
+      setClientSecret('')
+      setDiscoveryUrl('')
+      setSuccess(null)
+      setError(null)
+      setConfirmDelete(false)
+      void loadStatus()
+    }
+  }, [open, loadStatus])
+
+  const handleSave = useCallback(async () => {
+    const id = clientId.trim()
+    const discovery = discoveryUrl.trim()
+    const secret = clientSecret
+    if (!discovery) {
+      setError('OpenID discovery URL is required')
+      return
+    }
+    if (!id) {
+      setError('Client ID is required')
+      return
+    }
+    if (!status?.configured && !secret.trim()) {
+      setError('Client secret is required')
+      return
+    }
+    setSaving(true)
+    setError(null)
+    setSuccess(null)
+    try {
+      const result = await api.putCgeCredentials({
+        tenantId,
+        clientId: id,
+        clientSecret: secret,
+        discoveryUrl: discovery,
+      })
+      setStatus(result)
+      setClientSecret('')
+      setDiscoveryUrl(result.discoveryUrl ?? discovery)
+      setSuccess('CASE Global connection saved.')
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setSaving(false)
+    }
+  }, [api, tenantId, clientId, clientSecret, discoveryUrl, status?.configured])
+
+  const handleTest = useCallback(async () => {
+    setTesting(true)
+    setError(null)
+    setSuccess(null)
+    try {
+      const result = await api.testCgeCredentials({ tenantId })
+      if (result.ok) {
+        setSuccess(result.message || 'Token minted successfully.')
+      } else {
+        setError(result.message || 'Credential test failed.')
+      }
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setTesting(false)
+    }
+  }, [api, tenantId])
+
+  const handleDelete = useCallback(async () => {
+    setDeleting(true)
+    setError(null)
+    setSuccess(null)
+    try {
+      await api.deleteCgeCredentials({ tenantId })
+      setStatus({
+        configured: false,
+        clientIdMasked: null,
+        discoveryUrl: null,
+        updatedAt: null,
+      })
+      setDiscoveryUrl('')
+      setClientId('')
+      setClientSecret('')
+      setConfirmDelete(false)
+      setSuccess('CASE Global connection removed.')
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setDeleting(false)
+    }
+  }, [api, tenantId])
+
+  const handleClose = useCallback(() => {
+    setConfirmDelete(false)
+    setError(null)
+    setSuccess(null)
+    setClientId('')
+    setClientSecret('')
+    setDiscoveryUrl('')
+    onClose()
+  }, [onClose])
+
+  const canSave =
+    Boolean(discoveryUrl.trim() && clientId.trim()) &&
+    (status?.configured || Boolean(clientSecret.trim()))
+
+  return (
+    <>
+      <Dialog open={open && !confirmDelete} onOpenChange={(v) => { if (!v) handleClose() }}>
+        <DialogContent className="max-w-lg">
+          <DialogHeader>
+            <DialogTitle>CASE Global</DialogTitle>
+            <DialogDescription>
+              Configure this organization&apos;s CASE Global OpenID discovery endpoint and consumer credentials.
+              Token and API URLs are resolved automatically from discovery. The client secret is kept on the OpenCASE server only.
+            </DialogDescription>
+          </DialogHeader>
+
+          {error && (
+            <div className="rounded-md border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-800">
+              {error}
+            </div>
+          )}
+          {success && (
+            <div className="rounded-md border border-green-200 bg-green-50 px-3 py-2 text-sm text-green-800">
+              {success}
+            </div>
+          )}
+
+          <div className="rounded-lg border border-gray-200 bg-white px-3 py-2.5">
+            {loading ? (
+              <p className="text-sm text-gray-400">Loading...</p>
+            ) : status?.configured ? (
+              <div className="space-y-1 text-sm">
+                <p className="font-medium text-gray-800">Configured</p>
+                <p className="font-mono text-xs text-gray-600">
+                  Client ID: {status.clientIdMasked}
+                </p>
+                {status.discoveryUrl ? (
+                  <p className="font-mono text-xs text-gray-600 break-all">
+                    Discovery: {status.discoveryUrl}
+                  </p>
+                ) : null}
+                {status.updatedAt ? (
+                  <p className="text-xs text-gray-400">
+                    Updated {new Date(status.updatedAt).toLocaleString()}
+                  </p>
+                ) : null}
+              </div>
+            ) : (
+              <p className="text-sm text-gray-400">No CASE Global connection configured yet.</p>
+            )}
+          </div>
+
+          <div className="rounded-lg border border-gray-200 bg-gray-50 p-3">
+            <div className="grid gap-3">
+              <div className="grid gap-2">
+                <Label htmlFor="cge_discovery_url" className="text-xs font-medium text-gray-600">
+                  OpenID discovery URL
+                </Label>
+                <Input
+                  id="cge_discovery_url"
+                  value={discoveryUrl}
+                  onChange={(e) => setDiscoveryUrl(e.target.value)}
+                  placeholder={DISCOVERY_PLACEHOLDER}
+                  className="font-mono text-sm"
+                  autoComplete="off"
+                />
+                <p className="text-xs text-gray-400">
+                  Realm issuer URLs are accepted too — the well-known path is appended automatically.
+                </p>
+              </div>
+              <div className="grid gap-2">
+                <Label htmlFor="cge_client_id" className="text-xs font-medium text-gray-600">
+                  Client ID
+                </Label>
+                <Input
+                  id="cge_client_id"
+                  value={clientId}
+                  onChange={(e) => setClientId(e.target.value)}
+                  placeholder={status?.configured ? (status.clientIdMasked ?? 'Client ID') : 'Organisation API key client_id'}
+                  className="font-mono text-sm"
+                  autoComplete="off"
+                />
+              </div>
+              <div className="grid gap-2">
+                <Label htmlFor="cge_client_secret" className="text-xs font-medium text-gray-600">
+                  Client secret
+                </Label>
+                <Input
+                  id="cge_client_secret"
+                  type="password"
+                  value={clientSecret}
+                  onChange={(e) => setClientSecret(e.target.value)}
+                  placeholder={
+                    status?.configured
+                      ? 'Leave blank to keep current secret'
+                      : 'Organisation API key client_secret'
+                  }
+                  className="font-mono text-sm"
+                  autoComplete="new-password"
+                />
+              </div>
+            </div>
+            <p className="mt-2 text-xs text-gray-400">
+              {status?.configured
+                ? 'Saving re-fetches discovery and updates credentials. Leave the secret blank to keep the current one.'
+                : 'Saving fetches the discovery document and stores resolved endpoints with your credentials.'}
+            </p>
+            <div className="mt-3 flex flex-wrap gap-2">
+              <Button
+                size="sm"
+                disabled={saving || !canSave}
+                onClick={() => void handleSave()}
+              >
+                {saving ? 'Saving...' : status?.configured ? 'Update connection' : 'Save connection'}
+              </Button>
+              {status?.configured ? (
+                <Button
+                  size="sm"
+                  variant="outline"
+                  disabled={testing}
+                  onClick={() => void handleTest()}
+                >
+                  {testing ? 'Testing...' : 'Test connection'}
+                </Button>
+              ) : null}
+              {status?.configured ? (
+                <Button
+                  size="sm"
+                  variant="destructive"
+                  disabled={deleting}
+                  onClick={() => setConfirmDelete(true)}
+                >
+                  Remove
+                </Button>
+              ) : null}
+            </div>
+          </div>
+
+          <DialogFooter>
+            <Button variant="secondary" onClick={handleClose}>
+              Close
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      <Dialog open={confirmDelete} onOpenChange={(v) => { if (!v) setConfirmDelete(false) }}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>Remove CASE Global connection</DialogTitle>
+            <DialogDescription>
+              Remove the stored CASE Global discovery endpoint and API key for this organization?
+              Search and import from CASE Global will stop working until a new connection is saved.
+            </DialogDescription>
+          </DialogHeader>
+          <DialogFooter>
+            <Button variant="secondary" onClick={() => setConfirmDelete(false)} disabled={deleting}>
+              Cancel
+            </Button>
+            <Button variant="destructive" onClick={() => void handleDelete()} disabled={deleting}>
+              {deleting ? 'Removing...' : 'Remove'}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </>
+  )
+}
diff --git a/apps/editor/src/ui/home/HomeScreen.tsx b/apps/editor/src/ui/home/HomeScreen.tsx
index 8210534..34f3822 100644
--- a/apps/editor/src/ui/home/HomeScreen.tsx
+++ b/apps/editor/src/ui/home/HomeScreen.tsx
@@ -1,4 +1,4 @@
-import { PlusIcon, ArrowPathIcon, MagnifyingGlassIcon, FunnelIcon, XMarkIcon, ArrowRightStartOnRectangleIcon, CloudArrowDownIcon, KeyIcon, ArrowUpTrayIcon } from '@heroicons/react/24/solid'
+import { PlusIcon, ArrowPathIcon, MagnifyingGlassIcon, FunnelIcon, XMarkIcon, ArrowRightStartOnRectangleIcon, CloudArrowDownIcon, KeyIcon, ArrowUpTrayIcon, UsersIcon, GlobeAltIcon } from '@heroicons/react/24/solid'
 import { CodeBracketSquareIcon } from '@heroicons/react/24/outline'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { Button } from '@/ui/shared/components/ui/button'
@@ -7,11 +7,14 @@ import CreateFrameworkDialog, { type CreateFrameworkDraft } from '@/ui/home/Crea
 import ImportFrameworkDialog from '@/ui/home/ImportFrameworkDialog'
 import UploadFrameworkDialog from '@/ui/home/UploadFrameworkDialog'
 import ApiKeysDialog from '@/ui/home/ApiKeysDialog'
+import MembersDialog from '@/ui/home/MembersDialog'
+import CgeCredentialsDialog from '@/ui/home/CgeCredentialsDialog'
 import type { Framework } from '@/domain/framework/model/types'
 import { useAuth } from '@/app/providers/AuthProvider'
 import { getAppConfig } from '@/app/config'
 import { CaseApiClient, type CfDocumentSummary } from '@/infrastructure/caseApi/CaseApiClient'
 import { createFetchHttpClient } from '@/infrastructure/caseApi/http'
+import { tokenHasCaseOwner, decodeJwtPayload } from '@/infrastructure/auth/tokenScopes'
 import { ADOPTION_STATUS_OPTIONS } from '@/domain/framework/model/adoptionStatus'
 
 /** Compute initials from a display name */
@@ -32,7 +35,25 @@ import {
 } from '@/ui/shared/components/ui/dialog'
 
 /** Minimal user avatar dropdown for the hero */
-function UserAvatarMenu({ userName, tenantId: _tenantId, isAuthenticated, onSignOut, onChangePassword, onApiKeys }: Readonly<{ userName?: string; tenantId?: string; isAuthenticated: boolean; onSignOut?: () => void; onChangePassword?: () => void; onApiKeys?: () => void }>) {
+function UserAvatarMenu({
+  userName,
+  tenantId: _tenantId,
+  isAuthenticated,
+  onSignOut,
+  onChangePassword,
+  onApiKeys,
+  onMembers,
+  onCgeCredentials,
+}: Readonly<{
+  userName?: string
+  tenantId?: string
+  isAuthenticated: boolean
+  onSignOut?: () => void
+  onChangePassword?: () => void
+  onApiKeys?: () => void
+  onMembers?: () => void
+  onCgeCredentials?: () => void
+}>) {
   const [open, setOpen] = useState(false)
   const rootRef = useRef<HTMLDivElement | null>(null)
   const avatarText = useMemo(() => initials(userName), [userName])
@@ -47,7 +68,7 @@ function UserAvatarMenu({ userName, tenantId: _tenantId, isAuthenticated, onSign
   }, [open])
 
   return (
-    <div className="absolute right-5 top-4 z-10" ref={rootRef}>
+    <div className="absolute right-5 top-4 z-50" ref={rootRef}>
       <button
         type="button"
         onClick={() => setOpen((v) => !v)}
@@ -60,7 +81,7 @@ function UserAvatarMenu({ userName, tenantId: _tenantId, isAuthenticated, onSign
       </button>
 
       {open ? (
-        <div role="menu" className="absolute right-0 z-40 mt-2 w-52 overflow-hidden rounded-xl border border-gray-200 bg-white shadow-lg">
+        <div role="menu" className="absolute right-0 z-50 mt-2 w-56 overflow-hidden rounded-xl border border-gray-200 bg-white shadow-lg">
           <div className="p-1">
             {userName ? (
               <div className="px-2 py-2 text-sm text-gray-400">Signed in as {userName}</div>
@@ -79,6 +100,17 @@ function UserAvatarMenu({ userName, tenantId: _tenantId, isAuthenticated, onSign
                 Change password
               </button>
             ) : null}
+            {isAuthenticated && onMembers ? (
+              <button
+                role="menuitem"
+                type="button"
+                className="flex w-full items-center gap-2 rounded-lg px-2 py-2 text-left text-sm text-[#2E2F2F] hover:bg-gray-50"
+                onClick={() => { onMembers(); setOpen(false) }}
+              >
+                <UsersIcon className="h-4 w-4 text-gray-500" aria-hidden />
+                Members
+              </button>
+            ) : null}
             {isAuthenticated && onApiKeys ? (
               <button
                 role="menuitem"
@@ -90,6 +122,17 @@ function UserAvatarMenu({ userName, tenantId: _tenantId, isAuthenticated, onSign
                 API Keys
               </button>
             ) : null}
+            {isAuthenticated && onCgeCredentials ? (
+              <button
+                role="menuitem"
+                type="button"
+                className="flex w-full items-center gap-2 rounded-lg px-2 py-2 text-left text-sm text-[#2E2F2F] hover:bg-gray-50"
+                onClick={() => { onCgeCredentials(); setOpen(false) }}
+              >
+                <GlobeAltIcon className="h-4 w-4 text-gray-500" aria-hidden />
+                CASE Global
+              </button>
+            ) : null}
             {isAuthenticated && onSignOut ? (
               <button
                 role="menuitem"
@@ -126,6 +169,8 @@ export default function HomeScreen({
   const [importOpen, setImportOpen] = useState(false)
   const [uploadOpen, setUploadOpen] = useState(false)
   const [apiKeysOpen, setApiKeysOpen] = useState(false)
+  const [membersOpen, setMembersOpen] = useState(false)
+  const [cgeCredentialsOpen, setCgeCredentialsOpen] = useState(false)
   const [actionsMenuOpen, setActionsMenuOpen] = useState(false)
   const actionsMenuRef = useRef<HTMLDivElement | null>(null)
 
@@ -138,8 +183,13 @@ export default function HomeScreen({
     globalThis.addEventListener('pointerdown', onPointerDown)
     return () => globalThis.removeEventListener('pointerdown', onPointerDown)
   }, [actionsMenuOpen])
-  const { status, tenantId, userName, signOut, getAccessToken, changePassword } = useAuth()
+  const { status, tenantId, userName, signOut, getAccessToken, changePassword, accessToken } = useAuth()
   const cfg = getAppConfig()
+  const isTenantAdmin = useMemo(() => tokenHasCaseOwner(accessToken), [accessToken])
+  const currentUserId = useMemo(() => {
+    const payload = decodeJwtPayload(accessToken)
+    return typeof payload?.sub === 'string' ? payload.sub : null
+  }, [accessToken])
 
   const api = useMemo(() => new CaseApiClient(createFetchHttpClient(cfg.opencaseBaseUrl, { getAccessToken })), [cfg.opencaseBaseUrl, getAccessToken])
 
@@ -149,8 +199,8 @@ export default function HomeScreen({
   const [error, setError] = useState<string | null>(null)
   const [hasLoadedOnce, setHasLoadedOnce] = useState(false)
 
-  // Active / Archived tab
-  const [viewMode, setViewMode] = useState<'active' | 'archived'>('active')
+  // Active / Remote / Archived tabs
+  const [viewMode, setViewMode] = useState<'active' | 'remote' | 'archived'>('active')
 
   // Archived frameworks (loaded when switching to Archived tab)
   const [archivedFrameworks, setArchivedFrameworks] = useState<CfDocumentSummary[]>([])
@@ -174,7 +224,9 @@ export default function HomeScreen({
     setLoading(true)
     setError(null)
     try {
-      const docs = await api.listCfDocuments({ caseVersion: 'v1p1' })
+      const docs = tenantId
+        ? await api.listManagementCfPackages({ tenantId, caseVersion: '1.1' })
+        : await api.listCfDocuments({ caseVersion: 'v1p1' })
       setServerFrameworks(docs)
       setHasLoadedOnce(true)
     } catch (e: unknown) {
@@ -183,7 +235,7 @@ export default function HomeScreen({
     } finally {
       setLoading(false)
     }
-  }, [api])
+  }, [api, tenantId])
 
   // Auto-load when authenticated
   useEffect(() => {
@@ -357,25 +409,48 @@ export default function HomeScreen({
     return true
   }
 
-  // Filtered server frameworks
+  // Editable vs read-only remote cache frameworks
+  const editableServerFrameworks = useMemo(
+    () => serverFrameworks.filter((doc) => doc.readOnly !== true),
+    [serverFrameworks],
+  )
+
+  const remoteServerFrameworks = useMemo(
+    () => serverFrameworks.filter((doc) => doc.readOnly === true),
+    [serverFrameworks],
+  )
+
+  // Filtered editable server frameworks (Active tab)
   const filteredServerFrameworks = useMemo(
     () =>
-      serverFrameworks.filter((doc) => {
+      editableServerFrameworks.filter((doc) => {
         return doc.frameworkType !== 'Alignment' && matchesSearch(doc.title, doc.creator, doc.description) && matchesFilters(doc.adoptionStatus, doc.frameworkType)
       }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [serverFrameworks, searchQuery, statusFilter, typeFilter],
+    [editableServerFrameworks, searchQuery, statusFilter, typeFilter],
+  )
+
+  // Filtered remote cache frameworks (Remote tab)
+  const filteredRemoteFrameworks = useMemo(
+    () =>
+      remoteServerFrameworks.filter((doc) => {
+        return matchesSearch(doc.title, doc.creator, doc.description) && matchesFilters(doc.adoptionStatus, doc.frameworkType)
+      }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [remoteServerFrameworks, searchQuery, statusFilter, typeFilter],
   )
 
   // Collect unique framework types for the type filter dropdown
   const allFrameworkTypes = useMemo(() => {
     const types = new Set<string>()
-    serverFrameworks.forEach((d) => { if (d.frameworkType && d.frameworkType !== 'Alignment') types.add(d.frameworkType) })
+    editableServerFrameworks.forEach((d) => { if (d.frameworkType && d.frameworkType !== 'Alignment') types.add(d.frameworkType) })
+    remoteServerFrameworks.forEach((d) => { if (d.frameworkType && d.frameworkType !== 'Alignment') types.add(d.frameworkType) })
     return Array.from(types).sort((a, b) => a.localeCompare(b))
-  }, [serverFrameworks])
+  }, [editableServerFrameworks, remoteServerFrameworks])
 
   const hasActiveFilters = Boolean(searchQuery || statusFilter || typeFilter)
-  const totalResults = filteredServerFrameworks.length
+  const totalActiveResults = filteredServerFrameworks.length
+  const totalRemoteResults = filteredRemoteFrameworks.length
 
   const clearFilters = useCallback(() => {
     setSearchQuery('')
@@ -388,21 +463,20 @@ export default function HomeScreen({
 
       {/* ── Hero Section ─────────────────────────────────────────── */}
       <div
-        className="relative overflow-hidden"
+        className="relative z-30"
         style={{ background: 'linear-gradient(135deg, #000072 0%, #1a0f80 25%, #3d1a9b 50%, #662F90 80%)' }}
       >
-        {/* Subtle radial glow accents */}
-        <div className="pointer-events-none absolute inset-0" aria-hidden>
+        {/* Subtle radial glow accents (clipped so they don't spill) */}
+        <div className="pointer-events-none absolute inset-0 overflow-hidden" aria-hidden>
           <div className="absolute -right-32 -top-32 h-[28rem] w-[28rem] rounded-full bg-[#662F90]/15 blur-3xl" />
           <div className="absolute -bottom-20 -left-20 h-80 w-80 rounded-full bg-[#3d1a9b]/10 blur-3xl" />
-        </div>
-        {/* Network graph pattern — right side */}
-        <svg
-          className="pointer-events-none absolute right-0 top-0 hidden h-full w-[55%] sm:block"
-          viewBox="0 0 600 200"
-          preserveAspectRatio="xMaxYMid slice"
-          aria-hidden
-        >
+          {/* Network graph pattern — right side */}
+          <svg
+            className="absolute right-0 top-0 hidden h-full w-[55%] sm:block"
+            viewBox="0 0 600 200"
+            preserveAspectRatio="xMaxYMid slice"
+            aria-hidden
+          >
           <defs>
             <linearGradient id="hero-fade" x1="0" y1="0" x2="1" y2="0">
               <stop offset="0%" stopColor="white" stopOpacity="0" />
@@ -448,9 +522,19 @@ export default function HomeScreen({
             <circle cx="480" cy="170" r="3" />
           </g>
         </svg>
+        </div>
 
         {/* User button — top right */}
-        <UserAvatarMenu userName={userName ?? undefined} tenantId={tenantId ?? undefined} isAuthenticated={isAuthenticated} onSignOut={isAuthenticated ? () => void signOut() : undefined} onChangePassword={isAuthenticated && changePassword ? () => void changePassword() : undefined} onApiKeys={isAuthenticated ? () => setApiKeysOpen(true) : undefined} />
+        <UserAvatarMenu
+          userName={userName ?? undefined}
+          tenantId={tenantId ?? undefined}
+          isAuthenticated={isAuthenticated}
+          onSignOut={isAuthenticated ? () => void signOut() : undefined}
+          onChangePassword={isAuthenticated && changePassword ? () => void changePassword() : undefined}
+          onMembers={isAuthenticated && isTenantAdmin ? () => setMembersOpen(true) : undefined}
+          onApiKeys={isAuthenticated && isTenantAdmin ? () => setApiKeysOpen(true) : undefined}
+          onCgeCredentials={isAuthenticated && isTenantAdmin ? () => setCgeCredentialsOpen(true) : undefined}
+        />
 
         <div className="relative mx-auto max-w-6xl px-5 pb-12 pt-14">
           <div className="flex items-baseline gap-3">
@@ -547,7 +631,7 @@ export default function HomeScreen({
           )}
         </div>
 
-        {/* ── Active / Archived tabs + Refresh icon ───────────────── */}
+        {/* ── Active / Remote / Archived tabs + Refresh icon ───────── */}
         {isAuthenticated && (
           <div className="mb-6 flex items-center justify-between">
             <div className="flex gap-1 rounded-lg bg-gray-100 p-1">
@@ -563,6 +647,23 @@ export default function HomeScreen({
               >
                 Active
               </button>
+              <button
+                type="button"
+                onClick={() => setViewMode('remote')}
+                className={[
+                  'rounded-md px-4 py-2 text-sm font-medium transition-colors',
+                  viewMode === 'remote'
+                    ? 'bg-white text-[#2E2F2F] shadow-sm'
+                    : 'text-gray-500 hover:text-[#2E2F2F]',
+                ].join(' ')}
+              >
+                Remote
+                {remoteServerFrameworks.length > 0 ? (
+                  <span className="ml-1.5 rounded-full bg-slate-200 px-1.5 py-0.5 text-[10px] font-semibold text-slate-600">
+                    {remoteServerFrameworks.length}
+                  </span>
+                ) : null}
+              </button>
               <button
                 type="button"
                 onClick={() => {
@@ -594,8 +695,8 @@ export default function HomeScreen({
           </div>
         )}
 
-        {/* ── Search & filter bar (active tab only) ──────────────────── */}
-        {viewMode === 'active' && <div className="flex flex-wrap items-center gap-3">
+        {/* ── Search & filter bar (active / remote tabs) ─────────────── */}
+        {(viewMode === 'active' || viewMode === 'remote') && <div className="flex flex-wrap items-center gap-3">
           {/* Search input (always visible) */}
           <div className="relative min-w-0 flex-1">
             <MagnifyingGlassIcon className="pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400" />
@@ -656,7 +757,15 @@ export default function HomeScreen({
         {/* Active filter summary */}
         {viewMode === 'active' && hasActiveFilters && (
           <div className="mt-3 text-sm text-gray-400">
-            Showing {totalResults} {totalResults === 1 ? 'framework' : 'frameworks'}
+            Showing {totalActiveResults} {totalActiveResults === 1 ? 'framework' : 'frameworks'}
+            {searchQuery ? <> matching &ldquo;{searchQuery}&rdquo;</> : null}
+          </div>
+        )}
+
+        {/* Remote filter summary */}
+        {viewMode === 'remote' && hasActiveFilters && (
+          <div className="mt-3 text-sm text-gray-400">
+            Showing {totalRemoteResults} {totalRemoteResults === 1 ? 'framework' : 'frameworks'}
             {searchQuery ? <> matching &ldquo;{searchQuery}&rdquo;</> : null}
           </div>
         )}
@@ -686,14 +795,20 @@ export default function HomeScreen({
                 </div>
               )}
 
-              {isAuthenticated && !loading && hasLoadedOnce && serverFrameworks.length === 0 && !error && (
+              {isAuthenticated && !loading && hasLoadedOnce && editableServerFrameworks.length === 0 && remoteServerFrameworks.length === 0 && !error && (
                 <div className="mt-4 rounded-md border border-gray-200 px-4 py-3 text-sm text-gray-400">
                   No frameworks found. Create a new framework to get started.
                 </div>
               )}
 
+              {isAuthenticated && !loading && hasLoadedOnce && editableServerFrameworks.length === 0 && remoteServerFrameworks.length > 0 && !error && (
+                <div className="mt-4 rounded-md border border-gray-200 px-4 py-3 text-sm text-gray-400">
+                  No editable frameworks yet. Remote cached frameworks are listed under the Remote tab.
+                </div>
+              )}
+
               {/* No results after filtering */}
-              {isAuthenticated && hasLoadedOnce && serverFrameworks.length > 0 && filteredServerFrameworks.length === 0 && hasActiveFilters && (
+              {isAuthenticated && hasLoadedOnce && editableServerFrameworks.length > 0 && filteredServerFrameworks.length === 0 && hasActiveFilters && (
                 <div className="mt-4 rounded-md border border-gray-200 px-4 py-3 text-sm text-gray-400">
                   No frameworks match your current filters.{' '}
                   <button type="button" onClick={clearFilters} className="font-medium text-[#662F90] underline underline-offset-2 hover:text-[#2E2F2F]">
@@ -721,6 +836,73 @@ export default function HomeScreen({
                         }}
                         sourcePackageURI={doc.extensions?.['ext:opencase']?.sourcePackageURI}
                         isModifiedFromSource={doc.extensions?.['ext:opencase']?.isModifiedFromSource}
+                        readOnly={doc.readOnly === true}
+                        rightHint={isArchiving ? 'Archiving' : hint}
+                        lastChanged={doc.lastChangeDateTime}
+                        onClick={() => openRemote(doc.identifier)}
+                        onDelete={tenantId ? () => handleArchiveRequest(doc.identifier, title) : undefined}
+                        deleteDisabled={isArchiving || remoteOpenLoading}
+                        actionStyle="archive"
+                        className={cardClass}
+                      />
+                    )
+                  })}
+                </div>
+              )}
+            </>
+          )}
+
+          {/* ── Remote frameworks view ──────────────────────────────── */}
+          {viewMode === 'remote' && (
+            <>
+              <div className="mb-1">
+                <p className="text-sm text-gray-500">
+                  Read-only copies of frameworks linked from CASE Global or other publishers. Open to browse items or use as remote references on your editable frameworks.
+                </p>
+              </div>
+
+              {isAuthenticated && loading && !hasLoadedOnce && (
+                <div className="mt-4 flex items-center gap-2 text-sm text-gray-400">
+                  <ArrowPathIcon className="h-4 w-4 animate-spin" />
+                  Loading remote frameworks
+                </div>
+              )}
+
+              {isAuthenticated && !loading && hasLoadedOnce && remoteServerFrameworks.length === 0 && !error && (
+                <div className="mt-4 rounded-md border border-gray-200 px-4 py-3 text-sm text-gray-400">
+                  No remote frameworks cached yet. Add one from the editor using &ldquo;Add remote framework&rdquo;.
+                </div>
+              )}
+
+              {isAuthenticated && hasLoadedOnce && remoteServerFrameworks.length > 0 && filteredRemoteFrameworks.length === 0 && hasActiveFilters && (
+                <div className="mt-4 rounded-md border border-gray-200 px-4 py-3 text-sm text-gray-400">
+                  No remote frameworks match your current filters.{' '}
+                  <button type="button" onClick={clearFilters} className="font-medium text-[#662F90] underline underline-offset-2 hover:text-[#2E2F2F]">
+                    Clear filters
+                  </button>
+                </div>
+              )}
+
+              {isAuthenticated && filteredRemoteFrameworks.length > 0 && (
+                <div className="mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
+                  {filteredRemoteFrameworks.map((doc) => {
+                    const title = doc.title ?? doc.identifier ?? 'Untitled Framework'
+                    const hint = remoteOpenLoading ? 'Loading' : 'Open'
+                    const isArchiving = archivingDocId === doc.identifier
+                    const cardClass = remoteOpenLoading || isArchiving ? 'opacity-60 pointer-events-none' : undefined
+                    return (
+                      <FrameworkCard
+                        key={doc.identifier}
+                        cfDocument={{
+                          title,
+                          creator: doc.creator && doc.creator !== 'Unknown' ? doc.creator : undefined,
+                          description: doc.description,
+                          frameworkType: doc.frameworkType,
+                          adoptionStatus: doc.adoptionStatus,
+                        }}
+                        sourcePackageURI={doc.extensions?.['ext:opencase']?.sourcePackageURI}
+                        isModifiedFromSource={doc.extensions?.['ext:opencase']?.isModifiedFromSource}
+                        readOnly
                         rightHint={isArchiving ? 'Archiving' : hint}
                         lastChanged={doc.lastChangeDateTime}
                         onClick={() => openRemote(doc.identifier)}
@@ -772,6 +954,7 @@ export default function HomeScreen({
                         }}
                         sourcePackageURI={doc.extensions?.['ext:opencase']?.sourcePackageURI}
                         isModifiedFromSource={doc.extensions?.['ext:opencase']?.isModifiedFromSource}
+                        readOnly={doc.readOnly === true}
                         rightHint={isDeleting ? 'Deleting' : (isRestoring ? 'Restoring' : undefined)}
                         lastChanged={doc.lastChangeDateTime}
                         onDelete={tenantId ? () => handleHardDeleteRequest(doc.identifier, title) : undefined}
@@ -851,7 +1034,7 @@ export default function HomeScreen({
         }}
       />
 
-      {tenantId && (
+      {tenantId && isTenantAdmin && (
         <ApiKeysDialog
           open={apiKeysOpen}
           onClose={() => setApiKeysOpen(false)}
@@ -861,6 +1044,25 @@ export default function HomeScreen({
         />
       )}
 
+      {tenantId && isTenantAdmin && (
+        <MembersDialog
+          open={membersOpen}
+          onClose={() => setMembersOpen(false)}
+          api={api}
+          tenantId={tenantId}
+          currentUserId={currentUserId}
+        />
+      )}
+
+      {tenantId && isTenantAdmin && (
+        <CgeCredentialsDialog
+          open={cgeCredentialsOpen}
+          onClose={() => setCgeCredentialsOpen(false)}
+          api={api}
+          tenantId={tenantId}
+        />
+      )}
+
       {/* Archive Confirmation Dialog (active server frameworks → soft delete) */}
       <Dialog open={Boolean(archiveConfirm)} onOpenChange={(open) => !open && setArchiveConfirm(null)}>
         <DialogContent>
diff --git a/apps/editor/src/ui/home/MembersDialog.tsx b/apps/editor/src/ui/home/MembersDialog.tsx
new file mode 100644
index 0000000..18d868c
--- /dev/null
+++ b/apps/editor/src/ui/home/MembersDialog.tsx
@@ -0,0 +1,332 @@
+import { useCallback, useEffect, useState } from 'react'
+import { Button } from '@/ui/shared/components/ui/button'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/ui/shared/components/ui/dialog'
+import { Input } from '@/ui/shared/components/ui/input'
+import { Label } from '@/ui/shared/components/ui/label'
+import { TrashIcon, PlusIcon, ClipboardDocumentIcon, CheckIcon } from '@heroicons/react/24/outline'
+import type { CaseApiClient, TenantMember, TenantMemberRole } from '@/infrastructure/caseApi/CaseApiClient'
+
+const ROLE_OPTIONS: { value: TenantMemberRole; label: string; hint: string }[] = [
+  { value: 'viewer', label: 'Viewer', hint: 'Read frameworks' },
+  { value: 'author', label: 'Author', hint: 'Create and edit frameworks' },
+  { value: 'admin', label: 'Admin', hint: 'Manage members, API keys, and CGE credentials' },
+]
+
+function roleLabel (role: TenantMemberRole | null): string {
+  if (!role) return '—'
+  return ROLE_OPTIONS.find((o) => o.value === role)?.label ?? role
+}
+
+function CopyButton({ text }: Readonly<{ text: string }>) {
+  const [copied, setCopied] = useState(false)
+  const copy = useCallback(() => {
+    void navigator.clipboard.writeText(text).then(() => {
+      setCopied(true)
+      setTimeout(() => setCopied(false), 2000)
+    })
+  }, [text])
+
+  return (
+    <button
+      type="button"
+      onClick={copy}
+      className="ml-1 inline-flex shrink-0 items-center rounded p-1 text-gray-400 hover:text-gray-600"
+      title="Copy to clipboard"
+    >
+      {copied
+        ? <CheckIcon className="h-4 w-4 text-green-500" />
+        : <ClipboardDocumentIcon className="h-4 w-4" />}
+    </button>
+  )
+}
+
+export default function MembersDialog({
+  open,
+  onClose,
+  api,
+  tenantId,
+  currentUserId,
+}: Readonly<{
+  open: boolean
+  onClose: () => void
+  api: CaseApiClient
+  tenantId: string
+  /** Keycloak user id (JWT sub) — used to avoid removing yourself accidentally without confirm. */
+  currentUserId?: string | null
+}>) {
+  const [members, setMembers] = useState<TenantMember[]>([])
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+
+  const [email, setEmail] = useState('')
+  const [role, setRole] = useState<TenantMemberRole>('author')
+  const [creating, setCreating] = useState(false)
+  const [createdCreds, setCreatedCreds] = useState<{ email: string; temporaryPassword: string } | null>(null)
+
+  const [deleteTarget, setDeleteTarget] = useState<TenantMember | null>(null)
+  const [deleting, setDeleting] = useState(false)
+  const [updatingUserId, setUpdatingUserId] = useState<string | null>(null)
+
+  const loadMembers = useCallback(async () => {
+    setLoading(true)
+    setError(null)
+    try {
+      const result = await api.listMembers({ tenantId })
+      setMembers(result)
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setLoading(false)
+    }
+  }, [api, tenantId])
+
+  useEffect(() => {
+    if (open) void loadMembers()
+  }, [open, loadMembers])
+
+  const handleCreate = useCallback(async () => {
+    const trimmed = email.trim()
+    if (!trimmed) return
+    setCreating(true)
+    setError(null)
+    try {
+      const result = await api.createMember({ tenantId, email: trimmed, role })
+      setEmail('')
+      setRole('author')
+      if (result.temporaryPassword) {
+        setCreatedCreds({ email: result.email ?? trimmed, temporaryPassword: result.temporaryPassword })
+      }
+      void loadMembers()
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setCreating(false)
+    }
+  }, [api, tenantId, email, role, loadMembers])
+
+  const handleRoleChange = useCallback(async (member: TenantMember, nextRole: TenantMemberRole) => {
+    if (!member.role || member.role === nextRole) return
+    setUpdatingUserId(member.userId)
+    setError(null)
+    try {
+      await api.updateMember({ tenantId, userId: member.userId, role: nextRole })
+      void loadMembers()
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setUpdatingUserId(null)
+    }
+  }, [api, tenantId, loadMembers])
+
+  const handleDelete = useCallback(async () => {
+    if (!deleteTarget) return
+    setDeleting(true)
+    setError(null)
+    try {
+      await api.deleteMember({ tenantId, userId: deleteTarget.userId })
+      setDeleteTarget(null)
+      void loadMembers()
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e))
+    } finally {
+      setDeleting(false)
+    }
+  }, [api, tenantId, deleteTarget, loadMembers])
+
+  const handleClose = useCallback(() => {
+    setDeleteTarget(null)
+    setCreatedCreds(null)
+    setEmail('')
+    setRole('author')
+    setError(null)
+    onClose()
+  }, [onClose])
+
+  return (
+    <>
+      <Dialog open={open && !deleteTarget} onOpenChange={(v) => { if (!v) handleClose() }}>
+        <DialogContent className="max-w-xl">
+          <DialogHeader>
+            <DialogTitle>Members</DialogTitle>
+            <DialogDescription>
+              Manage who can access this organization and their roles.
+              New users get a temporary password and must change it on first login.
+            </DialogDescription>
+          </DialogHeader>
+
+          {error && (
+            <div className="rounded-md border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-800">
+              {error}
+            </div>
+          )}
+
+          {createdCreds && (
+            <div className="rounded-lg border border-green-200 bg-green-50 p-4">
+              <p className="mb-3 text-sm font-medium text-green-800">
+                Member added — copy the temporary password now, it will not be shown again.
+                They will be required to set a new password on first login.
+              </p>
+              <div className="space-y-2">
+                <div>
+                  <span className="text-xs font-medium text-gray-500">Email</span>
+                  <div className="flex items-center gap-1 rounded border border-gray-200 bg-white px-2 py-1.5 font-mono text-xs text-gray-800">
+                    <span className="flex-1 select-all break-all">{createdCreds.email}</span>
+                    <CopyButton text={createdCreds.email} />
+                  </div>
+                </div>
+                <div>
+                  <span className="text-xs font-medium text-gray-500">Temporary password</span>
+                  <div className="flex items-center gap-1 rounded border border-gray-200 bg-white px-2 py-1.5 font-mono text-xs text-gray-800">
+                    <span className="flex-1 select-all break-all">{createdCreds.temporaryPassword}</span>
+                    <CopyButton text={createdCreds.temporaryPassword} />
+                  </div>
+                </div>
+              </div>
+              <Button
+                variant="outline"
+                size="sm"
+                className="mt-3"
+                onClick={() => setCreatedCreds(null)}
+              >
+                Dismiss
+              </Button>
+            </div>
+          )}
+
+          <div className="max-h-72 space-y-2 overflow-y-auto">
+            {loading && members.length === 0 && (
+              <p className="py-4 text-center text-sm text-gray-400">Loading...</p>
+            )}
+
+            {!loading && members.length === 0 && (
+              <p className="py-4 text-center text-sm text-gray-400">
+                No members yet. Add someone below.
+              </p>
+            )}
+
+            {members.map((m) => {
+              const isSelf = Boolean(currentUserId && m.userId === currentUserId)
+              return (
+                <div
+                  key={m.userId}
+                  className="flex items-center justify-between gap-3 rounded-lg border border-gray-200 bg-white px-3 py-2.5"
+                >
+                  <div className="min-w-0 flex-1">
+                    <p className="truncate text-sm font-medium text-gray-800">
+                      {m.email ?? m.username ?? m.userId}
+                      {isSelf ? <span className="ml-1 text-xs font-normal text-gray-400">(you)</span> : null}
+                    </p>
+                    <p className="mt-0.5 text-xs text-gray-400">{roleLabel(m.role)}</p>
+                  </div>
+                  <select
+                    className="rounded-md border border-gray-200 bg-white px-2 py-1.5 text-xs text-gray-700"
+                    value={m.role ?? 'viewer'}
+                    disabled={updatingUserId === m.userId}
+                    onChange={(e) => void handleRoleChange(m, e.target.value as TenantMemberRole)}
+                    aria-label={`Role for ${m.email ?? m.userId}`}
+                  >
+                    {ROLE_OPTIONS.map((o) => (
+                      <option key={o.value} value={o.value}>{o.label}</option>
+                    ))}
+                  </select>
+                  <button
+                    type="button"
+                    title="Remove member"
+                    onClick={() => setDeleteTarget(m)}
+                    className="shrink-0 rounded p-1 text-gray-400 transition-colors hover:text-red-500"
+                  >
+                    <TrashIcon className="h-4 w-4" />
+                  </button>
+                </div>
+              )
+            })}
+          </div>
+
+          <div className="rounded-lg border border-gray-200 bg-gray-50 p-3">
+            <div className="grid gap-3 sm:grid-cols-[1fr_auto]">
+              <div className="grid gap-2">
+                <Label htmlFor="member_email" className="text-xs font-medium text-gray-600">
+                  Email
+                </Label>
+                <Input
+                  id="member_email"
+                  type="email"
+                  value={email}
+                  onChange={(e) => setEmail(e.target.value)}
+                  placeholder="colleague@example.org"
+                  className="text-sm"
+                  onKeyDown={(e) => {
+                    if (e.key === 'Enter') void handleCreate()
+                  }}
+                />
+              </div>
+              <div className="grid gap-2">
+                <Label htmlFor="member_role" className="text-xs font-medium text-gray-600">
+                  Role
+                </Label>
+                <select
+                  id="member_role"
+                  className="h-9 rounded-md border border-gray-200 bg-white px-2 text-sm text-gray-700"
+                  value={role}
+                  onChange={(e) => setRole(e.target.value as TenantMemberRole)}
+                >
+                  {ROLE_OPTIONS.map((o) => (
+                    <option key={o.value} value={o.value}>{o.label}</option>
+                  ))}
+                </select>
+              </div>
+            </div>
+            <p className="mt-2 text-xs text-gray-400">
+              {ROLE_OPTIONS.find((o) => o.value === role)?.hint}
+            </p>
+            <Button
+              size="sm"
+              className="mt-3"
+              disabled={creating || !email.trim()}
+              onClick={() => void handleCreate()}
+            >
+              <PlusIcon className="h-4 w-4" aria-hidden />
+              {creating ? 'Adding...' : 'Add member'}
+            </Button>
+          </div>
+
+          <DialogFooter>
+            <Button variant="secondary" onClick={handleClose}>
+              Close
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      <Dialog open={Boolean(deleteTarget)} onOpenChange={(v) => { if (!v) setDeleteTarget(null) }}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>Remove member</DialogTitle>
+            <DialogDescription>
+              Remove access for{' '}
+              <span className="font-medium text-gray-800">
+                {deleteTarget?.email ?? deleteTarget?.username ?? deleteTarget?.userId}
+              </span>
+              ? They will lose access to this organization until added again.
+            </DialogDescription>
+          </DialogHeader>
+          <DialogFooter>
+            <Button variant="secondary" onClick={() => setDeleteTarget(null)} disabled={deleting}>
+              Cancel
+            </Button>
+            <Button variant="destructive" onClick={() => void handleDelete()} disabled={deleting}>
+              {deleting ? 'Removing...' : 'Remove'}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </>
+  )
+}
diff --git a/apps/editor/src/ui/shared/components/FrameworkCard.tsx b/apps/editor/src/ui/shared/components/FrameworkCard.tsx
index 02d281b..4608927 100644
--- a/apps/editor/src/ui/shared/components/FrameworkCard.tsx
+++ b/apps/editor/src/ui/shared/components/FrameworkCard.tsx
@@ -72,6 +72,8 @@ type Props = {
   sourcePackageURI?: string
   /** Set (true or false) once a framework has been imported/mirrored; true once it's been locally modified (forked) */
   isModifiedFromSource?: boolean
+  /** Read-only cached remote framework (CGE cache) */
+  readOnly?: boolean
 }
 
 export function FrameworkCard({
@@ -92,6 +94,7 @@ export function FrameworkCard({
   lastChanged,
   sourcePackageURI,
   isModifiedFromSource,
+  readOnly,
 }: Readonly<Props>) {
   const title = cfDocument.title ?? 'Untitled framework'
   const frameworkType = (cfDocument as { frameworkType?: string }).frameworkType
@@ -210,6 +213,11 @@ export function FrameworkCard({
                 {adoptionStatus}
               </span>
             ) : null}
+            {readOnly ? (
+              <span className="rounded-full bg-slate-200 px-2.5 py-1 text-xs font-semibold text-slate-700">
+                Read-only
+              </span>
+            ) : null}
             {isModifiedFromSource !== undefined ? (
               <span
                 className={cn(
diff --git a/apps/editor/tsconfig.app.json b/apps/editor/tsconfig.app.json
index 7ba1b4c..cb6ab4b 100644
--- a/apps/editor/tsconfig.app.json
+++ b/apps/editor/tsconfig.app.json
@@ -12,7 +12,6 @@
     "jsx": "react-jsx",
     "strict": true,
     "types": ["vite/client"],
-    "baseUrl": ".",
     "paths": {
       "@/*": ["./src/*"]
     }
diff --git a/apps/opencase/docs/DEVELOPER.md b/apps/opencase/docs/DEVELOPER.md
index d4e68d4..519a65e 100644
--- a/apps/opencase/docs/DEVELOPER.md
+++ b/apps/opencase/docs/DEVELOPER.md
@@ -147,16 +147,23 @@ OpenCASE uses Keycloak client roles to control access:
 
 | Scope | Description | Use Cases |
 |-------|-------------|-----------|
-| `case.read` | Read-only access to CASE entities | Public API access, viewing frameworks |
-| `case.write` | Read and write access to CASE entities | Creating/updating frameworks, items, associations |
-| `case.owner` | Per-tenant administrator | Manage accounts, OAuth clients, and tenant data within a specific tenant |
-| `case.admin` | System-wide administrator | Create tenants, manage OAuth clients across all tenants |
+| `case.read` | Read-only access to CASE entities | Management list/get frameworks, licenses, definitions |
+| `case.write` | Read and write access to CASE entities | Creating/updating/deleting frameworks; CGE search/import proxies |
+| `case.owner` | Per-tenant administrator | Manage members, OpenCASE API keys, CGE credentials |
+| `case.admin` | System-wide administrator | Create/list tenants (`tenant-system` client) |
 
-**Scope Hierarchy:**
-- `case.admin` - Highest privilege (system-wide)
-- `case.owner` - Tenant-specific administration
-- `case.write` - Includes `case.read` permissions
-- `case.read` - Basic read access
+**Scope Hierarchy** (enforced in middleware):
+- `case.owner` implies `case.write` and `case.read`
+- `case.write` implies `case.read`
+- `case.admin` is orthogonal (system tenant only; does not imply tenant scopes)
+
+**Member roles** (mapped to client roles via `/management/tenants/{tenantId}/members`):
+
+| Role | Scopes |
+|------|--------|
+| `viewer` | `case.read` |
+| `author` | `case.read`, `case.write` |
+| `admin` | `case.read`, `case.write`, `case.owner` |
 
 ### JWT Token Claims
 
@@ -165,9 +172,14 @@ Keycloak-issued access tokens are JWTs containing:
 - `iss` - Issuer (must match the Keycloak realm URL)
 - `aud` / `azp` - Audience / authorized party (must match the tenant client id)
 - `tenantId` - Tenant identifier (injected by Keycloak mapper, required for tenant-scoped operations)
-- `scope` - Space-separated list of granted scopes
+- `scope` - Space-separated list of granted scopes (from client roles)
+- `org_id` - Optional SSO org claim (must equal `tenantId` for ensure-self); claim name configurable via `SSO_ORG_CLAIM`
 - `sub` - Subject (user ID for authorization_code flow, client ID for client_credentials)
 
+### Tenancy model
+
+OpenCASE uses a **single Keycloak realm** with **one OAuth client per tenant** (`tenant-{tenantId}`). JWT `tenantId` must match the URL `:tenantId` on all management routes.
+
 ---
 
 ## Configuration
@@ -298,103 +310,126 @@ When a tenant is created, an admin account is automatically created with:
 - Role: `admin`
 - Scopes: `case.read`, `case.write`, `case.owner`
 
-#### Account Management
+#### Member Management (Keycloak)
 
 **Required Scope:** `case.owner`
 
-**Create Account:**
+Members are Keycloak users with client roles on `tenant-{tenantId}`.
+
+**List members:**
 ```bash
-POST /management/tenants/{tenantId}/accounts
+GET /management/tenants/{tenantId}/members
+Authorization: Bearer {access_token}
+```
+
+**Add member:**
+```bash
+POST /management/tenants/{tenantId}/members
 Authorization: Bearer {access_token}
 Content-Type: application/json
 
 {
   "email": "user@example.com",
-  "password": "secure-password",
-  "role": "user",
-  "autoGeneratePassword": false
+  "role": "author"
 }
 ```
 
-**Roles and Default Scopes:**
-- `admin` → `case.read`, `case.write`, `case.owner`
-- `user` → `case.read`, `case.write`
-- `viewer` → `case.read`
-
-**List Accounts:**
-```bash
-GET /management/tenants/{tenantId}/accounts
-Authorization: Bearer {access_token}
-```
+Roles: `viewer` | `author` | `admin` (maps to scopes as above).
 
-**Update Account:**
+**Update member role:**
 ```bash
-PUT /management/tenants/{tenantId}/accounts/{accountId}
+PATCH /management/tenants/{tenantId}/members/{userId}
 Authorization: Bearer {access_token}
 Content-Type: application/json
 
-{
-  "email": "newemail@example.com",
-  "password": "new-password"
-}
+{ "role": "admin" }
 ```
 
-**Delete Account:**
+**Remove member** (removes this tenant’s client roles only):
 ```bash
-DELETE /management/tenants/{tenantId}/accounts/{accountId}
+DELETE /management/tenants/{tenantId}/members/{userId}
 Authorization: Bearer {access_token}
 ```
 
-**Add Tenant Membership:**
+**SSO ensure-self** (no `case.*` scope; requires access-token `org_id` === `tenantId`):
 ```bash
-POST /management/tenants/{tenantId}/accounts/{accountId}/memberships
+POST /management/tenants/{tenantId}/members/ensure-self
 Authorization: Bearer {access_token}
-Content-Type: application/json
-
-{
-  "tenantId": "other-tenant-id",
-  "role": "user"
-}
 ```
 
-**Remove Tenant Membership:**
+Assigns default `author` roles on first login when the org claim matches. Re-authenticate afterward so the JWT includes the new scopes.
+
+#### OpenCASE API Keys
+
+**Required Scope:** `case.owner`
+
 ```bash
-DELETE /management/tenants/{tenantId}/accounts/{accountId}/memberships/{targetTenantId}
-Authorization: Bearer {access_token}
+GET/POST /management/tenants/{tenantId}/api-keys
+DELETE /management/tenants/{tenantId}/api-keys/{keyId}
 ```
 
-#### OAuth Client Management
+Each key is a Keycloak confidential client with `client_credentials` and `case.read`.
 
-**Required Scope:** `case.owner` or `case.admin`
+#### CASE Global (CGE) credentials and proxies
 
-**Create OAuth Client:**
+**Configure a tenant connection** (`case.owner`):
 ```bash
-POST /management/tenants/{tenantId}/clients
-Authorization: Bearer {access_token}
+GET/PUT/DELETE /management/tenants/{tenantId}/cge/credentials
+POST /management/tenants/{tenantId}/cge/credentials/test
+```
+
+The CASE Global dialog on the Editor home screen manages the same settings. Each
+tenant can connect to a different CASE Global deployment.
+
+Create or update a connection:
+
+```http
+PUT /management/tenants/acme/cge/credentials
 Content-Type: application/json
 
 {
-  "clientId": "optional-client-id",
-  "clientSecret": "optional-secret",
-  "grantTypes": ["client_credentials", "authorization_code"],
-  "scopes": ["case.read", "case.write"],
-  "active": true,
-  "autoGenerateSecret": false
+  "apiBaseUrl": "https://cge.example.com",
+  "tokenUrl": "https://cge.example.com/realms/caseglobal/protocol/openid-connect/token",
+  "clientId": "acme-opencase",
+  "clientSecret": "..."
 }
 ```
 
-**List OAuth Clients:**
-```bash
-GET /management/tenants/{tenantId}/clients
-Authorization: Bearer {access_token}
+- `apiBaseUrl`, `tokenUrl`, and `clientId` are required.
+- On update, omit `clientSecret` or send an empty value to retain the stored secret.
+- `apiBaseUrl` and `tokenUrl` are not secrets and are returned by GET.
+- `clientSecret` is encrypted at rest using `CGE_CREDENTIALS_ENCRYPTION_KEY` and is never returned.
+
+Example GET response:
+
+```json
+{
+  "configured": true,
+  "clientIdMasked": "acme…case",
+  "apiBaseUrl": "https://cge.example.com",
+  "tokenUrl": "https://cge.example.com/realms/caseglobal/protocol/openid-connect/token",
+  "updatedAt": "2026-07-16T18:00:00.000Z"
+}
 ```
 
-**Delete OAuth Client:**
+`POST .../credentials/test` uses the stored token URL and credentials to mint a
+token. It does not call the coalition API.
+
+**Use CGE** (`case.write`) — OpenCASE backend mints org tokens server-side using the tenant’s stored endpoint + credentials:
 ```bash
-DELETE /management/tenants/{tenantId}/clients/{clientId}
-Authorization: Bearer {access_token}
+GET  /management/tenants/{tenantId}/cge/frameworks
+GET  /management/tenants/{tenantId}/cge/frameworks/{frameworkId}
+POST /management/tenants/{tenantId}/cge/subscriptions
+POST /management/tenants/{tenantId}/cge/import
 ```
 
+Import body example: `{ "frameworkId": "...", "sourceUri": "https://publisher/.../CFPackages/...", "subscribe": true }`.
+
+`CGE_TOKEN_URL` and `CGE_API_BASE_URL` are optional deployment-wide fallbacks
+for legacy tenant records that do not contain endpoint fields. New or updated
+connections must provide both URLs. Always set
+`CGE_CREDENTIALS_ENCRYPTION_KEY` before storing credentials.
+
 ---
 
 ## Roadmap
diff --git a/apps/opencase/src/application/case/endpoints/DeleteCFAssociation.ts b/apps/opencase/src/application/case/endpoints/DeleteCFAssociation.ts
index e29db2b..505a52e 100644
--- a/apps/opencase/src/application/case/endpoints/DeleteCFAssociation.ts
+++ b/apps/opencase/src/application/case/endpoints/DeleteCFAssociation.ts
@@ -2,6 +2,7 @@ import type { CFPackageRepository } from '../ports/CFPackageRepository'
 import { CaseVersion, TenantId } from '../../../domain/case/value-objects/Identifiers'
 import { CFPackage } from '../../../domain/case/entities/CFPackage'
 import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
+import { assertDocumentMutable } from '../services/assertDocumentMutable'
 
 export interface DeleteCFAssociationCommand {
   tenantId: TenantId
@@ -24,6 +25,8 @@ export class DeleteCFAssociation {
       throw new Error(`CFAssociation with sourcedId ${sourcedId} not found`)
     }
 
+    assertDocumentMutable(this.store, tenantId, caseVersion, storageKey)
+
     // Load existing package
     const existingPkg = await this.pkgRepo.load(tenantId, caseVersion, storageKey)
     if (!existingPkg) {
diff --git a/apps/opencase/src/application/case/endpoints/DeleteCFItem.ts b/apps/opencase/src/application/case/endpoints/DeleteCFItem.ts
index b5070f4..5cca5bb 100644
--- a/apps/opencase/src/application/case/endpoints/DeleteCFItem.ts
+++ b/apps/opencase/src/application/case/endpoints/DeleteCFItem.ts
@@ -2,6 +2,7 @@ import type { CFPackageRepository } from '../ports/CFPackageRepository'
 import { CaseVersion, TenantId } from '../../../domain/case/value-objects/Identifiers'
 import { CFPackage } from '../../../domain/case/entities/CFPackage'
 import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
+import { assertDocumentMutable } from '../services/assertDocumentMutable'
 
 export interface DeleteCFItemCommand {
   tenantId: TenantId
@@ -24,6 +25,8 @@ export class DeleteCFItem {
       throw new Error(`CFItem with sourcedId ${sourcedId} not found`)
     }
 
+    assertDocumentMutable(this.store, tenantId, caseVersion, storageKey)
+
     // Load existing package
     const existingPkg = await this.pkgRepo.load(tenantId, caseVersion, storageKey)
     if (!existingPkg) {
diff --git a/apps/opencase/src/application/case/endpoints/ImportFramework.ts b/apps/opencase/src/application/case/endpoints/ImportFramework.ts
index 3a4439b..855b08a 100644
--- a/apps/opencase/src/application/case/endpoints/ImportFramework.ts
+++ b/apps/opencase/src/application/case/endpoints/ImportFramework.ts
@@ -10,6 +10,7 @@ import { CFAssociation } from '../../../domain/case/entities/CFAssociation'
 import { CFRubric } from '../../../domain/case/entities/CFRubric'
 import { CFPackage } from '../../../domain/case/entities/CFPackage'
 import { logger } from '../../../infrastructure/logging/Logger'
+import type { ImportDocumentFlags } from '../types/ImportDocumentFlags'
 
 export interface ImportFrameworkCommand {
   tenantId: TenantId
@@ -19,6 +20,10 @@ export interface ImportFrameworkCommand {
   cfPackage?: any
   validateSchema?: boolean
   schemaName?: string
+  /** Optional import flags — omit for standard editable imports (default). */
+  documentFlags?: ImportDocumentFlags
+  /** Publisher CFPackage URL — used for provenance when importing from cfPackage JSON. */
+  sourcePackageUri?: string
 }
 
 export interface ImportFrameworkResult {
@@ -32,22 +37,44 @@ export interface ImportFrameworkResult {
  * marking it as a pristine mirror of the source. `endpointUrl` is only known
  * when the framework was imported by URL (as opposed to a pasted JSON payload).
  */
-function injectSourceProvenance (docPayload: any, endpointUrl?: string): any {
+function injectSourceProvenance (
+  docPayload: any,
+  endpointUrl?: string,
+  documentFlags?: ImportDocumentFlags
+): any {
   const existing = docPayload.extensions ?? {}
   const existingOpencase = (existing['ext:opencase'] && typeof existing['ext:opencase'] === 'object')
     ? existing['ext:opencase']
     : {}
 
+  const extPatch: Record<string, unknown> = {
+    ...existingOpencase,
+    // Only record a source URL when one is known — pasted JSON has no
+    // publisher endpoint, so the field is left off entirely rather than
+    // written as undefined.
+    ...(endpointUrl ? { sourcePackageURI: endpointUrl } : {}),
+    isModifiedFromSource: false,
+    importedAt: new Date().toISOString(),
+  }
+
+  if (documentFlags?.readOnly === true) {
+    extPatch.readOnly = true
+  }
+  if (documentFlags?.cgeFrameworkId) {
+    extPatch.cgeFrameworkId = documentFlags.cgeFrameworkId
+  }
+  if (documentFlags?.linkedFromDocId) {
+    extPatch.linkedFromDocId = documentFlags.linkedFromDocId
+  }
+  if (documentFlags?.cgeCachedAt) {
+    extPatch.cgeCachedAt = documentFlags.cgeCachedAt
+  }
+
   return {
     ...docPayload,
     extensions: {
       ...existing,
-      'ext:opencase': {
-        ...existingOpencase,
-        ...(endpointUrl ? { sourcePackageURI: endpointUrl } : {}),
-        isModifiedFromSource: false,
-        importedAt: new Date().toISOString(),
-      }
+      'ext:opencase': extPatch
     }
   }
 }
@@ -60,7 +87,7 @@ export class ImportFramework {
   ) {}
 
   async execute (cmd: ImportFrameworkCommand): Promise<ImportFrameworkResult> {
-    const { tenantId, caseVersion, endpointUrl, accessToken, cfPackage, validateSchema, schemaName } = cmd
+    const { tenantId, caseVersion, endpointUrl, accessToken, cfPackage, validateSchema, schemaName, documentFlags, sourcePackageUri } = cmd
 
     if (!endpointUrl && !cfPackage) {
       throw new Error('Either endpointUrl or cfPackage must be provided')
@@ -72,14 +99,15 @@ export class ImportFramework {
       const response = await this.apiClient.fetchCFPackage(endpointUrl, accessToken)
       sourceCFPackage = {
         ...response.CFPackage,
-        CFDocument: injectSourceProvenance(response.CFPackage.CFDocument, endpointUrl)
+        CFDocument: injectSourceProvenance(response.CFPackage.CFDocument, endpointUrl, documentFlags)
       }
     } else {
       logger.info({ tenantId, caseVersion }, 'Importing framework from provided JSON')
       const normalized = normalizeCfPackageData(cfPackage)
+      const provenanceUri = (sourcePackageUri ?? endpointUrl ?? '').trim()
       sourceCFPackage = {
         ...normalized,
-        CFDocument: injectSourceProvenance(normalized.CFDocument)
+        CFDocument: injectSourceProvenance(normalized.CFDocument, provenanceUri || undefined, documentFlags)
       }
     }
 
diff --git a/apps/opencase/src/application/case/endpoints/ListFrameworks.ts b/apps/opencase/src/application/case/endpoints/ListFrameworks.ts
index 4e4c216..1ab6e2f 100644
--- a/apps/opencase/src/application/case/endpoints/ListFrameworks.ts
+++ b/apps/opencase/src/application/case/endpoints/ListFrameworks.ts
@@ -23,11 +23,16 @@ export class ListFrameworks {
       sourcedId: string
       title: string
       caseVersion: CaseVersion
+      description?: string
+      creator?: string
       language?: string
       frameworkType?: string
       subject?: string
       version?: string
       lastChangeDateTime: string
+      adoptionStatus?: string
+      readOnly?: boolean
+      cgeFrameworkId?: string
       extensions?: { 'ext:opencase': Record<string, unknown> }
     }> = []
 
@@ -45,11 +50,16 @@ export class ListFrameworks {
           sourcedId: doc.sourcedId,
           title: doc.title,
           caseVersion: version,
+          description: doc.description,
+          creator: doc.creator,
           language: doc.language,
           frameworkType: doc.frameworkType,
           subject: doc.subject,
           version: doc.version,
           lastChangeDateTime: doc.lastChangeDateTime.toISOString(),
+          adoptionStatus: doc.adoptionStatus,
+          readOnly: doc.readOnly === true,
+          cgeFrameworkId: doc.cgeFrameworkId,
           // Serve the complete, untransformed ext:opencase object verbatim (not a hand-picked
           // subset), nested under `extensions` so the caller (management controller) can strip
           // it the same way the public API strips `extensions` when X-CASE-EDITOR is absent.
diff --git a/apps/opencase/src/application/case/endpoints/UpdateCFAssociation.ts b/apps/opencase/src/application/case/endpoints/UpdateCFAssociation.ts
index 7827045..939129e 100644
--- a/apps/opencase/src/application/case/endpoints/UpdateCFAssociation.ts
+++ b/apps/opencase/src/application/case/endpoints/UpdateCFAssociation.ts
@@ -4,6 +4,7 @@ import { CFPackage } from '../../../domain/case/entities/CFPackage'
 import { CFAssociation } from '../../../domain/case/entities/CFAssociation'
 import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
 import { JsonSchemaValidator } from '../../../infrastructure/validation/JsonSchemaValidator'
+import { assertDocumentMutable } from '../services/assertDocumentMutable'
 
 export interface UpdateCFAssociationCommand {
   tenantId: TenantId
@@ -38,6 +39,8 @@ export class UpdateCFAssociation {
       throw new Error(`CFAssociation with sourcedId ${sourcedId} not found`)
     }
 
+    assertDocumentMutable(this.store, tenantId, caseVersion, storageKey)
+
     // Load existing package
     const existingPkg = await this.pkgRepo.load(tenantId, caseVersion, storageKey)
     if (!existingPkg) {
diff --git a/apps/opencase/src/application/case/endpoints/UpdateCFDocument.ts b/apps/opencase/src/application/case/endpoints/UpdateCFDocument.ts
index 056e751..29735de 100644
--- a/apps/opencase/src/application/case/endpoints/UpdateCFDocument.ts
+++ b/apps/opencase/src/application/case/endpoints/UpdateCFDocument.ts
@@ -6,6 +6,7 @@ import { CFAssociation } from '../../../domain/case/entities/CFAssociation'
 import { CFPackage } from '../../../domain/case/entities/CFPackage'
 import { JsonSchemaValidator } from '../../../infrastructure/validation/JsonSchemaValidator'
 import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
+import { assertDocumentMutable } from '../services/assertDocumentMutable'
 
 export interface UpdateCFDocumentCommand {
   tenantId: TenantId
@@ -41,6 +42,8 @@ export class UpdateCFDocument {
       throw new Error(`CFDocument with sourcedId ${sourcedId} not found`)
     }
 
+    assertDocumentMutable(this.store, tenantId, caseVersion, storageKey)
+
     // Create updated document from payload
     const updatedDocument = CFDocument.fromRaw(tenantId, caseVersion, payload)
     
diff --git a/apps/opencase/src/application/case/endpoints/UpdateCFItem.ts b/apps/opencase/src/application/case/endpoints/UpdateCFItem.ts
index d88e305..98b147e 100644
--- a/apps/opencase/src/application/case/endpoints/UpdateCFItem.ts
+++ b/apps/opencase/src/application/case/endpoints/UpdateCFItem.ts
@@ -6,6 +6,7 @@ import { CFAssociation } from '../../../domain/case/entities/CFAssociation'
 import { CFPackage } from '../../../domain/case/entities/CFPackage'
 import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
 import { JsonSchemaValidator } from '../../../infrastructure/validation/JsonSchemaValidator'
+import { assertDocumentMutable } from '../services/assertDocumentMutable'
 
 export interface UpdateCFItemCommand {
   tenantId: TenantId
@@ -40,6 +41,8 @@ export class UpdateCFItem {
       throw new Error(`CFItem with sourcedId ${sourcedId} not found`)
     }
 
+    assertDocumentMutable(this.store, tenantId, caseVersion, storageKey)
+
     // Load existing package
     const existingPkg = await this.pkgRepo.load(tenantId, caseVersion, storageKey)
     if (!existingPkg) {
diff --git a/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFAssociation.test.ts b/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFAssociation.test.ts
index 2f51791..24844d5 100644
--- a/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFAssociation.test.ts
+++ b/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFAssociation.test.ts
@@ -18,7 +18,8 @@ describe('DeleteCFAssociation', () => {
 
     mockStore = {
       getStorageKeyForAssociation: jest.fn(),
-      removeAssociationFromIndex: jest.fn()
+      removeAssociationFromIndex: jest.fn(),
+      getDocumentMetadata: jest.fn().mockReturnValue(null)
     } as any
 
     deleteCFAssociation = new DeleteCFAssociation(mockRepository, mockStore)
diff --git a/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFItem.test.ts b/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFItem.test.ts
index 689cc92..4a8bc72 100644
--- a/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFItem.test.ts
+++ b/apps/opencase/src/application/case/endpoints/__tests__/DeleteCFItem.test.ts
@@ -20,7 +20,8 @@ describe('DeleteCFItem', () => {
     mockStore = {
       getStorageKeyForItem: jest.fn(),
       removeItemFromIndex: jest.fn(),
-      removeAssociationFromIndex: jest.fn()
+      removeAssociationFromIndex: jest.fn(),
+      getDocumentMetadata: jest.fn().mockReturnValue(null),
     } as any
 
     deleteCFItem = new DeleteCFItem(mockRepository, mockStore)
diff --git a/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFAssociation.test.ts b/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFAssociation.test.ts
index 56900be..34794f5 100644
--- a/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFAssociation.test.ts
+++ b/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFAssociation.test.ts
@@ -17,7 +17,8 @@ describe('UpdateCFAssociation', () => {
     } as any
 
     mockStore = {
-      getStorageKeyForAssociation: jest.fn()
+      getStorageKeyForAssociation: jest.fn(),
+      getDocumentMetadata: jest.fn().mockReturnValue(null)
     } as any
 
     updateCFAssociation = new UpdateCFAssociation(mockRepository, mockStore)
diff --git a/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFDocument.test.ts b/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFDocument.test.ts
index 8fd4530..4f82abf 100644
--- a/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFDocument.test.ts
+++ b/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFDocument.test.ts
@@ -20,7 +20,8 @@ describe('UpdateCFDocument', () => {
 
     // Identifier === storage key for these tests (no mirror/fork scenario).
     mockStore = {
-      resolveStorageKey: jest.fn((_t, _v, identifier) => identifier)
+      resolveStorageKey: jest.fn((_t, _v, identifier) => identifier),
+      getDocumentMetadata: jest.fn().mockReturnValue(null)
     } as any
 
     updateCFDocument = new UpdateCFDocument(mockRepository, mockStore)
diff --git a/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFItem.test.ts b/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFItem.test.ts
index 261f0da..b289fe9 100644
--- a/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFItem.test.ts
+++ b/apps/opencase/src/application/case/endpoints/__tests__/UpdateCFItem.test.ts
@@ -17,7 +17,8 @@ describe('UpdateCFItem', () => {
     } as any
 
     mockStore = {
-      getStorageKeyForItem: jest.fn()
+      getStorageKeyForItem: jest.fn(),
+      getDocumentMetadata: jest.fn().mockReturnValue(null)
     } as any
 
     updateCFItem = new UpdateCFItem(mockRepository, mockStore)
diff --git a/apps/opencase/src/application/case/services/assertDocumentMutable.ts b/apps/opencase/src/application/case/services/assertDocumentMutable.ts
new file mode 100644
index 0000000..aebd3d1
--- /dev/null
+++ b/apps/opencase/src/application/case/services/assertDocumentMutable.ts
@@ -0,0 +1,21 @@
+import type { CaseVersion, TenantId } from '../../../domain/case/value-objects/Identifiers'
+import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
+
+export class ReadOnlyDocumentError extends Error {
+  constructor (docId: string) {
+    super(`Document ${docId} is read-only and cannot be modified`)
+    this.name = 'ReadOnlyDocumentError'
+  }
+}
+
+export function assertDocumentMutable (
+  store: FileFrameworkStore,
+  tenantId: TenantId,
+  caseVersion: CaseVersion,
+  docId: string
+): void {
+  const meta = store.getDocumentMetadata(tenantId, caseVersion, docId)
+  if (meta?.readOnly === true) {
+    throw new ReadOnlyDocumentError(docId)
+  }
+}
diff --git a/apps/opencase/src/application/case/types/ImportDocumentFlags.ts b/apps/opencase/src/application/case/types/ImportDocumentFlags.ts
new file mode 100644
index 0000000..6c0a92b
--- /dev/null
+++ b/apps/opencase/src/application/case/types/ImportDocumentFlags.ts
@@ -0,0 +1,14 @@
+/**
+ * Optional flags applied when importing a CFPackage.
+ * Defaults preserve existing editable-import behaviour (readOnly is false when omitted).
+ */
+export interface ImportDocumentFlags {
+  /** When true, the document is a cached remote reference and cannot be mutated. */
+  readOnly?: boolean
+  /** CASE Global coalition registry identifier (when imported via CGE). */
+  cgeFrameworkId?: string
+  /** Local framework doc that triggered the cache import (editor hint). */
+  linkedFromDocId?: string
+  /** ISO timestamp when a read-only CGE cache was fetched. */
+  cgeCachedAt?: string
+}
diff --git a/apps/opencase/src/application/cge/endpoints/ImportCgeCachedFramework.ts b/apps/opencase/src/application/cge/endpoints/ImportCgeCachedFramework.ts
new file mode 100644
index 0000000..09bc887
--- /dev/null
+++ b/apps/opencase/src/application/cge/endpoints/ImportCgeCachedFramework.ts
@@ -0,0 +1,140 @@
+import type { ImportFramework } from '../../case/endpoints/ImportFramework'
+import type { CgeApiClient } from '../../../infrastructure/cge/CgeApiClient'
+import { type FileFrameworkStore, getOpenCaseSourcePackageURI } from '../../../infrastructure/persistence/file/FileFrameworkStore'
+import type { CaseVersion, TenantId } from '../../../domain/case/value-objects/Identifiers'
+import { normalizeCfPackageData } from '../../case/cfPackageShape'
+import { resolveCoalitionFrameworkTitle } from '../../../infrastructure/cge/cgeCoalitionHelpers'
+import { logger } from '../../../infrastructure/logging/Logger'
+
+export interface ImportCgeCachedFrameworkCommand {
+  tenantId: TenantId
+  caseVersion: CaseVersion
+  frameworkId: string
+  sourceUri?: string
+  registryId?: string
+  subscribe?: boolean
+  /** When true, re-fetch from publisher even if a cache exists. */
+  refresh?: boolean
+  linkedFromDocId?: string
+  validateSchema?: boolean
+  /** When true, fetch publisher CFPackage without CGE bearer token. */
+  skipPublisherAuth?: boolean
+}
+
+export interface ImportCgeCachedFrameworkResult {
+  docId: string
+  version: number
+  cgeFrameworkId: string
+  title: string
+  sourceUri: string
+  itemCount: number
+  cachedAt: string
+  fromCache: boolean
+}
+
+export class ImportCgeCachedFramework {
+  constructor (
+    private readonly cgeApi: CgeApiClient,
+    private readonly importFramework: ImportFramework,
+    private readonly store: FileFrameworkStore
+  ) {}
+
+  async execute (cmd: ImportCgeCachedFrameworkCommand): Promise<ImportCgeCachedFrameworkResult> {
+    const {
+      tenantId,
+      caseVersion,
+      frameworkId,
+      sourceUri,
+      registryId,
+      subscribe = false,
+      refresh = false,
+      linkedFromDocId,
+      validateSchema = false,
+      skipPublisherAuth = false
+    } = cmd
+
+    if (!frameworkId.trim()) {
+      throw new Error('frameworkId is required')
+    }
+
+    const existing = this.store.findDocumentByCgeFrameworkId(tenantId, caseVersion, frameworkId)
+    if (existing && !refresh) {
+      const bundle = await this.store.loadDocumentBundle(tenantId, caseVersion, existing.sourcedId)
+      const itemCount = Array.isArray(bundle?.items) ? bundle!.items.length : 0
+      return {
+        docId: existing.sourcedId,
+        version: 1,
+        cgeFrameworkId: frameworkId,
+        title: existing.title,
+        sourceUri: getOpenCaseSourcePackageURI(existing) ?? '',
+        itemCount,
+        cachedAt: existing.cgeCachedAt?.toISOString() ?? existing.lastChangeDateTime.toISOString(),
+        fromCache: true
+      }
+    }
+
+    const resolved = await this.cgeApi.resolveFramework(tenantId, frameworkId, sourceUri, registryId)
+    const endpointUrl = resolved.sourceUri
+
+    if (subscribe) {
+      try {
+        await this.cgeApi.createSubscription(tenantId, { frameworkId })
+      } catch (subErr: any) {
+        logger.warn({ tenantId, frameworkId, error: subErr?.message }, 'CGE subscribe during cache import (continuing)')
+      }
+    }
+
+    const cfPackageRaw = await this.cgeApi.fetchPublisherPackage(tenantId, endpointUrl, { skipAuth: skipPublisherAuth })
+    let normalized
+    try {
+      normalized = normalizeCfPackageData(cfPackageRaw)
+    } catch (parseErr: any) {
+      throw new Error(`Publisher returned an invalid CFPackage from ${endpointUrl}: ${parseErr?.message ?? 'unknown error'}`)
+    }
+
+    const publisherDocId = String(
+      normalized.CFDocument?.identifier ??
+      normalized.CFDocument?.sourcedId ??
+      ''
+    ).trim()
+
+    if (publisherDocId) {
+      const existingMeta = this.store.getDocumentMetadata(tenantId, caseVersion, publisherDocId)
+      if (existingMeta && existingMeta.readOnly !== true && existingMeta.cgeFrameworkId !== frameworkId) {
+        throw new Error(
+          `Framework "${existingMeta.title}" (${publisherDocId}) is already imported as an editable document. Open it from the home screen instead of adding it as a read-only remote cache.`
+        )
+      }
+    }
+
+    const cachedAt = new Date().toISOString()
+
+    const result = await this.importFramework.execute({
+      tenantId,
+      caseVersion,
+      cfPackage: cfPackageRaw,
+      sourcePackageUri: endpointUrl,
+      validateSchema,
+      documentFlags: {
+        readOnly: true,
+        cgeFrameworkId: frameworkId,
+        linkedFromDocId,
+        cgeCachedAt: cachedAt
+      }
+    })
+
+    const items = normalized.CFItems ?? []
+    const title = resolveCoalitionFrameworkTitle(resolved.entry, resolved.detail, normalized)
+
+    return {
+      docId: result.docId,
+      version: result.version,
+      cgeFrameworkId: frameworkId,
+      title,
+      sourceUri: endpointUrl,
+      itemCount: Array.isArray(items) ? items.length : 0,
+      cachedAt,
+      fromCache: false
+    }
+  }
+}
diff --git a/apps/opencase/src/application/cge/endpoints/SearchCachedFrameworkItems.ts b/apps/opencase/src/application/cge/endpoints/SearchCachedFrameworkItems.ts
new file mode 100644
index 0000000..1d0a184
--- /dev/null
+++ b/apps/opencase/src/application/cge/endpoints/SearchCachedFrameworkItems.ts
@@ -0,0 +1,40 @@
+import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
+import type { CaseVersion, TenantId } from '../../../domain/case/value-objects/Identifiers'
+
+export interface SearchCachedFrameworkItemsQuery {
+  tenantId: TenantId
+  caseVersion: CaseVersion
+  docId: string
+  q?: string
+  limit?: number
+}
+
+export interface CachedFrameworkItemSummary {
+  identifier: string
+  uri?: string
+  fullStatement?: string
+  abbreviatedStatement?: string
+  humanCodingScheme?: string
+  CFItemType?: string
+}
+
+export class SearchCachedFrameworkItems {
+  constructor (private readonly store: FileFrameworkStore) {}
+
+  async execute (query: SearchCachedFrameworkItemsQuery): Promise<{ items: CachedFrameworkItemSummary[] }> {
+    const meta = this.store.getDocumentMetadata(query.tenantId, query.caseVersion, query.docId)
+    if (!meta) {
+      throw new Error(`Cached framework ${query.docId} not found`)
+    }
+
+    const items = await this.store.searchItemsInDocument(
+      query.tenantId,
+      query.caseVersion,
+      query.docId,
+      query.q ?? '',
+      query.limit ?? 50
+    )
+
+    return { items }
+  }
+}
diff --git a/apps/opencase/src/domain/user/__tests__/memberRoles.test.ts b/apps/opencase/src/domain/user/__tests__/memberRoles.test.ts
new file mode 100644
index 0000000..e495405
--- /dev/null
+++ b/apps/opencase/src/domain/user/__tests__/memberRoles.test.ts
@@ -0,0 +1,37 @@
+import {
+  memberRoleFromScopes,
+  scopesForMemberRole,
+  keycloakRolesForMemberRole,
+  isMemberRole
+} from '../memberRoles'
+
+describe('memberRoles', () => {
+  it('maps roles to scopes', () => {
+    expect(scopesForMemberRole('viewer')).toEqual(['case.read'])
+    expect(scopesForMemberRole('author')).toEqual(['case.read', 'case.write'])
+    expect(scopesForMemberRole('admin')).toEqual(['case.read', 'case.write', 'case.owner'])
+  })
+
+  it('includes Keycloak-visible membership role labels', () => {
+    expect(keycloakRolesForMemberRole('author')).toEqual([
+      'case.read',
+      'case.write',
+      'author'
+    ])
+  })
+
+  it('derives highest role from scopes or labels', () => {
+    expect(memberRoleFromScopes(['case.read'])).toBe('viewer')
+    expect(memberRoleFromScopes(['viewer'])).toBe('viewer')
+    expect(memberRoleFromScopes(['case.read', 'case.write'])).toBe('author')
+    expect(memberRoleFromScopes(['author'])).toBe('author')
+    expect(memberRoleFromScopes(['case.owner', 'case.read'])).toBe('admin')
+    expect(memberRoleFromScopes(['admin'])).toBe('admin')
+    expect(memberRoleFromScopes([])).toBeNull()
+  })
+
+  it('validates role names', () => {
+    expect(isMemberRole('viewer')).toBe(true)
+    expect(isMemberRole('user')).toBe(false)
+  })
+})
diff --git a/apps/opencase/src/domain/user/memberRoles.ts b/apps/opencase/src/domain/user/memberRoles.ts
new file mode 100644
index 0000000..4d857b8
--- /dev/null
+++ b/apps/opencase/src/domain/user/memberRoles.ts
@@ -0,0 +1,54 @@
+export type MemberRole = 'viewer' | 'author' | 'admin'
+
+/** JWT / scope roles used by OpenCASE middleware. */
+export const TENANT_CASE_ROLES = ['case.read', 'case.write', 'case.owner'] as const
+
+/** Human-readable Keycloak client roles shown in the Admin Console and Members UI. */
+export const TENANT_MEMBER_ROLES = ['viewer', 'author', 'admin'] as const
+
+/** All Keycloak client roles managed by OpenCASE membership. */
+export const TENANT_MEMBERSHIP_ROLES = [
+  ...TENANT_CASE_ROLES,
+  ...TENANT_MEMBER_ROLES
+] as const
+
+export function scopesForMemberRole (role: MemberRole): string[] {
+  switch (role) {
+    case 'viewer':
+      return ['case.read']
+    case 'author':
+      return ['case.read', 'case.write']
+    case 'admin':
+      return ['case.read', 'case.write', 'case.owner']
+    default:
+      return []
+  }
+}
+
+/**
+ * Roles assigned on the Keycloak tenant client for a membership role:
+ * the human-readable label (viewer/author/admin) plus the case.* scopes for JWT.
+ */
+export function keycloakRolesForMemberRole (role: MemberRole): string[] {
+  return [...scopesForMemberRole(role), role]
+}
+
+/**
+ * Derive the highest member role from a set of client roles.
+ * Prefers explicit viewer/author/admin labels, then falls back to case.* scopes.
+ */
+export function memberRoleFromScopes (scopes: string[]): MemberRole | null {
+  const set = new Set(scopes)
+  if (set.has('admin') || set.has('case.owner')) return 'admin'
+  if (set.has('author') || set.has('case.write')) return 'author'
+  if (set.has('viewer') || set.has('case.read')) return 'viewer'
+  return null
+}
+
+export function isMemberRole (value: unknown): value is MemberRole {
+  return value === 'viewer' || value === 'author' || value === 'admin'
+}
+
+export function isManagedMembershipRole (name: string): boolean {
+  return (TENANT_MEMBERSHIP_ROLES as readonly string[]).includes(name)
+}
diff --git a/apps/opencase/src/infrastructure/cge/CgeApiClient.ts b/apps/opencase/src/infrastructure/cge/CgeApiClient.ts
new file mode 100644
index 0000000..902aff5
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/CgeApiClient.ts
@@ -0,0 +1,294 @@
+import { logger } from '../logging/Logger'
+import type { CgeAuthClient } from './CgeAuthClient'
+import type { CgeCredentials, FileCgeCredentialsStore } from './FileCgeCredentialsStore'
+import {
+  buildFrameworkListQuery,
+  extractCoalitionDataList,
+  extractCoalitionPagination,
+  matchFrameworkEntry,
+  resolvePublisherUriFromCoalition
+} from './cgeCoalitionHelpers'
+
+export type ResolvedCoalitionFramework = {
+  /** Registry row from coalition search (includes frameworkId + sourceUri). */
+  entry: any
+  /** Optional detail from GET /api/coalition/frameworks/{registryId}. */
+  detail: any
+  sourceUri: string
+}
+
+export class CgeApiClient {
+  constructor (
+    private readonly auth: CgeAuthClient,
+    private readonly credentialsStore: FileCgeCredentialsStore,
+    /** Optional deployment-wide defaults when a tenant omits an endpoint. */
+    private readonly defaults: { apiBaseUrl?: string, tokenUrl?: string } = {}
+  ) {}
+
+  private resolveEndpoints (creds: CgeCredentials): { apiBaseUrl: string, tokenUrl: string } {
+    const apiBaseUrl = (creds.apiBaseUrl || this.defaults.apiBaseUrl || '').trim().replace(/\/$/, '')
+    const tokenUrl = (creds.tokenUrl || this.defaults.tokenUrl || '').trim()
+    if (!apiBaseUrl) {
+      throw new Error('CGE API base URL is not configured for this tenant')
+    }
+    if (!tokenUrl) {
+      throw new Error('CGE token URL is not configured for this tenant')
+    }
+    return { apiBaseUrl, tokenUrl }
+  }
+
+  private async withToken <T>(
+    tenantId: string,
+    fn: (accessToken: string, apiBaseUrl: string) => Promise<T>
+  ): Promise<T> {
+    const creds = await this.credentialsStore.get(tenantId)
+    if (!creds) {
+      throw new Error('CGE credentials are not configured for this tenant')
+    }
+    const { apiBaseUrl, tokenUrl } = this.resolveEndpoints(creds)
+
+    const token = await this.auth.getAccessToken(tokenUrl, creds.clientId, creds.clientSecret)
+    try {
+      return await fn(token, apiBaseUrl)
+    } catch (err: any) {
+      if (err?.status === 401) {
+        const refreshed = await this.auth.refreshAccessToken(tokenUrl, creds.clientId, creds.clientSecret)
+        return await fn(refreshed, apiBaseUrl)
+      }
+      throw err
+    }
+  }
+
+  private async request (
+    apiBaseUrl: string,
+    accessToken: string,
+    method: string,
+    path: string,
+    body?: unknown
+  ): Promise<any> {
+    const url = `${apiBaseUrl.replace(/\/$/, '')}${path}`
+    const headers: Record<string, string> = {
+      Authorization: `Bearer ${accessToken}`,
+      Accept: 'application/json'
+    }
+    let payload: string | undefined
+    if (body !== undefined) {
+      headers['Content-Type'] = 'application/json'
+      payload = JSON.stringify(body)
+    }
+
+    const res = await fetch(url, { method, headers, body: payload })
+    if (!res.ok) {
+      const text = await res.text().catch(() => '')
+      const error: any = new Error(`CGE API error: ${method} ${path} -> ${res.status}. ${text.slice(0, 500)}`)
+      error.status = res.status
+      throw error
+    }
+    if (res.status === 204) return null
+    return await res.json().catch(() => null)
+  }
+
+  async listFrameworks (tenantId: string, query?: Record<string, string>): Promise<any> {
+    const coalitionQuery = buildFrameworkListQuery(query)
+    const qs = Object.keys(coalitionQuery).length > 0
+      ? `?${new URLSearchParams(coalitionQuery).toString()}`
+      : ''
+    return await this.withToken(tenantId, (token, apiBaseUrl) =>
+      this.request(apiBaseUrl, token, 'GET', `/api/coalition/frameworks${qs}`)
+    )
+  }
+
+  /** GET /api/coalition/frameworks/{id} — id is the registry entry UUID, not frameworkId. */
+  async getFrameworkRegistryEntry (tenantId: string, registryId: string): Promise<any> {
+    return await this.withToken(tenantId, (token, apiBaseUrl) =>
+      this.request(apiBaseUrl, token, 'GET', `/api/coalition/frameworks/${encodeURIComponent(registryId)}`)
+    )
+  }
+
+  /** @deprecated Use getFrameworkRegistryEntry — param is registry UUID, not frameworkId. */
+  async getFramework (tenantId: string, registryId: string): Promise<any> {
+    return this.getFrameworkRegistryEntry(tenantId, registryId)
+  }
+
+  /**
+   * Resolve a coalition framework by CASE frameworkId:
+   * 1. Optional registry detail when registryId is known
+   * 2. GET /api/coalition/frameworks?search={frameworkId}
+   * 3. Paginate coalition list and match frameworkId exactly
+   * 4. When sourceUri is already known (from browse UI), use it without registry match
+   */
+  async resolveFramework (
+    tenantId: string,
+    frameworkId: string,
+    sourceUri?: string,
+    registryId?: string
+  ): Promise<ResolvedCoalitionFramework> {
+    const trimmedId = frameworkId.trim()
+    if (!trimmedId) {
+      throw new Error('frameworkId is required')
+    }
+
+    const trimmedRegistryId = registryId?.trim()
+    let entry: any = null
+
+    if (trimmedRegistryId) {
+      try {
+        entry = await this.getFrameworkRegistryEntry(tenantId, trimmedRegistryId)
+      } catch (registryErr: any) {
+        logger.warn({ tenantId, frameworkId: trimmedId, registryId: trimmedRegistryId, error: registryErr?.message }, 'CGE registry lookup by id failed')
+      }
+    }
+
+    if (!entry) {
+      const searchRes = await this.listFrameworks(tenantId, { search: trimmedId, limit: '100' })
+      entry = matchFrameworkEntry(extractCoalitionDataList(searchRes), trimmedId, trimmedRegistryId)
+    }
+
+    if (!entry) {
+      entry = await this.findFrameworkInCoalitionPages(tenantId, trimmedId, trimmedRegistryId)
+    }
+
+    if (!entry) {
+      try {
+        entry = await this.getFrameworkRegistryEntry(tenantId, trimmedId)
+      } catch {
+        entry = null
+      }
+    }
+
+    const explicitSourceUri = (sourceUri ?? '').trim()
+    if (!entry && explicitSourceUri) {
+      logger.info({ tenantId, frameworkId: trimmedId, sourceUri: explicitSourceUri }, 'Using coalition sourceUri from client without registry match')
+      entry = {
+        frameworkId: trimmedId,
+        id: trimmedRegistryId,
+        sourceUri: explicitSourceUri
+      }
+    }
+
+    if (!entry) {
+      throw new Error(`Framework not found in CASE Global registry: ${trimmedId}`)
+    }
+
+    let detail = entry
+    const resolvedRegistryId = typeof entry.id === 'string' ? entry.id.trim() : trimmedRegistryId ?? ''
+    if (resolvedRegistryId && resolvedRegistryId !== trimmedId) {
+      try {
+        detail = await this.getFrameworkRegistryEntry(tenantId, resolvedRegistryId)
+      } catch (detailErr: any) {
+        logger.warn({ tenantId, frameworkId: trimmedId, registryId: resolvedRegistryId, error: detailErr?.message }, 'CGE registry detail fetch failed; using list row')
+      }
+    }
+
+    const resolvedUri = resolvePublisherUriFromCoalition(entry, detail, explicitSourceUri)
+    if (!resolvedUri) {
+      throw new Error('Could not resolve publisher URI for framework')
+    }
+
+    return { entry, detail, sourceUri: resolvedUri }
+  }
+
+  /** Paginate coalition browse until a frameworkId/registryId match is found. */
+  private async findFrameworkInCoalitionPages (
+    tenantId: string,
+    frameworkId: string,
+    registryId?: string
+  ): Promise<Record<string, unknown> | null> {
+    const pageLimit = 100
+    let page = 1
+    let totalPages = 1
+
+    while (page <= totalPages && page <= 20) {
+      const listRes = await this.listFrameworks(tenantId, { limit: String(pageLimit), page: String(page) })
+      const match = matchFrameworkEntry(extractCoalitionDataList(listRes), frameworkId, registryId)
+      if (match) return match
+
+      const pagination = extractCoalitionPagination(listRes)
+      totalPages = pagination?.totalPages ?? page
+      if (!extractCoalitionDataList(listRes).length) break
+      page += 1
+    }
+
+    return null
+  }
+
+  async createSubscription (tenantId: string, body: unknown): Promise<any> {
+    return await this.withToken(tenantId, (token, apiBaseUrl) =>
+      this.request(apiBaseUrl, token, 'POST', '/api/coalition/subscriptions', body)
+    )
+  }
+
+  async listSubscriptions (tenantId: string, query?: Record<string, string>): Promise<any> {
+    const qs = query && Object.keys(query).length > 0
+      ? `?${new URLSearchParams(query).toString()}`
+      : ''
+    return await this.withToken(tenantId, (token, apiBaseUrl) =>
+      this.request(apiBaseUrl, token, 'GET', `/api/coalition/subscriptions${qs}`)
+    )
+  }
+
+  /**
+   * Fetch a CFPackage from a publisher CASE host, presenting the CGE JWT.
+   * Accepts either wrapped ({ CFPackage: ... }) or flat CASE JSON.
+   */
+  async fetchPublisherPackage (tenantId: string, endpointUrl: string, options?: { skipAuth?: boolean }): Promise<any> {
+    if (options?.skipAuth) {
+      const res = await fetch(endpointUrl, {
+        method: 'GET',
+        headers: { Accept: 'application/json' }
+      })
+      if (!res.ok) {
+        const text = await res.text().catch(() => '')
+        const error: any = new Error(`Publisher fetch failed: ${res.status}. ${text.slice(0, 500)}`)
+        error.status = res.status
+        throw error
+      }
+      return await res.json()
+    }
+
+    return await this.withToken(tenantId, async (token) => {
+      const fetchOnce = async (accessToken: string) => {
+        const res = await fetch(endpointUrl, {
+          method: 'GET',
+          headers: {
+            Authorization: `Bearer ${accessToken}`,
+            Accept: 'application/json'
+          }
+        })
+        if (!res.ok) {
+          const text = await res.text().catch(() => '')
+          const error: any = new Error(`Publisher fetch failed: ${res.status}. ${text.slice(0, 500)}`)
+          error.status = res.status
+          throw error
+        }
+        return await res.json()
+      }
+
+      try {
+        return await fetchOnce(token)
+      } catch (err: any) {
+        if (err?.status !== 401) throw err
+        const creds = await this.credentialsStore.get(tenantId)
+        if (!creds) throw err
+        const { tokenUrl } = this.resolveEndpoints(creds)
+        const refreshed = await this.auth.refreshAccessToken(tokenUrl, creds.clientId, creds.clientSecret)
+        return await fetchOnce(refreshed)
+      }
+    })
+  }
+
+  async testCredentials (tenantId: string): Promise<{ ok: boolean, message: string }> {
+    try {
+      const creds = await this.credentialsStore.get(tenantId)
+      if (!creds) {
+        return { ok: false, message: 'No credentials configured' }
+      }
+      const { tokenUrl } = this.resolveEndpoints(creds)
+      await this.auth.refreshAccessToken(tokenUrl, creds.clientId, creds.clientSecret)
+      return { ok: true, message: 'Token minted successfully' }
+    } catch (error: any) {
+      logger.warn({ tenantId, error: error?.message }, 'CGE credential test failed')
+      return { ok: false, message: error?.message || 'Token request failed' }
+    }
+  }
+}
diff --git a/apps/opencase/src/infrastructure/cge/CgeAuthClient.ts b/apps/opencase/src/infrastructure/cge/CgeAuthClient.ts
new file mode 100644
index 0000000..0fc3ec6
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/CgeAuthClient.ts
@@ -0,0 +1,74 @@
+import { logger } from '../logging/Logger'
+
+type TokenCache = {
+  accessToken: string
+  expiresAtMs: number
+}
+
+/**
+ * OAuth2 client_credentials token client for CASE Global (org API key).
+ * Token URL is supplied per call so each tenant can use its own CGE endpoint.
+ */
+export class CgeAuthClient {
+  private cache = new Map<string, TokenCache>()
+
+  private cacheKey (tokenUrl: string, clientId: string): string {
+    return `${tokenUrl}::${clientId}`
+  }
+
+  async getAccessToken (tokenUrl: string, clientId: string, clientSecret: string): Promise<string> {
+    const key = this.cacheKey(tokenUrl, clientId)
+    const cached = this.cache.get(key)
+    if (cached && Date.now() < cached.expiresAtMs) {
+      return cached.accessToken
+    }
+
+    return await this.fetchToken(tokenUrl, clientId, clientSecret)
+  }
+
+  /** Force mint a new token (e.g. after HTTP 401). */
+  async refreshAccessToken (tokenUrl: string, clientId: string, clientSecret: string): Promise<string> {
+    this.cache.delete(this.cacheKey(tokenUrl, clientId))
+    return await this.fetchToken(tokenUrl, clientId, clientSecret)
+  }
+
+  private async fetchToken (tokenUrl: string, clientId: string, clientSecret: string): Promise<string> {
+    const url = tokenUrl.trim()
+    if (!url) {
+      throw new Error('CGE token URL is not configured for this tenant')
+    }
+
+    const params = new URLSearchParams()
+    params.set('grant_type', 'client_credentials')
+    params.set('client_id', clientId)
+    params.set('client_secret', clientSecret)
+
+    const res = await fetch(url, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/x-www-form-urlencoded',
+        Accept: 'application/json'
+      },
+      body: params.toString()
+    })
+
+    if (!res.ok) {
+      const body = await res.text().catch(() => '')
+      logger.warn({ status: res.status, body: body.slice(0, 500) }, 'CGE token request failed')
+      throw new Error(`Failed to obtain CGE access token: ${res.status} ${res.statusText}`)
+    }
+
+    const json = await res.json() as { access_token?: string, expires_in?: number }
+    if (!json.access_token) {
+      throw new Error('CGE token response missing access_token')
+    }
+
+    const expiresIn = typeof json.expires_in === 'number' ? json.expires_in : 300
+    this.cache.set(this.cacheKey(url, clientId), {
+      accessToken: json.access_token,
+      expiresAtMs: Date.now() + (expiresIn * 1000) - 30_000
+    })
+
+    return json.access_token
+  }
+}
diff --git a/apps/opencase/src/infrastructure/cge/FileCgeCredentialsStore.ts b/apps/opencase/src/infrastructure/cge/FileCgeCredentialsStore.ts
new file mode 100644
index 0000000..18040c7
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/FileCgeCredentialsStore.ts
@@ -0,0 +1,167 @@
+import { createCipheriv, createDecipheriv, randomBytes, scryptSync } from 'node:crypto'
+import { mkdir, readFile, writeFile, unlink } from 'node:fs/promises'
+import { dirname, join } from 'node:path'
+import { existsSync } from 'node:fs'
+
+export interface CgeCredentials {
+  clientId: string
+  clientSecret: string
+  /** OpenID Connect discovery document URL (stored as entered/normalized). */
+  discoveryUrl: string
+  /** CASE Global coalition API base URL (derived from discovery origin). */
+  apiBaseUrl: string
+  /** OAuth2 token endpoint for client_credentials (from discovery). */
+  tokenUrl: string
+  updatedAt: string
+}
+
+export interface CgeCredentialsPublic {
+  configured: boolean
+  clientIdMasked: string | null
+  discoveryUrl: string | null
+  updatedAt: string | null
+}
+
+export interface CgeCredentialsInput {
+  clientId: string
+  /** When empty and credentials already exist, the previous secret is retained. */
+  clientSecret?: string
+  discoveryUrl: string
+  apiBaseUrl: string
+  tokenUrl: string
+}
+
+/**
+ * File-based per-tenant CGE credential + endpoint store.
+ * Secrets are encrypted at rest when an encryption key is configured.
+ */
+export class FileCgeCredentialsStore {
+  constructor (
+    private readonly baseDataDir: string,
+    private readonly encryptionKey: string | undefined
+  ) {}
+
+  private credentialsPath (tenantId: string): string {
+    return join(this.baseDataDir, 'tenants', tenantId, 'cge', 'credentials.json')
+  }
+
+  private deriveKey (): Buffer {
+    if (!this.encryptionKey) {
+      throw new Error('CGE_CREDENTIALS_ENCRYPTION_KEY is required to store CGE credentials')
+    }
+    // scrypt with fixed salt scoped to this app purpose
+    return scryptSync(this.encryptionKey, 'opencase-cge-credentials', 32)
+  }
+
+  private encrypt (plaintext: string): string {
+    const key = this.deriveKey()
+    const iv = randomBytes(12)
+    const cipher = createCipheriv('aes-256-gcm', key, iv)
+    const encrypted = Buffer.concat([cipher.update(plaintext, 'utf8'), cipher.final()])
+    const tag = cipher.getAuthTag()
+    return `v1:${iv.toString('base64')}:${tag.toString('base64')}:${encrypted.toString('base64')}`
+  }
+
+  private decrypt (payload: string): string {
+    if (!payload.startsWith('v1:')) {
+      // Legacy/dev plaintext fallback when key was not used
+      return payload
+    }
+    const parts = payload.split(':')
+    if (parts.length !== 4) throw new Error('Invalid encrypted credential payload')
+    const [, ivB64, tagB64, dataB64] = parts
+    const key = this.deriveKey()
+    const decipher = createDecipheriv('aes-256-gcm', key, Buffer.from(ivB64, 'base64'))
+    decipher.setAuthTag(Buffer.from(tagB64, 'base64'))
+    return Buffer.concat([
+      decipher.update(Buffer.from(dataB64, 'base64')),
+      decipher.final()
+    ]).toString('utf8')
+  }
+
+  private maskClientId (id: string): string {
+    return id.length <= 8 ? '********' : `${id.slice(0, 4)}…${id.slice(-4)}`
+  }
+
+  async get (tenantId: string): Promise<CgeCredentials | null> {
+    const path = this.credentialsPath(tenantId)
+    if (!existsSync(path)) return null
+    const raw = JSON.parse(await readFile(path, 'utf8')) as {
+      clientId: string
+      clientSecret: string
+      discoveryUrl?: string
+      apiBaseUrl?: string
+      tokenUrl?: string
+      updatedAt: string
+    }
+    return {
+      clientId: raw.clientId,
+      clientSecret: this.decrypt(raw.clientSecret),
+      discoveryUrl: (raw.discoveryUrl ?? '').trim(),
+      apiBaseUrl: (raw.apiBaseUrl ?? '').trim(),
+      tokenUrl: (raw.tokenUrl ?? '').trim(),
+      updatedAt: raw.updatedAt
+    }
+  }
+
+  async getPublic (tenantId: string): Promise<CgeCredentialsPublic> {
+    const creds = await this.get(tenantId)
+    if (!creds) {
+      return {
+        configured: false,
+        clientIdMasked: null,
+        discoveryUrl: null,
+        updatedAt: null
+      }
+    }
+    return {
+      configured: true,
+      clientIdMasked: this.maskClientId(creds.clientId),
+      discoveryUrl: creds.discoveryUrl || null,
+      updatedAt: creds.updatedAt
+    }
+  }
+
+  async put (tenantId: string, input: CgeCredentialsInput): Promise<CgeCredentialsPublic> {
+    if (!this.encryptionKey) {
+      throw new Error('CGE_CREDENTIALS_ENCRYPTION_KEY is required to store CGE credentials')
+    }
+
+    const discoveryUrl = input.discoveryUrl.trim()
+    const apiBaseUrl = input.apiBaseUrl.trim().replace(/\/$/, '')
+    const tokenUrl = input.tokenUrl.trim()
+    const clientId = input.clientId.trim()
+    if (!discoveryUrl) throw new Error('discoveryUrl is required')
+    if (!apiBaseUrl) throw new Error('apiBaseUrl is required')
+    if (!tokenUrl) throw new Error('tokenUrl is required')
+    if (!clientId) throw new Error('clientId is required')
+
+    const existing = await this.get(tenantId)
+    const secretInput = (input.clientSecret ?? '').trim()
+    const clientSecret = secretInput || existing?.clientSecret
+    if (!clientSecret) {
+      throw new Error('clientSecret is required')
+    }
+
+    const path = this.credentialsPath(tenantId)
+    await mkdir(dirname(path), { recursive: true })
+    const updatedAt = new Date().toISOString()
+    const payload = {
+      clientId,
+      clientSecret: this.encrypt(clientSecret),
+      discoveryUrl,
+      apiBaseUrl,
+      tokenUrl,
+      updatedAt
+    }
+    await writeFile(path, JSON.stringify(payload, null, 2), 'utf8')
+    return await this.getPublic(tenantId)
+  }
+
+  async delete (tenantId: string): Promise<void> {
+    const path = this.credentialsPath(tenantId)
+    if (existsSync(path)) {
+      await unlink(path)
+    }
+  }
+}
diff --git a/apps/opencase/src/infrastructure/cge/__tests__/CgeAuthClient.test.ts b/apps/opencase/src/infrastructure/cge/__tests__/CgeAuthClient.test.ts
new file mode 100644
index 0000000..b3db00f
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/__tests__/CgeAuthClient.test.ts
@@ -0,0 +1,44 @@
+import { CgeAuthClient } from '../CgeAuthClient'
+
+describe('CgeAuthClient', () => {
+  const originalFetch = global.fetch
+
+  afterEach(() => {
+    global.fetch = originalFetch
+  })
+
+  it('mints and caches access tokens per token URL', async () => {
+    let calls = 0
+    global.fetch = jest.fn(async () => {
+      calls += 1
+      return {
+        ok: true,
+        json: async () => ({ access_token: 'tok-1', expires_in: 3600 })
+      } as any
+    }) as any
+
+    const client = new CgeAuthClient()
+    const t1 = await client.getAccessToken('https://cge.example/token', 'cid', 'sec')
+    const t2 = await client.getAccessToken('https://cge.example/token', 'cid', 'sec')
+    expect(t1).toBe('tok-1')
+    expect(t2).toBe('tok-1')
+    expect(calls).toBe(1)
+  })
+
+  it('refreshAccessToken bypasses cache', async () => {
+    let calls = 0
+    global.fetch = jest.fn(async () => {
+      calls += 1
+      return {
+        ok: true,
+        json: async () => ({ access_token: `tok-${calls}`, expires_in: 3600 })
+      } as any
+    }) as any
+
+    const client = new CgeAuthClient()
+    await client.getAccessToken('https://cge.example/token', 'cid', 'sec')
+    const refreshed = await client.refreshAccessToken('https://cge.example/token', 'cid', 'sec')
+    expect(refreshed).toBe('tok-2')
+    expect(calls).toBe(2)
+  })
+})
diff --git a/apps/opencase/src/infrastructure/cge/__tests__/FileCgeCredentialsStore.test.ts b/apps/opencase/src/infrastructure/cge/__tests__/FileCgeCredentialsStore.test.ts
new file mode 100644
index 0000000..3b2a347
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/__tests__/FileCgeCredentialsStore.test.ts
@@ -0,0 +1,75 @@
+import { mkdtemp, rm } from 'node:fs/promises'
+import { tmpdir } from 'node:os'
+import { join } from 'node:path'
+import { FileCgeCredentialsStore } from '../FileCgeCredentialsStore'
+
+describe('FileCgeCredentialsStore', () => {
+  let dir: string
+
+  beforeEach(async () => {
+    dir = await mkdtemp(join(tmpdir(), 'cge-creds-'))
+  })
+
+  afterEach(async () => {
+    await rm(dir, { recursive: true, force: true })
+  })
+
+  it('refuses to store without encryption key', async () => {
+    const store = new FileCgeCredentialsStore(dir, undefined)
+    await expect(store.put('t1', {
+      clientId: 'cid',
+      clientSecret: 'sec',
+      discoveryUrl: 'https://cge.example/realm/.well-known/openid-configuration',
+      apiBaseUrl: 'https://cge.example',
+      tokenUrl: 'https://cge.example/token'
+    })).rejects.toThrow(/CGE_CREDENTIALS_ENCRYPTION_KEY/)
+  })
+
+  it('stores and retrieves encrypted credentials with discovery URL', async () => {
+    const store = new FileCgeCredentialsStore(dir, 'test-encryption-key-32chars!!')
+    const pub = await store.put('demo', {
+      clientId: 'my-client-id',
+      clientSecret: 'super-secret',
+      discoveryUrl: 'https://cge.example/realm/.well-known/openid-configuration',
+      apiBaseUrl: 'https://cge.example/',
+      tokenUrl: 'https://cge.example/oauth/token'
+    })
+    expect(pub.configured).toBe(true)
+    expect(pub.clientIdMasked).toContain('…')
+    expect(pub.discoveryUrl).toBe('https://cge.example/realm/.well-known/openid-configuration')
+    expect('apiBaseUrl' in pub).toBe(false)
+
+    const creds = await store.get('demo')
+    expect(creds?.clientId).toBe('my-client-id')
+    expect(creds?.clientSecret).toBe('super-secret')
+    expect(creds?.discoveryUrl).toBe('https://cge.example/realm/.well-known/openid-configuration')
+    expect(creds?.apiBaseUrl).toBe('https://cge.example')
+    expect(creds?.tokenUrl).toBe('https://cge.example/oauth/token')
+
+    await store.delete('demo')
+    expect(await store.get('demo')).toBeNull()
+  })
+
+  it('keeps existing secret when clientSecret is omitted on update', async () => {
+    const store = new FileCgeCredentialsStore(dir, 'test-encryption-key-32chars!!')
+    await store.put('demo', {
+      clientId: 'cid',
+      clientSecret: 'original-secret',
+      discoveryUrl: 'https://cge.example/realm/.well-known/openid-configuration',
+      apiBaseUrl: 'https://cge.example',
+      tokenUrl: 'https://cge.example/token'
+    })
+
+    const pub = await store.put('demo', {
+      clientId: 'cid',
+      clientSecret: '',
+      discoveryUrl: 'https://cge.example/realm2/.well-known/openid-configuration',
+      apiBaseUrl: 'https://cge.example',
+      tokenUrl: 'https://cge.example/token2'
+    })
+    expect(pub.discoveryUrl).toBe('https://cge.example/realm2/.well-known/openid-configuration')
+
+    const creds = await store.get('demo')
+    expect(creds?.clientSecret).toBe('original-secret')
+  })
+})
diff --git a/apps/opencase/src/infrastructure/cge/__tests__/cgeCoalitionHelpers.test.ts b/apps/opencase/src/infrastructure/cge/__tests__/cgeCoalitionHelpers.test.ts
new file mode 100644
index 0000000..54838e6
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/__tests__/cgeCoalitionHelpers.test.ts
@@ -0,0 +1,76 @@
+import {
+  buildFrameworkListQuery,
+  extractCoalitionDataList,
+  extractCoalitionPagination,
+  matchFrameworkEntry,
+  resolvePublisherUriFromCoalition
+} from '../cgeCoalitionHelpers'
+
+describe('cgeCoalitionHelpers', () => {
+  describe('buildFrameworkListQuery', () => {
+    it('maps q to search', () => {
+      expect(buildFrameworkListQuery({ q: 'math', limit: '20' })).toEqual({
+        search: 'math',
+        limit: '20'
+      })
+    })
+
+    it('maps offset to page', () => {
+      expect(buildFrameworkListQuery({ offset: '20', limit: '10' })).toEqual({
+        page: '3',
+        limit: '10'
+      })
+    })
+  })
+
+  describe('extractCoalitionDataList', () => {
+    it('reads data array from coalition list response', () => {
+      const rows = extractCoalitionDataList({
+        data: [{ frameworkId: 'fw-1' }],
+        pagination: { page: 1, limit: 20, total: 1, totalPages: 1 }
+      })
+      expect(rows).toHaveLength(1)
+    })
+  })
+
+  describe('matchFrameworkEntry', () => {
+    const rows = [
+      { id: 'registry-1', frameworkId: 'fw-abc', title: 'A' },
+      { id: 'registry-2', frameworkId: 'fw-def', title: 'B' }
+    ]
+
+    it('matches by frameworkId', () => {
+      expect(matchFrameworkEntry(rows, 'fw-abc')?.title).toBe('A')
+    })
+
+    it('matches by registry id', () => {
+      expect(matchFrameworkEntry(rows, 'missing', 'registry-2')?.title).toBe('B')
+    })
+  })
+
+  describe('extractCoalitionPagination', () => {
+    it('reads pagination block', () => {
+      expect(extractCoalitionPagination({ pagination: { page: 2, totalPages: 5 } })).toEqual({
+        page: 2,
+        totalPages: 5
+      })
+    })
+  })
+
+  describe('resolvePublisherUriFromCoalition', () => {
+    it('prefers explicit sourceUri', () => {
+      expect(resolvePublisherUriFromCoalition(
+        { sourceUri: 'https://list.example/pkg' },
+        { sourceUri: 'https://detail.example/pkg' },
+        'https://explicit.example/pkg'
+      )).toBe('https://explicit.example/pkg')
+    })
+
+    it('uses detail metadata when present', () => {
+      expect(resolvePublisherUriFromCoalition(
+        { sourceUri: 'https://list.example/pkg' },
+        { metadata: { CFPackageURI: 'https://detail.example/pkg' } }
+      )).toBe('https://detail.example/pkg')
+    })
+  })
+})
diff --git a/apps/opencase/src/infrastructure/cge/__tests__/resolveCgeOpenIdDiscovery.test.ts b/apps/opencase/src/infrastructure/cge/__tests__/resolveCgeOpenIdDiscovery.test.ts
new file mode 100644
index 0000000..f591629
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/__tests__/resolveCgeOpenIdDiscovery.test.ts
@@ -0,0 +1,53 @@
+import { normalizeOpenIdDiscoveryUrl, resolveCgeOpenIdDiscovery } from '../resolveCgeOpenIdDiscovery'
+
+describe('normalizeOpenIdDiscoveryUrl', () => {
+  it('appends well-known path to realm issuer URLs', () => {
+    expect(normalizeOpenIdDiscoveryUrl('https://caseglobal-preview.1edtech.org/auth/realms/caseglobal'))
+      .toBe('https://caseglobal-preview.1edtech.org/auth/realms/caseglobal/.well-known/openid-configuration')
+  })
+
+  it('preserves a full discovery URL', () => {
+    const url = 'https://caseglobal-preview.1edtech.org/auth/realms/caseglobal/.well-known/openid-configuration'
+    expect(normalizeOpenIdDiscoveryUrl(url)).toBe(url)
+  })
+
+  it('trims trailing slashes before normalizing', () => {
+    expect(normalizeOpenIdDiscoveryUrl('https://example.com/realm/caseglobal/'))
+      .toBe('https://example.com/realm/caseglobal/.well-known/openid-configuration')
+  })
+})
+
+describe('resolveCgeOpenIdDiscovery', () => {
+  const originalFetch = globalThis.fetch
+
+  afterEach(() => {
+    globalThis.fetch = originalFetch
+  })
+
+  it('derives token and API base URLs from discovery document', async () => {
+    globalThis.fetch = jest.fn(async () => ({
+      ok: true,
+      json: async () => ({
+        issuer: 'https://caseglobal-preview.1edtech.org/auth/realms/caseglobal',
+        token_endpoint: 'https://caseglobal-preview.1edtech.org/auth/realms/caseglobal/protocol/openid-connect/token'
+      })
+    })) as unknown as typeof fetch
+
+    const result = await resolveCgeOpenIdDiscovery(
+      'https://caseglobal-preview.1edtech.org/auth/realms/caseglobal/.well-known/openid-configuration'
+    )
+
+    expect(result.discoveryUrl).toContain('/.well-known/openid-configuration')
+    expect(result.tokenUrl).toContain('/protocol/openid-connect/token')
+    expect(result.apiBaseUrl).toBe('https://caseglobal-preview.1edtech.org')
+  })
+
+  it('throws when discovery document lacks token_endpoint', async () => {
+    globalThis.fetch = jest.fn(async () => ({
+      ok: true,
+      json: async () => ({ issuer: 'https://example.com' })
+    })) as unknown as typeof fetch
+
+    await expect(resolveCgeOpenIdDiscovery('https://example.com/realm')).rejects.toThrow(/token_endpoint/)
+  })
+})
diff --git a/apps/opencase/src/infrastructure/cge/cgeCoalitionHelpers.ts b/apps/opencase/src/infrastructure/cge/cgeCoalitionHelpers.ts
new file mode 100644
index 0000000..e1aa64b
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/cgeCoalitionHelpers.ts
@@ -0,0 +1,99 @@
+/** Coalition framework list query — maps legacy `q`/`offset` to CGE `search`/`page`. */
+export function buildFrameworkListQuery (query?: Record<string, string>): Record<string, string> {
+  if (!query) return {}
+  const out: Record<string, string> = { ...query }
+
+  if (out.q && !out.search) {
+    out.search = out.q
+    delete out.q
+  }
+
+  if (out.offset && !out.page) {
+    const limit = Number.parseInt(out.limit ?? '20', 10)
+    const offset = Number.parseInt(out.offset, 10)
+    if (Number.isFinite(limit) && limit > 0 && Number.isFinite(offset) && offset >= 0) {
+      out.page = String(Math.floor(offset / limit) + 1)
+    }
+    delete out.offset
+  }
+
+  return out
+}
+
+/** Extract framework rows from coalition list/detail responses. */
+export function extractCoalitionDataList (data: unknown): any[] {
+  if (!data) return []
+  if (Array.isArray(data)) return data
+  if (typeof data !== 'object') return []
+
+  const obj = data as Record<string, unknown>
+  for (const key of ['data', 'frameworks', 'items', 'results']) {
+    const value = obj[key]
+    if (Array.isArray(value)) return value
+  }
+  return []
+}
+
+/** Read coalition pagination metadata when present. */
+export function extractCoalitionPagination (data: unknown): { page: number, totalPages: number } | null {
+  if (!data || typeof data !== 'object') return null
+  const pagination = (data as Record<string, unknown>).pagination
+  if (!pagination || typeof pagination !== 'object') return null
+  const page = Number((pagination as Record<string, unknown>).page)
+  const totalPages = Number((pagination as Record<string, unknown>).totalPages)
+  if (!Number.isFinite(page) || !Number.isFinite(totalPages) || totalPages < 1) return null
+  return { page, totalPages }
+}
+
+/** Match a coalition list row by CASE frameworkId or registry entry id. */
+export function matchFrameworkEntry (entries: any[], frameworkId: string, registryId?: string): Record<string, unknown> | null {
+  const needle = frameworkId.trim()
+  const registryNeedle = registryId?.trim()
+  if (!needle && !registryNeedle) return null
+
+  return entries.find((entry) =>
+    (needle && String(entry?.frameworkId ?? '') === needle) ||
+    (needle && String(entry?.id ?? '') === needle) ||
+    (registryNeedle && String(entry?.id ?? '') === registryNeedle)
+  ) ?? null
+}
+
+/** Resolve publisher CFPackage URL from coalition list/detail payloads. */
+export function resolvePublisherUriFromCoalition (
+  entry: any,
+  detail?: any,
+  explicitSourceUri?: string
+): string {
+  const explicit = (explicitSourceUri ?? '').trim()
+  if (explicit) return explicit
+
+  const meta = detail?.metadata
+  const metaUri = typeof meta === 'object' && meta
+    ? (meta.CFPackageURI ?? meta.uri ?? meta.officialSourceURL)
+    : undefined
+
+  return String(
+    detail?.sourceUri ??
+    metaUri ??
+    entry?.sourceUri ??
+    detail?.source_uri ??
+    entry?.source_uri ??
+    detail?.uri ??
+    entry?.uri ??
+    detail?.packageUri ??
+    entry?.packageUri ??
+    ''
+  ).trim()
+}
+
+export function resolveCoalitionFrameworkTitle (entry: any, detail?: any, cfPackage?: any): string {
+  return String(
+    detail?.title ??
+    entry?.title ??
+    detail?.name ??
+    entry?.name ??
+    cfPackage?.CFDocument?.title ??
+    cfPackage?.CFPackage?.CFDocument?.title ??
+    'Remote framework'
+  )
+}
diff --git a/apps/opencase/src/infrastructure/cge/resolveCgeOpenIdDiscovery.ts b/apps/opencase/src/infrastructure/cge/resolveCgeOpenIdDiscovery.ts
new file mode 100644
index 0000000..23c3954
--- /dev/null
+++ b/apps/opencase/src/infrastructure/cge/resolveCgeOpenIdDiscovery.ts
@@ -0,0 +1,58 @@
+export type CgeOpenIdDiscovery = {
+  discoveryUrl: string
+  issuer: string
+  tokenUrl: string
+  apiBaseUrl: string
+}
+
+/** Normalize user input to a full OpenID Connect discovery document URL. */
+export function normalizeOpenIdDiscoveryUrl (input: string): string {
+  const trimmed = input.trim().replace(/\/$/, '')
+  if (!trimmed) return ''
+  if (trimmed.includes('/.well-known/openid-configuration')) {
+    return trimmed
+  }
+  return `${trimmed}/.well-known/openid-configuration`
+}
+
+/**
+ * Fetch an OIDC discovery document and derive CGE coalition API + token endpoints.
+ * API base is the discovery URL origin (e.g. https://caseglobal-preview.1edtech.org).
+ */
+export async function resolveCgeOpenIdDiscovery (discoveryInput: string): Promise<CgeOpenIdDiscovery> {
+  const discoveryUrl = normalizeOpenIdDiscoveryUrl(discoveryInput)
+  if (!discoveryUrl) {
+    throw new Error('OpenID discovery URL is required')
+  }
+
+  let parsed: URL
+  try {
+    parsed = new URL(discoveryUrl)
+  } catch {
+    throw new Error('OpenID discovery URL is not a valid URL')
+  }
+
+  const res = await fetch(discoveryUrl, {
+    method: 'GET',
+    headers: { Accept: 'application/json' }
+  })
+  if (!res.ok) {
+    const text = await res.text().catch(() => '')
+    throw new Error(`OpenID discovery failed (${res.status}): ${text.slice(0, 200)}`)
+  }
+
+  const doc = await res.json() as { issuer?: string, token_endpoint?: string }
+  const tokenUrl = typeof doc.token_endpoint === 'string' ? doc.token_endpoint.trim() : ''
+  if (!tokenUrl) {
+    throw new Error('OpenID discovery document is missing token_endpoint')
+  }
+
+  const apiBaseUrl = `${parsed.protocol}//${parsed.host}`
+
+  return {
+    discoveryUrl,
+    issuer: typeof doc.issuer === 'string' ? doc.issuer.trim() : '',
+    tokenUrl,
+    apiBaseUrl
+  }
+}
diff --git a/apps/opencase/src/infrastructure/config/Config.ts b/apps/opencase/src/infrastructure/config/Config.ts
index c97dba5..eabae3d 100644
--- a/apps/opencase/src/infrastructure/config/Config.ts
+++ b/apps/opencase/src/infrastructure/config/Config.ts
@@ -42,6 +42,22 @@ export interface AppConfig {
 
   // Keycloak realm SSL enforcement ('none' for HTTP dev, 'external' for production HTTPS)
   keycloakRealmSslRequired: 'none' | 'external' | 'all';
+
+  /**
+   * Access-token claim from federated IdP (Auth0) carrying the organization id.
+   * Convention: claim value equals OpenCASE tenantId (1:1).
+   */
+  ssoOrgClaim: string;
+
+  /** CGE OAuth token endpoint (client_credentials). */
+  cgeTokenUrl: string;
+  /** CGE coalition API base URL (e.g. https://cge.example.com). */
+  cgeApiBaseUrl: string;
+  /**
+   * Encryption key for per-tenant CGE client secrets at rest.
+   * Required to store credentials (PUT).
+   */
+  cgeCredentialsEncryptionKey?: string;
 }
 
 export function loadConfig(): AppConfig {
@@ -83,6 +99,12 @@ export function loadConfig(): AppConfig {
     smtpFrom: process.env.SMTP_FROM ?? 'noreply@opencase.local',
 
     keycloakRealmSslRequired: (process.env.KEYCLOAK_SSL_REQUIRED ?? (isProduction ? 'external' : 'none')) as 'none' | 'external' | 'all',
+
+    ssoOrgClaim: process.env.SSO_ORG_CLAIM ?? 'org_id',
+
+    cgeTokenUrl: process.env.CGE_TOKEN_URL ?? '',
+    cgeApiBaseUrl: process.env.CGE_API_BASE_URL ?? '',
+    cgeCredentialsEncryptionKey: process.env.CGE_CREDENTIALS_ENCRYPTION_KEY,
   };
 }
 
diff --git a/apps/opencase/src/infrastructure/config/__tests__/Config.test.ts b/apps/opencase/src/infrastructure/config/__tests__/Config.test.ts
index 6579bb9..212a522 100644
--- a/apps/opencase/src/infrastructure/config/__tests__/Config.test.ts
+++ b/apps/opencase/src/infrastructure/config/__tests__/Config.test.ts
@@ -49,6 +49,9 @@ describe('Config', () => {
       expect(config.keycloakBootstrapSystemAdmin).toBe(true);
       expect(config.keycloakSystemAdminEmail).toBe('system-admin@local');
       expect(config.keycloakSystemAdminPassword).toBe('admin');
+      expect(config.ssoOrgClaim).toBe('org_id');
+      expect(config.cgeTokenUrl).toBe('');
+      expect(config.cgeApiBaseUrl).toBe('');
     });
 
     it('should default KEYCLOAK_BOOTSTRAP_SYSTEM_ADMIN to false in production when not set', () => {
diff --git a/apps/opencase/src/infrastructure/keycloak/KeycloakAdminClient.ts b/apps/opencase/src/infrastructure/keycloak/KeycloakAdminClient.ts
index 86ac155..e196325 100644
--- a/apps/opencase/src/infrastructure/keycloak/KeycloakAdminClient.ts
+++ b/apps/opencase/src/infrastructure/keycloak/KeycloakAdminClient.ts
@@ -107,17 +107,119 @@ export class KeycloakAdminClient {
     return { id: created.id }
   }
 
-  async ensureClientRole (clientUuid: string, roleName: string): Promise<void> {
+  async ensureClientRole (clientUuid: string, roleName: string, description?: string): Promise<void> {
     const realm = this.cfg.realm
     const existing = await this.requestRaw('GET', `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles/${encodeURIComponent(roleName)}`)
-    if (existing.status === 200) return
+    if (existing.status === 200) {
+      if (description) {
+        const role = await existing.json().catch(() => null) as any
+        if (role && role.description !== description) {
+          await this.requestJson('PUT', `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles/${encodeURIComponent(roleName)}`, {
+            ...role,
+            description
+          })
+        }
+      }
+      return
+    }
     if (existing.status !== 404) throw new Error(`Failed to check role '${roleName}': ${existing.status} ${existing.statusText}`)
 
     await this.requestJson('POST', `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles`, {
-      name: roleName
+      name: roleName,
+      description: description ?? ''
     })
   }
 
+  async getClientRole (clientUuid: string, roleName: string): Promise<Record<string, unknown> | null> {
+    const realm = this.cfg.realm
+    const res = await this.requestRaw(
+      'GET',
+      `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles/${encodeURIComponent(roleName)}`
+    )
+    if (res.status === 404) return null
+    if (!res.ok) {
+      const text = await res.text().catch(() => '')
+      throw new Error(`Failed to get role '${roleName}': ${res.status}. ${text}`)
+    }
+    return await res.json()
+  }
+
+  /**
+   * Ensure case.* scope roles and viewer/author/admin membership roles exist on a tenant client.
+   * Membership roles are composites of the corresponding case.* roles so they appear clearly in Keycloak.
+   */
+  async ensureTenantMemberRoles (clientUuid: string): Promise<void> {
+    await this.ensureClientRole(clientUuid, 'case.read', 'Read frameworks (case.read)')
+    await this.ensureClientRole(clientUuid, 'case.write', 'Author frameworks (case.write)')
+    await this.ensureClientRole(clientUuid, 'case.owner', 'Tenant administrator (case.owner)')
+
+    await this.ensureClientRole(clientUuid, 'viewer', 'Viewer — read frameworks')
+    await this.ensureClientRole(clientUuid, 'author', 'Author — create and edit frameworks')
+    await this.ensureClientRole(clientUuid, 'admin', 'Admin — manage members, API keys, and credentials')
+
+    await this.ensureClientRoleComposites(clientUuid, 'viewer', ['case.read'])
+    await this.ensureClientRoleComposites(clientUuid, 'author', ['case.read', 'case.write'])
+    await this.ensureClientRoleComposites(clientUuid, 'admin', ['case.read', 'case.write', 'case.owner'])
+  }
+
+  private async ensureClientRoleComposites (
+    clientUuid: string,
+    compositeRoleName: string,
+    childRoleNames: string[]
+  ): Promise<void> {
+    const realm = this.cfg.realm
+    const existing = await this.requestJson(
+      'GET',
+      `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles/${encodeURIComponent(compositeRoleName)}/composites`
+    )
+    const existingNames = new Set(
+      (Array.isArray(existing) ? existing : []).map((r: any) => r?.name as string).filter(Boolean)
+    )
+    const missing = childRoleNames.filter(n => !existingNames.has(n))
+    if (missing.length === 0) return
+
+    const children: any[] = []
+    for (const name of missing) {
+      const role = await this.getClientRole(clientUuid, name)
+      if (role) children.push(role)
+    }
+    if (children.length === 0) return
+
+    await this.requestJson(
+      'POST',
+      `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles/${encodeURIComponent(compositeRoleName)}/composites`,
+      children
+    )
+  }
+
+  /**
+   * Set membership for a user on a tenant client to exactly one MemberRole.
+   * Assigns the human-readable role (viewer/author/admin) plus case.* scopes for JWT mappers.
+   * Only touches OpenCASE-managed roles; leaves other client roles alone.
+   */
+  async setMemberRole (
+    userId: string,
+    clientUuid: string,
+    desiredRoleNames: string[]
+  ): Promise<void> {
+    await this.ensureTenantMemberRoles(clientUuid)
+
+    const managed = new Set([
+      'case.read', 'case.write', 'case.owner',
+      'viewer', 'author', 'admin'
+    ])
+    const desired = new Set(desiredRoleNames)
+    const current = await this.getUserClientRoleMappings(userId, clientUuid)
+    const currentNames = current.map((r: any) => r?.name as string).filter(Boolean)
+    const currentManaged = currentNames.filter(n => managed.has(n))
+
+    const toRemove = currentManaged.filter(n => !desired.has(n))
+    const toAdd = [...desired].filter(n => !currentManaged.includes(n))
+
+    if (toRemove.length > 0) await this.removeClientRoles(userId, clientUuid, toRemove)
+    if (toAdd.length > 0) await this.assignClientRoles(userId, clientUuid, toAdd)
+  }
+
   async ensureProtocolMapper (clientUuid: string, mapper: any): Promise<void> {
     const realm = this.cfg.realm
     const list = await this.requestJson('GET', `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/protocol-mappers/models`)
@@ -127,11 +229,11 @@ export class KeycloakAdminClient {
     await this.requestJson('POST', `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/protocol-mappers/models`, mapper)
   }
 
-  async ensureUser (user: { username: string, email?: string, enabled?: boolean }): Promise<{ id: string }> {
+  async ensureUser (user: { username: string, email?: string, enabled?: boolean }): Promise<{ id: string, created: boolean }> {
     const realm = this.cfg.realm
     const users = await this.requestJson('GET', `/admin/realms/${encodeURIComponent(realm)}/users?username=${encodeURIComponent(user.username)}&exact=true`)
     const existing = Array.isArray(users) ? users[0] : undefined
-    if (existing?.id) return { id: existing.id }
+    if (existing?.id) return { id: existing.id, created: false }
 
     await this.requestJson('POST', `/admin/realms/${encodeURIComponent(realm)}/users`, {
       username: user.username,
@@ -143,7 +245,7 @@ export class KeycloakAdminClient {
     const users2 = await this.requestJson('GET', `/admin/realms/${encodeURIComponent(realm)}/users?username=${encodeURIComponent(user.username)}&exact=true`)
     const created = Array.isArray(users2) ? users2[0] : undefined
     if (!created?.id) throw new Error(`Failed to create Keycloak user '${user.username}'`)
-    return { id: created.id }
+    return { id: created.id, created: true }
   }
 
   async findUserByEmailExact (email: string): Promise<{ id: string, username?: string, email?: string } | null> {
@@ -195,6 +297,96 @@ export class KeycloakAdminClient {
     await this.requestJson('POST', `/admin/realms/${encodeURIComponent(realm)}/users/${encodeURIComponent(userId)}/role-mappings/clients/${encodeURIComponent(clientUuid)}`, roles)
   }
 
+  async removeClientRoles (userId: string, clientUuid: string, roleNames: string[]): Promise<void> {
+    if (roleNames.length === 0) return
+    const realm = this.cfg.realm
+    const roles: any[] = []
+    for (const roleName of roleNames) {
+      const role = await this.requestJson('GET', `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles/${encodeURIComponent(roleName)}`)
+      roles.push(role)
+    }
+
+    const res = await this.requestRaw(
+      'DELETE',
+      `/admin/realms/${encodeURIComponent(realm)}/users/${encodeURIComponent(userId)}/role-mappings/clients/${encodeURIComponent(clientUuid)}`,
+      roles
+    )
+    if (!res.ok && res.status !== 204) {
+      const text = await res.text().catch(() => '')
+      throw new Error(`Failed to remove client roles: ${res.status} ${res.statusText}. ${text}`)
+    }
+  }
+
+  /**
+   * Replace a user's client roles for a given client with exactly `roleNames`.
+   */
+  async setClientRoles (userId: string, clientUuid: string, roleNames: string[]): Promise<void> {
+    const current = await this.getUserClientRoleMappings(userId, clientUuid)
+    const currentNames = current.map((r: any) => r?.name as string).filter(Boolean)
+    const toRemove = currentNames.filter(n => !roleNames.includes(n))
+    const toAdd = roleNames.filter(n => !currentNames.includes(n))
+    if (toRemove.length > 0) await this.removeClientRoles(userId, clientUuid, toRemove)
+    if (toAdd.length > 0) await this.assignClientRoles(userId, clientUuid, toAdd)
+  }
+
+  async getUserById (userId: string): Promise<{ id: string, username?: string, email?: string, enabled?: boolean } | null> {
+    const realm = this.cfg.realm
+    const res = await this.requestRaw('GET', `/admin/realms/${encodeURIComponent(realm)}/users/${encodeURIComponent(userId)}`)
+    if (res.status === 404) return null
+    if (!res.ok) {
+      const text = await res.text().catch(() => '')
+      throw new Error(`Keycloak Admin API error: GET user ${userId} -> ${res.status}. ${text}`)
+    }
+    const u = await res.json().catch(() => null) as any
+    if (!u?.id) return null
+    return { id: u.id, username: u.username, email: u.email, enabled: u.enabled }
+  }
+
+  /**
+   * List users that have any of the given client roles on a tenant client.
+   * Uses Keycloak role-user listing per role and de-duplicates.
+   */
+  async listUsersWithClientRoles (
+    clientUuid: string,
+    roleNames: string[]
+  ): Promise<Array<{ id: string, username?: string, email?: string, roles: string[] }>> {
+    const realm = this.cfg.realm
+    const byId = new Map<string, { id: string, username?: string, email?: string, roles: Set<string> }>()
+
+    for (const roleName of roleNames) {
+      const users = await this.requestJson(
+        'GET',
+        `/admin/realms/${encodeURIComponent(realm)}/clients/${encodeURIComponent(clientUuid)}/roles/${encodeURIComponent(roleName)}/users?max=5000`
+      )
+      if (!Array.isArray(users)) continue
+      for (const u of users) {
+        if (!u?.id) continue
+        const existing = byId.get(u.id)
+        if (existing) {
+          existing.roles.add(roleName)
+        } else {
+          byId.set(u.id, {
+            id: u.id,
+            username: u.username,
+            email: u.email,
+            roles: new Set([roleName])
+          })
+        }
+      }
+    }
+
+    return [...byId.values()].map(u => ({
+      id: u.id,
+      username: u.username,
+      email: u.email,
+      roles: [...u.roles].sort()
+    }))
+  }
+
+  async findClientByClientIdPublic (clientId: string): Promise<{ id: string, clientId: string } | null> {
+    return await this.findClientByClientId(clientId)
+  }
+
   // ── OAuth2 client scope helpers ──────────────────────────────────
 
   /**
diff --git a/apps/opencase/src/infrastructure/keycloak/KeycloakTenantProvisioner.ts b/apps/opencase/src/infrastructure/keycloak/KeycloakTenantProvisioner.ts
index 8ce7973..40f0ea5 100644
--- a/apps/opencase/src/infrastructure/keycloak/KeycloakTenantProvisioner.ts
+++ b/apps/opencase/src/infrastructure/keycloak/KeycloakTenantProvisioner.ts
@@ -43,6 +43,10 @@ export class KeycloakTenantProvisioner {
     const { id: userId } = await this.admin.ensureUser({ username: email, email, enabled: true })
     await this.admin.setUserPassword(userId, password, false)
     await this.admin.assignClientRoles(userId, clientUuid, roles)
+    // Tenant-admin membership so system-admin can use Members / API Keys on the system tenant
+    await this.admin.setMemberRole(userId, clientUuid, [
+      'case.read', 'case.write', 'case.owner', 'admin'
+    ])
 
     logger.info({ clientId, email }, 'Bootstrapped system admin user in Keycloak')
   }
@@ -57,7 +61,8 @@ export class KeycloakTenantProvisioner {
     const { id: userId } = await this.admin.ensureUser({ username: adminEmail, email: adminEmail, enabled: true })
     const adminPassword = randomBytes(18).toString('base64url')
     await this.admin.setUserPassword(userId, adminPassword, true)
-    await this.admin.assignClientRoles(userId, clientUuid, roles)
+    // Assign admin membership (human-readable label + case.* scopes)
+    await this.admin.setMemberRole(userId, clientUuid, [...roles, 'admin'])
 
     logger.info({ tenantId, clientId, adminEmail }, 'Provisioned tenant client and admin user in Keycloak')
     return { adminEmail, adminPassword }
@@ -73,9 +78,13 @@ export class KeycloakTenantProvisioner {
       webOrigins: this.cfg.spaWebOrigins
     })
 
+    // Scope roles requested by the caller (e.g. case.admin on the system tenant)…
     for (const role of roles) {
       await this.admin.ensureClientRole(clientUuid, role)
     }
+    // …plus the human-readable membership roles (viewer/author/admin) the Members
+    // UI assigns, which are composites of the corresponding case.* scopes.
+    await this.admin.ensureTenantMemberRoles(clientUuid)
 
     await this.admin.ensureProtocolMapper(clientUuid, {
       name: 'tenantId',
diff --git a/apps/opencase/src/infrastructure/persistence/file/FileFrameworkStore.ts b/apps/opencase/src/infrastructure/persistence/file/FileFrameworkStore.ts
index 67b0a48..d196088 100644
--- a/apps/opencase/src/infrastructure/persistence/file/FileFrameworkStore.ts
+++ b/apps/opencase/src/infrastructure/persistence/file/FileFrameworkStore.ts
@@ -24,6 +24,14 @@ export interface DocumentMetadata {
   licenseIdentifier?: string // UUID of the assigned CFLicense (for public-access checks)
   /** Server-level archive flag — independent of CASE adoptionStatus */
   archived?: boolean
+  /** When true, framework is a cached remote reference and cannot be mutated. */
+  readOnly?: boolean
+  /** CASE Global coalition registry ID (read-only caches). */
+  cgeFrameworkId?: string
+  /** Local framework that triggered a CGE cache import. */
+  linkedFromDocId?: string
+  /** When a read-only CGE cache was last fetched. */
+  cgeCachedAt?: Date
   /**
    * The complete, untransformed `extensions['ext:opencase']` object as stored on the document,
    * verbatim. This is the single source of truth for anything derived from that extension —
@@ -45,6 +53,12 @@ export function getOpenCaseAlignmentParticipants (meta: DocumentMetadata | undef
   return Array.isArray(v) ? v as Array<{ identifier?: string; uri: string }> : undefined
 }
 
+/** URL the framework was imported/mirrored from, if known. */
+export function getOpenCaseSourcePackageURI (meta: DocumentMetadata | undefined | null): string | undefined {
+  const v = meta?.openCaseExtensions?.sourcePackageURI
+  return typeof v === 'string' ? v : undefined
+}
+
 export interface DocumentVersionInfo {
   file: string
   lastChangeDateTime: Date
@@ -224,6 +238,10 @@ export class FileFrameworkStore {
           adoptionStatus: d.adoptionStatus,
           licenseIdentifier: d.licenseIdentifier,
           archived: d.archived,
+          readOnly: d.readOnly === true,
+          cgeFrameworkId: typeof d.cgeFrameworkId === 'string' ? d.cgeFrameworkId : undefined,
+          linkedFromDocId: typeof d.linkedFromDocId === 'string' ? d.linkedFromDocId : undefined,
+          cgeCachedAt: d.cgeCachedAt ? new Date(d.cgeCachedAt as string | number | Date) : undefined,
           openCaseExtensions: d.openCaseExtensions,
         })
       }
@@ -476,7 +494,32 @@ export class FileFrameworkStore {
       licenseIdentifier = lic.identifier
     }
 
+    let readOnly: boolean | undefined
+    let cgeFrameworkId: string | undefined
+    let linkedFromDocId: string | undefined
+    let cgeCachedAt: Date | undefined
     const extOpencase = doc.extensions?.['ext:opencase']
+    if (extOpencase && typeof extOpencase === 'object') {
+      if ((extOpencase as any).readOnly === true) {
+        readOnly = true
+      }
+      if (typeof (extOpencase as any).cgeFrameworkId === 'string') {
+        cgeFrameworkId = (extOpencase as any).cgeFrameworkId
+      }
+      if (typeof (extOpencase as any).linkedFromDocId === 'string') {
+        linkedFromDocId = (extOpencase as any).linkedFromDocId
+      }
+      if (typeof (extOpencase as any).cgeCachedAt === 'string') {
+        cgeCachedAt = new Date((extOpencase as any).cgeCachedAt)
+      }
+    }
+
+    // Preserve index-only flags when a new bundle omits ext:opencase fields (e.g. partial update).
+    // `previous` is the metadata already recorded under this storage key (resolved above).
+    if (readOnly !== true && previous?.readOnly === true) readOnly = true
+    if (!cgeFrameworkId && previous?.cgeFrameworkId) cgeFrameworkId = previous.cgeFrameworkId
+    if (!linkedFromDocId && previous?.linkedFromDocId) linkedFromDocId = previous.linkedFromDocId
+    if (!cgeCachedAt && previous?.cgeCachedAt) cgeCachedAt = previous.cgeCachedAt
 
     versionMap.set(storageKey, {
       sourcedId: currentIdentifier,
@@ -491,6 +534,10 @@ export class FileFrameworkStore {
       currentFile: relativePath,
       adoptionStatus: doc.adoptionStatus as string | undefined,
       licenseIdentifier,
+      readOnly,
+      cgeFrameworkId,
+      linkedFromDocId,
+      cgeCachedAt,
       openCaseExtensions: extOpencase && typeof extOpencase === 'object' ? extOpencase as Record<string, unknown> : undefined,
     })
   }
@@ -694,6 +741,10 @@ export class FileFrameworkStore {
       adoptionStatus: meta.adoptionStatus,
       licenseIdentifier: meta.licenseIdentifier,
       archived: meta.archived,
+      readOnly: meta.readOnly,
+      cgeFrameworkId: meta.cgeFrameworkId,
+      linkedFromDocId: meta.linkedFromDocId,
+      cgeCachedAt: meta.cgeCachedAt?.toISOString(),
       openCaseExtensions: meta.openCaseExtensions,
     }))
 
@@ -876,6 +927,58 @@ export class FileFrameworkStore {
     return Array.from(versionMap.values())
   }
 
+  findDocumentByCgeFrameworkId (
+    tenantId: TenantId,
+    version: CaseVersion,
+    cgeFrameworkId: string
+  ): DocumentMetadata | null {
+    const docs = this.getAllDocuments(tenantId, version)
+    return docs.find(d => d.cgeFrameworkId === cgeFrameworkId && d.readOnly === true) ?? null
+  }
+
+  async searchItemsInDocument (
+    tenantId: TenantId,
+    version: CaseVersion,
+    docId: string,
+    query: string,
+    limit: number
+  ): Promise<Array<{
+    identifier: string
+    uri?: string
+    fullStatement?: string
+    abbreviatedStatement?: string
+    humanCodingScheme?: string
+    CFItemType?: string
+  }>> {
+    const bundle = await this.loadDocumentBundle(tenantId, version, docId)
+    if (!bundle?.items || !Array.isArray(bundle.items)) return []
+
+    const q = query.trim().toLowerCase()
+    const matches = (item: any): boolean => {
+      if (!q) return true
+      const parts = [
+        item.fullStatement,
+        item.abbreviatedStatement,
+        item.humanCodingScheme,
+        item.identifier,
+        item.CFItemType
+      ]
+      return parts.some(p => typeof p === 'string' && p.toLowerCase().includes(q))
+    }
+
+    return bundle.items
+      .filter(matches)
+      .slice(0, limit)
+      .map((item: any) => ({
+        identifier: item.identifier ?? item.sourcedId,
+        uri: item.uri,
+        fullStatement: item.fullStatement,
+        abbreviatedStatement: item.abbreviatedStatement,
+        humanCodingScheme: item.humanCodingScheme,
+        CFItemType: item.CFItemType
+      }))
+  }
+
   // ──────────────────────────────────────────────────────────────────────────
   // Global lookup methods — search across ALL tenants by globally-unique ID
   // ──────────────────────────────────────────────────────────────────────────
diff --git a/apps/opencase/src/interfaces/http/http-management/controllers/CFAssociationsManagementController.ts b/apps/opencase/src/interfaces/http/http-management/controllers/CFAssociationsManagementController.ts
index bb4ce65..caf6b55 100644
--- a/apps/opencase/src/interfaces/http/http-management/controllers/CFAssociationsManagementController.ts
+++ b/apps/opencase/src/interfaces/http/http-management/controllers/CFAssociationsManagementController.ts
@@ -35,6 +35,9 @@ export class CFAssociationsManagementController {
       if (error.message?.includes('not found')) {
         return res.status(404).json({ error: error.message })
       }
+      if (error.name === 'ReadOnlyDocumentError' || error.message?.includes('read-only')) {
+        return res.status(403).json({ error: error.message })
+      }
       if (error.message?.includes('Schema validation failed')) {
         return res.status(400).json({
           error: 'validation_failed',
@@ -69,6 +72,9 @@ export class CFAssociationsManagementController {
       if (error.message?.includes('not found')) {
         return res.status(404).json({ error: error.message })
       }
+      if (error.name === 'ReadOnlyDocumentError' || error.message?.includes('read-only')) {
+        return res.status(403).json({ error: error.message })
+      }
       return res.status(400).json({ error: error.message || 'Delete failed' })
     }
   }
diff --git a/apps/opencase/src/interfaces/http/http-management/controllers/CFDocumentsManagementController.ts b/apps/opencase/src/interfaces/http/http-management/controllers/CFDocumentsManagementController.ts
index 99c14da..256e480 100644
--- a/apps/opencase/src/interfaces/http/http-management/controllers/CFDocumentsManagementController.ts
+++ b/apps/opencase/src/interfaces/http/http-management/controllers/CFDocumentsManagementController.ts
@@ -36,6 +36,9 @@ export class CFDocumentsManagementController {
       if (error.message?.includes('not found')) {
         return res.status(404).json({ error: error.message })
       }
+      if (error.name === 'ReadOnlyDocumentError' || error.message?.includes('read-only')) {
+        return res.status(403).json({ error: error.message })
+      }
       if (error.message?.includes('Schema validation failed')) {
         return res.status(400).json({
           error: 'validation_failed',
@@ -75,6 +78,9 @@ export class CFDocumentsManagementController {
       if (error.message?.includes('not found')) {
         return res.status(404).json({ error: error.message })
       }
+      if (error.name === 'ReadOnlyDocumentError' || error.message?.includes('read-only')) {
+        return res.status(403).json({ error: error.message })
+      }
       return res.status(400).json({ error: error.message || 'Delete failed' })
     }
   }
diff --git a/apps/opencase/src/interfaces/http/http-management/controllers/CFItemsManagementController.ts b/apps/opencase/src/interfaces/http/http-management/controllers/CFItemsManagementController.ts
index afa5de2..e20bad4 100644
--- a/apps/opencase/src/interfaces/http/http-management/controllers/CFItemsManagementController.ts
+++ b/apps/opencase/src/interfaces/http/http-management/controllers/CFItemsManagementController.ts
@@ -36,6 +36,9 @@ export class CFItemsManagementController {
       if (error.message?.includes('not found')) {
         return res.status(404).json({ error: error.message })
       }
+      if (error.name === 'ReadOnlyDocumentError' || error.message?.includes('read-only')) {
+        return res.status(403).json({ error: error.message })
+      }
       if (error.message?.includes('Schema validation failed')) {
         return res.status(400).json({
           error: 'validation_failed',
@@ -70,6 +73,9 @@ export class CFItemsManagementController {
       if (error.message?.includes('not found')) {
         return res.status(404).json({ error: error.message })
       }
+      if (error.name === 'ReadOnlyDocumentError' || error.message?.includes('read-only')) {
+        return res.status(403).json({ error: error.message })
+      }
       return res.status(400).json({ error: error.message || 'Delete failed' })
     }
   }
diff --git a/apps/opencase/src/interfaces/http/http-management/controllers/CFPackagesManagementController.ts b/apps/opencase/src/interfaces/http/http-management/controllers/CFPackagesManagementController.ts
index b8b150c..96f719f 100644
--- a/apps/opencase/src/interfaces/http/http-management/controllers/CFPackagesManagementController.ts
+++ b/apps/opencase/src/interfaces/http/http-management/controllers/CFPackagesManagementController.ts
@@ -7,6 +7,7 @@ import { type RestoreFramework } from '../../../../application/case/endpoints/Re
 import { type ListFrameworks } from '../../../../application/case/endpoints/ListFrameworks'
 import { getParam } from '../../utils/expressParams'
 import { getCaseVersion } from '../../utils/caseVersion'
+import { requireMatchingTenant } from '../../middleware/tenantAccess'
 
 export class CFPackagesManagementController {
   constructor (
@@ -19,15 +20,13 @@ export class CFPackagesManagementController {
 
   list: RequestHandler<{ tenantId: string }> = async (req: Request, res: Response) => {
     try {
-      const tenantId = (req as any).tenantId ?? req.params.tenantId
-      const urlTenantId = getParam(req, 'tenantId')
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
       // For GET endpoints, `caseVersion` remains a filter param (no override needed).
       const caseVersion = getCaseVersion(req)
 
-      if (urlTenantId && urlTenantId !== tenantId) {
-        return res.status(403).json({ error: 'Tenant mismatch - authenticated tenant does not match URL parameter' })
-      }
-
+      // Extract includeArchived query parameter (default: false)
       const includeArchived = req.query.includeArchived === 'true'
       const frameworkType = typeof req.query.frameworkType === 'string' ? req.query.frameworkType : undefined
       const participantId = typeof req.query.participantId === 'string' ? req.query.participantId : undefined
@@ -47,12 +46,11 @@ export class CFPackagesManagementController {
   }
 
   create: RequestHandler<{ tenantId: string }> = async (req: Request, res: Response) => {
-    const tenantId = getParam(req, 'tenantId')
+    const tenantId = requireMatchingTenant(req, res)
+    if (!tenantId) return
     const caseVersion = getCaseVersion(req, { default: '1.1' })!
 
     try {
-      if (!tenantId) return res.status(400).json({ error: 'Missing tenantId' })
-      
       if (!req.body.CFDocument) {
         return res.status(400).json({ 
           error: 'missing_required_field',
@@ -86,7 +84,8 @@ export class CFPackagesManagementController {
   }
 
   import: RequestHandler<{ tenantId: string }> = async (req: Request, res: Response) => {
-    const tenantId = getParam(req, 'tenantId')
+    const tenantId = requireMatchingTenant(req, res)
+    if (!tenantId) return
     const caseVersion = getCaseVersion(req, { default: '1.1' })!
     const { endpointUrl, accessToken, cfPackage, validateSchema, schemaName } = req.body
 
@@ -95,7 +94,6 @@ export class CFPackagesManagementController {
     }
 
     try {
-      if (!tenantId) return res.status(400).json({ error: 'Missing tenantId' })
       const result = await this.importFramework.execute({
         tenantId,
         caseVersion,
@@ -122,14 +120,11 @@ export class CFPackagesManagementController {
 
   delete: RequestHandler<{ tenantId: string, id: string }> = async (req: Request, res: Response) => {
     try {
-      const tenantId = (req as any).tenantId ?? req.params.tenantId
-      const urlTenantId = getParam(req, 'tenantId')
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
       const id = getParam(req, 'id')
       const caseVersion = getCaseVersion(req, { default: '1.1' })!
 
-      if (urlTenantId && urlTenantId !== tenantId) {
-        return res.status(403).json({ error: 'Tenant mismatch - authenticated tenant does not match URL parameter' })
-      }
       if (!id) return res.status(400).json({ error: 'Missing id' })
 
       // Extract hardDelete query parameter (default: false = soft delete/archive)
@@ -153,14 +148,11 @@ export class CFPackagesManagementController {
 
   restore: RequestHandler<{ tenantId: string, id: string }> = async (req: Request, res: Response) => {
     try {
-      const tenantId = (req as any).tenantId ?? req.params.tenantId
-      const urlTenantId = getParam(req, 'tenantId')
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
       const id = getParam(req, 'id')
       const caseVersion = getCaseVersion(req, { default: '1.1' })!
 
-      if (urlTenantId && urlTenantId !== tenantId) {
-        return res.status(403).json({ error: 'Tenant mismatch - authenticated tenant does not match URL parameter' })
-      }
       if (!id) return res.status(400).json({ error: 'Missing id' })
 
       await this.restoreFrameworkUseCase.execute({
diff --git a/apps/opencase/src/interfaces/http/http-management/controllers/CgeManagementController.ts b/apps/opencase/src/interfaces/http/http-management/controllers/CgeManagementController.ts
new file mode 100644
index 0000000..c4ed3fc
--- /dev/null
+++ b/apps/opencase/src/interfaces/http/http-management/controllers/CgeManagementController.ts
@@ -0,0 +1,362 @@
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+import type { Request, Response, RequestHandler } from 'express'
+import type { FileCgeCredentialsStore } from '../../../../infrastructure/cge/FileCgeCredentialsStore'
+import type { CgeApiClient } from '../../../../infrastructure/cge/CgeApiClient'
+import type { ImportFramework } from '../../../../application/case/endpoints/ImportFramework'
+import type { ImportCgeCachedFramework } from '../../../../application/cge/endpoints/ImportCgeCachedFramework'
+import type { SearchCachedFrameworkItems } from '../../../../application/cge/endpoints/SearchCachedFrameworkItems'
+import { requireMatchingTenant } from '../../middleware/tenantAccess'
+import { getParam } from '../../utils/expressParams'
+import { getCaseVersion } from '../../utils/caseVersion'
+import { resolveCgeOpenIdDiscovery } from '../../../../infrastructure/cge/resolveCgeOpenIdDiscovery'
+import { logger } from '../../../../infrastructure/logging/Logger'
+
+export class CgeManagementController {
+  constructor (
+    private readonly credentialsStore: FileCgeCredentialsStore,
+    private readonly cgeApi: CgeApiClient,
+    private readonly importFramework: ImportFramework,
+    private readonly importCgeCachedFramework: ImportCgeCachedFramework,
+    private readonly searchCachedFrameworkItems: SearchCachedFrameworkItems
+  ) {}
+
+  getCredentials: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+      const pub = await this.credentialsStore.getPublic(tenantId)
+      return res.status(200).json(pub)
+    } catch (error: any) {
+      return res.status(400).json({ error: error?.message || 'Failed to get credentials' })
+    }
+  }
+
+  putCredentials: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const clientId = typeof req.body?.clientId === 'string' ? req.body.clientId.trim() : ''
+      const clientSecret = typeof req.body?.clientSecret === 'string' ? req.body.clientSecret : ''
+      const discoveryInput = typeof req.body?.discoveryUrl === 'string' ? req.body.discoveryUrl.trim() : ''
+      if (!clientId || !discoveryInput) {
+        return res.status(400).json({
+          error: 'clientId and discoveryUrl are required'
+        })
+      }
+
+      const resolved = await resolveCgeOpenIdDiscovery(discoveryInput)
+
+      const pub = await this.credentialsStore.put(tenantId, {
+        clientId,
+        clientSecret,
+        discoveryUrl: resolved.discoveryUrl,
+        apiBaseUrl: resolved.apiBaseUrl,
+        tokenUrl: resolved.tokenUrl
+      })
+      logger.info({ tenantId, sub: (req as any).user?.sub }, 'CGE credentials updated')
+      return res.status(200).json(pub)
+    } catch (error: any) {
+      return res.status(400).json({ error: error?.message || 'Failed to store credentials' })
+    }
+  }
+
+  deleteCredentials: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+      await this.credentialsStore.delete(tenantId)
+      logger.info({ tenantId, sub: (req as any).user?.sub }, 'CGE credentials deleted')
+      return res.status(200).json({ status: 'deleted' })
+    } catch (error: any) {
+      return res.status(400).json({ error: error?.message || 'Failed to delete credentials' })
+    }
+  }
+
+  testCredentials: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+      const result = await this.cgeApi.testCredentials(tenantId)
+      return res.status(result.ok ? 200 : 400).json(result)
+    } catch (error: any) {
+      return res.status(400).json({ ok: false, message: error?.message || 'Test failed' })
+    }
+  }
+
+  listFrameworks: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const query: Record<string, string> = {}
+      for (const [k, v] of Object.entries(req.query)) {
+        if (typeof v === 'string') query[k] = v
+      }
+
+      const data = await this.cgeApi.listFrameworks(tenantId, query)
+      logger.info({
+        tenantId,
+        sub: (req as any).user?.sub,
+        email: (req as any).user?.email
+      }, 'CGE frameworks search')
+      return res.status(200).json(data)
+    } catch (error: any) {
+      const status = error?.status === 401 ? 502 : 400
+      return res.status(status).json({ error: error?.message || 'CGE list failed' })
+    }
+  }
+
+  getFramework: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+      const frameworkId = getParam(req, 'frameworkId')
+      if (!frameworkId) return res.status(400).json({ error: 'Missing frameworkId' })
+
+      try {
+        const data = await this.cgeApi.getFrameworkRegistryEntry(tenantId, frameworkId)
+        return res.status(200).json(data)
+      } catch (registryErr: any) {
+        if (registryErr?.status !== 404) throw registryErr
+        const resolved = await this.cgeApi.resolveFramework(tenantId, frameworkId)
+        return res.status(200).json(resolved.detail)
+      }
+    } catch (error: any) {
+      const status = error?.message?.includes('not found') ? 404 : 400
+      return res.status(status).json({ error: error?.message || 'CGE get failed' })
+    }
+  }
+
+  listSubscriptions: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const query: Record<string, string> = {}
+      for (const [k, v] of Object.entries(req.query)) {
+        if (typeof v === 'string') query[k] = v
+      }
+
+      const data = await this.cgeApi.listSubscriptions(tenantId, query)
+      return res.status(200).json(data)
+    } catch (error: any) {
+      const status = error?.status === 401 ? 502 : 400
+      return res.status(status).json({ error: error?.message || 'CGE subscriptions list failed' })
+    }
+  }
+
+  createSubscription: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const data = await this.cgeApi.createSubscription(tenantId, req.body ?? {})
+      logger.info({
+        tenantId,
+        sub: (req as any).user?.sub,
+        body: req.body
+      }, 'CGE subscription created')
+      return res.status(201).json(data ?? { status: 'created' })
+    } catch (error: any) {
+      return res.status(400).json({ error: error?.message || 'CGE subscribe failed' })
+    }
+  }
+
+  /**
+   * Import from CGE — supports two modes:
+   * - readOnly: true (default for editor cache) — cached reference, not editable
+   * - readOnly: false — full editable import (fork from remote publisher)
+   */
+  importFromCge: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const frameworkId = typeof req.body?.frameworkId === 'string' ? req.body.frameworkId.trim() : ''
+      const sourceUri = typeof req.body?.sourceUri === 'string' ? req.body.sourceUri.trim() : ''
+      const registryId = typeof req.body?.registryId === 'string' ? req.body.registryId.trim() : undefined
+      const subscribe = req.body?.subscribe !== false
+      const readOnly = req.body?.readOnly === true || req.body?.readOnly === 'true'
+      const refresh = req.body?.refresh === true
+      const caseVersion = (req.body?.caseVersion === '1.0' ? '1.0' : '1.1') as '1.0' | '1.1'
+      const linkedFromDocId = typeof req.body?.linkedFromDocId === 'string' ? req.body.linkedFromDocId.trim() : undefined
+      const skipPublisherAuth = req.body?.skipPublisherAuth === true || req.body?.skipPublisherAuth === 'true'
+
+      if (!frameworkId && !sourceUri) {
+        return res.status(400).json({
+          error: 'frameworkId or sourceUri is required'
+        })
+      }
+
+      // Read-only cache path (editor remote framework associations)
+      if (readOnly && frameworkId) {
+        const result = await this.importCgeCachedFramework.execute({
+          tenantId,
+          caseVersion,
+          frameworkId,
+          sourceUri: sourceUri || undefined,
+          registryId,
+          subscribe,
+          refresh,
+          linkedFromDocId,
+          validateSchema: req.body?.validateSchema ?? false,
+          skipPublisherAuth
+        })
+
+        logger.info({
+          tenantId,
+          sub: (req as any).user?.sub,
+          frameworkId,
+          docId: result.docId,
+          fromCache: result.fromCache
+        }, 'CGE framework cached (read-only)')
+
+        return res.status(result.fromCache ? 200 : 201).json({
+          status: result.fromCache ? 'cached' : 'imported',
+          id: result.docId,
+          docId: result.docId,
+          version: result.version,
+          cgeFrameworkId: result.cgeFrameworkId,
+          title: result.title,
+          sourceUri: result.sourceUri,
+          itemCount: result.itemCount,
+          cachedAt: result.cachedAt,
+          readOnly: true,
+          fromCache: result.fromCache
+        })
+      }
+
+      // Editable import path (fork from remote — preserves existing ImportFramework behaviour)
+      let endpointUrl = sourceUri
+
+      if (frameworkId) {
+        const resolved = await this.cgeApi.resolveFramework(tenantId, frameworkId, sourceUri, registryId)
+        endpointUrl = resolved.sourceUri
+      }
+
+      if (!endpointUrl) {
+        return res.status(400).json({
+          error: 'sourceUri or frameworkId with a resolvable publisher URI is required'
+        })
+      }
+
+      if (subscribe && frameworkId) {
+        try {
+          await this.cgeApi.createSubscription(tenantId, {
+            frameworkId,
+            ...(req.body?.subscription ?? {})
+          })
+        } catch (subErr: any) {
+          logger.warn({ tenantId, frameworkId, error: subErr?.message }, 'CGE subscribe during import (continuing)')
+        }
+      }
+
+      const cfPackage = await this.cgeApi.fetchPublisherPackage(tenantId, endpointUrl)
+      const result = await this.importFramework.execute({
+        tenantId,
+        caseVersion,
+        cfPackage,
+        validateSchema: req.body?.validateSchema ?? false
+        // No documentFlags — editable import
+      })
+
+      logger.info({
+        tenantId,
+        sub: (req as any).user?.sub,
+        email: (req as any).user?.email,
+        frameworkId: frameworkId || undefined,
+        docId: result.docId
+      }, 'CGE framework imported (editable)')
+
+      return res.status(201).json({
+        status: 'imported',
+        id: result.docId,
+        docId: result.docId,
+        version: result.version,
+        sourceUri: endpointUrl,
+        frameworkId: frameworkId || undefined,
+        readOnly: false
+      })
+    } catch (error: any) {
+      const failedTenantId = typeof (req as any).tenantId === 'string' ? (req as any).tenantId : getParam(req, 'tenantId')
+      logger.warn({
+        tenantId: failedTenantId,
+        frameworkId: typeof req.body?.frameworkId === 'string' ? req.body.frameworkId : undefined,
+        readOnly: req.body?.readOnly === true || req.body?.readOnly === 'true',
+        error: error?.message,
+        status: error?.status
+      }, 'CGE import failed')
+
+      let status = 400
+      if (error?.status === 401 || error?.status === 403) status = 502
+      else if (error?.message?.includes('not found')) status = 404
+      else if (error?.message?.includes('not configured')) status = 400
+
+      return res.status(status).json({ error: 'cge_import_failed', message: error?.message ?? 'Import failed' })
+    }
+  }
+
+  refreshCachedFramework: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const frameworkId = getParam(req, 'frameworkId')
+      if (!frameworkId) return res.status(400).json({ error: 'Missing frameworkId' })
+
+      const caseVersion = getCaseVersion(req, { default: '1.1' })!
+      const skipPublisherAuth = req.body?.skipPublisherAuth === true || req.body?.skipPublisherAuth === 'true'
+
+      const result = await this.importCgeCachedFramework.execute({
+        tenantId,
+        caseVersion,
+        frameworkId,
+        refresh: true,
+        subscribe: false,
+        skipPublisherAuth
+      })
+
+      return res.status(200).json({
+        status: 'refreshed',
+        id: result.docId,
+        docId: result.docId,
+        cgeFrameworkId: result.cgeFrameworkId,
+        title: result.title,
+        sourceUri: result.sourceUri,
+        itemCount: result.itemCount,
+        cachedAt: result.cachedAt
+      })
+    } catch (error: any) {
+      return res.status(400).json({ error: error?.message || 'Refresh failed' })
+    }
+  }
+
+  searchCachedItems: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const docId = getParam(req, 'docId')
+      if (!docId) return res.status(400).json({ error: 'Missing docId' })
+
+      const caseVersion = getCaseVersion(req, { default: '1.1' })!
+      const q = typeof req.query.q === 'string' ? req.query.q : ''
+      const limitRaw = typeof req.query.limit === 'string' ? parseInt(req.query.limit, 10) : 50
+      const limit = Number.isFinite(limitRaw) ? Math.min(Math.max(limitRaw, 1), 200) : 50
+
+      const result = await this.searchCachedFrameworkItems.execute({
+        tenantId,
+        caseVersion,
+        docId,
+        q,
+        limit
+      })
+
+      return res.status(200).json(result)
+    } catch (error: any) {
+      const status = error?.message?.includes('not found') ? 404 : 400
+      return res.status(status).json({ error: error?.message || 'Search failed' })
+    }
+  }
+}
diff --git a/apps/opencase/src/interfaces/http/http-management/controllers/MembersManagementController.ts b/apps/opencase/src/interfaces/http/http-management/controllers/MembersManagementController.ts
new file mode 100644
index 0000000..79445a9
--- /dev/null
+++ b/apps/opencase/src/interfaces/http/http-management/controllers/MembersManagementController.ts
@@ -0,0 +1,234 @@
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+import type { Request, Response, RequestHandler } from 'express'
+import { randomBytes } from 'node:crypto'
+import type { KeycloakAdminClient } from '../../../../infrastructure/keycloak/KeycloakAdminClient'
+import { OidcJwtVerifier } from '../../../../infrastructure/auth/OidcJwtVerifier'
+import { requireMatchingTenant } from '../../middleware/tenantAccess'
+import { getParam } from '../../utils/expressParams'
+import {
+  isManagedMembershipRole,
+  isMemberRole,
+  keycloakRolesForMemberRole,
+  memberRoleFromScopes,
+  TENANT_MEMBERSHIP_ROLES,
+  type MemberRole
+} from '../../../../domain/user/memberRoles'
+import { logger } from '../../../../infrastructure/logging/Logger'
+
+/**
+ * Tenant member management via Keycloak client roles.
+ * Keycloak remains the source of truth for membership.
+ *
+ * Roles visible in Keycloak Admin Console (Clients → tenant-{id} → Roles):
+ *   viewer, author, admin  (composites of case.read / case.write / case.owner)
+ */
+export class MembersManagementController {
+  constructor (
+    private readonly admin: KeycloakAdminClient,
+    private readonly cfg: {
+      clientIdPrefix: string
+      /** Access-token claim carrying Auth0 org id (default org_id). */
+      ssoOrgClaim: string
+    }
+  ) {}
+
+  private async resolveTenantClient (tenantId: string): Promise<{ id: string, clientId: string } | null> {
+    const clientId = OidcJwtVerifier.computeTenantClientId(this.cfg.clientIdPrefix, tenantId)
+    return await this.admin.findClientByClientIdPublic(clientId)
+  }
+
+  list: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const client = await this.resolveTenantClient(tenantId)
+      if (!client) return res.status(404).json({ error: 'Tenant client not found' })
+
+      await this.admin.ensureTenantMemberRoles(client.id)
+
+      const users = await this.admin.listUsersWithClientRoles(client.id, [...TENANT_MEMBERSHIP_ROLES])
+      const members = users.map(u => ({
+        userId: u.id,
+        email: u.email ?? null,
+        username: u.username ?? null,
+        role: memberRoleFromScopes(u.roles),
+        scopes: u.roles.filter(isManagedMembershipRole)
+      }))
+
+      return res.status(200).json({ members })
+    } catch (error: any) {
+      logger.error({ error: error?.message }, 'Failed to list members')
+      return res.status(400).json({ error: error?.message || 'Failed to list members' })
+    }
+  }
+
+  create: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const email = typeof req.body?.email === 'string' ? req.body.email.trim() : ''
+      const role = req.body?.role as MemberRole
+      if (!email) return res.status(400).json({ error: 'email is required' })
+      if (!isMemberRole(role)) {
+        return res.status(400).json({ error: 'role must be one of: viewer, author, admin' })
+      }
+
+      const client = await this.resolveTenantClient(tenantId)
+      if (!client) return res.status(404).json({ error: 'Tenant client not found' })
+
+      const { id: userId, created } = await this.admin.ensureUser({
+        username: email,
+        email,
+        enabled: true
+      })
+
+      let temporaryPassword: string | null = null
+      if (created) {
+        temporaryPassword = randomBytes(12).toString('base64url')
+        // temporary=true forces UPDATE_PASSWORD on next Keycloak login
+        await this.admin.setUserPassword(userId, temporaryPassword, true)
+      }
+
+      const roles = keycloakRolesForMemberRole(role)
+      await this.admin.setMemberRole(userId, client.id, roles)
+
+      return res.status(201).json({
+        userId,
+        email,
+        role,
+        scopes: roles,
+        temporaryPassword,
+        mustChangePassword: temporaryPassword !== null,
+        created
+      })
+    } catch (error: any) {
+      logger.error({ error: error?.message }, 'Failed to create member')
+      return res.status(400).json({ error: error?.message || 'Failed to create member' })
+    }
+  }
+
+  update: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const userId = getParam(req, 'userId')
+      if (!userId) return res.status(400).json({ error: 'Missing userId' })
+
+      const role = req.body?.role as MemberRole
+      if (!isMemberRole(role)) {
+        return res.status(400).json({ error: 'role must be one of: viewer, author, admin' })
+      }
+
+      const client = await this.resolveTenantClient(tenantId)
+      if (!client) return res.status(404).json({ error: 'Tenant client not found' })
+
+      const user = await this.admin.getUserById(userId)
+      if (!user) return res.status(404).json({ error: 'User not found' })
+
+      const roles = keycloakRolesForMemberRole(role)
+      await this.admin.setMemberRole(userId, client.id, roles)
+
+      return res.status(200).json({
+        userId,
+        email: user.email ?? null,
+        role,
+        scopes: roles
+      })
+    } catch (error: any) {
+      logger.error({ error: error?.message }, 'Failed to update member')
+      return res.status(400).json({ error: error?.message || 'Failed to update member' })
+    }
+  }
+
+  remove: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const userId = getParam(req, 'userId')
+      if (!userId) return res.status(400).json({ error: 'Missing userId' })
+
+      const client = await this.resolveTenantClient(tenantId)
+      if (!client) return res.status(404).json({ error: 'Tenant client not found' })
+
+      const current = await this.admin.getUserClientRoleMappings(userId, client.id)
+      const currentNames = current.map((r: any) => r?.name as string).filter(Boolean)
+      const toRemove = currentNames.filter(isManagedMembershipRole)
+      if (toRemove.length > 0) {
+        await this.admin.removeClientRoles(userId, client.id, toRemove)
+      }
+
+      return res.status(200).json({ status: 'removed', userId })
+    } catch (error: any) {
+      logger.error({ error: error?.message }, 'Failed to remove member')
+      return res.status(400).json({ error: error?.message || 'Failed to remove member' })
+    }
+  }
+
+  /**
+   * SSO first-login: assign default author roles when org claim matches tenant
+   * and the user has no tenant client roles yet.
+   */
+  ensureSelf: RequestHandler = async (req: Request, res: Response) => {
+    try {
+      const tenantId = requireMatchingTenant(req, res)
+      if (!tenantId) return
+
+      const user = (req as any).user as Record<string, unknown> | undefined
+      const claimName = this.cfg.ssoOrgClaim
+      const orgClaim = user?.[claimName]
+      const orgId = typeof orgClaim === 'string'
+        ? orgClaim
+        : Array.isArray(orgClaim)
+          ? String(orgClaim[0] ?? '')
+          : ''
+
+      if (!orgId || orgId !== tenantId) {
+        return res.status(403).json({
+          error: 'Forbidden',
+          message: `Access token claim '${claimName}' must match tenantId for ensure-self`
+        })
+      }
+
+      const sub = typeof user?.sub === 'string' ? user.sub : undefined
+      if (!sub) return res.status(401).json({ error: 'Unauthorized - missing sub' })
+
+      const client = await this.resolveTenantClient(tenantId)
+      if (!client) return res.status(404).json({ error: 'Tenant client not found' })
+
+      await this.admin.ensureTenantMemberRoles(client.id)
+
+      const current = await this.admin.getUserClientRoleMappings(sub, client.id)
+      const currentNames = current.map((r: any) => r?.name as string).filter(Boolean)
+      const existingRole = memberRoleFromScopes(currentNames)
+      if (existingRole) {
+        return res.status(200).json({
+          status: 'unchanged',
+          userId: sub,
+          role: existingRole,
+          scopes: currentNames.filter(isManagedMembershipRole)
+        })
+      }
+
+      const role: MemberRole = 'author'
+      const roles = keycloakRolesForMemberRole(role)
+      await this.admin.setMemberRole(sub, client.id, roles)
+
+      logger.info({ tenantId, userId: sub }, 'SSO ensure-self assigned default author roles')
+
+      return res.status(200).json({
+        status: 'assigned',
+        userId: sub,
+        role,
+        scopes: roles,
+        note: 'Re-authenticate to refresh access token scopes'
+      })
+    } catch (error: any) {
+      logger.error({ error: error?.message }, 'Failed ensure-self membership')
+      return res.status(400).json({ error: error?.message || 'Failed to ensure membership' })
+    }
+  }
+}
diff --git a/apps/opencase/src/interfaces/http/http-management/controllers/__tests__/CFPackagesManagementController.test.ts b/apps/opencase/src/interfaces/http/http-management/controllers/__tests__/CFPackagesManagementController.test.ts
index f6b0a7c..154a5c5 100644
--- a/apps/opencase/src/interfaces/http/http-management/controllers/__tests__/CFPackagesManagementController.test.ts
+++ b/apps/opencase/src/interfaces/http/http-management/controllers/__tests__/CFPackagesManagementController.test.ts
@@ -117,6 +117,17 @@ describe('CFPackagesManagementController', () => {
     expect(responseJson).toHaveBeenCalledWith({ status: 'archived', id: 'doc-1' })
   })
 
+  it('rejects create when JWT tenant does not match URL', async () => {
+    ;(mockRequest as any).tenantId = 'other-tenant'
+    mockRequest.params = { tenantId: 'test-tenant' } as any
+    mockRequest.body = { CFDocument: { identifier: 'x' } }
+
+    await (controller.create as any)(mockRequest as Request, mockResponse as Response, next)
+
+    expect(responseStatus).toHaveBeenCalledWith(403)
+    expect(mockCreateFramework.execute).not.toHaveBeenCalled()
+  })
+
   it('performs hard delete when hardDelete=true', async () => {
     ;(mockRequest as any).tenantId = 'test-tenant'
     mockRequest.params = { tenantId: 'test-tenant', id: 'doc-1' } as any
@@ -153,6 +164,7 @@ describe('CFPackagesManagementController', () => {
   })
 
   it('imports a framework from an endpointUrl', async () => {
+    ;(mockRequest as any).tenantId = 'test-tenant'
     mockRequest.body = { endpointUrl: 'https://example.org/CFPackages/doc-1' }
     mockImportFramework.execute.mockResolvedValueOnce({ docId: 'doc-1', version: 1 })
 
@@ -172,6 +184,7 @@ describe('CFPackagesManagementController', () => {
   })
 
   it('imports a framework from a pasted cfPackage payload', async () => {
+    ;(mockRequest as any).tenantId = 'test-tenant'
     const cfPackage = { CFDocument: { identifier: 'doc-2' } }
     mockRequest.body = { cfPackage }
     mockImportFramework.execute.mockResolvedValueOnce({ docId: 'doc-2', version: 1 })
@@ -192,6 +205,7 @@ describe('CFPackagesManagementController', () => {
   })
 
   it('rejects import when neither endpointUrl nor cfPackage is provided', async () => {
+    ;(mockRequest as any).tenantId = 'test-tenant'
     mockRequest.body = {}
 
     await (controller.import as any)(mockRequest as Request, mockResponse as Response, next)
diff --git a/apps/opencase/src/interfaces/http/http-management/routes.ts b/apps/opencase/src/interfaces/http/http-management/routes.ts
index 8d7e1a6..2db1bc5 100644
--- a/apps/opencase/src/interfaces/http/http-management/routes.ts
+++ b/apps/opencase/src/interfaces/http/http-management/routes.ts
@@ -5,6 +5,8 @@ import type { CFAssociationsManagementController } from './controllers/CFAssocia
 import type { CFPackagesManagementController } from './controllers/CFPackagesManagementController'
 import type { TenantsManagementController } from './controllers/TenantsManagementController'
 import type { ApiKeysManagementController } from './controllers/ApiKeysManagementController'
+import type { MembersManagementController } from './controllers/MembersManagementController'
+import type { CgeManagementController } from './controllers/CgeManagementController'
 import type { FileFrameworkStore } from '../../../infrastructure/persistence/file/FileFrameworkStore'
 import { requireScope, requireAnyScope } from '../middleware/scope'
 
@@ -33,6 +35,8 @@ export interface ManagementDeps {
   cfPackagesController: CFPackagesManagementController
   tenantsController: TenantsManagementController
   apiKeysController?: ApiKeysManagementController
+  membersController?: MembersManagementController
+  cgeController?: CgeManagementController
   store?: FileFrameworkStore
 }
 
@@ -257,92 +261,113 @@ export function registerManagementRoutes (app: Express, deps: ManagementDeps): v
   // CFPackage list/create/import/delete endpoints (non-CASE extension)
   app.get(
     '/management/tenants/:tenantId/CFPackages',
+    requireScope('case.read'),
     deps.cfPackagesController.list
   )
   app.post(
     '/management/tenants/:tenantId/ims/case/v1p0/CFPackages',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfPackagesController.create as unknown as RequestHandler)
   )
   app.post(
     '/management/tenants/:tenantId/ims/case/v1p1/CFPackages',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfPackagesController.create as unknown as RequestHandler)
   )
   app.post(
     '/management/tenants/:tenantId/ims/case/v1p0/CFPackages/import',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfPackagesController.import as unknown as RequestHandler)
   )
   app.post(
     '/management/tenants/:tenantId/ims/case/v1p1/CFPackages/import',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfPackagesController.import as unknown as RequestHandler)
   )
   // CASE entity management endpoints (explicit version in the path)
   app.put(
     '/management/tenants/:tenantId/ims/case/v1p0/CFDocuments/:id',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfDocumentsController.update as unknown as RequestHandler)
   )
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p0/CFDocuments/:id',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfDocumentsController.delete as unknown as RequestHandler)
   )
   app.put(
     '/management/tenants/:tenantId/ims/case/v1p1/CFDocuments/:id',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfDocumentsController.update as unknown as RequestHandler)
   )
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p1/CFDocuments/:id',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfDocumentsController.delete as unknown as RequestHandler)
   )
 
   app.put(
     '/management/tenants/:tenantId/ims/case/v1p0/CFItems/:id',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfItemsController.update as unknown as RequestHandler)
   )
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p0/CFItems/:id',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfItemsController.delete as unknown as RequestHandler)
   )
   app.put(
     '/management/tenants/:tenantId/ims/case/v1p1/CFItems/:id',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfItemsController.update as unknown as RequestHandler)
   )
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p1/CFItems/:id',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfItemsController.delete as unknown as RequestHandler)
   )
 
   app.put(
     '/management/tenants/:tenantId/ims/case/v1p0/CFAssociations/:id',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfAssociationsController.update as unknown as RequestHandler)
   )
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p0/CFAssociations/:id',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfAssociationsController.delete as unknown as RequestHandler)
   )
   app.put(
     '/management/tenants/:tenantId/ims/case/v1p1/CFAssociations/:id',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfAssociationsController.update as unknown as RequestHandler)
   )
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p1/CFAssociations/:id',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfAssociationsController.delete as unknown as RequestHandler)
   )
 
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p0/CFPackages/:id',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfPackagesController.delete as unknown as RequestHandler)
   )
   app.delete(
     '/management/tenants/:tenantId/ims/case/v1p1/CFPackages/:id',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfPackagesController.delete as unknown as RequestHandler)
   )
 
   // Restore (unarchive) a previously archived framework
   app.post(
     '/management/tenants/:tenantId/ims/case/v1p0/CFPackages/:id/restore',
+    requireScope('case.write'),
     withCaseVersion('1.0', deps.cfPackagesController.restore as unknown as RequestHandler)
   )
   app.post(
     '/management/tenants/:tenantId/ims/case/v1p1/CFPackages/:id/restore',
+    requireScope('case.write'),
     withCaseVersion('1.1', deps.cfPackagesController.restore as unknown as RequestHandler)
   )
 
@@ -362,6 +387,7 @@ export function registerManagementRoutes (app: Express, deps: ManagementDeps): v
   if (deps.store) {
     app.get(
       '/management/tenants/:tenantId/licenses',
+      requireScope('case.read'),
       (req: Request, res: Response) => {
         try {
           const tenantId = (req as any).tenantId ?? req.params.tenantId
@@ -383,6 +409,7 @@ export function registerManagementRoutes (app: Express, deps: ManagementDeps): v
     // for use by the editor's combobox / picker UI.
     app.get(
       '/management/tenants/:tenantId/definitions',
+      requireScope('case.read'),
       (req: Request, res: Response) => {
         try {
           const tenantId = (req as any).tenantId ?? req.params.tenantId
@@ -407,7 +434,7 @@ export function registerManagementRoutes (app: Express, deps: ManagementDeps): v
     )
   }
 
-  // API key management endpoints (require case.owner or case.admin scope)
+  // API key management endpoints (tenant owner or system case.admin)
   if (deps.apiKeysController) {
     app.get(
       '/management/tenants/:tenantId/api-keys',
@@ -426,4 +453,93 @@ export function registerManagementRoutes (app: Express, deps: ManagementDeps): v
     )
   }
 
+  // Member management (Keycloak client roles)
+  if (deps.membersController) {
+    // SSO first-login ensure — authenticated, no case.* scope required (register before :userId)
+    app.post(
+      '/management/tenants/:tenantId/members/ensure-self',
+      deps.membersController.ensureSelf
+    )
+    app.get(
+      '/management/tenants/:tenantId/members',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.membersController.list
+    )
+    app.post(
+      '/management/tenants/:tenantId/members',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.membersController.create
+    )
+    app.patch(
+      '/management/tenants/:tenantId/members/:userId',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.membersController.update
+    )
+    app.delete(
+      '/management/tenants/:tenantId/members/:userId',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.membersController.remove
+    )
+  }
+
+  // CASE Global credentials + proxy APIs
+  if (deps.cgeController) {
+    app.get(
+      '/management/tenants/:tenantId/cge/credentials',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.cgeController.getCredentials
+    )
+    app.put(
+      '/management/tenants/:tenantId/cge/credentials',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.cgeController.putCredentials
+    )
+    app.delete(
+      '/management/tenants/:tenantId/cge/credentials',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.cgeController.deleteCredentials
+    )
+    app.post(
+      '/management/tenants/:tenantId/cge/credentials/test',
+      requireAnyScope('case.owner', 'case.admin'),
+      deps.cgeController.testCredentials
+    )
+
+    app.get(
+      '/management/tenants/:tenantId/cge/frameworks',
+      requireScope('case.write'),
+      deps.cgeController.listFrameworks
+    )
+    app.get(
+      '/management/tenants/:tenantId/cge/frameworks/:frameworkId',
+      requireScope('case.write'),
+      deps.cgeController.getFramework
+    )
+    app.post(
+      '/management/tenants/:tenantId/cge/subscriptions',
+      requireScope('case.write'),
+      deps.cgeController.createSubscription
+    )
+    app.get(
+      '/management/tenants/:tenantId/cge/subscriptions',
+      requireScope('case.write'),
+      deps.cgeController.listSubscriptions
+    )
+    app.post(
+      '/management/tenants/:tenantId/cge/import',
+      requireScope('case.write'),
+      deps.cgeController.importFromCge
+    )
+    app.post(
+      '/management/tenants/:tenantId/cge/frameworks/:frameworkId/refresh',
+      requireScope('case.write'),
+      deps.cgeController.refreshCachedFramework
+    )
+    app.get(
+      '/management/tenants/:tenantId/cge/cache/:docId/items',
+      requireScope('case.write'),
+      deps.cgeController.searchCachedItems
+    )
+  }
+
 }
diff --git a/apps/opencase/src/interfaces/http/http-public/public/controllers/TenantLookupController.ts b/apps/opencase/src/interfaces/http/http-public/public/controllers/TenantLookupController.ts
index a7c467a..395b60a 100644
--- a/apps/opencase/src/interfaces/http/http-public/public/controllers/TenantLookupController.ts
+++ b/apps/opencase/src/interfaces/http/http-public/public/controllers/TenantLookupController.ts
@@ -1,5 +1,6 @@
 import type { Request, Response, RequestHandler } from 'express'
 import type { KeycloakAdminClient } from '../../../../../infrastructure/keycloak/KeycloakAdminClient'
+import { OidcJwtVerifier } from '../../../../../infrastructure/auth/OidcJwtVerifier'
 import { logger } from '../../../../../infrastructure/logging/Logger'
 
 export class TenantLookupController {
@@ -11,10 +12,26 @@ export class TenantLookupController {
   ) {}
 
   lookup: RequestHandler = async (req: Request, res: Response) => {
-    // Anti-enumeration: always 202, regardless of whether the email exists.
+    // Anti-enumeration: always 202, regardless of whether the email/org exists.
     res.status(202)
     res.setHeader('Cache-Control', 'no-store')
 
+    const rawOrgId = (req.query as any)?.orgId as string | string[] | undefined
+    const orgId = (Array.isArray(rawOrgId) ? rawOrgId[0] : rawOrgId)?.trim()
+    if (orgId) {
+      try {
+        const clientId = OidcJwtVerifier.computeTenantClientId(this.cfg.clientIdPrefix, orgId)
+        const client = await this.keycloakAdmin.findClientByClientIdPublic(clientId)
+        if (client) {
+          return res.json({ status: 'accepted', tenantId: orgId })
+        }
+        return res.json({ status: 'accepted' })
+      } catch (error: any) {
+        logger.warn({ error: error?.message, orgId }, 'Tenant lookup by orgId failed')
+        return res.json({ status: 'accepted' })
+      }
+    }
+
     const rawEmail = (req.query as any)?.email as string | string[] | undefined
     const email = (Array.isArray(rawEmail) ? rawEmail[0] : rawEmail)?.trim()
     if (!email) return res.json({ status: 'accepted' })
@@ -63,4 +80,3 @@ export class TenantLookupController {
     return null
   }
 }
-
diff --git a/apps/opencase/src/interfaces/http/http-public/public/controllers/__tests__/TenantLookupController.test.ts b/apps/opencase/src/interfaces/http/http-public/public/controllers/__tests__/TenantLookupController.test.ts
index 237daf6..362264f 100644
--- a/apps/opencase/src/interfaces/http/http-public/public/controllers/__tests__/TenantLookupController.test.ts
+++ b/apps/opencase/src/interfaces/http/http-public/public/controllers/__tests__/TenantLookupController.test.ts
@@ -47,5 +47,34 @@ describe('TenantLookupController', () => {
     expect(res.status).toHaveBeenCalledWith(202)
     expect((res.json as any).mock.calls[0][0]).toEqual({ status: 'accepted', tenantId: 'demo' })
   })
+
+  it('returns 202 with tenantId when orgId matches an existing tenant client', async () => {
+    const keycloakAdmin: any = {
+      findClientByClientIdPublic: jest.fn().mockResolvedValue({ id: 'c1', clientId: 'tenant-acme-org' })
+    }
+    const c = new TenantLookupController(keycloakAdmin, { clientIdPrefix: 'tenant-' })
+    const req = { query: { orgId: 'acme-org' } } as unknown as Request
+    const res = makeRes()
+
+    await c.lookup(req, res, jest.fn() as any)
+
+    expect(res.status).toHaveBeenCalledWith(202)
+    expect((res.json as any).mock.calls[0][0]).toEqual({ status: 'accepted', tenantId: 'acme-org' })
+    expect(keycloakAdmin.findClientByClientIdPublic).toHaveBeenCalledWith('tenant-acme-org')
+  })
+
+  it('returns 202 without tenantId when orgId client does not exist', async () => {
+    const keycloakAdmin: any = {
+      findClientByClientIdPublic: jest.fn().mockResolvedValue(null)
+    }
+    const c = new TenantLookupController(keycloakAdmin, { clientIdPrefix: 'tenant-' })
+    const req = { query: { orgId: 'missing' } } as unknown as Request
+    const res = makeRes()
+
+    await c.lookup(req, res, jest.fn() as any)
+
+    expect(res.status).toHaveBeenCalledWith(202)
+    expect((res.json as any).mock.calls[0][0]).toEqual({ status: 'accepted' })
+  })
 })
 
diff --git a/apps/opencase/src/interfaces/http/http-public/public/routes.ts b/apps/opencase/src/interfaces/http/http-public/public/routes.ts
index ab3d934..2067959 100644
--- a/apps/opencase/src/interfaces/http/http-public/public/routes.ts
+++ b/apps/opencase/src/interfaces/http/http-public/public/routes.ts
@@ -10,14 +10,16 @@ export interface PublicDeps {
  * /public/tenant-lookup:
  *   get:
  *     operationId: publicTenantLookup
- *     summary: Tenant lookup by email (anti-enumeration; always 202)
+ *     summary: Tenant lookup by email or orgId (anti-enumeration; always 202)
  *     description: |
  *       Used by SPAs to discover a tenantId for Keycloak client-per-tenant login.
+ *       Pass either `email` (membership lookup) or `orgId` (tenant client existence; Auth0 org === tenantId).
  *       Always responds with 202 Accepted. The response body may include tenantId if a mapping exists.
  *     tags: [Public]
  *     security: []
  *     parameters:
- *       - { name: email, in: query, required: true, schema: { type: string, format: email } }
+ *       - { name: email, in: query, required: false, schema: { type: string, format: email } }
+ *       - { name: orgId, in: query, required: false, schema: { type: string } }
  *     responses:
  *       202: { description: Accepted }
  */
diff --git a/apps/opencase/src/interfaces/http/middleware/__tests__/scope.test.ts b/apps/opencase/src/interfaces/http/middleware/__tests__/scope.test.ts
index 434c615..4f1d6b2 100644
--- a/apps/opencase/src/interfaces/http/middleware/__tests__/scope.test.ts
+++ b/apps/opencase/src/interfaces/http/middleware/__tests__/scope.test.ts
@@ -1,5 +1,35 @@
 import { Request, Response, NextFunction } from 'express'
-import { requireScope } from '../scope'
+import { requireScope, expandScopes, userHasScope } from '../scope'
+
+describe('expandScopes', () => {
+  it('expands case.owner to include write and read', () => {
+    expect([...expandScopes(['case.owner'])].sort()).toEqual([
+      'case.owner',
+      'case.read',
+      'case.write'
+    ])
+  })
+
+  it('expands admin membership role to case.owner', () => {
+    expect([...expandScopes(['admin'])].sort()).toEqual([
+      'admin',
+      'case.owner',
+      'case.read',
+      'case.write'
+    ])
+  })
+
+  it('expands case.write to include read', () => {
+    expect([...expandScopes(['case.write'])].sort()).toEqual([
+      'case.read',
+      'case.write'
+    ])
+  })
+
+  it('does not expand case.admin into tenant scopes', () => {
+    expect([...expandScopes(['case.admin'])]).toEqual(['case.admin'])
+  })
+})
 
 describe('requireScope', () => {
   let mockRequest: Partial<Request>
@@ -36,6 +66,43 @@ describe('requireScope', () => {
     expect(responseStatus).not.toHaveBeenCalled()
   })
 
+  it('should allow case.owner to satisfy case.write', () => {
+    const middleware = requireScope('case.write')
+    ;(mockRequest as any).user = { scope: 'case.owner' }
+
+    middleware(mockRequest as Request, mockResponse as Response, mockNext)
+
+    expect(mockNext).toHaveBeenCalled()
+  })
+
+  it('should allow admin membership role to satisfy case.owner', () => {
+    const middleware = requireScope('case.owner')
+    ;(mockRequest as any).user = { scope: 'admin' }
+
+    middleware(mockRequest as Request, mockResponse as Response, mockNext)
+
+    expect(mockNext).toHaveBeenCalled()
+  })
+
+  it('should allow case.write to satisfy case.read', () => {
+    const middleware = requireScope('case.read')
+    ;(mockRequest as any).user = { scope: 'case.write' }
+
+    middleware(mockRequest as Request, mockResponse as Response, mockNext)
+
+    expect(mockNext).toHaveBeenCalled()
+  })
+
+  it('should not allow case.write to satisfy case.owner', () => {
+    const middleware = requireScope('case.owner')
+    ;(mockRequest as any).user = { scope: 'case.write' }
+
+    middleware(mockRequest as Request, mockResponse as Response, mockNext)
+
+    expect(responseStatus).toHaveBeenCalledWith(403)
+    expect(mockNext).not.toHaveBeenCalled()
+  })
+
   it('should return 401 when user is not set', () => {
     const middleware = requireScope('case.admin')
     ;(mockRequest as any).user = undefined
@@ -115,17 +182,15 @@ describe('requireScope', () => {
     expect(responseStatus).toHaveBeenCalledWith(403)
     expect(mockNext).not.toHaveBeenCalled()
   })
-})
-
-
-
-
-
-
-
-
-
-
-
-
 
+  it('userHasScope reads resource_access roles', () => {
+    const user = {
+      resource_access: {
+        'tenant-demo': { roles: ['case.write'] }
+      }
+    }
+    expect(userHasScope(user, 'case.read')).toBe(true)
+    expect(userHasScope(user, 'case.write')).toBe(true)
+    expect(userHasScope(user, 'case.owner')).toBe(false)
+  })
+})
diff --git a/apps/opencase/src/interfaces/http/middleware/__tests__/tenantAccess.test.ts b/apps/opencase/src/interfaces/http/middleware/__tests__/tenantAccess.test.ts
new file mode 100644
index 0000000..e17fe04
--- /dev/null
+++ b/apps/opencase/src/interfaces/http/middleware/__tests__/tenantAccess.test.ts
@@ -0,0 +1,27 @@
+import type { Request, Response } from 'express'
+import { requireMatchingTenant } from '../tenantAccess'
+
+describe('requireMatchingTenant', () => {
+  it('returns tenantId when JWT and URL match', () => {
+    const req = {
+      params: { tenantId: 'demo' },
+      tenantId: 'demo'
+    } as any as Request
+    const res = { status: jest.fn().mockReturnThis(), json: jest.fn() } as any as Response
+
+    expect(requireMatchingTenant(req, res)).toBe('demo')
+    expect(res.status).not.toHaveBeenCalled()
+  })
+
+  it('returns 403 on mismatch', () => {
+    const req = {
+      params: { tenantId: 'other' },
+      tenantId: 'demo'
+    } as any as Request
+    const json = jest.fn()
+    const res = { status: jest.fn().mockReturnValue({ json }), json } as any as Response
+
+    expect(requireMatchingTenant(req, res)).toBeNull()
+    expect(res.status).toHaveBeenCalledWith(403)
+  })
+})
diff --git a/apps/opencase/src/interfaces/http/middleware/scope.ts b/apps/opencase/src/interfaces/http/middleware/scope.ts
index 0c915b3..aa405e1 100644
--- a/apps/opencase/src/interfaces/http/middleware/scope.ts
+++ b/apps/opencase/src/interfaces/http/middleware/scope.ts
@@ -1,21 +1,76 @@
 import { Request, Response, NextFunction } from 'express'
 
+/** Hierarchy: membership labels + case.* scopes. case.admin (system) is orthogonal. */
+const SCOPE_IMPLIES: Record<string, string[]> = {
+  admin: ['case.owner', 'case.write', 'case.read'],
+  author: ['case.write', 'case.read'],
+  viewer: ['case.read'],
+  'case.owner': ['case.write', 'case.read'],
+  'case.write': ['case.read'],
+}
+
+export function expandScopes (scopes: string[]): Set<string> {
+  const expanded = new Set(scopes)
+  // Fixed-point expansion so owner → write → read
+  let changed = true
+  while (changed) {
+    changed = false
+    for (const s of [...expanded]) {
+      for (const implied of SCOPE_IMPLIES[s] ?? []) {
+        if (!expanded.has(implied)) {
+          expanded.add(implied)
+          changed = true
+        }
+      }
+    }
+  }
+  return expanded
+}
+
+export function normalizeScopes (user: any): string[] {
+  const raw = user?.scope
+  const scopes: string[] = []
+  if (typeof raw === 'string') {
+    scopes.push(...raw.split(' ').filter(Boolean))
+  } else if (Array.isArray(raw)) {
+    scopes.push(...raw.map(String).filter(Boolean))
+  }
+
+  // Keycloak fallback: accept client/realm roles as scopes
+  const realmRoles = user?.realm_access?.roles
+  if (Array.isArray(realmRoles)) scopes.push(...realmRoles.map(String))
+
+  const resourceAccess = user?.resource_access
+  if (resourceAccess && typeof resourceAccess === 'object') {
+    for (const client of Object.values(resourceAccess as Record<string, any>)) {
+      const roles = client?.roles
+      if (Array.isArray(roles)) scopes.push(...roles.map(String))
+    }
+  }
+
+  return scopes.filter(Boolean)
+}
+
+export function userHasScope (user: any, requiredScope: string): boolean {
+  const expanded = expandScopes(normalizeScopes(user))
+  return expanded.has(requiredScope)
+}
+
 /**
- * Creates middleware that requires a specific scope in the JWT token
+ * Creates middleware that requires a specific scope in the JWT token.
+ * Applies hierarchy: case.owner satisfies case.write and case.read; case.write satisfies case.read.
  */
-export function requireScope(requiredScope: string) {
+export function requireScope (requiredScope: string) {
   return (req: Request, res: Response, next: NextFunction) => {
     const user = (req as any).user
     if (!user) {
       return res.status(401).json({ error: 'Unauthorized - no user information' })
     }
 
-    const scopes = normalizeScopes(user)
-    
-    if (!scopes.includes(requiredScope)) {
-      return res.status(403).json({ 
-        error: 'Forbidden', 
-        message: `Required scope '${requiredScope}' not found in token` 
+    if (!userHasScope(user, requiredScope)) {
+      return res.status(403).json({
+        error: 'Forbidden',
+        message: `Required scope '${requiredScope}' not found in token`
       })
     }
 
@@ -24,52 +79,24 @@ export function requireScope(requiredScope: string) {
 }
 
 /**
- * Creates middleware that requires any of the specified scopes in the JWT token
+ * Creates middleware that requires any of the specified scopes in the JWT token.
  */
-export function requireAnyScope(...requiredScopes: string[]) {
+export function requireAnyScope (...requiredScopes: string[]) {
   return (req: Request, res: Response, next: NextFunction) => {
     const user = (req as any).user
     if (!user) {
       return res.status(401).json({ error: 'Unauthorized - no user information' })
     }
 
-    const scopes = normalizeScopes(user)
-    
-    const hasRequiredScope = requiredScopes.some(scope => scopes.includes(scope))
-    
+    const hasRequiredScope = requiredScopes.some(scope => userHasScope(user, scope))
+
     if (!hasRequiredScope) {
-      return res.status(403).json({ 
-        error: 'Forbidden', 
-        message: `Required scope(s) '${requiredScopes.join(' or ')}' not found in token` 
+      return res.status(403).json({
+        error: 'Forbidden',
+        message: `Required scope(s) '${requiredScopes.join(' or ')}' not found in token`
       })
     }
 
     return next()
   }
 }
-
-function normalizeScopes (user: any): string[] {
-  const raw = user?.scope
-  if (typeof raw === 'string') {
-    return raw.split(' ').filter(Boolean)
-  }
-  if (Array.isArray(raw)) {
-    return raw.map(String).filter(Boolean)
-  }
-
-  // Keycloak fallback: accept client/realm roles as scopes
-  const scopes: string[] = []
-  const realmRoles = user?.realm_access?.roles
-  if (Array.isArray(realmRoles)) scopes.push(...realmRoles.map(String))
-
-  const resourceAccess = user?.resource_access
-  if (resourceAccess && typeof resourceAccess === 'object') {
-    for (const client of Object.values(resourceAccess as Record<string, any>)) {
-      const roles = client?.roles
-      if (Array.isArray(roles)) scopes.push(...roles.map(String))
-    }
-  }
-
-  return scopes.filter(Boolean)
-}
-
diff --git a/apps/opencase/src/interfaces/http/middleware/tenantAccess.ts b/apps/opencase/src/interfaces/http/middleware/tenantAccess.ts
new file mode 100644
index 0000000..221123f
--- /dev/null
+++ b/apps/opencase/src/interfaces/http/middleware/tenantAccess.ts
@@ -0,0 +1,33 @@
+import type { Request, Response } from 'express'
+import { getParam } from '../utils/expressParams'
+
+/**
+ * Validate that the JWT tenantId matches the URL :tenantId path param.
+ * Returns the tenantId on success, or null after writing an error response.
+ */
+export function requireMatchingTenant (
+  req: Request,
+  res: Response
+): string | null {
+  const tokenTenantId = (req as any).tenantId as string | undefined
+  const urlTenantId = getParam(req, 'tenantId')
+
+  if (!urlTenantId) {
+    res.status(400).json({ error: 'Missing tenantId' })
+    return null
+  }
+
+  if (!tokenTenantId) {
+    res.status(401).json({ error: 'Unauthorized - missing tenantId in token' })
+    return null
+  }
+
+  if (urlTenantId !== tokenTenantId) {
+    res.status(403).json({
+      error: 'Tenant mismatch - authenticated tenant does not match URL parameter'
+    })
+    return null
+  }
+
+  return tokenTenantId
+}
diff --git a/apps/opencase/src/interfaces/http/server.ts b/apps/opencase/src/interfaces/http/server.ts
index fbac892..7d6bb05 100644
--- a/apps/opencase/src/interfaces/http/server.ts
+++ b/apps/opencase/src/interfaces/http/server.ts
@@ -84,6 +84,8 @@ export function createServer (container: Container): express.Express {
     cfPackagesController: container.controllers.management.cfPackages,
     tenantsController: container.controllers.management.tenants,
     apiKeysController: container.controllers.management.apiKeys,
+    membersController: container.controllers.management.members,
+    cgeController: container.controllers.management.cge,
     store: container.store,
   })
 
diff --git a/apps/opencase/src/wiring/container.ts b/apps/opencase/src/wiring/container.ts
index f907b2c..841443a 100644
--- a/apps/opencase/src/wiring/container.ts
+++ b/apps/opencase/src/wiring/container.ts
@@ -7,6 +7,8 @@ import { FileFrameworkStore } from '../infrastructure/persistence/file/FileFrame
 import { FileCFPackageRepository } from '../infrastructure/persistence/file/FileCFPackageRepository'
 import { CreateFramework } from '../application/case/endpoints/CreateFramework'
 import { ImportFramework } from '../application/case/endpoints/ImportFramework'
+import { ImportCgeCachedFramework } from '../application/cge/endpoints/ImportCgeCachedFramework'
+import { SearchCachedFrameworkItems } from '../application/cge/endpoints/SearchCachedFrameworkItems'
 import { GetCFPackage } from '../application/case/endpoints/GetCFPackage'
 import { GetCFDocument } from '../application/case/endpoints/GetCFDocument'
 import { GetAllCFDocuments } from '../application/case/endpoints/GetAllCFDocuments'
@@ -58,6 +60,8 @@ import { CFAssociationsManagementController } from '../interfaces/http/http-mana
 import { CFPackagesManagementController } from '../interfaces/http/http-management/controllers/CFPackagesManagementController'
 import { TenantsManagementController } from '../interfaces/http/http-management/controllers/TenantsManagementController'
 import { ApiKeysManagementController } from '../interfaces/http/http-management/controllers/ApiKeysManagementController'
+import { MembersManagementController } from '../interfaces/http/http-management/controllers/MembersManagementController'
+import { CgeManagementController } from '../interfaces/http/http-management/controllers/CgeManagementController'
 import { ListFrameworks } from '../application/case/endpoints/ListFrameworks'
 import { ListTenants } from '../application/case/endpoints/ListTenants'
 import { CreateTenant } from '../application/case/endpoints/CreateTenant'
@@ -66,6 +70,9 @@ import { JsonSchemaValidator } from '../infrastructure/validation/JsonSchemaVali
 import { KeycloakAdminClient } from '../infrastructure/keycloak/KeycloakAdminClient'
 import { KeycloakTenantProvisioner } from '../infrastructure/keycloak/KeycloakTenantProvisioner'
 import { TenantLookupController } from '../interfaces/http/http-public/public/controllers/TenantLookupController'
+import { FileCgeCredentialsStore } from '../infrastructure/cge/FileCgeCredentialsStore'
+import { CgeAuthClient } from '../infrastructure/cge/CgeAuthClient'
+import { CgeApiClient } from '../infrastructure/cge/CgeApiClient'
 
 export interface Container {
   config: AppConfig
@@ -111,6 +118,8 @@ export interface Container {
       cfPackages: CFPackagesManagementController
       tenants: TenantsManagementController
       apiKeys: ApiKeysManagementController
+      members: MembersManagementController
+      cge: CgeManagementController
     }
     public: {
       tenantLookup: TenantLookupController
@@ -385,6 +394,30 @@ export async function buildContainer(): Promise<Container> {
     clientIdPrefix: config.oidcClientIdPrefix
   })
 
+  const membersManagementController = new MembersManagementController(keycloakAdmin, {
+    clientIdPrefix: config.oidcClientIdPrefix,
+    ssoOrgClaim: config.ssoOrgClaim
+  })
+
+  const cgeCredentialsStore = new FileCgeCredentialsStore(
+    config.caseDataDir,
+    config.cgeCredentialsEncryptionKey
+  )
+  const cgeAuthClient = new CgeAuthClient()
+  const cgeApiClient = new CgeApiClient(cgeAuthClient, cgeCredentialsStore, {
+    apiBaseUrl: config.cgeApiBaseUrl,
+    tokenUrl: config.cgeTokenUrl
+  })
+  const importCgeCachedFramework = new ImportCgeCachedFramework(cgeApiClient, importFramework, store)
+  const searchCachedFrameworkItems = new SearchCachedFrameworkItems(store)
+  const cgeManagementController = new CgeManagementController(
+    cgeCredentialsStore,
+    cgeApiClient,
+    importFramework,
+    importCgeCachedFramework,
+    searchCachedFrameworkItems
+  )
+
   const tenantLookupController = new TenantLookupController(keycloakAdmin, {
     clientIdPrefix: config.oidcClientIdPrefix
   })
@@ -432,7 +465,9 @@ export async function buildContainer(): Promise<Container> {
         cfAssociations: cfAssociationsManagementController,
         cfPackages: cfPackagesManagementController,
         tenants: tenantsManagementController,
-        apiKeys: apiKeysManagementController
+        apiKeys: apiKeysManagementController,
+        members: membersManagementController,
+        cge: cgeManagementController
       },
       public: {
         tenantLookup: tenantLookupController
diff --git a/apps/opencase/tsconfig.json b/apps/opencase/tsconfig.json
index e2d2933..7e508f4 100644
--- a/apps/opencase/tsconfig.json
+++ b/apps/opencase/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     "target": "ES2022",
-    "module": "CommonJS",
+    "module": "NodeNext",
     "rootDir": "src",
     "outDir": "dist",
     "strict": true,
@@ -9,10 +9,9 @@
     "forceConsistentCasingInFileNames": true,
     "skipLibCheck": true,
     "resolveJsonModule": true,
-    "moduleResolution": "node",
+    "moduleResolution": "NodeNext",
     "types": ["node", "jest"]
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules", "dist"]
 }
-
diff --git a/docker-compose.yml b/docker-compose.yml
index bb48948..5ba6a56 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -34,8 +34,10 @@ services:
       - KC_HTTP_ENABLED=true
       - KC_HEALTH_ENABLED=true
       - KC_METRICS_ENABLED=true
-      # Hostname configuration - tell Keycloak its external URL
-      - KC_HOSTNAME=${OPENCASE_HOSTNAME:-localhost}
+      # Hostname configuration - full public URL (scheme + host + optional port)
+      # Required so login form actions match the browser URL when TLS is terminated
+      # upstream of Traefik (e.g. ngrok https → local http :3000).
+      - KC_HOSTNAME=${OPENCASE_SCHEME:-http}://${OPENCASE_HOSTNAME:-localhost}${OPENCASE_PORT_SUFFIX-:3000}
       - KC_HOSTNAME_STRICT=false
       # Proxy settings for running behind Traefik
       - KC_PROXY_HEADERS=xforwarded
@@ -124,6 +126,11 @@ services:
       - SMTP_PORT=${SMTP_PORT:-1025}
       - SMTP_FROM=noreply@${OPENCASE_HOSTNAME:-opencase.local}
       - KEYCLOAK_SSL_REQUIRED=${KEYCLOAK_SSL_REQUIRED:-none}
+      # SSO org claim + CASE Global
+      - SSO_ORG_CLAIM=${SSO_ORG_CLAIM:-org_id}
+      - CGE_TOKEN_URL=${CGE_TOKEN_URL:-}
+      - CGE_API_BASE_URL=${CGE_API_BASE_URL:-}
+      - CGE_CREDENTIALS_ENCRYPTION_KEY=${CGE_CREDENTIALS_ENCRYPTION_KEY:-}
     restart: on-failure
     volumes:
       - ./apps/opencase/data:/app/data
diff --git a/docs/AUTH0_SSO.md b/docs/AUTH0_SSO.md
index 54aa1c2..bed76c3 100644
--- a/docs/AUTH0_SSO.md
+++ b/docs/AUTH0_SSO.md
@@ -242,7 +242,31 @@ This works well for most setups. If you want to **skip the review page** and cre
 
 ## Step 7 -- Assign Roles to SSO Users
 
-Users who log in via Auth0 are created in Keycloak with no roles by default. To give them access to OpenCASE features, you need to assign roles:
+Users who log in via Auth0 are created in Keycloak with no roles by default.
+
+### Preferred: org → tenant + ensure-self
+
+OpenCASE uses **one Keycloak realm** and **one OAuth client per tenant** (`tenant-{tenantId}`). For multi-org Auth0:
+
+1. Create an OpenCASE tenant whose `tenantId` equals the Auth0 organization id (v1 convention: 1:1).
+2. Users sign in with **Organization ID** on the Editor login screen (not a shared `DEFAULT_TENANT_ID`).
+3. After login, the Editor calls `POST /management/tenants/{tenantId}/members/ensure-self`.
+
+**Claim contract** (configure Auth0 → Keycloak mappers separately):
+
+| Source | Target | Notes |
+|--------|--------|-------|
+| Auth0 organization id | Keycloak user attribute + access token claim `org_id` | Claim name override: env `SSO_ORG_CLAIM` |
+| OpenCASE tenant client mapper | JWT `tenantId` | Hardcoded to the client’s tenant |
+
+`ensure-self` requires `org_id === tenantId`. If the user has no client roles yet, OpenCASE assigns default **author** roles (`case.read` + `case.write`). The user should re-authenticate so the access token includes the new scopes.
+
+Tenant owners can promote members via:
+
+```
+POST /management/tenants/{tenantId}/members
+{ "email": "...", "role": "admin" | "author" | "viewer" }
+```
 
 ### Manual Role Assignment
 
@@ -253,7 +277,7 @@ Users who log in via Auth0 are created in Keycloak with no roles by default. To
 
 ### Automatic Role Assignment (Optional)
 
-To assign a default role to all Auth0 users automatically:
+To assign a default role to all Auth0 users automatically (single-tenant only; prefer ensure-self for multi-org):
 
 1. Go to **Identity providers** > **auth0** > **Mappers** tab
 2. Click **Add mapper**
diff --git a/docs/env.example b/docs/env.example
index 50b69ec..97611c2 100644
--- a/docs/env.example
+++ b/docs/env.example
@@ -75,10 +75,31 @@ SMTP_PORT=1025
 # Single-Tenant Mode (optional)
 # =============================================================================
 
-# Skip the tenant lookup / email screen and sign in directly with this tenant.
-# Leave empty (or remove) to use the standard multi-tenant login flow.
+# Skip the tenant lookup screen and sign in directly with this tenant.
+# Leave empty (or remove) for multi-tenant / multi-org SSO (Organization ID or email login).
+# Do NOT set this for 1EdTech multi-org Auth0 deployments — use org-id login instead.
 DEFAULT_TENANT_ID=
 
+# =============================================================================
+# CASE Global (CGE) integration
+# =============================================================================
+# Configure apiBaseUrl + tokenUrl per tenant through the Editor's CASE Global
+# dialog or PUT /management/tenants/{tenantId}/cge/credentials. The two URL
+# variables below are optional fallbacks for legacy tenant records only.
+
+# OAuth token endpoint for org API keys (client_credentials)
+# CGE_TOKEN_URL=https://cge.example.com/realms/caseglobal/protocol/openid-connect/token
+
+# Coalition API base URL
+# CGE_API_BASE_URL=https://cge.example.com
+
+# Required before storing per-tenant CGE client secrets (AES-256-GCM at rest).
+# Use a stable, long random value; changing it makes existing secrets unreadable.
+# CGE_CREDENTIALS_ENCRYPTION_KEY=change-me-to-a-long-random-secret
+
+# Access-token claim carrying Auth0 org id (must equal OpenCASE tenantId)
+SSO_ORG_CLAIM=org_id
+
 # =============================================================================
 # Advanced (rarely need to change)
 # =============================================================================