(function (root, factory) {
  "use strict";

  let workflow = root && root.MbnOperatorCatalogWorkflow;
  if (!workflow && typeof module === "object" && module.exports) {
    workflow = require("./operator-catalog-workflow.js");
  }
  const api = Object.freeze(factory(workflow));
  if (typeof module === "object" && module.exports) module.exports = api;
  if (root) root.MbnOperatorCatalogUi = api;
})(typeof globalThis === "object" ? globalThis : this, function (workflow) {
  "use strict";

  if (!workflow) throw new Error("MbnOperatorCatalogWorkflow is required.");

  const globalScope = typeof globalThis === "object" ? globalThis : null;
  const fixedRequestIdPattern = /^[A-Za-z0-9_-]{1,128}$/;
  const themeStockCodePattern = /^[A-Za-z0-9]{1,12}$/;
  const expertStockCodePattern = /^[A-Za-z0-9]{1,32}$/;
  const unsafeTextPattern = /[\p{Cc}\p{Cf}\p{Cs}\p{Zl}\p{Zp}\uFFFD]/u;
  const themePrefixes = Object.freeze({
    krx: Object.freeze(["P", "D"]),
    nxt: Object.freeze(["X", "T"])
  });

  function exactOptions(value) {
    if (!value || typeof value !== "object" || Array.isArray(value)) return false;
    const required = ["postNative", "isLocked", "showToast", "addLog", "createId"];
    return required.every(key => typeof value[key] === "function") &&
      (value.requestStockSearch === undefined || typeof value.requestStockSearch === "function");
  }

  function safeText(value, maximumLength) {
    return typeof value === "string" && value.length > 0 && value.length <= maximumLength &&
      value === value.trim() && !unsafeTextPattern.test(value);
  }

  function clone(value) {
    if (value === null || value === undefined) return value;
    return JSON.parse(JSON.stringify(value));
  }

  function createController(options) {
    if (!exactOptions(options)) {
      throw new TypeError("Operator catalog UI requires closed native and operator callbacks.");
    }

    const contract = workflow.bridgeContract;
    const coordinator = workflow.createMutationCoordinator();
    const state = {
      mounted: false,
      open: false,
      entity: "theme",
      mode: "list",
      forcedLocked: false,
      processQuarantined: false,
      schema: null,
      canMutate: { theme: null, expert: null },
      activeRead: null,
      readQueue: [],
      themeQuery: "",
      expertQuery: "",
      nxtSession: "preMarket",
      themeMarketForNew: "krx",
      themeResults: [],
      expertResults: [],
      selectedCatalogIndex: -1,
      edit: null,
      status: "대기",
      error: ""
    };
    let dom = null;

    function nextRequestId(kind) {
      const value = `catalog-${kind}-${String(options.createId())}`;
      if (!fixedRequestIdPattern.test(value)) {
        throw new TypeError("createId returned an unsafe operator-catalog identifier.");
      }
      return value;
    }

    function locked() {
      let external = true;
      try {
        external = options.isLocked() === true;
      } catch {
        external = true;
      }
      return state.forcedLocked || external;
    }

    function quarantined() {
      return state.processQuarantined || coordinator.getState().quarantined;
    }

    function notifyError(message) {
      state.error = message;
      state.status = "차단됨";
      options.showToast(message);
      render();
      return false;
    }

    function latchQuarantine(message) {
      state.processQuarantined = true;
      state.error = message || "DB 쓰기 결과를 확인할 수 없습니다. 앱 재시작 전까지 쓰기를 차단합니다.";
      state.status = "WRITE 잠금";
      options.addLog(`ThemeA/EList WRITE quarantine · ${state.error}`);
    }

    function expectedReadError(entity, operation, requestId) {
      return Object.freeze({ requestId, entity, operation, identityCode: "" });
    }

    function enqueueRead(key, type, request, expectedError) {
      state.readQueue = state.readQueue.filter(item => item.key !== key);
      if (state.activeRead?.key === key) state.activeRead.superseded = true;
      state.readQueue.push({ key, type, request, expectedError, superseded: false });
      pumpReadQueue();
      render();
    }

    function pumpReadQueue() {
      if (state.activeRead || state.readQueue.length === 0) return;
      const pending = state.readQueue.shift();
      state.activeRead = pending;
      state.status = "DB 조회 중";
      state.error = "";
      try {
        options.postNative(pending.type, pending.request);
      } catch {
        state.activeRead = null;
        state.error = "Native Bridge로 DB 조회 요청을 전달하지 못했습니다.";
        state.status = "조회 실패";
        pumpReadQueue();
      }
    }

    function completeRead(pending, apply) {
      if (state.activeRead !== pending) return false;
      if (!pending.superseded) apply();
      state.activeRead = null;
      if (!state.error) state.status = "준비됨";
      pumpReadQueue();
      render();
      return true;
    }

    function requestSchemaPreflight() {
      if (state.schema || state.activeRead?.key === "schema" ||
          state.readQueue.some(item => item.key === "schema")) return;
      const request = workflow.createSchemaPreflightRequest(nextRequestId("schema"));
      enqueueRead(
        "schema",
        contract.requests.schemaPreflight,
        request,
        expectedReadError("catalog", "schemaPreflight", request.requestId));
    }

    function requestCatalogList(query) {
      if (state.entity === "theme") {
        const request = workflow.createThemeCatalogListRequest(
          nextRequestId("theme-list"),
          query ?? state.themeQuery,
          state.nxtSession,
          500);
        state.themeQuery = request.query;
        enqueueRead(
          "catalog-list",
          contract.requests.themeList,
          request,
          expectedReadError("theme", "list", request.requestId));
        return request;
      }
      const request = workflow.createExpertCatalogListRequest(
        nextRequestId("expert-list"),
        query ?? state.expertQuery,
        500);
      state.expertQuery = request.query;
      enqueueRead(
        "catalog-list",
        contract.requests.expertList,
        request,
        expectedReadError("expert", "list", request.requestId));
      return request;
    }

    function normalizeEditContext(context, entity) {
      if (!context || typeof context !== "object" || Array.isArray(context) ||
          Object.keys(context).sort().join("|") !== "preview|selection") {
        throw new TypeError("Editing requires exactly one read-only selection and complete preview.");
      }
      return entity === "theme"
        ? workflow.createThemeEditDraft(context.selection, context.preview)
        : workflow.createExpertEditDraft(context.selection, context.preview);
    }

    function openEntity(entity, context) {
      state.open = true;
      state.entity = entity;
      state.selectedCatalogIndex = -1;
      state.error = "";
      if (context !== undefined && context !== null) {
        state.edit = normalizeEditContext(context, entity);
        state.mode = "edit";
        state.status = "편집 준비";
      } else {
        state.edit = null;
        state.mode = "list";
        state.status = "목록 준비";
      }
      requestSchemaPreflight();
      if (state.mode === "list") requestCatalogList();
      render();
      return snapshot();
    }

    function openTheme(context) {
      return openEntity("theme", context);
    }

    function openExpert(context) {
      return openEntity("expert", context);
    }

    function beginNewTheme(market) {
      if (market !== "krx" && market !== "nxt") return notifyError("KRX 또는 NXT 시장을 선택하세요.");
      if (locked() || quarantined()) return notifyError("현재 ThemeA 쓰기를 시작할 수 없습니다.");
      state.themeMarketForNew = market;
      const request = workflow.createThemeNextCodeRequest(nextRequestId("theme-next"), market);
      enqueueRead(
        "next-code",
        contract.requests.themeNextCode,
        request,
        expectedReadError("theme", "nextCode", request.requestId));
      return true;
    }

    function beginNewExpert() {
      if (locked() || quarantined()) return notifyError("현재 EList 쓰기를 시작할 수 없습니다.");
      const request = workflow.createExpertNextCodeRequest(nextRequestId("expert-next"));
      enqueueRead(
        "next-code",
        contract.requests.expertNextCode,
        request,
        expectedReadError("expert", "nextCode", request.requestId));
      return true;
    }

    function currentDraft() {
      return state.edit?.draft || null;
    }

    function updateDraft(values) {
      const draft = currentDraft();
      if (!draft || !values || typeof values !== "object" || Array.isArray(values)) return false;
      if (state.entity === "theme" && Object.keys(values).every(key => key === "themeTitle") &&
          typeof values.themeTitle === "string") {
        draft.themeTitle = values.themeTitle;
      } else if (state.entity === "expert" &&
          Object.keys(values).every(key => key === "expertName") &&
          typeof values.expertName === "string") {
        draft.expertName = values.expertName;
      } else {
        return false;
      }
      state.error = "";
      render();
      return true;
    }

    function addThemeItem(prefix, stockCode, stockName) {
      const draft = currentDraft();
      const allowed = draft && themePrefixes[draft.market];
      if (!draft || state.entity !== "theme" || !allowed?.includes(prefix) ||
          typeof stockCode !== "string" || !themeStockCodePattern.test(stockCode) ||
          !safeText(stockName, 200) || draft.items.length >= workflow.limits.maximumThemeItems) {
        return notifyError("시장별 prefix와 종목 코드·이름을 정확히 입력하세요.");
      }
      const itemCode = `${prefix}${stockCode}`;
      const candidate = {
        market: draft.market,
        themeCode: draft.themeCode,
        themeTitle: safeText(draft.themeTitle, 128) ? draft.themeTitle : "검증",
        items: [...draft.items, { inputIndex: draft.items.length, itemCode, itemName: stockName }]
      };
      if (!workflow.normalizeThemeDraft(candidate)) {
        return notifyError("중복되거나 허용되지 않은 ThemeA 종목입니다.");
      }
      draft.items.push({ inputIndex: draft.items.length, itemCode, itemName: stockName });
      state.error = "";
      render();
      return true;
    }

    function addExpertRecommendation(stockCode, stockName, buyAmount) {
      const draft = currentDraft();
      const amount = typeof buyAmount === "number" ? buyAmount : Number(buyAmount);
      if (!draft || state.entity !== "expert" ||
          typeof stockCode !== "string" || !expertStockCodePattern.test(stockCode) ||
          !safeText(stockName, 200) || !Number.isSafeInteger(amount) || amount <= 0 ||
          draft.recommendations.length >= workflow.limits.maximumRecommendations) {
        return notifyError("종목 코드·이름과 1 이상의 정수 매수가를 정확히 입력하세요.");
      }
      const candidate = {
        expertCode: draft.expertCode,
        expertName: safeText(draft.expertName, 128) ? draft.expertName : "검증",
        recommendations: [
          ...draft.recommendations,
          {
            playIndex: draft.recommendations.length,
            stockCode,
            stockName,
            buyAmount: amount
          }
        ]
      };
      if (!workflow.normalizeExpertDraft(candidate)) {
        return notifyError("중복되거나 허용되지 않은 EList 추천 종목입니다.");
      }
      draft.recommendations.push({
        playIndex: draft.recommendations.length,
        stockCode,
        stockName,
        buyAmount: amount
      });
      state.error = "";
      render();
      return true;
    }

    function reindexDraftRows(rows, key) {
      rows.forEach((item, index) => { item[key] = index; });
    }

    function moveDraftItem(index, direction) {
      const draft = currentDraft();
      const rows = state.entity === "theme" ? draft?.items : draft?.recommendations;
      const target = index + direction;
      if (!rows || !Number.isInteger(index) || ![-1, 1].includes(direction) ||
          index < 0 || target < 0 || index >= rows.length || target >= rows.length) return false;
      [rows[index], rows[target]] = [rows[target], rows[index]];
      reindexDraftRows(rows, state.entity === "theme" ? "inputIndex" : "playIndex");
      render();
      return true;
    }

    function removeDraftItem(index) {
      const draft = currentDraft();
      const rows = state.entity === "theme" ? draft?.items : draft?.recommendations;
      if (!rows || !Number.isInteger(index) || index < 0 || index >= rows.length) return false;
      rows.splice(index, 1);
      reindexDraftRows(rows, state.entity === "theme" ? "inputIndex" : "playIndex");
      render();
      return true;
    }

    function canWrite() {
      if (locked() || quarantined() || coordinator.getState().active || state.activeRead ||
          state.readQueue.length > 0 || !state.schema) return false;
      return state.entity === "theme"
        ? state.schema.themeCanMutate === true && state.canMutate.theme !== false
        : state.schema.expertCanMutate === true && state.canMutate.expert !== false;
    }

    function sendMutation(type, payload) {
      if (!canWrite()) return notifyError("송출 IDLE 및 schema preflight 완료 후 DB 쓰기를 실행하세요.");
      try {
        coordinator.begin(type, payload);
        options.postNative(type, payload);
        state.status = "DB 반영 확인 중";
        state.error = "";
        options.addLog(`${type} 요청 · 자동 재시도 없음`);
        render();
        return true;
      } catch (error) {
        if (coordinator.getState().active) {
          coordinator.loseCorrelation();
          latchQuarantine("DB 쓰기 요청 전달 여부를 확인할 수 없습니다. 앱을 재시작하세요.");
        }
        return notifyError(error?.message || "DB 쓰기 요청을 만들 수 없습니다.");
      }
    }

    function submit() {
      if (!state.edit || (state.mode !== "new" && state.mode !== "edit")) return false;
      try {
        const id = nextRequestId(`${state.entity}-${state.mode}`);
        if (state.entity === "theme") {
          const request = state.mode === "new"
            ? workflow.createThemeCreateRequest(id, state.edit.draft)
            : workflow.createThemeReplaceRequest(id, state.edit);
          const type = state.mode === "new"
            ? contract.requests.themeCreate
            : contract.requests.themeReplace;
          return sendMutation(type, request);
        }
        const request = state.mode === "new"
          ? workflow.createExpertCreateRequest(id, state.edit.draft)
          : workflow.createExpertReplaceRequest(id, state.edit);
        const type = state.mode === "new"
          ? contract.requests.expertCreate
          : contract.requests.expertReplace;
        return sendMutation(type, request);
      } catch (error) {
        return notifyError(error?.message || "편집 내용을 검증할 수 없습니다.");
      }
    }

    function selectedCatalog() {
      const rows = state.entity === "theme" ? state.themeResults : state.expertResults;
      return rows[state.selectedCatalogIndex] || null;
    }

    function selectCatalog(index) {
      const rows = state.entity === "theme" ? state.themeResults : state.expertResults;
      if (!Number.isInteger(index) || index < 0 || index >= rows.length) return false;
      state.selectedCatalogIndex = index;
      render();
      return true;
    }

    function deleteCurrent() {
      try {
        const id = nextRequestId(`${state.entity}-delete`);
        if (state.entity === "theme") {
          const source = state.mode === "edit"
            ? state.edit?.expectedIdentity
            : selectedCatalog();
          if (!source) return notifyError("삭제할 ThemeA 정의를 선택하세요.");
          const identity = {
            market: source.market,
            session: source.session,
            themeCode: source.themeCode,
            themeTitle: source.themeTitle
          };
          return sendMutation(
            contract.requests.themeDelete,
            workflow.createThemeDeleteRequest(id, identity));
        }
        const source = state.mode === "edit"
          ? state.edit?.expectedIdentity
          : selectedCatalog();
        if (!source) return notifyError("삭제할 EList 정의를 선택하세요.");
        return sendMutation(
          contract.requests.expertDelete,
          workflow.createExpertDeleteRequest(id, {
            expertCode: source.expertCode,
            expertName: source.expertName
          }));
      } catch (error) {
        return notifyError(error?.message || "삭제 요청을 검증할 수 없습니다.");
      }
    }

    function handleSchemaResult(payload) {
      const pending = state.activeRead;
      if (!pending || pending.type !== contract.requests.schemaPreflight ||
          payload?.requestId !== pending.request.requestId) return;
      const result = workflow.normalizeSchemaResult(payload, pending.request);
      if (!result) return failCurrentRead(pending, "schema preflight 응답이 현재 요청과 일치하지 않습니다.");
      completeRead(pending, () => {
        state.schema = result;
        state.canMutate.theme = result.themeCanMutate;
        state.canMutate.expert = result.expertCanMutate;
        if (result.writeQuarantined) latchQuarantine("Native catalog 쓰기가 이미 격리되었습니다.");
      });
    }

    function handleThemeListResult(payload) {
      const pending = state.activeRead;
      if (!pending || pending.type !== contract.requests.themeList ||
          payload?.requestId !== pending.request.requestId) return;
      const result = workflow.normalizeThemeListResult(payload, pending.request);
      if (!result) return failCurrentRead(pending, "ThemeA 목록 응답이 현재 검색과 일치하지 않습니다.");
      completeRead(pending, () => {
        state.themeResults = [...result.results];
        state.canMutate.theme = state.canMutate.theme !== false && result.canMutate;
        state.selectedCatalogIndex = -1;
        if (result.writeQuarantined) latchQuarantine("ThemeA 쓰기가 Native에서 격리되었습니다.");
      });
    }

    function handleExpertListResult(payload) {
      const pending = state.activeRead;
      if (!pending || pending.type !== contract.requests.expertList ||
          payload?.requestId !== pending.request.requestId) return;
      const result = workflow.normalizeExpertListResult(payload, pending.request);
      if (!result) return failCurrentRead(pending, "EList 목록 응답이 현재 검색과 일치하지 않습니다.");
      completeRead(pending, () => {
        state.expertResults = [...result.results];
        state.canMutate.expert = state.canMutate.expert !== false && result.canMutate;
        state.selectedCatalogIndex = -1;
        if (result.writeQuarantined) latchQuarantine("EList 쓰기가 Native에서 격리되었습니다.");
      });
    }

    function handleThemeNextCodeResult(payload) {
      const pending = state.activeRead;
      if (!pending || pending.type !== contract.requests.themeNextCode ||
          payload?.requestId !== pending.request.requestId) return;
      const result = workflow.normalizeThemeNextCodeResult(payload, pending.request);
      if (!result) return failCurrentRead(pending, "ThemeA 다음 코드 응답이 현재 시장과 일치하지 않습니다.");
      completeRead(pending, () => {
        if (result.writeQuarantined) latchQuarantine("ThemeA 쓰기가 Native에서 격리되었습니다.");
        state.canMutate.theme = state.canMutate.theme !== false && result.canMutate;
        state.entity = "theme";
        state.mode = "new";
        state.edit = {
          expectedIdentity: null,
          draft: workflow.createBlankThemeDraft(result.market, result.themeCode)
        };
      });
    }

    function handleExpertNextCodeResult(payload) {
      const pending = state.activeRead;
      if (!pending || pending.type !== contract.requests.expertNextCode ||
          payload?.requestId !== pending.request.requestId) return;
      const result = workflow.normalizeExpertNextCodeResult(payload, pending.request);
      if (!result) return failCurrentRead(pending, "EList 다음 코드 응답이 현재 요청과 일치하지 않습니다.");
      completeRead(pending, () => {
        if (result.writeQuarantined) latchQuarantine("EList 쓰기가 Native에서 격리되었습니다.");
        state.canMutate.expert = state.canMutate.expert !== false && result.canMutate;
        state.entity = "expert";
        state.mode = "new";
        state.edit = {
          expectedIdentity: null,
          draft: workflow.createBlankExpertDraft(result.expertCode)
        };
      });
    }

    function failCurrentRead(pending, message) {
      completeRead(pending, () => {
        state.error = message;
        state.status = "응답 차단";
      });
    }

    function handleMutationResult(payload) {
      const active = coordinator.getState().active;
      if (!active || payload?.requestId !== active.requestId) return;
      const result = coordinator.acceptResult(payload);
      if (!result) {
        coordinator.loseCorrelation();
        latchQuarantine("DB 쓰기 결과 형식이 현재 요청과 일치하지 않습니다. 앱을 재시작하세요.");
        render();
        return;
      }
      state.status = "DB 반영 완료";
      state.error = "";
      state.mode = "list";
      state.edit = null;
      options.addLog(`${result.entity} ${result.operation} 완료 · ${result.identityCode} · ${result.operationId}`);
      options.showToast("ThemeA/EList DB 작업이 완료되었습니다.");
      render();
    }

    function handleCatalogError(payload) {
      const activeMutation = coordinator.getState().active;
      if (activeMutation) {
        if (payload?.requestId !== activeMutation.requestId) return;
        const error = coordinator.acceptError(payload);
        if (!error) {
          coordinator.loseCorrelation();
          latchQuarantine("DB 쓰기 오류 응답을 현재 요청과 연결할 수 없습니다. 앱을 재시작하세요.");
        } else {
          if (error.outcomeUnknown || error.writeQuarantined) latchQuarantine(error.message);
          else {
            state.error = `${error.message} [${error.code}]`;
            state.status = "DB 반영 실패";
          }
        }
        render();
        return;
      }

      const pending = state.activeRead;
      if (!pending || payload?.requestId !== pending.request.requestId) return;
      const error = workflow.normalizeCatalogError(payload, pending.expectedError);
      if (!error) return failCurrentRead(pending, "DB 조회 오류 응답을 현재 요청과 연결할 수 없습니다.");
      completeRead(pending, () => {
        if (error.writeQuarantined || error.outcomeUnknown) latchQuarantine(error.message);
        state.error = `${error.message} [${error.code}]`;
        state.status = "조회 실패";
      });
    }

    function handleMessage(type, payload) {
      switch (type) {
        case contract.events.schemaPreflight:
          handleSchemaResult(payload);
          return true;
        case contract.events.themeList:
          handleThemeListResult(payload);
          return true;
        case contract.events.expertList:
          handleExpertListResult(payload);
          return true;
        case contract.events.themeNextCode:
          handleThemeNextCodeResult(payload);
          return true;
        case contract.events.expertNextCode:
          handleExpertNextCodeResult(payload);
          return true;
        case contract.events.mutation:
          handleMutationResult(payload);
          return true;
        case contract.events.error:
          handleCatalogError(payload);
          return true;
        default:
          return false;
      }
    }

    function search(query, nxtSession) {
      if (state.entity === "theme" && nxtSession !== undefined) {
        if (nxtSession !== "preMarket" && nxtSession !== "afterMarket") {
          return notifyError("NXT 세션을 명시적으로 선택하세요.");
        }
        state.nxtSession = nxtSession;
      }
      try {
        requestCatalogList(query);
        return true;
      } catch (error) {
        return notifyError(error?.message || "카탈로그 검색 요청이 올바르지 않습니다.");
      }
    }

    function loseCorrelation() {
      if (coordinator.getState().active) {
        coordinator.loseCorrelation();
        latchQuarantine("Browser 상관관계를 잃어 DB 쓰기 결과를 확인할 수 없습니다.");
      }
      state.activeRead = null;
      state.readQueue = [];
      render();
    }

    function setLocked(value = true) {
      state.forcedLocked = value === true;
      render();
      return locked();
    }

    function close() {
      state.open = false;
      render();
    }

    function snapshot() {
      return Object.freeze({
        mounted: state.mounted,
        open: state.open,
        entity: state.entity,
        mode: state.mode,
        locked: locked(),
        quarantined: quarantined(),
        status: state.status,
        error: state.error,
        schema: clone(state.schema),
        canMutate: clone(state.canMutate),
        activeRead: clone(state.activeRead && {
          key: state.activeRead.key,
          type: state.activeRead.type,
          request: state.activeRead.request,
          superseded: state.activeRead.superseded
        }),
        queuedReadCount: state.readQueue.length,
        mutation: clone(coordinator.getState().active),
        themeResults: clone(state.themeResults),
        expertResults: clone(state.expertResults),
        selectedCatalogIndex: state.selectedCatalogIndex,
        edit: clone(state.edit),
        draft: clone(currentDraft())
      });
    }

    function makeElement(documentValue, tagName, className, text) {
      const element = documentValue.createElement(tagName);
      if (className) element.className = className;
      if (text !== undefined) element.textContent = text;
      return element;
    }

    function assignRole(element, role) {
      element.setAttribute("data-role", role);
      return element;
    }

    function addStylesheet(documentValue) {
      if (!documentValue.head || documentValue.getElementById?.("mbn-operator-catalog-ui-css")) return;
      const link = documentValue.createElement("link");
      link.id = "mbn-operator-catalog-ui-css";
      link.rel = "stylesheet";
      link.href = "operator-catalog-ui.css";
      documentValue.head.appendChild(link);
    }

    function mount(host) {
      if (state.mounted) return snapshot();
      const target = host ?? (typeof document === "object" ? document.body : null);
      const documentValue = target?.ownerDocument ?? (typeof document === "object" ? document : null);
      if (!target || !documentValue || typeof documentValue.createElement !== "function" ||
          typeof target.appendChild !== "function") {
        throw new TypeError("mount requires a DOM host.");
      }
      addStylesheet(documentValue);

      const dialog = makeElement(documentValue, "dialog", "mbn-operator-catalog-dialog");
      dialog.setAttribute("aria-labelledby", "mbnOperatorCatalogTitle");
      const shell = makeElement(documentValue, "section", "mbn-operator-catalog-shell");
      const header = makeElement(documentValue, "header", "mbn-operator-catalog-header");
      const title = makeElement(documentValue, "h2", "", "ThemeA / EList 운영 관리");
      title.id = "mbnOperatorCatalogTitle";
      const status = assignRole(makeElement(documentValue, "span", "mbn-operator-catalog-status"), "status");
      status.setAttribute("aria-live", "polite");
      const closeButton = assignRole(makeElement(documentValue, "button", "", "닫기"), "close");
      closeButton.type = "button";
      header.append(title, status, closeButton);

      const tabs = makeElement(documentValue, "nav", "mbn-operator-catalog-tabs");
      const themeTab = assignRole(makeElement(documentValue, "button", "", "ThemeA"), "theme-tab");
      const expertTab = assignRole(makeElement(documentValue, "button", "", "EList"), "expert-tab");
      themeTab.type = expertTab.type = "button";
      tabs.append(themeTab, expertTab);

      const toolbar = makeElement(documentValue, "form", "mbn-operator-catalog-toolbar");
      const query = assignRole(makeElement(documentValue, "input"), "query");
      query.type = "search";
      query.maxLength = workflow.limits.maximumQueryLength;
      query.autocomplete = "off";
      const session = assignRole(makeElement(documentValue, "select"), "nxt-session");
      for (const [value, label] of [["preMarket", "NXT 프리마켓"], ["afterMarket", "NXT 애프터마켓"]]) {
        const option = makeElement(documentValue, "option", "", label);
        option.value = value;
        session.appendChild(option);
      }
      const searchButton = assignRole(makeElement(documentValue, "button", "", "검색"), "search");
      searchButton.type = "submit";
      const market = assignRole(makeElement(documentValue, "select"), "new-market");
      for (const [value, label] of [["krx", "KRX"], ["nxt", "NXT"]]) {
        const option = makeElement(documentValue, "option", "", label);
        option.value = value;
        market.appendChild(option);
      }
      const newButton = assignRole(makeElement(documentValue, "button", "", "새 정의"), "new");
      newButton.type = "button";
      const listDeleteButton = assignRole(
        makeElement(documentValue, "button", "mbn-danger", "선택 정의 삭제"),
        "delete-selected");
      listDeleteButton.type = "button";
      toolbar.append(query, session, searchButton, market, newButton, listDeleteButton);

      const body = makeElement(documentValue, "div", "mbn-operator-catalog-body");
      const catalog = assignRole(makeElement(documentValue, "ol", "mbn-operator-catalog-list"), "catalog-list");
      const editor = assignRole(makeElement(documentValue, "section", "mbn-operator-catalog-editor"), "editor");
      const identity = makeElement(documentValue, "div", "mbn-operator-catalog-identity");
      const code = assignRole(makeElement(documentValue, "output"), "identity-code");
      const name = assignRole(makeElement(documentValue, "input"), "identity-name");
      name.type = "text";
      name.maxLength = 128;
      name.autocomplete = "off";
      identity.append(code, name);

      const itemForm = makeElement(documentValue, "form", "mbn-operator-catalog-item-form");
      const prefix = assignRole(makeElement(documentValue, "select"), "item-prefix");
      const stockCode = assignRole(makeElement(documentValue, "input"), "stock-code");
      stockCode.type = "text";
      stockCode.maxLength = 32;
      stockCode.autocomplete = "off";
      const stockName = assignRole(makeElement(documentValue, "input"), "stock-name");
      stockName.type = "text";
      stockName.maxLength = 200;
      stockName.autocomplete = "off";
      const buyAmount = assignRole(makeElement(documentValue, "input"), "buy-amount");
      buyAmount.type = "number";
      buyAmount.min = "1";
      buyAmount.step = "1";
      const addButton = assignRole(makeElement(documentValue, "button", "", "추가"), "add-item");
      addButton.type = "submit";
      itemForm.append(prefix, stockCode, stockName, buyAmount, addButton);
      const draftList = assignRole(makeElement(documentValue, "ol", "mbn-operator-catalog-draft"), "draft-list");
      const actions = makeElement(documentValue, "footer", "mbn-operator-catalog-actions");
      const saveButton = assignRole(makeElement(documentValue, "button", "", "DB 반영"), "save");
      const deleteButton = assignRole(makeElement(documentValue, "button", "mbn-danger", "정의 삭제"), "delete");
      const cancelButton = assignRole(makeElement(documentValue, "button", "", "목록으로"), "cancel-edit");
      saveButton.type = deleteButton.type = cancelButton.type = "button";
      actions.append(saveButton, deleteButton, cancelButton);
      editor.append(identity, itemForm, draftList, actions);
      body.append(catalog, editor);

      const error = assignRole(makeElement(documentValue, "p", "mbn-operator-catalog-error"), "error");
      shell.append(header, tabs, toolbar, body, error);
      dialog.appendChild(shell);
      target.appendChild(dialog);

      dom = {
        document: documentValue,
        dialog,
        status,
        closeButton,
        themeTab,
        expertTab,
        query,
        session,
        market,
        newButton,
        listDeleteButton,
        toolbar,
        catalog,
        editor,
        code,
        name,
        itemForm,
        prefix,
        stockCode,
        stockName,
        buyAmount,
        draftList,
        saveButton,
        deleteButton,
        cancelButton,
        error
      };

      closeButton.addEventListener("click", close);
      themeTab.addEventListener("click", () => openTheme());
      expertTab.addEventListener("click", () => openExpert());
      toolbar.addEventListener("submit", event => {
        event.preventDefault();
        search(query.value, session.value);
      });
      newButton.addEventListener("click", () => state.entity === "theme"
        ? beginNewTheme(market.value)
        : beginNewExpert());
      listDeleteButton.addEventListener("click", () => {
        const confirmDelete = typeof globalScope?.confirm !== "function" ||
          globalScope.confirm("선택한 ThemeA/EList 정의를 DB에서 삭제할까요?");
        if (confirmDelete) deleteCurrent();
      });
      name.addEventListener("input", () => updateDraft(state.entity === "theme"
        ? { themeTitle: name.value }
        : { expertName: name.value }));
      itemForm.addEventListener("submit", event => {
        event.preventDefault();
        const added = state.entity === "theme"
          ? addThemeItem(prefix.value, stockCode.value, stockName.value)
          : addExpertRecommendation(stockCode.value, stockName.value, buyAmount.value);
        if (added) {
          stockCode.value = "";
          stockName.value = "";
          buyAmount.value = "";
        }
      });
      saveButton.addEventListener("click", submit);
      deleteButton.addEventListener("click", () => {
        const confirmDelete = typeof globalScope?.confirm !== "function" ||
          globalScope.confirm("선택한 ThemeA/EList 정의를 DB에서 삭제할까요?");
        if (confirmDelete) deleteCurrent();
      });
      cancelButton.addEventListener("click", () => {
        state.mode = "list";
        state.edit = null;
        render();
      });

      state.mounted = true;
      render();
      return snapshot();
    }

    function renderCatalogRows() {
      if (!dom) return;
      dom.catalog.replaceChildren();
      const rows = state.entity === "theme" ? state.themeResults : state.expertResults;
      rows.forEach((item, index) => {
        const row = makeElement(dom.document, "li", "mbn-operator-catalog-row");
        const button = makeElement(
          dom.document,
          "button",
          index === state.selectedCatalogIndex ? "selected" : "",
          state.entity === "theme"
            ? `${item.themeCode} · ${item.themeTitle} · ${item.market.toUpperCase()}`
            : `${item.expertCode} · ${item.expertName}`);
        button.type = "button";
        button.addEventListener("click", () => selectCatalog(index));
        row.appendChild(button);
        dom.catalog.appendChild(row);
      });
    }

    function renderDraftRows() {
      if (!dom) return;
      dom.draftList.replaceChildren();
      const draft = currentDraft();
      const rows = state.entity === "theme" ? draft?.items : draft?.recommendations;
      (rows || []).forEach((item, index) => {
        const row = makeElement(dom.document, "li", "mbn-operator-catalog-draft-row");
        const label = makeElement(
          dom.document,
          "span",
          "",
          state.entity === "theme"
            ? `${item.itemCode} · ${item.itemName}`
            : `${item.stockCode} · ${item.stockName} · ${item.buyAmount}`);
        const up = makeElement(dom.document, "button", "", "↑");
        const down = makeElement(dom.document, "button", "", "↓");
        const remove = makeElement(dom.document, "button", "mbn-danger", "삭제");
        up.type = down.type = remove.type = "button";
        up.disabled = index === 0 || locked();
        down.disabled = index + 1 === rows.length || locked();
        remove.disabled = locked();
        up.addEventListener("click", () => moveDraftItem(index, -1));
        down.addEventListener("click", () => moveDraftItem(index, 1));
        remove.addEventListener("click", () => removeDraftItem(index));
        row.append(label, up, down, remove);
        dom.draftList.appendChild(row);
      });
    }

    function render() {
      if (!dom) return snapshot();
      const isLocked = locked();
      const isQuarantined = quarantined();
      const mutationActive = Boolean(coordinator.getState().active);
      dom.status.textContent = isQuarantined ? "WRITE 잠금" : state.status;
      dom.error.textContent = state.error;
      dom.error.hidden = !state.error;
      dom.themeTab.setAttribute("aria-pressed", String(state.entity === "theme"));
      dom.expertTab.setAttribute("aria-pressed", String(state.entity === "expert"));
      dom.query.value = state.entity === "theme" ? state.themeQuery : state.expertQuery;
      dom.session.value = state.nxtSession;
      dom.session.hidden = state.entity !== "theme";
      dom.market.hidden = state.entity !== "theme";
      dom.market.value = state.themeMarketForNew;
      dom.newButton.textContent = state.entity === "theme" ? "새 ThemeA" : "새 EList";
      dom.newButton.disabled = isLocked || isQuarantined || mutationActive;
      dom.listDeleteButton.disabled = !canWrite() || !selectedCatalog();
      dom.catalog.hidden = state.mode !== "list";
      dom.editor.hidden = state.mode === "list";
      const draft = currentDraft();
      dom.code.textContent = draft
        ? (state.entity === "theme" ? draft.themeCode : draft.expertCode)
        : "";
      dom.name.value = draft
        ? (state.entity === "theme" ? draft.themeTitle : draft.expertName)
        : "";
      dom.name.placeholder = state.entity === "theme" ? "ThemeA 이름" : "전문가 이름";
      dom.name.disabled = isLocked || mutationActive;
      dom.prefix.hidden = state.entity !== "theme";
      dom.buyAmount.hidden = state.entity !== "expert";
      if (draft && state.entity === "theme") {
        const previous = dom.prefix.value;
        dom.prefix.replaceChildren();
        for (const value of themePrefixes[draft.market]) {
          const option = makeElement(dom.document, "option", "", `${value} prefix`);
          option.value = value;
          dom.prefix.appendChild(option);
        }
        dom.prefix.value = themePrefixes[draft.market].includes(previous)
          ? previous
          : themePrefixes[draft.market][0];
      }
      for (const control of [dom.stockCode, dom.stockName, dom.buyAmount, dom.prefix]) {
        control.disabled = isLocked || mutationActive;
      }
      dom.saveButton.disabled = !canWrite() || !draft;
      dom.deleteButton.disabled = !canWrite() ||
        (state.mode !== "edit" && !selectedCatalog());
      dom.cancelButton.disabled = mutationActive;
      dom.closeButton.disabled = mutationActive;
      renderCatalogRows();
      renderDraftRows();

      if (state.open) {
        if (typeof dom.dialog.showModal === "function" && !dom.dialog.open) dom.dialog.showModal();
        else {
          dom.dialog.hidden = false;
          dom.dialog.setAttribute("open", "");
        }
      } else if (typeof dom.dialog.close === "function" && dom.dialog.open) {
        dom.dialog.close();
      } else {
        dom.dialog.hidden = true;
        dom.dialog.removeAttribute("open");
      }
      return snapshot();
    }

    return Object.freeze({
      mount,
      openTheme,
      openExpert,
      handleMessage,
      render,
      setLocked,
      close,
      search,
      beginNewTheme,
      beginNewExpert,
      updateDraft,
      addThemeItem,
      addExpertRecommendation,
      moveDraftItem,
      removeDraftItem,
      selectCatalog,
      submit,
      deleteCurrent,
      loseCorrelation
    });
  }

  return Object.freeze({ createController });
});