(function () {
  "use strict";

  const TOKEN_KEY = "airshelf_token";
  const LIVE_KEY = "airshelf_live";
  const USER_KEY = "airshelf_user";
  const TEAM_KEY = "airshelf_team";
  const BRIDGE_VERSION = "20260601-live-api-bridge-notifications";
  const CACHE_VERSION = "20260601";
  const CACHE_PREFIX = "airshelf:live-cache:";
  const requestMemo = {};
  const context = window.__AIR_SHELF_EXACT_CONTEXT__ || {};
  const sourceMeta = document.querySelector('meta[name="x-airshelf-exact-source"]');
  const page = (context.page || (sourceMeta && sourceMeta.content) || location.pathname.split("/").pop() || "index.html").toLowerCase();
  const query = new URLSearchParams(context.search || location.search);
  const liveDataPages = {
    "index.html": true,
    "products.html": true,
    "product-detail.html": true,
    "projects.html": true,
    "projects-new.html": true,
    "pipeline.html": true,
    "library.html": true,
    "account.html": true,
    "settings.html": true,
    "team.html": true,
    "messages.html": true,
  };
  const needsLiveHydration = Boolean(context.liveHydrate || liveDataPages[page]);

  function token() {
    return localStorage.getItem(TOKEN_KEY) || "";
  }

  function isLive() {
    return query.get("live") === "1" || localStorage.getItem(LIVE_KEY) === "1";
  }

  function canUseApi() {
    return !!token();
  }

  function cacheScope() {
    try {
      const team = JSON.parse(localStorage.getItem(TEAM_KEY) || "null");
      if (team?.id) return "team:" + team.id;
      const user = JSON.parse(localStorage.getItem(USER_KEY) || "null");
      if (user?.id) return "user:" + user.id;
    } catch (error) {
      // Fall through to anonymous scope.
    }
    return "anonymous";
  }

  function cacheKey(name) {
    return CACHE_PREFIX + CACHE_VERSION + ":" + cacheScope() + ":" + name;
  }

  function readCache(name) {
    try {
      const raw = localStorage.getItem(cacheKey(name));
      if (!raw) return null;
      const parsed = JSON.parse(raw);
      return parsed && parsed.data !== undefined ? parsed.data : null;
    } catch (error) {
      return null;
    }
  }

  function writeCache(name, data) {
    try {
      localStorage.setItem(cacheKey(name), JSON.stringify({ ts: Date.now(), data: data }));
      renderShellFromCache();
    } catch (error) {
      // localStorage may be full or unavailable; live API rendering still works.
    }
  }

  function forgetCache(name) {
    try {
      localStorage.removeItem(cacheKey(name));
      delete requestMemo[name];
      renderShellFromCache();
    } catch (error) {
      // Best effort only.
    }
  }

  function apiGet(cacheName, path) {
    if (!requestMemo[cacheName]) {
      requestMemo[cacheName] = api(path)
        .then(function (data) {
          writeCache(cacheName, data);
          return data;
        })
        .catch(function (error) {
          delete requestMemo[cacheName];
          throw error;
        });
    }
    return requestMemo[cacheName];
  }

  function rememberAuthShape(meData) {
    if (!meData) return;
    try {
      if (meData.user) localStorage.setItem(USER_KEY, JSON.stringify(meData.user));
      if (meData.team) localStorage.setItem(TEAM_KEY, JSON.stringify(meData.team));
    } catch (error) {
      // Best effort only.
    }
  }

  function cachedAuthShape() {
    const cached = readCache("auth:me");
    if (cached) return cached;
    try {
      const user = JSON.parse(localStorage.getItem(USER_KEY) || "null");
      const team = JSON.parse(localStorage.getItem(TEAM_KEY) || "null");
      return user || team ? { user: user || {}, team: team || {} } : null;
    } catch (error) {
      return null;
    }
  }

  async function loadWithCache(cacheName, fetcher, render, failTitle) {
    const cached = readCache(cacheName);
    if (cached) {
      render(cached, true);
      markHydrationDone();
    }
    try {
      const fresh = await fetcher();
      writeCache(cacheName, fresh);
      render(fresh, false);
      return fresh;
    } catch (error) {
      if (cached) {
        toast(failTitle || "数据刷新失败", (error && error.message ? error.message : "接口暂不可用") + " · 已显示本地缓存");
        return cached;
      }
      toast(failTitle || "数据加载失败", error.message);
      throw error;
    }
  }

  function markHydrationLoading() {
    if (!needsLiveHydration || !canUseApi()) return;
    document.documentElement.removeAttribute("data-live-error");
    document.documentElement.setAttribute("data-live-hydrating", "1");
  }

  function markHydrationDone() {
    if (!needsLiveHydration) return;
    document.documentElement.removeAttribute("data-live-hydrating");
    document.documentElement.removeAttribute("data-live-error");
    document.documentElement.setAttribute("data-live-ready", "1");
  }

  function markHydrationError(message) {
    if (!needsLiveHydration) return;
    document.documentElement.removeAttribute("data-live-hydrating");
    document.documentElement.setAttribute("data-live-error", "1");
    document.documentElement.dataset.liveErrorMessage = message || "真实数据加载失败";
  }

  function applyContextHash() {
    const cleanHash = String(context.hash || location.hash || "").replace(/^#/, "");
    if (!cleanHash) return;
    if (page === "settings.html" && cleanHash.indexOf("sec-") === 0 && typeof window.showSection === "function") {
      window.showSection(cleanHash);
      return;
    }
    const stageMatch = cleanHash.match(/^stage-(\d+)$/);
    if (page === "pipeline.html" && stageMatch && typeof window.activateStage === "function") {
      window.activateStage(Number(stageMatch[1]));
    }
  }

  function go(href) {
    if (typeof window.__AIR_SHELF_HOST_NAVIGATE__ === "function") {
      window.__AIR_SHELF_HOST_NAVIGATE__(href);
      return;
    }
    location.href = href;
  }

  function ready(fn) {
    if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", fn);
    else fn();
  }

  function esc(value) {
    return String(value == null ? "" : value).replace(/[&<>"']/g, function (char) {
      return { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[char];
    });
  }

  function dateOnly(value) {
    if (!value) return new Date().toISOString().slice(0, 10);
    return String(value).slice(0, 10);
  }

  function shortLabel(value) {
    const text = String(value || "商品").replace(/[·｜|]/g, " ").trim();
    return text.length > 9 ? text.slice(0, 9) : text;
  }

  function parseError(text) {
    try {
      const data = JSON.parse(text);
      if (typeof data.detail === "string") return data.detail;
      if (Array.isArray(data.non_field_errors)) return data.non_field_errors.join(" / ");
      const parts = [];
      Object.keys(data).forEach(function (key) {
        const value = data[key];
        if (Array.isArray(value)) parts.push(key + ": " + value.join(" / "));
        else if (typeof value === "string") parts.push(key + ": " + value);
      });
      return parts.join("；") || text;
    } catch (error) {
      return text || "请求失败";
    }
  }

  async function api(path, options) {
    const opts = options || {};
    const headers = new Headers(opts.headers || {});
    if (!(opts.body instanceof FormData)) headers.set("Content-Type", "application/json");
    if (token()) headers.set("Authorization", "Token " + token());
    const response = await fetch(path, Object.assign({}, opts, { headers: headers }));
    if (!response.ok) {
      const text = await response.text();
      throw new Error(parseError(text));
    }
    if (response.status === 204) return null;
    return response.json();
  }

  function toast(title, sub) {
    if (window.Shell && typeof window.Shell.toast === "function") {
      window.Shell.toast(title, sub || "");
      return;
    }
    if (typeof window._loginToast === "function") {
      window._loginToast(title, sub || "");
      return;
    }
    if (typeof window._regToast === "function") {
      window._regToast(title, sub || "");
      return;
    }
    let el = document.getElementById("__api_bridge_toast");
    if (!el) {
      el = document.createElement("div");
      el.id = "__api_bridge_toast";
      el.style.cssText =
        "position:fixed;left:50%;bottom:36px;transform:translateX(-50%) translateY(20px);background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:12px 18px;box-shadow:0 8px 24px rgba(0,0,0,.12);display:flex;flex-direction:column;gap:2px;opacity:0;transition:opacity .2s,transform .2s;z-index:9999;font-family:inherit;max-width:380px;";
      document.body.appendChild(el);
    }
    el.innerHTML =
      '<div style="font-size:13.5px;font-weight:600;color:#262626;">' +
      esc(title) +
      "</div>" +
      (sub ? '<div style="font-size:11.5px;color:rgba(0,0,0,.56);">// ' + esc(sub) + "</div>" : "");
    requestAnimationFrame(function () {
      el.style.opacity = "1";
      el.style.transform = "translateX(-50%) translateY(0)";
    });
    clearTimeout(el._timer);
    el._timer = setTimeout(function () {
      el.style.opacity = "0";
      el.style.transform = "translateX(-50%) translateY(20px)";
    }, 3000);
  }

  function setAuthPayload(payload) {
    localStorage.setItem(TOKEN_KEY, payload.token);
    localStorage.setItem(LIVE_KEY, "1");
    localStorage.setItem(USER_KEY, JSON.stringify(payload.user || {}));
    localStorage.setItem(TEAM_KEY, JSON.stringify(payload.team || {}));
  }

  function renderShellIdentity(meData, billingData) {
    if (meData) rememberAuthShape(meData);
    const teamName = meData?.team?.name || "团队";
    const userName = meData?.user ? displayName(meData.user) : "成员";
    const email = meData?.user?.email || "";
    const avatar = initial(userName);

    document.querySelectorAll(".aside-foot .user .em, .shell-account-head .nm").forEach(function (el) {
      el.textContent = teamName;
    });
    document.querySelectorAll(".aside-foot .user .av, .topbar-avatar span, .shell-account-head .av").forEach(function (el) {
      el.textContent = avatar;
    });
    document.querySelectorAll(".shell-account-head .mail").forEach(function (el) {
      el.textContent = email;
    });
    syncShellBalance(billingData);
  }

  function syncShellBalance(billingData) {
    const balance = billingData?.account?.balance;
    document.querySelectorAll(".balance-chip strong").forEach(function (el) {
      el.textContent = balance === undefined || balance === null ? "--" : money(balance);
    });
  }

  function firstPresent(values) {
    for (let i = 0; i < values.length; i += 1) {
      if (values[i] !== null && values[i] !== undefined) return values[i];
    }
    return null;
  }

  function collectionCount(data) {
    if (!data) return null;
    if (typeof data.count === "number") return data.count;
    if (typeof data.count === "string" && data.count.trim() !== "" && !Number.isNaN(Number(data.count))) return Number(data.count);
    if (Array.isArray(data.results)) return data.results.length;
    if (Array.isArray(data)) return data.length;
    return null;
  }

  function listResults(data) {
    if (Array.isArray(data)) return data;
    if (data && Array.isArray(data.results)) return data.results;
    return [];
  }

  function unreadNotificationCount(data) {
    if (!data) return null;
    if (typeof data.unread_count === "number") return data.unread_count;
    if (typeof data.unread_count === "string" && data.unread_count.trim() !== "" && !Number.isNaN(Number(data.unread_count))) {
      return Number(data.unread_count);
    }
    const rows = listResults(data);
    if (!rows.length && collectionCount(data) === 0) return 0;
    return rows.filter(function (item) {
      if (item.unread !== undefined) return Boolean(item.unread);
      return item.is_read === false;
    }).length;
  }

  function emptyList() {
    return { count: 0, next: null, previous: null, results: [] };
  }

  function listCacheOrEmpty(name) {
    return readCache(name) || emptyList();
  }

  function cacheNested(name, key) {
    const data = readCache(name);
    return data && data[key] ? data[key] : null;
  }

  function setShellBadge(href, count) {
    document.querySelectorAll('aside.sidebar a[href="' + href + '"] .pill-mini').forEach(function (badge) {
      if (count === null || count === undefined) {
        badge.textContent = "";
        badge.hidden = true;
        return;
      }
      badge.hidden = false;
      badge.textContent = String(count);
    });
  }

  function syncNotificationBadge() {
    document.querySelectorAll(".count-noti").forEach(function (badge) {
      const count = firstPresent([
        readCache("notifications:summary")?.unread_count,
        unreadNotificationCount(readCache("notifications:list")),
      ]);
      if (count === null || count === undefined || Number(count) <= 0) {
        badge.textContent = "";
        badge.hidden = true;
        return;
      }
      badge.hidden = false;
      badge.textContent = String(count);
    });
  }

  function shellSummaryFromCache() {
    return firstPresent([
      readCache("billing:summary"),
      cacheNested("dashboard", "summary"),
      cacheNested("account:bundle", "summary"),
      cacheNested("team:bundle", "summary"),
      cacheNested("settings:profile", "summary"),
    ]);
  }

  function shellProductDataFromCache() {
    return firstPresent([
      readCache("products:list"),
      cacheNested("dashboard", "products"),
      cacheNested("account:bundle", "products"),
      cacheNested("projects:bundle", "products"),
      cacheNested("pipeline:latest", "products"),
    ]);
  }

  function shellProjectDataFromCache() {
    return firstPresent([
      readCache("projects:list"),
      cacheNested("dashboard", "projects"),
      cacheNested("account:bundle", "projects"),
      cacheNested("projects:bundle", "projects"),
    ]);
  }

  function renderShellFromCache() {
    if (!document.body) return;
    const meData = cachedAuthShape();
    const summaryData = shellSummaryFromCache();
    if (canUseApi() || meData || summaryData) renderShellIdentity(meData, summaryData);
    setShellBadge("products.html", collectionCount(shellProductDataFromCache()));
    setShellBadge("projects.html", collectionCount(shellProjectDataFromCache()));
    syncNotificationBadge();
  }

  function seedProjectsBundleFromCache() {
    if (readCache("projects:bundle")) return;
    const products = shellProductDataFromCache();
    const projects = shellProjectDataFromCache();
    if (!products && !projects) return;
    writeCache("projects:bundle", {
      products: products || emptyList(),
      projects: projects || emptyList(),
    });
  }

  function seedAccountBundleFromCache() {
    if (readCache("account:bundle")) return;
    const summary = shellSummaryFromCache();
    const ledgers = readCache("billing:ledgers");
    const members = readCache("team:members");
    const products = shellProductDataFromCache();
    const projects = shellProjectDataFromCache();
    if (!summary && !ledgers && !members && !products && !projects) return;
    writeCache("account:bundle", {
      summary: summary || { account: { balance: 0 }, charged_total: 0 },
      ledgers: ledgers || [],
      members: members || [],
      products: products || emptyList(),
      projects: projects || emptyList(),
    });
  }

  function seedTeamBundleFromCache() {
    if (readCache("team:bundle")) return;
    const me = cachedAuthShape();
    const summary = readCache("billing:summary");
    const members = readCache("team:members");
    if (!me && !summary && !members) return;
    writeCache("team:bundle", {
      me: me || {},
      summary: summary || { account: { balance: 0 }, charged_total: 0 },
      members: members || [],
    });
  }

  async function hydrateShellIdentity() {
    if (!canUseApi()) return;
    const cachedMe = cachedAuthShape();
    const cachedBilling = readCache("billing:summary");
    renderShellFromCache();
    if (cachedMe) renderShellIdentity(cachedMe, cachedBilling);
    try {
      const meData = await apiGet("auth:me", "/api/auth/me/");
      writeCache("auth:me", meData);
      const billingData = await apiGet("billing:summary", "/api/billing/summary/").catch(function () {
        return null;
      });
      if (billingData) writeCache("billing:summary", billingData);
      renderShellIdentity(meData, billingData || cachedBilling);
      renderShellFromCache();
    } catch (error) {
      // Shell identity is a convenience layer; page-specific API errors are handled below.
    }
  }

  function setButtonBusy(button, text) {
    if (!button) return function () {};
    const html = button.innerHTML;
    button.disabled = true;
    button.innerHTML =
      '<span style="font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;">// ' +
      esc(text) +
      "</span>";
    return function () {
      button.disabled = false;
      button.innerHTML = html;
    };
  }

  function wireAuth() {
    if (page === "login.html") {
      window.doLogin = async function () {
        const email = document.getElementById("auth-email").value.trim();
        const password = document.getElementById("auth-pwd").value;
        const restore = setButtonBusy(document.querySelector(".btn-cta"), "验证中...");
        try {
          const payload = await api("/api/auth/login/", {
            method: "POST",
            body: JSON.stringify({ username: email, password: password }),
          });
          setAuthPayload(payload);
          toast("登录成功", "已接入 Django 真实会话");
          go("index.html");
        } catch (error) {
          restore();
          toast("登录失败", error.message || "请检查账号密码");
        }
      };
    }

    if (page === "register.html") {
      window.doRegister = async function () {
        const team = document.getElementById("reg-team").value.trim();
        const email = document.getElementById("reg-email").value.trim();
        const password = document.getElementById("reg-pwd").value;
        const confirm = document.getElementById("reg-pwd2").value;
        const agree = document.getElementById("reg-agree").checked;
        if (!team || !email) return alert("请补全团队名 + 邮箱");
        if (password.length < 8) return alert("密码至少 8 位");
        if (password !== confirm) return alert("两次密码不一致");
        if (!agree) return alert("请同意用户协议");

        const restore = setButtonBusy(document.getElementById("reg-submit"), "创建团队中...");
        try {
          const payload = await api("/api/auth/register/", {
            method: "POST",
            body: JSON.stringify({
              username: email,
              email: email,
              password: password,
              team_name: team,
            }),
          });
          setAuthPayload(payload);
          toast("注册成功", "团队与试用额度已创建");
          go("index.html");
        } catch (error) {
          restore();
          toast("注册失败", error.message || "请稍后重试");
        }
      };
    }
  }

  function sellingPointsFromDrawer() {
    const points = Array.from(document.querySelectorAll("#pf-bullets .bl-item .bl-text"))
      .map(function (el) {
        return el.textContent.trim();
      })
      .filter(Boolean);
    const pending = document.querySelector("#pf-bullets .bl-add .bl-input");
    if (pending && pending.value.trim()) points.push(pending.value.trim());
    return points;
  }

  let productCreateInFlight = false;

  async function submitLiveProduct(saveBtn) {
    if (!canUseApi()) return false;
    if (productCreateInFlight) return true;

    const nameEl = document.getElementById("pf-name");
    const catEl = document.getElementById("pf-cat");
    const targetEl = document.getElementById("pf-target");
    const name = (nameEl && nameEl.value ? nameEl.value : "").trim();
    const category = catEl ? catEl.value : "";
    const target = targetEl ? targetEl.value.trim() : "";
    const points = sellingPointsFromDrawer();

    if (!name) {
      toast("请填写商品名称", "必填项");
      if (nameEl) nameEl.focus();
      return true;
    }
    if (points.length === 0) {
      toast("请填写核心卖点", "至少 1 条");
      return true;
    }

    productCreateInFlight = true;
    const restore = setButtonBusy(saveBtn, "保存商品中...");
    try {
      const product = await api("/api/products/", {
        method: "POST",
        body: JSON.stringify({
          title: name,
          category: category,
          target_audience: target,
          selling_points: points.map(function (title, index) {
            return { title: title, detail: "", sort_order: index };
          }),
        }),
      });
      rememberPrototypeProduct(product, {
        title: name,
        category: category,
        target: target,
        points: points,
      });
      forgetCache("products:list");
      forgetCache("projects:bundle");
      forgetCache("dashboard");
      localStorage.setItem("airshelf_current_product_id", product.id);
      toast("商品已创建", "已写入 Django 数据库");
      go("product-detail.html?product_id=" + encodeURIComponent(product.id) + "&product=" + encodeURIComponent(product.title || name));
    } catch (error) {
      productCreateInFlight = false;
      restore();
      toast("创建失败", error.message);
    }
    return true;
  }

  function rememberPrototypeProduct(product, draft) {
    try {
      const key = "fs-extra-products";
      const list = JSON.parse(sessionStorage.getItem(key) || "[]");
      list.push({
        id: product.id,
        name: product.title || draft.title,
        cat: product.category || draft.category || "未分类",
        target: product.target_audience || draft.target || "",
        assets: 0,
        videos: 0,
        bullets: draft.points || [],
        date: dateOnly(product.created_at),
        createdAt: Date.now(),
      });
      sessionStorage.setItem(key, JSON.stringify(list));
    } catch (error) {
      // Prototype compatibility only; API persistence is already complete.
    }
  }

  function productCardHTML(product, index) {
    const title = product.title || "未命名商品";
    const cat = product.category || "未分类";
    const date = dateOnly(product.created_at);
    const assets = (product.images && product.images.length) || 0;
    const videos = product.metadata && product.metadata.videos_count ? product.metadata.videos_count : 0;
    return (
      '<div class="product-card" data-live="1" data-product-id="' +
      esc(product.id) +
      '" data-cat="' +
      esc(cat) +
      '" data-name="' +
      esc(title) +
      '" data-tags="" data-added="' +
      esc(index + 1) +
      '" data-assets="' +
      esc(assets) +
      '" data-videos="' +
      esc(videos) +
      '" data-date="' +
      esc(date) +
      '">' +
      '<span class="card-check" aria-hidden="true"><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="3 8 7 12 13 4"/></svg></span>' +
      '<button class="card-del-btn" type="button" title="删除商品" data-action="delete-product" data-product-id="' +
      esc(product.id) +
      '"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2"/><path d="M19 6l-1.5 14a2 2 0 01-2 1.8H8.5a2 2 0 01-2-1.8L5 6"/></svg></button>' +
      '<div class="placeholder product-thumb"><span class="ph-frame">' +
      esc(shortLabel(title)) +
      " · 1200×800</span></div>" +
      '<div class="product-body"><div class="product-name">' +
      esc(title) +
      '</div><div class="product-cat">' +
      esc(cat) +
      '</div><div class="product-date">' +
      esc(date) +
      " 创建</div></div>" +
      '<div class="product-footer"><span class="stat"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="9" cy="10" r="2"/><path d="M21 17l-5-5-9 9"/></svg>素材 <b>' +
      esc(assets) +
      '</b></span><span class="sep">·</span><span class="stat"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="6" width="14" height="12" rx="2"/><path d="M16 10l6-3v10l-6-3z"/></svg>视频 <b>' +
      esc(videos) +
      "</b></span></div></div>"
    );
  }

  function syncProductCount() {
    const cards = Array.from(document.querySelectorAll("#product-grid .product-card"));
    const visible = cards.filter(function (card) {
      return card.style.display !== "none";
    }).length;
    const total = cards.length;
    const sku = document.getElementById("sku-count");
    if (sku) sku.textContent = String(total);
    const meta = document.getElementById("result-meta");
    if (meta) meta.innerHTML = '// 显示 <span class="count">' + visible + "</span> / " + total + " 个商品";
    setShellBadge("products.html", total);
    const empty = document.getElementById("empty");
    if (empty) empty.hidden = visible !== 0;
  }

  function applyLiveProductFilter() {
    const q = (document.getElementById("search-input") || {}).value || "";
    const needle = q.trim().toLowerCase();
    document.querySelectorAll("#product-grid .product-card").forEach(function (card) {
      const hay = ((card.dataset.name || "") + " " + (card.dataset.cat || "") + " " + (card.dataset.tags || "")).toLowerCase();
      card.style.display = !needle || hay.indexOf(needle) >= 0 ? "" : "none";
    });
    syncProductCount();
  }

  function bindLiveProductCards() {
    const grid = document.getElementById("product-grid");
    if (!grid) return;
    grid.querySelectorAll(".product-card").forEach(function (card) {
      card.addEventListener("click", function (event) {
        if (document.body.classList.contains("edit-mode")) {
          event.preventDefault();
          event.stopImmediatePropagation();
          card.classList.toggle("selected");
          return;
        }
        const id = card.dataset.productId;
        const name = card.dataset.name || "";
        if (id) go("product-detail.html?product_id=" + encodeURIComponent(id) + "&product=" + encodeURIComponent(name));
      });
    });

    grid.querySelectorAll('[data-action="delete-product"][data-product-id]').forEach(function (button) {
      button.addEventListener("click", async function (event) {
        event.preventDefault();
        event.stopImmediatePropagation();
        const card = button.closest(".product-card");
        const id = button.dataset.productId;
        if (!id || !confirm("确认删除商品「" + (card && card.dataset.name ? card.dataset.name : "") + "」?")) return;
        try {
          await api("/api/products/" + encodeURIComponent(id) + "/", { method: "DELETE" });
          if (card) card.remove();
          forgetCache("products:list");
          forgetCache("projects:bundle");
          forgetCache("dashboard");
          syncProductCount();
          toast("已删除", "商品已从 Django 数据库移除");
        } catch (error) {
          toast("删除失败", error.message);
        }
      });
    });
  }

  function renderLiveProductsPayload(data) {
    const grid = document.getElementById("product-grid");
    if (!grid) return;
    const products = data.results || [];
    grid.innerHTML = products.length
      ? products.map(productCardHTML).join("")
      : '<div class="empty-filter">// 当前团队还没有真实商品</div>';
    bindLiveProductCards();
    applyLiveProductFilter();
  }

  async function loadLiveProducts() {
    if (!canUseApi()) return;
    const grid = document.getElementById("product-grid");
    if (!grid) return;
    return loadWithCache(
      "products:list",
      function () {
        return apiGet("products:list", "/api/products/");
      },
      renderLiveProductsPayload,
      "商品加载失败"
    );
  }

  function wireProductCreate() {
    const saveBtn = document.getElementById("pc-save-btn");
    if (!saveBtn) return;

    const submitHandler = function (event) {
      const button = event.target && event.target.closest ? event.target.closest("#pc-save-btn") : null;
      if (!button || !canUseApi()) return;
      event.preventDefault();
      event.stopPropagation();
      event.stopImmediatePropagation();
      submitLiveProduct(button);
    };

    document.addEventListener("click", submitHandler, true);
    saveBtn.addEventListener("click", submitHandler, true);

    const search = document.getElementById("search-input");
    if (search) {
      search.addEventListener(
        "input",
        function (event) {
          if (!canUseApi()) return;
          event.stopImmediatePropagation();
          applyLiveProductFilter();
        },
        true
      );
    }
  }

  function renderProductDetail(product) {
    if (!product) return;
      const title = product.title || "";
      const category = product.category || "";
      const target = product.target_audience || "";
      const h1 = document.getElementById("pd-name");
      if (h1 && title) h1.textContent = title;
      setField("name", title);
      setField("cat", category);
      setField("target", target);
      const bulletBox = document.querySelector('[data-field="bullets"] .v-static');
      if (bulletBox && product.selling_points && product.selling_points.length) {
        bulletBox.innerHTML = product.selling_points
          .map(function (point) {
            return '<span class="bullet">' + esc(point.title) + "</span>";
          })
          .join("");
      }
  }

  async function hydrateProductDetail() {
    if (!canUseApi()) return;
    if (page !== "product-detail.html") return;
    const id = query.get("product_id") || localStorage.getItem("airshelf_current_product_id");
    if (!id) return;
    return loadWithCache(
      "product:" + id,
      function () {
        return apiGet("product:" + id, "/api/products/" + encodeURIComponent(id) + "/");
      },
      renderProductDetail,
      "商品详情加载失败"
    );
  }

  function setField(field, value) {
    const row = document.querySelector('[data-field="' + field + '"]');
    if (!row) return;
    const stat = row.querySelector(".v-static");
    const input = row.querySelector(".v-input, .v-select");
    if (stat && value) stat.textContent = value;
    if (input && value) {
      if (input.tagName === "SELECT" && !Array.from(input.options).some(function (option) { return option.value === value; })) {
        const option = document.createElement("option");
        option.textContent = value;
        option.value = value;
        input.insertBefore(option, input.firstChild);
      }
      input.value = value;
    }
  }

  function stageNo(project) {
    const map = { script: 1, base_assets: 2, storyboard: 3, video: 4, export: 5 };
    if (project.status === "completed") return 5;
    return map[project.current_stage] || 1;
  }

  function statusBucket(project) {
    if (project.status === "completed") return "done";
    if (project.status === "failed") return "fail";
    return "wip";
  }

  function projectStatusLabel(project) {
    return {
      draft: "脚本待生成",
      scripting: "脚本生成中",
      asseting: "基础资产生成中",
      storyboarding: "故事板生成中",
      videoing: "视频片段生成中",
      exporting: "导出中",
      completed: "已完成",
      failed: "失败",
    }[project.status] || "进行中";
  }

  function pillClass(project) {
    if (project.status === "completed") return "ok";
    if (project.status === "failed") return "fail";
    return "info";
  }

  function progressHTML(project) {
    const no = stageNo(project);
    let html = "";
    for (let i = 1; i <= 5; i += 1) {
      let cls = "";
      if (project.status === "completed" || i < no) cls = "done";
      else if (i === no) cls = "cur";
      html += '<span class="' + cls + '"></span>';
    }
    return html;
  }

  function projectHref(project) {
    return "pipeline.html?project_id=" + encodeURIComponent(project.id) + "#stage-" + stageNo(project);
  }

  function liveProjectRowHTML(project, productName) {
    const href = projectHref(project);
    const status = statusBucket(project);
    const label = projectStatusLabel(project);
    const shots = (project.video_segments && project.video_segments.length) || 4;
    const no = stageNo(project);
    return (
      '<tr data-live="1" data-project-id="' +
      esc(project.id) +
      '" data-href="' +
      esc(href) +
      '" data-status="' +
      esc(status) +
      '" data-name="' +
      esc(project.name) +
      '">' +
      '<td><div class="proj-name-cell"><div class="placeholder proj-thumb"><span class="ph-frame">9:16</span></div><div><div class="proj-name">' +
      esc(project.name) +
      '</div><div class="proj-sub">' +
      esc(shots) +
      " 镜 · 0-60s</div></div></div></td>" +
      "<td>" +
      esc(productName || "未命名商品") +
      '</td><td><span class="muted">AI 全生</span></td><td><div class="hstack"><div class="prog">' +
      progressHTML(project) +
      '</div><span class="muted-2 mono" style="font-size:11px;">' +
      esc(no) +
      '/5</span></div></td><td><span class="pill ' +
      pillClass(project) +
      '"><span class="dot"></span>' +
      esc(label) +
      '</span></td><td class="muted-2">' +
      esc(dateOnly(project.updated_at)) +
      '</td><td><div class="row-action"><a href="' +
      esc(href) +
      '" title="继续"><svg width="14" height="14" viewBox="0 0 16 16"><path d="M5 4l6 4-6 4z" fill="currentColor"/></svg></a><span class="row-more"><svg width="14" height="14" viewBox="0 0 16 16"><circle cx="3" cy="8" r="1.2" fill="currentColor"/><circle cx="8" cy="8" r="1.2" fill="currentColor"/><circle cx="13" cy="8" r="1.2" fill="currentColor"/></svg></span></div></td></tr>'
    );
  }

  function liveProjectCardHTML(project, productName) {
    const href = projectHref(project);
    const status = statusBucket(project);
    const label = projectStatusLabel(project);
    const shots = (project.video_segments && project.video_segments.length) || 4;
    const no = stageNo(project);
    return (
      '<div class="proj-card" data-live="1" data-project-id="' +
      esc(project.id) +
      '" data-href="' +
      esc(href) +
      '" data-status="' +
      esc(status) +
      '" data-name="' +
      esc(project.name) +
      '">' +
      '<span class="card-check" aria-hidden="true"><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="3 8 7 12 13 4"/></svg></span>' +
      '<button class="card-del-btn" type="button" title="删除项目" data-action="delete-project" data-project-id="' +
      esc(project.id) +
      '"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2"/><path d="M19 6l-1.5 14a2 2 0 01-2 1.8H8.5a2 2 0 01-2-1.8L5 6"/></svg></button>' +
      '<div class="placeholder card-thumb"><span class="ph-frame">9:16 · 阶段 ' +
      esc(no) +
      '/5</span></div><div class="card-body"><div><div class="card-name">' +
      esc(project.name) +
      '</div><div class="card-sub" style="margin-top:4px;">' +
      esc(productName || "未命名商品") +
      " · " +
      esc(shots) +
      ' 镜</div></div><div class="hstack"><div class="prog">' +
      progressHTML(project) +
      '</div><span class="muted-2 mono" style="font-size:10.5px;">' +
      esc(no) +
      '/5</span></div><div class="card-foot"><span class="pill ' +
      pillClass(project) +
      '"><span class="dot"></span>' +
      esc(label) +
      '</span><span class="card-time">' +
      esc(dateOnly(project.updated_at)) +
      "</span></div></div></div>"
    );
  }

  function syncProjectCount() {
    const rows = Array.from(document.querySelectorAll("#list-tbody tr"));
    const visible = rows.filter(function (row) {
      return row.style.display !== "none";
    }).length;
    const counts = { total: rows.length, wip: 0, done: 0, fail: 0 };
    rows.forEach(function (row) {
      const s = row.dataset.status;
      if (counts[s] !== undefined) counts[s] += 1;
    });
    const total = document.getElementById("sub-total");
    const wip = document.getElementById("sub-wip");
    const done = document.getElementById("sub-done");
    const fail = document.getElementById("sub-fail");
    if (total) total.textContent = counts.total;
    if (wip) wip.textContent = counts.wip;
    if (done) done.textContent = counts.done;
    if (fail) fail.textContent = counts.fail;
    document.querySelectorAll("#status-tabs .tab").forEach(function (tab) {
      const filter = tab.dataset.filter;
      const n = filter === "all" ? counts.total : counts[filter] || 0;
      const el = tab.querySelector(".count");
      if (el) el.textContent = n;
    });
    const meta = document.getElementById("result-meta");
    if (meta) meta.innerHTML = '// 显示 <span class="count">' + visible + "</span> / " + counts.total + " 个项目";
    setShellBadge("projects.html", counts.total);
    const empty = document.getElementById("empty");
    if (empty) empty.hidden = visible !== 0;
  }

  function applyLiveProjectFilter() {
    const active = document.querySelector("#status-tabs .tab.active");
    const filter = active ? active.dataset.filter : "all";
    const needle = ((document.getElementById("search-input") || {}).value || "").trim().toLowerCase();
    const test = function (el) {
      const statusOk = filter === "all" || el.dataset.status === filter;
      const textOk = !needle || (el.dataset.name || "").toLowerCase().indexOf(needle) >= 0;
      return statusOk && textOk;
    };
    document.querySelectorAll("#list-tbody tr, #grid-body .proj-card").forEach(function (el) {
      el.style.display = test(el) ? "" : "none";
    });
    syncProjectCount();
  }

  function bindLiveProjects() {
    document.querySelectorAll("#list-tbody tr[data-project-id], #grid-body .proj-card[data-project-id]").forEach(function (el) {
      el.addEventListener("click", function (event) {
        if (event.target.closest("button, a, .row-more")) return;
        if (document.body.classList.contains("edit-mode")) {
          event.preventDefault();
          event.stopImmediatePropagation();
          el.classList.toggle("selected");
          return;
        }
        go(el.dataset.href || projectHref({ id: el.dataset.projectId, current_stage: "script", status: "" }));
      });
    });

    document.querySelectorAll('[data-action="delete-project"][data-project-id]').forEach(function (button) {
      button.addEventListener("click", async function (event) {
        event.preventDefault();
        event.stopImmediatePropagation();
        const id = button.dataset.projectId;
        const el = button.closest(".proj-card, tr");
        const name = el ? el.dataset.name : "";
        if (!id || !confirm("确认删除项目「" + name + "」?")) return;
        try {
          await api("/api/projects/" + encodeURIComponent(id) + "/", { method: "DELETE" });
          document.querySelectorAll('[data-project-id="' + CSS.escape(id) + '"]').forEach(function (node) {
            node.remove();
          });
          forgetCache("projects:bundle");
          forgetCache("projects:list");
          forgetCache("dashboard");
          applyLiveProjectFilter();
          toast("已删除", "项目已从 Django 数据库移除");
        } catch (error) {
          toast("删除失败", error.message);
        }
      });
    });

    const search = document.getElementById("search-input");
    if (search) {
      search.addEventListener(
        "input",
        function (event) {
          if (!canUseApi()) return;
          event.stopImmediatePropagation();
          applyLiveProjectFilter();
        },
        true
      );
    }
    document.querySelectorAll("#status-tabs .tab").forEach(function (tab) {
      tab.addEventListener(
        "click",
        function (event) {
          if (!canUseApi()) return;
          event.preventDefault();
          event.stopImmediatePropagation();
          document.querySelectorAll("#status-tabs .tab").forEach(function (x) {
            x.classList.remove("active");
          });
          tab.classList.add("active");
          applyLiveProjectFilter();
        },
        true
      );
    });
  }

  function renderLiveProjectsPayload(payload) {
    const tbody = document.getElementById("list-tbody");
    const grid = document.getElementById("grid-body");
    if (!tbody || !grid) return;
    const productData = payload.products || {};
    const projectData = payload.projects || {};
    const productMap = {};
    (productData.results || []).forEach(function (product) {
      productMap[product.id] = product.title;
    });
    const projects = projectData.results || [];
    tbody.innerHTML = projects.length
      ? projects
        .map(function (project) {
          return liveProjectRowHTML(project, productMap[project.product]);
        })
        .join("")
      : '<tr data-live="1"><td colspan="6" class="muted">// 当前团队还没有真实项目</td></tr>';
    grid.innerHTML = projects.length
      ? projects
        .map(function (project) {
          return liveProjectCardHTML(project, productMap[project.product]);
        })
        .join("")
      : '<div class="empty-filter">// 当前团队还没有真实项目</div>';
    bindLiveProjects();
    applyLiveProjectFilter();
  }

  async function loadLiveProjects() {
    if (!canUseApi()) return;
    const tbody = document.getElementById("list-tbody");
    const grid = document.getElementById("grid-body");
    if (!tbody || !grid) return;
    seedProjectsBundleFromCache();
    return loadWithCache(
      "projects:bundle",
      async function () {
        const productData = await apiGet("products:list", "/api/products/");
        writeCache("products:list", productData);
        const projectData = await apiGet("projects:list", "/api/projects/");
        return { products: productData, projects: projectData };
      },
      renderLiveProjectsPayload,
      "项目加载失败"
    );
  }

  async function ensureProduct(title, category, id) {
    if (id) return api("/api/products/" + encodeURIComponent(id) + "/");
    const data = await api("/api/products/?search=" + encodeURIComponent(title));
    const found = (data.results || []).find(function (product) {
      return product.title === title;
    });
    if (found) return found;
    return api("/api/products/", {
      method: "POST",
      body: JSON.stringify({ title: title, category: category || "" }),
    });
  }

  function selectedWizardProduct() {
    const card = document.querySelector("#step-pane-1 .product-card.selected, #step-pane-1 .product-pick.selected");
    if (!card) return null;
    return {
      id: card.dataset.productId || card.dataset.id || "",
      title: (card.querySelector(".product-name, .name") || {}).textContent || "",
      category: (card.querySelector(".product-cat, .meta") || {}).textContent || "",
    };
  }

  function projectNameFromWizard(productTitle) {
    const inputs = Array.from(document.querySelectorAll("#step-pane-2 input.input"));
    const named = inputs.find(function (input) {
      return input.value && input.value.trim().length >= 2;
    });
    const value = named ? named.value.trim() : "";
    return value || (productTitle ? productTitle + " · AI 视频" : "未命名项目");
  }

  function liveWizardProductHTML(product, index) {
    const title = product.title || "未命名商品";
    const category = product.category || "未分类";
    const date = dateOnly(product.created_at);
    return (
      '<div class="product-card' +
      (index === 0 ? " selected" : "") +
      '" data-live="1" data-product-id="' +
      esc(product.id) +
      '">' +
      '<div class="placeholder product-thumb"><span class="ph-frame">' +
      esc(shortLabel(title)) +
      " · 1200×800</span></div>" +
      '<div class="product-body"><div class="product-name">' +
      esc(title) +
      '</div><div class="product-cat">' +
      esc(category) +
      '</div><div class="product-date">' +
      esc(date) +
      " 创建</div></div></div>"
    );
  }

  function renderLiveWizardProductsPayload(data) {
    const grid = document.querySelector("#step-pane-1 .pp-grid");
    if (!grid) return;
    const products = data.results || [];
    const createCard =
      '<div class="pp-create-card" data-live-create="1"><div class="pc-plus"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"><path d="M12 5v14M5 12h14"/></svg></div><div class="pc-t">新建商品</div><div class="pc-d">// 进入商品库创建</div></div>';
    grid.innerHTML =
      createCard +
      (products.length
        ? products.map(liveWizardProductHTML).join("")
        : '<div class="pp-empty">// 当前团队还没有商品 · 请先新建商品</div>');
    grid.querySelector('[data-live-create="1"]')?.addEventListener("click", function () {
      go("products.html");
    });
    grid.querySelectorAll(".product-card[data-product-id]").forEach(function (card) {
      card.addEventListener("click", function () {
        grid.querySelectorAll(".product-card").forEach(function (node) {
          node.classList.remove("selected");
        });
        card.classList.add("selected");
        const title = (card.querySelector(".product-name") || {}).textContent || "";
        const projectInputs = Array.from(document.querySelectorAll("#step-pane-2 input.input"));
        const target = projectInputs.find(function (input) {
          return input.placeholder && input.placeholder.indexOf("项目") >= 0;
        });
        if (target && !target.value.trim()) target.value = title + " · 痛点种草 · v1";
      });
    });
    const meta = document.querySelector("#step-pane-1 .pp-result-meta");
    if (meta) meta.textContent = "// 显示 " + products.length + " / " + products.length + " 个真实商品";
    document.querySelectorAll(".btn-start.disabled").forEach(function (button) {
      button.classList.remove("disabled");
    });
  }

  async function loadLiveWizardProducts() {
    if (page !== "projects-new.html" || !canUseApi()) return;
    const grid = document.querySelector("#step-pane-1 .pp-grid");
    if (!grid) return;
    return loadWithCache(
      "products:list",
      function () {
        return apiGet("products:list", "/api/products/");
      },
      renderLiveWizardProductsPayload,
      "商品加载失败"
    );
  }

  function wireProjectWizard() {
    if (page !== "projects-new.html") return;
    if (!window._wiz || typeof window._wiz.startGenerate !== "function") return;
    const original = window._wiz.startGenerate;
    window._wiz.startGenerate = async function () {
      if (!canUseApi()) return original();
      const picked = selectedWizardProduct();
      if (!picked || !picked.title.trim()) {
        toast("请选择商品", "项目必须绑定一个商品");
        return;
      }
      const startBtn = document.querySelector(".btn-start");
      const restore = setButtonBusy(startBtn, "创建项目中...");
      try {
        const product = await ensureProduct(picked.title.trim(), picked.category.trim(), picked.id);
        const project = await api("/api/projects/", {
          method: "POST",
          body: JSON.stringify({
            name: projectNameFromWizard(product.title),
            product: product.id,
          }),
        });
        forgetCache("projects:bundle");
        forgetCache("projects:list");
        forgetCache("dashboard");
        localStorage.setItem("airshelf_current_project_id", project.id);
        toast("项目已创建", "已写入 Django,进入生产管线");
        go(
          "pipeline.html?project_id=" +
            encodeURIComponent(project.id) +
            "&product=" +
            encodeURIComponent(product.title || picked.title) +
            "#stage-1"
        );
      } catch (error) {
        restore();
        toast("创建项目失败", error.message);
      }
    };
  }

  function money(value) {
    const n = Number(value || 0);
    return "¥" + n.toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  }

  function plainMoney(value) {
    const n = Number(value || 0);
    return "¥" + n.toFixed(2);
  }

  function roleUi(role) {
    if (role === "owner" || role === "super") return { key: "super", label: "超管" };
    if (role === "admin") return { key: "admin", label: "团管" };
    if (role === "viewer") return { key: "member", label: "访客" };
    return { key: "member", label: "成员" };
  }

  function displayName(user) {
    const raw = String(user?.username || user?.email || "成员").trim();
    if (raw.indexOf("@") > 0) return raw.split("@")[0];
    return raw || "成员";
  }

  function userPublicId(user) {
    const id = String(user?.id || "").replace(/-/g, "").toUpperCase();
    return id ? "USR-" + id.slice(0, 12) : "USR-UNKNOWN";
  }

  function initial(name) {
    return String(name || "U").trim().slice(0, 1).toUpperCase() || "U";
  }

  function stageLabel(project) {
    return {
      script: "Stage 1 脚本",
      base_assets: "Stage 2 基础资产",
      storyboard: "Stage 3 故事板",
      video: "Stage 4 视频",
      export: "Stage 5 导出",
    }[project.current_stage] || "Stage 1 脚本";
  }

  function assetTab(asset) {
    const category = asset.category || "";
    if (category === "person") return "people";
    if (category === "scene") return "scenes";
    if (category === "product_image") return "products";
    if (category === "final_video" || category === "video_clip") return "finals";
    if (category === "upload") return "uploads";
    return "unclassified";
  }

  function assetMeta(asset, tab) {
    const source = asset.source === "ai_generated" ? "AI 生成" : asset.source === "exported" ? "导出" : "手动上传";
    const type = asset.asset_type === "video" ? "视频" : "图片";
    if (tab === "people") return "人物 · " + source + " · 用过 0 次";
    if (tab === "scenes") return "场景 · " + source + " · 用过 0 次";
    if (tab === "products") return "商品图 · " + source + " · 用过 0 次";
    if (tab === "finals") return "成片 · " + type + " · " + dateOnly(asset.created_at);
    return type + " · " + source + " · " + dateOnly(asset.created_at);
  }

  function liveAssetCardHTML(asset, tab) {
    const file = asset.files && asset.files[0];
    const isVideo = asset.asset_type === "video";
    const preview = file && file.preview_url;
    const thumb = preview
      ? isVideo
        ? '<video src="' + esc(preview) + '" muted playsinline style="width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit;"></video>'
        : '<img src="' + esc(preview) + '" alt="" style="width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit;">'
      : '<span class="ph-frame">' + esc(shortLabel(asset.name)) + "</span>";
    return (
      '<div class="asset-card' +
      (isVideo ? " video" : "") +
      '" data-live="1" data-asset-id="' +
      esc(asset.id) +
      '" data-name="' +
      esc(asset.name) +
      '" data-source="' +
      esc(asset.source || "") +
      '">' +
      '<span class="card-check" aria-hidden="true"><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="3 8 7 12 13 4"/></svg></span>' +
      '<div class="placeholder asset-thumb">' +
      thumb +
      '</div><div class="asset-body"><div class="asset-name">' +
      esc(asset.name || "未命名资产") +
      '</div><div class="asset-meta">' +
      esc(assetMeta(asset, tab)) +
      "</div></div></div>"
    );
  }

  function applyLiveAssetTab(tab) {
    const assets = window.__airshelfLiveAssets || [];
    document.querySelectorAll("#asset-tabs .tab").forEach(function (node) {
      node.classList.toggle("active", node.dataset.tab === tab);
    });
    document.querySelectorAll(".asset-grid[data-tab]").forEach(function (grid) {
      grid.hidden = grid.dataset.tab !== tab;
    });
    const grid = document.getElementById("grid-" + tab);
    const queryText = ((document.getElementById("search-input") || {}).value || "").trim().toLowerCase();
    let visible = 0;
    if (grid) {
      grid.querySelectorAll(".asset-card").forEach(function (card) {
        const ok = !queryText || (card.dataset.name || "").toLowerCase().indexOf(queryText) >= 0;
        card.style.display = ok ? "" : "none";
        if (ok) visible += 1;
      });
    }
    const total = assets.filter(function (asset) {
      return assetTab(asset) === tab;
    }).length;
    const meta = document.getElementById("result-meta");
    if (meta) meta.innerHTML = '// 显示 <span class="count">' + visible + "</span> / " + total + " 个资产";
  }

  function renderLiveAssetsPayload(data) {
    const assets = data.results || [];
    window.__airshelfLiveAssets = assets;
    const tabs = ["people", "scenes", "products", "finals", "uploads", "unclassified"];
    tabs.forEach(function (tab) {
      const grid = document.getElementById("grid-" + tab);
      if (!grid) return;
      const list = assets.filter(function (asset) {
        return assetTab(asset) === tab;
      });
      grid.innerHTML = list.length
        ? list
            .map(function (asset) {
              return liveAssetCardHTML(asset, tab);
            })
            .join("")
        : '<div class="empty-filter">// 当前分类暂无真实资产</div>';
      const count = document.querySelector('#asset-tabs .tab[data-tab="' + tab + '"] .count');
      if (count) count.textContent = String(list.length);
    });
    const counts = tabs.reduce(function (acc, tab) {
      acc[tab] = assets.filter(function (asset) {
        return assetTab(asset) === tab;
      }).length;
      return acc;
    }, {});
    const people = document.getElementById("sub-people");
    const scenes = document.getElementById("sub-scenes");
    const products = document.getElementById("sub-products");
    const finals = document.getElementById("sub-finals");
    if (people) people.textContent = String(counts.people || 0);
    if (scenes) scenes.textContent = String(counts.scenes || 0);
    if (products) products.textContent = String(counts.products || 0);
    if (finals) finals.textContent = String(counts.finals || 0);
    const active = document.querySelector("#asset-tabs .tab.active");
    applyLiveAssetTab(active ? active.dataset.tab : "people");
  }

  async function loadLiveAssets() {
    if (page !== "library.html" || !canUseApi()) return;
    return loadWithCache(
      "assets:list",
      function () {
        return apiGet("assets:list", "/api/assets/");
      },
      renderLiveAssetsPayload,
      "资产加载失败"
    );
  }

  let assetUploadInFlight = false;

  async function submitLiveAsset(submit) {
    if (!canUseApi()) return false;
    if (assetUploadInFlight) return true;

    const file = document.getElementById("upload-file")?.files?.[0];
    const name = (document.getElementById("upload-name")?.value || "").trim();
    const kind = document.getElementById("upload-kind")?.value || "uploads";
    if (!file) {
      toast("请选择文件", "资产上传需要真实文件");
      return true;
    }
    if (!name) {
      toast("请填写资产名称", "必填项");
      return true;
    }
    const categoryMap = {
      people: "person",
      scenes: "scene",
      products: "product_image",
      finals: "final_video",
      uploads: "upload",
      unclassified: "uncategorized",
    };
    const form = new FormData();
    form.append("file", file);
    form.append("name", name);
    form.append("asset_type", kind === "finals" ? "video" : "image");
    form.append("category", categoryMap[kind] || "upload");
    assetUploadInFlight = true;
    const restore = setButtonBusy(submit, "上传中...");
    try {
      await api("/api/assets/upload/", { method: "POST", body: form });
      forgetCache("assets:list");
      forgetCache("dashboard");
      if (window.Shell) Shell.closeModal("upload-modal-bg");
      toast("资产已上传", "已写入 TOS 与资产表");
      await loadLiveAssets();
    } catch (error) {
      toast("上传失败", error.message);
    } finally {
      assetUploadInFlight = false;
      restore();
    }
    return true;
  }

  function wireLiveAssets() {
    if (page !== "library.html") return;
    document.querySelectorAll("#asset-tabs .tab").forEach(function (tab) {
      tab.addEventListener(
        "click",
        function (event) {
          if (!canUseApi()) return;
          event.preventDefault();
          event.stopImmediatePropagation();
          applyLiveAssetTab(tab.dataset.tab);
        },
        true
      );
    });
    const search = document.getElementById("search-input");
    if (search) {
      search.addEventListener(
        "input",
        function (event) {
          if (!canUseApi()) return;
          event.stopImmediatePropagation();
          const active = document.querySelector("#asset-tabs .tab.active");
          applyLiveAssetTab(active ? active.dataset.tab : "people");
        },
        true
      );
    }
    const submit = document.getElementById("upload-submit");
    if (!submit) return;
    const submitHandler = function (event) {
      const button = event.target && event.target.closest ? event.target.closest("#upload-submit") : null;
      if (!button || !canUseApi()) return;
      event.preventDefault();
      event.stopPropagation();
      event.stopImmediatePropagation();
      submitLiveAsset(button);
    };
    document.addEventListener("click", submitHandler, true);
    submit.addEventListener("click", submitHandler, true);
  }

  function ledgerStageKey(ledger) {
    const text = String(ledger.reason || ledger.ledger_type || ledger.metadata?.stage || ledger.metadata?.task_type || "").toLowerCase();
    if (text.indexOf("video") >= 0 || text.indexOf("seedance") >= 0 || text.indexOf("视频") >= 0) return "video";
    if (text.indexOf("story") >= 0 || text.indexOf("image-2") >= 0 || text.indexOf("故事板") >= 0) return "storyboard";
    if (text.indexOf("asset") >= 0 || text.indexOf("image") >= 0 || text.indexOf("基础资产") >= 0) return "asset";
    if (text.indexOf("script") >= 0 || text.indexOf("llm") >= 0 || text.indexOf("脚本") >= 0) return "script";
    return "other";
  }

  function renderLiveAccountOverview(ledgers, used) {
    const spendByStage = { video: 0, storyboard: 0, asset: 0, script: 0 };
    const daily = {};
    ledgers.forEach(function (ledger) {
      const amount = Math.abs(Math.min(0, Number(ledger.amount || 0)));
      if (!amount) return;
      const key = ledgerStageKey(ledger);
      if (spendByStage[key] !== undefined) spendByStage[key] += amount;
      const day = dateOnly(ledger.created_at);
      daily[day] = (daily[day] || 0) + amount;
    });
    const stageRows = [
      ["video", "视频片段(Seedance)"],
      ["storyboard", "故事板(image-2)"],
      ["asset", "基础资产"],
      ["script", "脚本 LLM"],
    ];
    const stageTotal = stageRows.reduce(function (sum, row) {
      return sum + spendByStage[row[0]];
    }, 0);
    const denominator = Math.max(stageTotal, used, 1);
    const lines = document.querySelectorAll(".stage-pane .usage-line");
    const bars = document.querySelectorAll(".stage-pane .usage-bar > span");
    stageRows.forEach(function (row, index) {
      const value = spendByStage[row[0]];
      const valueEl = lines[index]?.querySelector(".v");
      if (valueEl) valueEl.textContent = money(value);
      if (bars[index]) bars[index].style.width = Math.min(100, (value / denominator) * 100).toFixed(1) + "%";
    });
    const totalEl = document.querySelector(".stage-pane .total .v");
    if (totalEl) totalEl.textContent = money(used || stageTotal);

    const days = Object.keys(daily).sort().slice(-14);
    const values = days.map(function (day) {
      return daily[day] || 0;
    });
    const sum = values.reduce(function (acc, value) {
      return acc + value;
    }, 0);
    const peak = values.reduce(function (max, value) {
      return Math.max(max, value);
    }, 0);
    const trendSum = document.getElementById("trend-sum");
    const trendAvg = document.getElementById("trend-avg");
    const trendPeak = document.getElementById("trend-peak");
    if (trendSum) trendSum.textContent = money(sum);
    if (trendAvg) trendAvg.textContent = money(values.length ? sum / values.length : 0);
    if (trendPeak) trendPeak.textContent = money(peak);
  }

  function renderLiveAccountPayload(payload) {
    const summaryData = payload.summary || {};
    const ledgers = payload.ledgers || [];
    const members = payload.members || [];
    const projectsData = payload.projects || {};
    const productsData = payload.products || {};
    const projects = projectsData.results || [];
    const productMap = {};
    (productsData.results || []).forEach(function (product) {
      productMap[product.id] = product.title;
    });
    const account = summaryData.account || {};
    const used = Math.abs(Number(summaryData.charged_total || 0));
    const memberLimit = members.reduce(function (sum, member) {
      return sum + Math.max(0, Number(member.monthly_credit_limit || 0));
    }, 0);
    const limit = memberLimit || Number(account.balance || 0);
    const left = Math.max(0, limit - used);
    const pct = limit > 0 ? Math.min(100, (used / limit) * 100) : 0;
    const hero = document.querySelector(".balance-hero .v");
    if (hero) hero.textContent = money(account.balance || 0);
    const subValues = document.querySelectorAll(".balance-sub .col .v");
    if (subValues[0]) subValues[0].textContent = money(limit);
    if (subValues[1]) subValues[1].textContent = money(used);
    const subMeta = document.querySelectorAll(".balance-sub .col .meta");
    if (subMeta[1]) subMeta[1].textContent = "// 占比 " + pct.toFixed(1) + "% · " + (pct >= 80 ? "注意" : "健康");
    const meter = document.querySelector(".balance-meter > span");
    if (meter) meter.style.width = pct.toFixed(1) + "%";
    const foot = document.querySelectorAll(".balance-foot-meta span");
    if (foot[0]) foot[0].textContent = "团队月剩余 " + money(left);
    if (foot[1]) foot[1].textContent = "使用率 " + pct.toFixed(1) + "%";
    renderLiveAccountOverview(ledgers, used);
    const billsBody = document.getElementById("bills-body");
    if (billsBody) {
      billsBody.innerHTML = ledgers.length
        ? ledgers
            .map(function (ledger) {
              const n = Number(ledger.amount || 0);
              const cls = n > 0 ? "pos" : n < 0 ? "neg" : "zero";
              return (
                "<tr><td><span class=\"ts\">" +
                esc(dateOnly(ledger.created_at)) +
                '</span></td><td><div>' +
                esc(ledger.reason || ledger.ledger_type) +
                '<div class="ref">' +
                esc(ledger.ledger_type) +
                '</div></div></td><td><span class="muted">' +
                esc(ledger.id) +
                '</span></td><td><span class="who"><span class="av">U</span>成员</span></td><td><span class="status-tag ok">真实</span></td><td class="' +
                cls +
                '">' +
                plainMoney(n) +
                "</td></tr>"
              );
            })
            .join("")
        : '<tr><td colspan="6" class="muted">// 暂无真实账单流水</td></tr>';
    }
    const billsCount = document.getElementById("bills-count");
    if (billsCount) billsCount.textContent = String(ledgers.length);
    const projectBody = document.getElementById("proj-body");
    if (projectBody) {
      projectBody.innerHTML = projects.length
        ? projects
            .map(function (project) {
              const status = statusBucket(project);
              return (
                '<tr><td><strong>' +
                esc(project.name) +
                '</strong></td><td><span class="muted">' +
                esc(productMap[project.product] || "未命名商品") +
                '</span></td><td><span class="who"><span class="av">' +
                initial(members[0]?.user?.username) +
                "</span>" +
                esc(members[0]?.user?.username || "成员") +
                '</span></td><td><span class="muted">' +
                esc(stageLabel(project)) +
                '</span></td><td><span class="status-tag ' +
                (status === "fail" ? "fail" : status === "done" ? "ok" : "wip") +
                '">' +
                esc(projectStatusLabel(project)) +
                '</span></td><td class="neg">¥0.00</td></tr>'
              );
            })
            .join("")
        : '<tr><td colspan="6" class="muted">// 暂无真实项目</td></tr>';
    }
    const projCount = document.getElementById("proj-count");
    if (projCount) projCount.innerHTML = '共 <b style="color:var(--accent-black);">' + projects.length + "</b> 个项目 · 消耗 " + money(used);
    const memberBody = document.getElementById("member-body");
    if (memberBody) {
      memberBody.innerHTML = members.length
        ? members
            .map(function (member) {
              const role = roleUi(member.role);
              const name = member.user?.username || member.user?.email || "成员";
              const limitText = Number(member.monthly_credit_limit || 0) > 0 ? money(member.monthly_credit_limit) : "不限";
              return (
                '<tr><td><span class="who"><span class="av">' +
                initial(name) +
                "</span>" +
                esc(name) +
                '</span></td><td><span class="role-pill role-' +
                role.key +
                '"><span class="dot"></span>' +
                role.label +
                "</span></td><td>0</td><td>" +
                money(0) +
                " / " +
                limitText +
                '</td><td><span class="muted">真实成员表</span></td></tr>'
              );
            })
            .join("")
        : '<tr><td colspan="5" class="muted">// 暂无成员</td></tr>';
    }
    const memCount = document.getElementById("mem-count");
    if (memCount) memCount.innerHTML = '共 <b style="color:var(--accent-black);">' + members.length + "</b> 人 · 合计 " + money(used);
    document.querySelectorAll(".billing-tabs .tab .count").forEach(function (count) {
      const tab = count.closest(".tab")?.dataset.tab;
      if (tab === "by-project") count.textContent = String(projects.length);
      if (tab === "by-member") count.textContent = String(members.length);
      if (tab === "bills") count.textContent = String(ledgers.length);
    });
  }

  async function loadLiveAccount() {
    if (page !== "account.html" || !canUseApi()) return;
    seedAccountBundleFromCache();
    return loadWithCache(
      "account:bundle",
      async function () {
        const summaryData = await apiGet("billing:summary", "/api/billing/summary/");
        writeCache("billing:summary", summaryData);
        const ledgers = await apiGet("billing:ledgers", "/api/billing/ledgers/");
        const members = await apiGet("team:members", "/api/auth/team/members/");
        writeCache("team:members", members);
        const projectsData = await apiGet("projects:list", "/api/projects/");
        const productsData = await apiGet("products:list", "/api/products/");
        writeCache("products:list", productsData);
        return { summary: summaryData, ledgers: ledgers, members: members, projects: projectsData, products: productsData };
      },
      renderLiveAccountPayload,
      "账户数据加载失败"
    );
  }

  function parseMoneyText(text) {
    const n = Number(String(text || "").replace(/[^\d.-]/g, ""));
    return Number.isFinite(n) ? n : 0;
  }

  function liveTopupPayload() {
    const amount = parseMoneyText(document.getElementById("topup-amt")?.textContent || "");
    const bonusText = document.getElementById("topup-bonus")?.textContent || "";
    const bonusMatch = bonusText.match(/含\s*¥?([\d,.]+)/);
    const channelText = document.getElementById("topup-channel-label")?.textContent || "";
    return {
      amount: amount,
      bonus: bonusMatch ? parseMoneyText(bonusMatch[1]) : 0,
      channel: channelText.indexOf("支付宝") >= 0 ? "alipay" : "wechat",
    };
  }

  async function submitLiveTopup() {
    const payload = liveTopupPayload();
    if (payload.amount <= 0) {
      toast("充值金额不正确", "请重新选择金额");
      return;
    }
    try {
      await api("/api/billing/recharge/", {
        method: "POST",
        body: JSON.stringify(payload),
      });
      if (window.Shell) Shell.closeModal("topup-bg");
      forgetCache("billing:summary");
      forgetCache("billing:ledgers");
      forgetCache("account:bundle");
      forgetCache("dashboard");
      toast("充值成功", "已写入 Django 账本");
      await loadLiveAccount();
    } catch (error) {
      toast("充值确认失败", error.message);
    }
  }

  function wireLiveAccount() {
    if (page !== "account.html" || window.__airshelfLiveAccountWired) return;
    window.__airshelfLiveAccountWired = true;
    const fallbackTopupDone = window.topupDone;
    window.topupDone = function () {
      if (!canUseApi()) {
        if (typeof fallbackTopupDone === "function") fallbackTopupDone();
        return;
      }
      submitLiveTopup();
    };
  }

  function liveTeamMemberRowHTML(member) {
    const name = member.user?.first_name || member.user?.username || member.user?.email || "成员";
    const role = roleUi(member.role);
    const monthly = Number(member.monthly_credit_limit || 0);
    const usedPct = monthly > 0 ? Math.min(100, (0 / monthly) * 100) : 0;
    const isOwner = member.role === "owner";
    const actions = isOwner
      ? '<span style="font-family:var(--font-mono);font-size:10.5px;color:var(--black-alpha-32);align-self:center;">不可编辑</span>'
      : '<button class="icon-btn-sm" type="button" data-live-team-action="edit" data-member-id="' +
        esc(member.id) +
        '" title="编辑"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.12 2.12 0 0 1 3 3L12 15l-4 1 1-4z"/></svg></button><button class="icon-btn-sm" type="button" data-live-team-action="password" data-member-id="' +
        esc(member.id) +
        '" title="重置密码"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg></button><button class="icon-btn-sm danger" type="button" data-live-team-action="remove" data-member-id="' +
        esc(member.id) +
        '" title="移出"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg></button>';
    return (
      '<tr data-live="1" data-id="' +
      esc(member.id) +
      '"><td><span class="member-cell"><span class="av">' +
      initial(name) +
      '</span><span><span class="nm">' +
      esc(name) +
      '</span><span class="em">' +
      esc(member.user?.email || "") +
      '</span></span></span></td><td><span class="role-pill role-' +
      role.key +
      '"><span class="dot"></span>' +
      role.label +
      '</span></td><td><span class="quota-cell"><span class="v">不限</span></span></td><td><span class="quota-cell"><span class="v">' +
      (monthly > 0 ? money(monthly) : "不限") +
      '</span></span></td><td><div class="quota-cell"><span class="v">¥0.00</span> <span class="lbl">/ ' +
      usedPct.toFixed(0) +
      '%</span></div><div class="used-bar"><span class="ok" style="width:' +
      usedPct.toFixed(0) +
      '%"></span></div></td><td><div class="acts">' +
      actions +
      "</div></td></tr>"
    );
  }

  function renderLiveTeamMembers(filterText) {
    const tbody = document.getElementById("members-tbody");
    if (!tbody) return;
    const members = window.__airshelfLiveTeamMembers || [];
    const needle = String(filterText || "").trim().toLowerCase();
    const list = members.filter(function (member) {
      const name = member.user?.first_name || member.user?.username || "";
      const email = member.user?.email || "";
      return !needle || (name + " " + email).toLowerCase().indexOf(needle) >= 0;
    });
    tbody.innerHTML = list.length
      ? list.map(liveTeamMemberRowHTML).join("")
      : '<tr data-live="1"><td colspan="6" class="muted">// 没有匹配的真实成员</td></tr>';
    const headingCount = document.querySelector(".members-table")?.closest(".pane")?.querySelector("h3 .ct");
    if (headingCount) headingCount.textContent = "// " + list.length + " / " + members.length + " 人 · 真实团队表";
  }

  function liveMemberById(id) {
    return (window.__airshelfLiveTeamMembers || []).find(function (member) {
      return String(member.id) === String(id);
    });
  }

  function selectedRoleValue(selector, fallback) {
    const selected = document.querySelector(selector + " .role-choice.selected");
    return selected?.dataset.role || selected?.dataset.editRole || fallback || "member";
  }

  async function refreshLiveTeamAfterMutation() {
    forgetCache("team:members");
    forgetCache("team:bundle");
    forgetCache("account:bundle");
    await loadLiveTeam();
  }

  async function submitLiveTeamMember(button) {
    const username = (document.getElementById("inv-username")?.value || "").trim();
    const password = (document.getElementById("inv-password")?.value || "").trim();
    const name = (document.getElementById("inv-name")?.value || "").trim() || username;
    const monthly = Number(document.getElementById("inv-monthly")?.value || 0);
    if (!username || !password) {
      toast("请填写用户名和密码", "成员未创建");
      return;
    }
    const restore = setButtonBusy(button, "创建中...");
    try {
      const member = await api("/api/auth/team/members/", {
        method: "POST",
        body: JSON.stringify({
          username: username,
          password: password,
          name: name,
          role: selectedRoleValue("#invite-bg", "member"),
          monthly_credit_limit: Number.isFinite(monthly) ? monthly : 0,
        }),
      });
      if (window.Shell) Shell.closeModal("invite-bg");
      const shareUser = document.getElementById("share-username");
      const sharePassword = document.getElementById("share-password");
      if (shareUser) shareUser.textContent = username;
      if (sharePassword) sharePassword.textContent = password;
      if (window.Shell) Shell.openModal("invite-share-bg");
      toast("账户已创建", (member.user?.username || username) + " · 已写入团队表");
      await refreshLiveTeamAfterMutation();
    } catch (error) {
      toast("创建成员失败", error.message);
    } finally {
      restore();
    }
  }

  function openLiveTeamEdit(memberId) {
    const member = liveMemberById(memberId);
    if (!member) return;
    window.__airshelfEditingMemberId = memberId;
    const name = member.user?.first_name || member.user?.username || "";
    const title = document.getElementById("edit-username");
    const input = document.getElementById("edit-name-readonly");
    if (title) title.textContent = name;
    if (input) input.value = name;
    document.querySelectorAll("#edit-role-choices .role-choice").forEach(function (choice) {
      choice.classList.toggle("selected", choice.dataset.editRole === member.role || (member.role === "owner" && choice.dataset.editRole === "super"));
    });
    const daily = document.getElementById("edit-daily");
    const monthly = document.getElementById("edit-monthly");
    const total = document.getElementById("edit-total");
    if (daily) daily.value = "-1";
    if (monthly) monthly.value = Number(member.monthly_credit_limit || 0);
    if (total) total.value = "-1";
    if (window.Shell) Shell.openModal("edit-member-bg");
  }

  async function submitLiveTeamMemberEdit(button) {
    const memberId = window.__airshelfEditingMemberId;
    const monthly = Number(document.getElementById("edit-monthly")?.value || 0);
    const restore = setButtonBusy(button, "保存中...");
    try {
      await api("/api/auth/team/members/" + encodeURIComponent(memberId) + "/", {
        method: "PATCH",
        body: JSON.stringify({
          name: (document.getElementById("edit-name-readonly")?.value || "").trim(),
          role: selectedRoleValue("#edit-role-choices", "member"),
          monthly_credit_limit: Number.isFinite(monthly) ? monthly : 0,
        }),
      });
      window.__airshelfEditingMemberId = null;
      if (window.Shell) Shell.closeModal("edit-member-bg");
      toast("成员已保存", "已写入 Django 团队表");
      await refreshLiveTeamAfterMutation();
    } catch (error) {
      toast("保存成员失败", error.message);
    } finally {
      restore();
    }
  }

  function openLiveTeamPassword(memberId) {
    const member = liveMemberById(memberId);
    if (!member) return;
    window.__airshelfPasswordMemberId = memberId;
    const name = member.user?.first_name || member.user?.username || "成员";
    const title = document.getElementById("reset-pwd-name");
    if (title) title.textContent = name;
    const input = document.getElementById("reset-pwd-input");
    if (input && !input.value.trim()) input.value = "Airshelf" + Math.floor(100000 + Math.random() * 900000);
    if (window.Shell) Shell.openModal("reset-pwd-bg");
  }

  async function submitLiveTeamPassword(button) {
    const memberId = window.__airshelfPasswordMemberId;
    const password = (document.getElementById("reset-pwd-input")?.value || "").trim();
    const restore = setButtonBusy(button, "重置中...");
    try {
      await api("/api/auth/team/members/" + encodeURIComponent(memberId) + "/password/", {
        method: "POST",
        body: JSON.stringify({ password: password }),
      });
      window.__airshelfPasswordMemberId = null;
      if (window.Shell) Shell.closeModal("reset-pwd-bg");
      toast("密码已重置", "成员旧会话已失效");
    } catch (error) {
      toast("重置密码失败", error.message);
    } finally {
      restore();
    }
  }

  async function removeLiveTeamMember(memberId) {
    const member = liveMemberById(memberId);
    const name = member?.user?.first_name || member?.user?.username || "成员";
    if (!confirm("确定将「" + name + "」移出团队?")) return;
    try {
      await api("/api/auth/team/members/" + encodeURIComponent(memberId) + "/", { method: "DELETE" });
      toast("成员已移出", name);
      await refreshLiveTeamAfterMutation();
    } catch (error) {
      toast("移出失败", error.message);
    }
  }

  function runLiveTeamAction(action, memberId) {
    if (action === "edit") openLiveTeamEdit(memberId);
    if (action === "password") openLiveTeamPassword(memberId);
    if (action === "remove") removeLiveTeamMember(memberId);
  }

  function wireLiveTeam() {
    if (page !== "team.html" || window.__airshelfLiveTeamWired) return;
    window.__airshelfLiveTeamWired = true;
    const search = document.getElementById("member-search");
    if (search) {
      search.addEventListener(
        "input",
        function (event) {
          if (!canUseApi()) return;
          event.stopImmediatePropagation();
          renderLiveTeamMembers(search.value);
        },
        true
      );
    }
    document.addEventListener(
      "click",
      function (event) {
        if (!canUseApi()) return;
        const actionButton = event.target && event.target.closest ? event.target.closest("[data-live-team-action]") : null;
        if (actionButton) {
          event.preventDefault();
          event.stopImmediatePropagation();
          runLiveTeamAction(actionButton.dataset.liveTeamAction, actionButton.dataset.memberId);
          return;
        }
        const createButton = event.target && event.target.closest ? event.target.closest("#inv-send") : null;
        if (createButton) {
          event.preventDefault();
          event.stopImmediatePropagation();
          submitLiveTeamMember(createButton);
          return;
        }
        const editButton = event.target && event.target.closest ? event.target.closest("#edit-save") : null;
        if (editButton && window.__airshelfEditingMemberId) {
          event.preventDefault();
          event.stopImmediatePropagation();
          submitLiveTeamMemberEdit(editButton);
          return;
        }
        const pwdButton = event.target && event.target.closest ? event.target.closest("#reset-pwd-confirm") : null;
        if (pwdButton && window.__airshelfPasswordMemberId) {
          event.preventDefault();
          event.stopImmediatePropagation();
          submitLiveTeamPassword(pwdButton);
        }
      },
      true
    );
  }

  function renderLiveTeamActivity(members) {
    const feed = document.querySelector(".team-feed .feed-list");
    if (feed) {
      const count = members.length;
      feed.innerHTML =
        '<div class="feed-item"><div class="av">Q</div><div><div class="txt"><span class="who">真实团队表</span><span class="act">已同步</span><span class="obj">' +
        esc(count) +
        ' 名成员</span></div><div class="ts">local cache</div></div></div>';
    }
    const feedCount = document.querySelector(".team-feed .h .ct");
    if (feedCount) feedCount.textContent = "// 真实动态接口待接入";
    const more = document.getElementById("open-feed-all");
    if (more) more.hidden = true;
    const allList = document.getElementById("feed-all-list");
    if (allList) allList.innerHTML = '<div class="feed-empty">// 暂无真实团队动态</div>';
    const allCount = document.getElementById("feed-all-count");
    if (allCount) allCount.textContent = "// 共 0 条";
    const allMeta = document.getElementById("feed-all-meta");
    if (allMeta) allMeta.textContent = "// 共 0 条";
  }

  function renderLiveTeamPayload(payload) {
    const meData = payload.me || {};
    const summaryData = payload.summary || {};
    const members = payload.members || [];
    rememberAuthShape(meData);
    window.__airshelfLiveTeamMembers = members;
    const account = summaryData.account || {};
    const used = Number(summaryData.charged_total || 0);
    const limit = members.reduce(function (sum, member) {
      return sum + Math.max(0, Number(member.monthly_credit_limit || 0));
    }, 0) || Number(account.balance || 0);
    const left = Math.max(0, limit - used);
    const pct = limit > 0 ? Math.min(100, (used / limit) * 100) : 0;
    const nameEl = document.querySelector(".banner-id .nm");
    if (nameEl) nameEl.innerHTML = esc(meData.team?.name || "团队") + ' <span class="tag">企业</span>';
    const metaEl = document.querySelector(".banner-id .meta");
    if (metaEl) metaEl.textContent = "// 团队 ID: " + (meData.team?.id || "-") + " · " + members.length + " 名成员";
    const statValues = document.querySelectorAll(".banner-stats .stat .v");
    if (statValues[0]) statValues[0].textContent = money(account.balance || 0);
    if (statValues[1]) statValues[1].textContent = money(limit);
    if (statValues[2]) statValues[2].textContent = money(used);
    if (statValues[3]) statValues[3].textContent = money(left);
    const usedSub = document.getElementById("stat-used-sub");
    const leftSub = document.getElementById("stat-left-sub");
    if (usedSub) usedSub.textContent = "// 占月限 " + pct.toFixed(1) + "%";
    if (leftSub) leftSub.textContent = "// 还可生成约 " + Math.max(0, Math.round(left / 10)) + " 个项目";
    renderLiveTeamActivity(members);
    renderLiveTeamMembers((document.getElementById("member-search") || {}).value || "");
  }

  async function loadLiveTeam() {
    if (page !== "team.html" || !canUseApi()) return;
    seedTeamBundleFromCache();
    return loadWithCache(
      "team:bundle",
      async function () {
        const meData = await apiGet("auth:me", "/api/auth/me/");
        writeCache("auth:me", meData);
        const summaryData = await apiGet("billing:summary", "/api/billing/summary/");
        writeCache("billing:summary", summaryData);
        const members = await apiGet("team:members", "/api/auth/team/members/");
        writeCache("team:members", members);
        return { me: meData, summary: summaryData, members: members };
      },
      renderLiveTeamPayload,
      "团队数据加载失败"
    );
  }

  function renderLivePipelinePayload(payload) {
    const project = payload.project;
    const productsData = payload.products || {};
    if (!project) return;
    const productMap = {};
    (productsData.results || []).forEach(function (product) {
      productMap[product.id] = product;
    });
    localStorage.setItem("airshelf_current_project_id", project.id);
    const product = productMap[project.product] || {};
    const productName = product.title || "未命名商品";
    const title = document.querySelector(".pipeline-topbar-title");
    if (title) {
      title.innerHTML =
        '<div style="font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">' +
        esc(project.name) +
        '</div><div class="mono">// ' +
        esc(productName) +
        " · " +
        esc(projectStatusLabel(project)) +
        "</div>";
    }
    ["asset-prod-name", "asset-prod-card-name"].forEach(function (id) {
      const el = document.getElementById(id);
      if (el) el.textContent = productName;
    });
    const thumb = document.getElementById("asset-prod-thumb-label");
    if (thumb) thumb.textContent = productName + " · 主图";
    const cat = document.querySelector("#asset-prod-card .prod-cat");
    if (cat) cat.textContent = product.category || "未分类";
    const date = document.querySelector("#asset-prod-card .prod-date");
    if (date) date.textContent = dateOnly(product.created_at) + " 创建";
    const activeNo = stageNo(project);
    document.querySelectorAll("#stage-pill .sp-dot").forEach(function (dot) {
      const no = Number(dot.dataset.stage);
      dot.classList.toggle("done", project.status === "completed" || no < activeNo);
      dot.classList.toggle("active", no === activeNo && project.status !== "completed");
      dot.classList.toggle("fail", project.status === "failed" && no === activeNo);
    });
    document.querySelectorAll("#stage-pill .sp-line").forEach(function (line, index) {
      line.classList.toggle("done", index + 1 < activeNo || project.status === "completed");
    });
  }

  async function loadLivePipeline() {
    if (page !== "pipeline.html" || !canUseApi()) return;
    const projectId = query.get("project_id") || localStorage.getItem("airshelf_current_project_id");
    return loadWithCache(
      "pipeline:" + (projectId || "latest"),
      async function () {
        const productsData = await apiGet("products:list", "/api/products/");
        writeCache("products:list", productsData);
        let project = null;
        if (projectId) project = await apiGet("project:" + projectId, "/api/projects/" + encodeURIComponent(projectId) + "/");
        if (!project) {
          const data = await apiGet("projects:list", "/api/projects/");
          project = (data.results || [])[0];
        }
        return new Promise(function (resolve) {
          setTimeout(function () {
            resolve({ products: productsData, project: project });
          }, 120);
        });
      },
      renderLivePipelinePayload,
      "Pipeline 数据加载失败"
    );
  }

  function monthStart() {
    const now = new Date();
    return new Date(now.getFullYear(), now.getMonth(), 1);
  }

  function isThisMonth(value) {
    if (!value) return false;
    const date = new Date(value);
    return !Number.isNaN(date.getTime()) && date >= monthStart();
  }

  function moneyHTML(value) {
    const text = money(value).replace("¥", "");
    const parts = text.split(".");
    return "¥" + esc(parts[0]) + (parts[1] ? "<small>." + esc(parts[1]) + "</small>" : "");
  }

  function dashboardRecentRowHTML(project, productMap) {
    const product = productMap[project.product] || {};
    const productName = product.title || "未命名商品";
    const href = projectHref(project);
    const shots = (project.video_segments && project.video_segments.length) || 4;
    return (
      '<a class="recent-row" data-live="1" href="' +
      esc(href) +
      '"><div class="placeholder thumb"><span class="ph-frame">9:16</span></div><div class="recent-meta"><div class="name">' +
      esc(project.name || "未命名项目") +
      '</div><div class="sub">' +
      esc(productName) +
      " / AI 全生 / " +
      esc(shots) +
      ' 镜</div></div><div class="prog">' +
      progressHTML(project) +
      '</div><span class="pill ' +
      pillClass(project) +
      '"><span class="dot"></span>' +
      esc(projectStatusLabel(project)) +
      '</span><span class="btn btn-sm">' +
      (project.status === "completed" ? "打开" : "继续") +
      "</span></a>"
    );
  }

  function renderLiveDashboardPayload(payload) {
    const meData = payload.me || {};
    const summaryData = payload.summary || {};
    const productsData = payload.products || {};
    const projectsData = payload.projects || {};
    const assetsData = payload.assets || {};
    rememberAuthShape(meData);

    const projects = projectsData.results || [];
    const products = productsData.results || [];
    const assets = assetsData.results || [];
    const productMap = {};
    products.forEach(function (product) {
      productMap[product.id] = product;
    });
    const wip = projects.filter(function (project) {
      return project.status !== "completed" && project.status !== "failed";
    }).length;
    const done = projects.filter(function (project) {
      return project.status === "completed";
    }).length;
    const monthDone = projects.filter(function (project) {
      return project.status === "completed" && isThisMonth(project.updated_at || project.created_at);
    }).length;
    const failed = projects.filter(function (project) {
      return project.status === "failed";
    }).length;
    const balance = Number(summaryData.account?.balance || 0);
    const charged = Number(summaryData.charged_total || 0);
    const budget = Math.max(balance + charged, 1);
    const budgetPct = Math.min(100, (charged / budget) * 100);

    const h1 = document.querySelector(".page-head h1");
    if (h1) h1.textContent = "欢迎回来，" + displayName(meData.user);
    const sub = document.querySelector(".page-head .sub");
    if (sub) {
      const now = new Date();
      const day = new Intl.DateTimeFormat("zh-CN", { month: "2-digit", day: "2-digit", weekday: "short" }).format(now);
      sub.innerHTML =
        '<span class="mono">// ' +
        esc(day.replace(/\//g, ".")) +
        '</span><span>·</span><span>你有 <b style="color:var(--accent-black)">' +
        esc(wip) +
        " 个项目</b> 正在进行中</span>";
    }

    const stats = document.querySelectorAll(".stats .stat");
    if (stats[0]) {
      const v = stats[0].querySelector(".v");
      const d = stats[0].querySelector(".delta");
      if (v) v.textContent = String(projects.length);
      if (d) d.textContent = "本月完成 " + monthDone;
    }
    if (stats[1]) {
      const v = stats[1].querySelector(".v");
      const d = stats[1].querySelector(".delta");
      if (v) v.textContent = String(wip);
      if (d) d.textContent = failed ? failed + " 个失败需处理" : "全部正常推进";
    }
    if (stats[2]) {
      const v = stats[2].querySelector(".v");
      const d = stats[2].querySelector(".delta");
      if (v) v.textContent = String(monthDone || done);
      if (d) d.textContent = "累计完成 " + done;
    }
    if (stats[3]) {
      const v = stats[3].querySelector(".v");
      const bar = stats[3].querySelector(".bar span");
      const subText = stats[3].querySelector(".sub");
      if (v) v.innerHTML = moneyHTML(balance);
      if (bar) bar.style.width = budgetPct.toFixed(0) + "%";
      if (subText) subText.textContent = "已用 " + money(charged) + " / " + money(budget);
    }

    const more = document.querySelector(".dash-grid .section-h .more[href='projects.html']");
    if (more) more.textContent = "[ ALL · " + projects.length + " ]";
    const recentBox = document.querySelector(".card-hard");
    if (recentBox) {
      const recent = projects.slice(0, 5);
      recentBox.innerHTML = recent.length
        ? recent
            .map(function (project) {
              return dashboardRecentRowHTML(project, productMap);
            })
            .join("")
        : '<div class="recent-row" style="grid-template-columns:1fr;cursor:default;">// 当前团队还没有真实项目</div>';
    }
    const shortcutData = [
      products.length + " SKU",
      "资产 " + assets.length + " 个",
      money(balance),
      projects.length + " 个",
    ];
    document.querySelectorAll(".shortcut .d").forEach(function (el, index) {
      if (shortcutData[index]) el.textContent = shortcutData[index];
    });
  }

  async function loadLiveDashboard() {
    if (page !== "index.html" || !canUseApi()) return;
    return loadWithCache(
      "dashboard",
      async function () {
        const meData = await apiGet("auth:me", "/api/auth/me/");
        writeCache("auth:me", meData);
        const summaryData = await apiGet("billing:summary", "/api/billing/summary/");
        writeCache("billing:summary", summaryData);
        const productsData = await apiGet("products:list", "/api/products/");
        writeCache("products:list", productsData);
        const projectsData = await apiGet("projects:list", "/api/projects/");
        const assetsData = await apiGet("assets:list", "/api/assets/");
        writeCache("assets:list", assetsData);
        return { me: meData, summary: summaryData, products: productsData, projects: projectsData, assets: assetsData };
      },
      renderLiveDashboardPayload,
      "工作台数据加载失败"
    );
  }

  function settingsRowByLabel(label) {
    return Array.from(document.querySelectorAll("#sec-profile .form-row")).find(function (row) {
      const lbl = row.querySelector(".lbl");
      return lbl && lbl.textContent.indexOf(label) >= 0;
    });
  }

  function collectSettingsPrefs() {
    const fields = {};
    document.querySelectorAll('[data-track], input[type="checkbox"], select').forEach(function (el) {
      if (!el.id) return;
      fields[el.id] = el.type === "checkbox" ? Boolean(el.checked) : el.value;
    });
    const choices = {};
    ["pref-template", "pref-duration", "pref-subtitle"].forEach(function (id) {
      const selected = document.querySelector("#" + id + " .selected");
      if (selected) choices[id] = selected.dataset.v || selected.textContent.trim();
    });
    const avatar = document.getElementById("prof-avatar-preview");
    return {
      fields: fields,
      choices: choices,
      avatarText: avatar ? avatar.textContent.trim() : "",
    };
  }

  function applySettingsPrefs(prefs) {
    if (!prefs) return;
    Object.keys(prefs.fields || {}).forEach(function (id) {
      const el = document.getElementById(id);
      if (!el) return;
      if (el.type === "checkbox") el.checked = Boolean(prefs.fields[id]);
      else el.value = prefs.fields[id];
    });
    Object.keys(prefs.choices || {}).forEach(function (id) {
      const value = prefs.choices[id];
      document.querySelectorAll("#" + id + " .pref-choice, #" + id + " .dur-chip").forEach(function (node) {
        const nodeValue = node.dataset.v || node.textContent.trim();
        node.classList.toggle("selected", nodeValue === value);
      });
    });
    if (prefs.avatarText) {
      ["prof-avatar-preview", "av-up-preview"].forEach(function (id) {
        const el = document.getElementById(id);
        if (el) el.textContent = prefs.avatarText;
      });
    }
  }

  function renderLiveSettingsPayload(payload) {
    const meData = payload.me || {};
    const members = payload.members || [];
    rememberAuthShape(meData);
    const user = meData.user || {};
    const team = meData.team || {};
    const name = displayName(user);
    const email = user.email || "";
    const phone = user.phone || "";
    const avatar = initial(name);
    const member =
      members.find(function (item) {
        return item.user?.id === user.id || item.user?.email === email;
      }) || members[0] || {};
    const role = roleUi(member.role);

    const avatarEl = document.getElementById("prof-avatar-preview");
    if (avatarEl) avatarEl.textContent = avatar;
    const avatarUp = document.getElementById("av-up-preview");
    if (avatarUp) avatarUp.textContent = avatar;
    const avatarName = document.getElementById("av-up-preview-name");
    if (avatarName) avatarName.textContent = "当前头像 · 默认";
    const avatarInfo = document.getElementById("av-up-preview-info");
    if (avatarInfo) avatarInfo.textContent = "// 系统生成 · 取显示名称首字";

    const nameInput = document.getElementById("prof-name");
    const emailInput = document.getElementById("prof-email");
    const phoneInput = document.getElementById("prof-phone");
    if (nameInput) nameInput.value = name;
    if (emailInput) emailInput.value = email;
    if (phoneInput) phoneInput.value = phone;

    const emailBtn = emailInput?.closest(".val")?.querySelector("button");
    if (emailBtn) emailBtn.onclick = function () { Shell.toast("已发送验证邮件", email || "当前邮箱"); };
    const phoneBtn = phoneInput?.closest(".val")?.querySelector("button");
    if (phoneBtn) phoneBtn.onclick = function () { Shell.toast("已发送短信验证码", phone || "未绑定手机号"); };

    const teamRow = settingsRowByLabel("所属团队");
    if (teamRow) {
      const staticEl = teamRow.querySelector(".static");
      const roleEl = teamRow.querySelector(".role-tag");
      if (staticEl) staticEl.textContent = team.name || "团队";
      if (roleEl) roleEl.innerHTML = '<span class="dot"></span>' + esc(role.label) + (member.role === "owner" ? " · 创建者" : "");
    }
    const idRow = settingsRowByLabel("用户 ID");
    if (idRow) {
      const idEl = idRow.querySelector(".static");
      if (idEl) idEl.textContent = userPublicId(user);
    }

    applySettingsPrefs(readCache("settings:prefs"));
  }

  function wireLiveSettings() {
    if (page !== "settings.html") return;
    const save = document.getElementById("save-btn");
    if (save) {
      save.addEventListener("click", function () {
        setTimeout(function () {
          const invalid = document.querySelector("#sec-profile .input.invalid");
          if (!invalid) {
            writeCache("settings:prefs", collectSettingsPrefs());
            toast("本地设置已更新", "已写入 localStorage, 下次访问会先显示本地数据");
          }
        }, 0);
      });
    }
    const reset = document.getElementById("prof-avatar-reset");
    if (reset) {
      reset.addEventListener("click", function () {
        setTimeout(function () {
          const current = readCache("settings:profile");
          if (current) renderLiveSettingsPayload(current);
        }, 0);
      });
    }
  }

  async function loadLiveSettings() {
    if (page !== "settings.html" || !canUseApi()) return;
    if (!readCache("settings:profile")) {
      const me = cachedAuthShape();
      if (me) {
        writeCache("settings:profile", {
          me: me,
          summary: readCache("billing:summary"),
          members: readCache("team:members") || [],
        });
      }
    }
    return loadWithCache(
      "settings:profile",
      async function () {
        const meData = await apiGet("auth:me", "/api/auth/me/");
        writeCache("auth:me", meData);
        const summaryData = await apiGet("billing:summary", "/api/billing/summary/").catch(function () {
          return null;
        });
        if (summaryData) writeCache("billing:summary", summaryData);
        const members = await apiGet("team:members", "/api/auth/team/members/").catch(function () {
          return [];
        });
        writeCache("team:members", members);
        return { me: meData, summary: summaryData, members: members };
      },
      renderLiveSettingsPayload,
      "设置数据加载失败"
    );
  }

  const messageTypeLabel = { all: "全部", unread: "未读", task: "任务", team: "团队", billing: "计费", system: "系统" };
  const messageTypeIcon = { task: "clapperboard", team: "users", billing: "creditCard", system: "info" };
  const messagePriorityLabel = { ok: "已完成", warn: "需关注", err: "风险", info: "更新" };

  function messageIcon(name) {
    return window.IconKit && typeof window.IconKit.svg === "function" ? window.IconKit.svg(name) : "";
  }

  function messageDate(value) {
    const date = value ? new Date(value) : new Date();
    return Number.isNaN(date.getTime()) ? new Date() : date;
  }

  function messageTimeAgo(value) {
    const diff = Math.max(0, Date.now() - messageDate(value).getTime());
    const minutes = Math.floor(diff / 60000);
    if (minutes < 1) return "刚刚";
    if (minutes < 60) return minutes + "m";
    if (minutes < 1440) return Math.floor(minutes / 60) + "h";
    return Math.floor(minutes / 1440) + "d";
  }

  function messageFullTime(value) {
    const date = messageDate(value);
    const z = function (n) {
      return String(n).padStart(2, "0");
    };
    return date.getFullYear() + "-" + z(date.getMonth() + 1) + "-" + z(date.getDate()) + " " + z(date.getHours()) + ":" + z(date.getMinutes());
  }

  function notificationType(item) {
    return item.type || item.notification_type || "system";
  }

  function notificationUnread(item) {
    if (item.unread !== undefined) return Boolean(item.unread);
    return item.is_read !== true;
  }

  function normalizeNotification(item) {
    const metadata = item.metadata || {};
    const type = notificationType(item);
    return {
      id: String(item.id || item.dedupe_key || item.title || ""),
      type: type,
      priority: item.priority || metadata.priority || "info",
      unread: notificationUnread(item),
      title: item.title || "系统消息",
      brief: item.brief || metadata.brief || "",
      body: item.body || item.brief || metadata.body || "暂无详情。",
      source: item.source || metadata.source || "Airshelf",
      project: item.project_name || metadata.project_name || metadata.project || "系统",
      stage: item.stage || metadata.stage || "通知",
      owner: item.owner_label || metadata.owner || metadata.owner_label || "系统",
      cost: item.cost_label || metadata.cost || metadata.cost_label || "-",
      href: item.related_url || metadata.href || metadata.related_url || "",
      time: item.created_at || item.updated_at || item.time || new Date().toISOString(),
      metadata: metadata,
      raw: item,
    };
  }

  function normalizeNotificationsPayload(data) {
    const rows = listResults(data).map(normalizeNotification).filter(function (item) {
      return item.id;
    });
    const unread = unreadNotificationCount(data);
    return {
      count: collectionCount(data) ?? rows.length,
      unread_count: unread === null || unread === undefined ? rows.filter(function (item) { return item.unread; }).length : unread,
      results: rows,
    };
  }

  function notificationCachePayload(messages) {
    const rows = (messages || []).map(function (message) {
      return {
        id: message.id,
        type: message.type,
        notification_type: message.type,
        priority: message.priority,
        title: message.title,
        brief: message.brief,
        body: message.body,
        source: message.source,
        project_name: message.project,
        stage: message.stage,
        owner_label: message.owner,
        cost_label: message.cost,
        related_url: message.href,
        is_read: !message.unread,
        unread: message.unread,
        created_at: message.time,
        metadata: message.metadata || {},
      };
    });
    return {
      count: rows.length,
      next: null,
      previous: null,
      unread_count: rows.filter(function (item) { return item.unread; }).length,
      results: rows,
    };
  }

  function persistLiveMessages(messages) {
    const payload = notificationCachePayload(messages || []);
    delete requestMemo["notifications:list"];
    writeCache("notifications:list", payload);
    writeCache("notifications:summary", { count: payload.count, unread_count: payload.unread_count });
    return payload;
  }

  function liveMessageState() {
    if (!window.__airshelfLiveMessageState) {
      window.__airshelfLiveMessageState = { tab: "all", q: "", selectedId: null, showLogId: null };
    }
    return window.__airshelfLiveMessageState;
  }

  function liveMessages() {
    return Array.isArray(window.__airshelfLiveMessages) ? window.__airshelfLiveMessages : [];
  }

  function liveVisibleMessages() {
    const state = liveMessageState();
    const q = String(state.q || "").trim().toLowerCase();
    return liveMessages().filter(function (message) {
      if (state.tab === "unread" && !message.unread) return false;
      if (!["all", "unread"].includes(state.tab) && message.type !== state.tab) return false;
      if (!q) return true;
      return [message.title, message.brief, message.body, message.source, message.project, message.stage]
        .join(" ")
        .toLowerCase()
        .indexOf(q) >= 0;
    });
  }

  function liveMessageCounts() {
    const rows = liveMessages();
    return {
      all: rows.length,
      unread: rows.filter(function (message) { return message.unread; }).length,
      task: rows.filter(function (message) { return message.type === "task"; }).length,
      team: rows.filter(function (message) { return message.type === "team"; }).length,
      billing: rows.filter(function (message) { return message.type === "billing"; }).length,
      system: rows.filter(function (message) { return message.type === "system"; }).length,
    };
  }

  function liveMessageTimeline(message) {
    if (Array.isArray(message.metadata?.timeline)) return message.metadata.timeline;
    const created = messageFullTime(message.time);
    const rows = [[created, "通知写入团队消息中心"]];
    if (!message.unread) rows.push([messageFullTime(message.raw?.read_at || message.time), "当前用户已读"]);
    return rows;
  }

  function renderLiveMessageFilters() {
    const box = document.getElementById("msg-filters");
    if (!box) return;
    const state = liveMessageState();
    const c = liveMessageCounts();
    const filters = [
      ["all", "全部", c.all],
      ["unread", "未读", c.unread],
      ["task", "任务", c.task],
      ["team", "团队", c.team],
      ["billing", "计费", c.billing],
      ["system", "系统", c.system],
    ];
    box.innerHTML = filters
      .map(function (filter) {
        return (
          '<button class="msg-filter' +
          (state.tab === filter[0] ? " active" : "") +
          '" type="button" data-live-tab="' +
          esc(filter[0]) +
          '">' +
          esc(filter[1]) +
          '<span class="ct">' +
          esc(filter[2]) +
          "</span></button>"
        );
      })
      .join("");
    box.querySelectorAll("[data-live-tab]").forEach(function (button) {
      button.addEventListener("click", function (event) {
        event.preventDefault();
        event.stopImmediatePropagation();
        state.tab = button.dataset.liveTab || "all";
        renderLiveMessages();
      });
    });
  }

  function renderLiveMessageList() {
    const listEl = document.getElementById("msg-list");
    const countEl = document.getElementById("msg-list-count");
    if (!listEl) return;
    const state = liveMessageState();
    const list = liveVisibleMessages();
    if (countEl) countEl.textContent = "// 显示 " + list.length + " 条";
    if (!list.length) {
      listEl.innerHTML = '<div class="msg-empty">' + messageIcon("search") + "<span>没有符合条件的消息</span></div>";
      return;
    }
    listEl.innerHTML = list
      .map(function (message) {
        return (
          '<button class="msg-item' +
          (state.selectedId === message.id ? " active" : "") +
          (message.unread ? "" : " read") +
          '" type="button" data-live-message-id="' +
          esc(message.id) +
          '"><span class="msg-type-ic ' +
          esc(message.type) +
          '">' +
          messageIcon(messageTypeIcon[message.type] || "info") +
          '</span><span class="msg-item-main"><span class="msg-item-row"><span class="msg-dot"></span><span class="msg-item-title">' +
          esc(message.title) +
          '</span><span class="msg-time">' +
          esc(messageTimeAgo(message.time)) +
          '</span></span><span class="msg-brief">' +
          esc(message.brief) +
          '</span><span class="msg-item-foot"><span class="msg-priority ' +
          esc(message.priority) +
          '">' +
          esc(messagePriorityLabel[message.priority] || "更新") +
          '</span><span class="msg-priority">' +
          esc(message.project) +
          "</span></span></span></button>"
        );
      })
      .join("");
    listEl.querySelectorAll("[data-live-message-id]").forEach(function (button) {
      button.addEventListener("click", function (event) {
        event.preventDefault();
        event.stopImmediatePropagation();
        selectLiveMessage(button.dataset.liveMessageId);
      });
    });
  }

  function renderLiveMessageDetail() {
    const detail = document.getElementById("msg-detail");
    if (!detail) return;
    const state = liveMessageState();
    const list = liveMessages();
    let message = list.find(function (item) {
      return item.id === state.selectedId;
    });
    if (!message) message = liveVisibleMessages()[0] || list[0];
    if (!message) {
      state.selectedId = null;
      detail.innerHTML = '<div class="msg-detail-empty"><div class="ic">' + messageIcon("bell") + "</div><div>暂无消息</div></div>";
      return;
    }
    state.selectedId = message.id;
    const props = [
      ["来源", message.source],
      ["类别", messageTypeLabel[message.type] || "系统"],
      ["项目", message.project],
      ["阶段", message.stage],
      ["负责人", message.owner],
      ["费用", message.cost],
      ["时间", messageFullTime(message.time)],
      ["关联资源", message.href ? '<a href="' + esc(message.href) + '">' + esc(message.project) + " →</a>" : "无"],
    ]
      .map(function (row) {
        return '<span class="k">' + esc(row[0]) + '</span><span class="v">' + row[1] + "</span>";
      })
      .join("");
    const timeline = liveMessageTimeline(message)
      .map(function (row) {
        return '<div class="msg-step"><span class="t">' + esc(row[0]) + '</span><span class="d">' + esc(row[1]) + "</span></div>";
      })
      .join("");
    const primaryAction = message.href
      ? '<button class="btn btn-primary" type="button" data-live-action="goto">进入关联页面</button>'
      : '<button class="btn btn-primary" type="button" data-live-action="settings">通知设置</button>';
    const readAction = message.unread
      ? '<button class="btn" type="button" data-live-action="ack">标为已读</button>'
      : '<button class="btn" type="button" data-live-action="unread">标为未读</button>';
    detail.innerHTML =
      '<div class="msg-detail-body"><div class="msg-detail-top"><span class="msg-type-ic ' +
      esc(message.type) +
      '">' +
      messageIcon(messageTypeIcon[message.type] || "info") +
      '</span><div class="msg-detail-title"><h2>' +
      esc(message.title) +
      '</h2><div class="meta"><span>' +
      esc(message.source) +
      "</span><span>// " +
      esc(messageTypeLabel[message.type] || "系统") +
      "</span><span>" +
      esc(messageFullTime(message.time)) +
      '</span></div></div><span class="msg-priority ' +
      esc(message.priority) +
      '">' +
      esc(messagePriorityLabel[message.priority] || "更新") +
      '</span></div><p class="msg-body-text">' +
      esc(message.body) +
      '</p><div class="msg-props">' +
      props +
      '</div><div class="msg-timeline"><div class="msg-timeline-h">处理记录</div>' +
      timeline +
      '</div></div><div class="msg-detail-f"><button class="btn btn-ghost" type="button" data-live-action="archive">归档</button><button class="btn btn-ghost" type="button" data-live-action="mute">静音同类</button><span class="spacer"></span>' +
      readAction +
      primaryAction +
      "</div>";
    detail.querySelectorAll("[data-live-action]").forEach(function (button) {
      button.addEventListener("click", function (event) {
        event.preventDefault();
        event.stopImmediatePropagation();
        runLiveMessageAction(message.id, button.dataset.liveAction, button);
      });
    });
  }

  function renderLiveMessages() {
    const head = document.getElementById("msg-head-sub");
    const counts = liveMessageCounts();
    if (head) head.textContent = "// " + counts.unread + " 条未读 · " + counts.all + " 条总计";
    renderLiveMessageFilters();
    renderLiveMessageList();
    renderLiveMessageDetail();
    persistLiveMessages(liveMessages());
  }

  function setLiveMessageReadState(id, unread, response) {
    const rows = liveMessages();
    const next = response ? normalizeNotification(response) : null;
    const index = rows.findIndex(function (item) {
      return item.id === id;
    });
    if (index < 0) return;
    if (next) rows[index] = next;
    else rows[index].unread = unread;
    window.__airshelfLiveMessages = rows;
    renderLiveMessages();
  }

  async function markLiveMessageRead(id) {
    const message = liveMessages().find(function (item) {
      return item.id === id;
    });
    if (!message || !message.unread) return;
    setLiveMessageReadState(id, false);
    try {
      const response = await api("/api/ops/notifications/" + encodeURIComponent(id) + "/mark-read/", {
        method: "POST",
        body: JSON.stringify({}),
      });
      setLiveMessageReadState(id, false, response);
    } catch (error) {
      setLiveMessageReadState(id, true);
      toast("已读状态保存失败", error.message);
    }
  }

  async function markLiveMessageUnread(id) {
    setLiveMessageReadState(id, true);
    try {
      const response = await api("/api/ops/notifications/" + encodeURIComponent(id) + "/mark-unread/", {
        method: "POST",
        body: JSON.stringify({}),
      });
      setLiveMessageReadState(id, true, response);
    } catch (error) {
      setLiveMessageReadState(id, false);
      toast("未读状态保存失败", error.message);
    }
  }

  function selectLiveMessage(id) {
    const state = liveMessageState();
    state.selectedId = id;
    renderLiveMessages();
    markLiveMessageRead(id);
  }

  async function archiveLiveMessage(id, button) {
    const message = liveMessages().find(function (item) {
      return item.id === id;
    });
    if (!message) return;
    const restore = setButtonBusy(button, "归档中...");
    try {
      await api("/api/ops/notifications/" + encodeURIComponent(id) + "/archive/", {
        method: "POST",
        body: JSON.stringify({}),
      });
      window.__airshelfLiveMessages = liveMessages().filter(function (item) {
        return item.id !== id;
      });
      const state = liveMessageState();
      state.selectedId = liveMessages()[0]?.id || null;
      renderLiveMessages();
      toast("已归档", message.title);
    } catch (error) {
      toast("归档失败", error.message);
    } finally {
      restore();
    }
  }

  async function markAllLiveMessagesRead(button) {
    const rows = liveMessages();
    if (!rows.length) return;
    const restore = setButtonBusy(button, "保存中...");
    try {
      await api("/api/ops/notifications/mark-all-read/", {
        method: "POST",
        body: JSON.stringify({}),
      });
      rows.forEach(function (message) {
        message.unread = false;
      });
      window.__airshelfLiveMessages = rows;
      renderLiveMessages();
      toast("已全部标为已读", rows.length + " 条消息已写入数据库");
    } catch (error) {
      toast("批量更新失败", error.message);
    } finally {
      restore();
    }
  }

  function runLiveMessageAction(id, action, button) {
    const message = liveMessages().find(function (item) {
      return item.id === id;
    });
    if (!message) return;
    if (action === "goto") {
      go(message.href || "settings.html#sec-notify");
      return;
    }
    if (action === "settings") {
      go("settings.html#sec-notify");
      return;
    }
    if (action === "ack") {
      markLiveMessageRead(id);
      return;
    }
    if (action === "unread") {
      markLiveMessageUnread(id);
      return;
    }
    if (action === "archive") {
      archiveLiveMessage(id, button);
      return;
    }
    if (action === "mute") {
      toast("已记录静音偏好", (messageTypeLabel[message.type] || "系统") + " 类提醒设置入口在通知设置");
    }
  }

  function renderLiveMessagesPayload(data) {
    const payload = normalizeNotificationsPayload(data);
    window.__airshelfLiveMessages = payload.results;
    const state = liveMessageState();
    if (!payload.results.some(function (message) { return message.id === state.selectedId; })) {
      state.selectedId = payload.results[0]?.id || null;
    }
    renderLiveMessages();
  }

  function wireLiveMessages() {
    if (page !== "messages.html" || window.__airshelfLiveMessagesWired) return;
    window.__airshelfLiveMessagesWired = true;
    const search = document.getElementById("msg-search");
    if (search) {
      search.addEventListener(
        "input",
        function (event) {
          if (!canUseApi()) return;
          event.preventDefault();
          event.stopImmediatePropagation();
          liveMessageState().q = search.value.trim();
          renderLiveMessages();
        },
        true
      );
    }
    const markAll = document.getElementById("msg-mark-all");
    if (markAll) {
      markAll.addEventListener(
        "click",
        function (event) {
          if (!canUseApi()) return;
          event.preventDefault();
          event.stopPropagation();
          event.stopImmediatePropagation();
          markAllLiveMessagesRead(markAll);
        },
        true
      );
    }
    const settings = document.getElementById("msg-settings");
    if (settings) {
      settings.addEventListener(
        "click",
        function (event) {
          if (!canUseApi()) return;
          event.preventDefault();
          event.stopImmediatePropagation();
          go("settings.html#sec-notify");
        },
        true
      );
    }
  }

  async function loadLiveMessages() {
    if (page !== "messages.html" || !canUseApi()) return;
    return loadWithCache(
      "notifications:list",
      function () {
        return apiGet("notifications:list", "/api/ops/notifications/");
      },
      renderLiveMessagesPayload,
      "消息加载失败"
    );
  }

  function init() {
    wireAuth();
    ready(function () {
      applyContextHash();
      markHydrationLoading();
      const work = (async function () {
        hydrateShellIdentity();
        if (page === "index.html") await loadLiveDashboard();
        if (page === "products.html") {
          wireProductCreate();
          await loadLiveProducts();
        }
        if (page === "product-detail.html") await hydrateProductDetail();
        if (page === "projects.html") await loadLiveProjects();
        if (page === "projects-new.html") {
          wireProjectWizard();
          await loadLiveWizardProducts();
        }
        if (page === "library.html") {
          wireLiveAssets();
          await loadLiveAssets();
        }
        if (page === "account.html") {
          wireLiveAccount();
          await loadLiveAccount();
        }
        if (page === "settings.html") {
          wireLiveSettings();
          await loadLiveSettings();
        }
        if (page === "team.html") {
          wireLiveTeam();
          await loadLiveTeam();
        }
        if (page === "messages.html") {
          wireLiveMessages();
          await loadLiveMessages();
        }
        if (page === "pipeline.html") await loadLivePipeline();
      })();

      work
        .then(function () {
          applyContextHash();
          markHydrationDone();
        })
        .catch(function (error) {
          markHydrationError(error && error.message);
        });
    });
  }

  window.AirShelfBridge = {
    version: BRIDGE_VERSION,
    api: api,
    isLive: isLive,
    canUseApi: canUseApi,
    loadLiveProducts: loadLiveProducts,
    loadLiveProjects: loadLiveProjects,
    loadLiveDashboard: loadLiveDashboard,
    loadLiveSettings: loadLiveSettings,
    loadLiveMessages: loadLiveMessages,
  };

  init();
})();