PageSourceSearch

https://vip.xiaoxiaodong.ai/favorites

html xiaoxiaodong.ai collected 2026-10-03 23:20:04 UTC 199,212 bytes, 2,514 lines download raw bytes

1<!doctype html>
2<html lang="zh-Hans">
3  <head>
4    
4<script>window.__XXD_LOCALE__="zh-Hans";</script>
4
5    <meta name="xxd-traditional-module" content="/traditional-display.087a176bf9.js">
6    <meta charset="utf-8">
7    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
8    <meta name="robots" content="noindex, nofollow">
9    <link rel="icon" href="/favicon.svg?v=grumpy-bear-tile" type="image/svg+xml">
10    <!-- Warm the image origin early: the LCP element is a catalog thumbnail
11         served from img.xiaoxiaodong.ai, so a cold DNS+TCP+TLS handshake to that
12         third origin otherwise sits on the LCP path. -->
13    <link rel="preconnect" href="https://img.xiaoxiaodong.ai" crossorigin>
14    <link rel="dns-prefetch" href="https://img.xiaoxiaodong.ai">
15    
15<script src="/device-session.5edf265750.js"></script>
15
16    
16<script src="/conversion-analytics.4699856b43.js"></script>
16
17    <!-- Boot prefetch: fire /api/me + public stats + first-grid data and navigation preferences during HTML parse on grid
18         routes so they overlap the deferred app.js download instead of starting
19         only after it executes. app.js reuses window.__XXD_SEED and these
20         in-flight promises (see __XXD_BOOT consumption in app.js), so there is
21         no double fetch; any failure resolves to null and app.js falls back to
22         its own request. size must match STYLE_BATCH_SIZE (36). -->
23    
23<script>
24      (() => {
25        // Mark the document as JS-capable before the body is parsed. Public
26        // open-source pages carry a server-rendered SEO snapshot for crawlers
27        // and no-JS users; the runtime hides that snapshot during hydration so
28        // it cannot flash a second, differently styled grid before the shared
29        // interactive waterfall is ready.
30        document.documentElement.classList.add("has-js-runtime");
31        document.documentElement.classList.add("is-site-footer-pending");
32        try {
33          const a = new Uint32Array(1);
34          if (self.crypto && self.crypto.getRandomValues) self.crypto.getRandomValues(a);
35          const seed = a[0] || (Date.now() % 2147483647);
36          const opt = { credentials: "same-origin", headers: { accept: "application/json" } };
37          const locale = String(window.__XXD_LOCALE__ || (String(location.pathname || "/") === "/en" || String(location.pathname || "/").startsWith("/en/") ? "en" : "zh-CN"));
38          const localizedApiUrl = (value) => {
39            const url = new URL(String(value || ""), location.origin);
40            if (locale === "en" && !url.searchParams.has("locale")) url.searchParams.set("locale", "en");
41            return `${url.pathname}${url.search}${url.hash}`;
42          };
43          const logicalPathname = String(location.pathname || "/").replace(/^\/en(?=\/|$)/, "") || "/";
44          const grab = (u, timeoutMs = 10000) => {
45            const controller = typeof AbortController === "function" ? new AbortController() : null;
46            let timer = 0;
47            const request = fetch(localizedApiUrl(u), { ...opt, ...(controller ? { signal: controller.signal } : {}) })
48              .then((r) => (r.ok ? r.json() : null))
49              .catch(() => null);
50            const timeout = new Promise((resolve) => {
51              timer = setTimeout(() => {
52                resolve(null);
53                controller?.abort();
54              }, timeoutMs);
55            });
56            return Promise.race([request, timeout]).finally(() => clearTimeout(timer));
57          };
58          const firstPath = logicalPathname.split("/").filter(Boolean)[0] || "";
59          const hashRoute = String(location.hash || "").replace(/^#/, "");
60          // Select the initial placeholder before the body paints, including English and legacy links.
61          const isCreateEntry = /^\/image-generator\/?$/.test(logicalPathname)
62            || /^image-generator\/?$/.test(hashRoute);
63          if (isCreateEntry) document.documentElement.classList.add("is-image-create-boot");
64          // Pick the boot skeleton that previews this route's final layout, so
65          // the first paint shows structure instead of a lone status line.
66          const bootLayoutPath = /^(favorites|articles|article\/|settings|image-generator|notifications)(\/|$)/.test(hashRoute)
67            ? hashRoute.split("/")[0] : firstPath;
68          document.documentElement.dataset.bootLayout = isCreateEntry ? "composer"
69            : (!bootLayoutPath || ["prompts", "favorites", "open-source", "image-generator", "media-library"].includes(bootLayoutPath)) ? "waterfall"
70              : ["skills"].includes(bootLayoutPath) || /^\/tools\/github\/?$/.test(logicalPathname) ? "content"
71                : ["articles", "article", "tools", "notifications"].includes(bootLayoutPath) ? "articles"
72                : bootLayoutPath === "settings" ? "settings" : "generic";
73          // Only a boot that is genuinely slow earns visible copy.
74          setTimeout(() => {
75            if (document.body && document.body.classList.contains("is-app-booting")) document.documentElement.classList.add("is-boot-slow");
76          }, 8000);
77          const hashIsStandalone = /^(favorites|articles|article\/|settings|image-generator|notifications)(\/|$)/.test(hashRoute);
78          const shouldBootCatalog = !hashIsStandalone && (!firstPath || firstPath === "prompts");
79          const hashIsFavorites = /^favorites(\/|$)/.test(hashRoute);
80          const favoriteSearch = new URLSearchParams(location.search || "");
81          const isPagedLatestFavorites = /^\/favorites\/prompts\/?$/.test(logicalPathname)
82            && favoriteSearch.get("sort") === "latest"
83            && !favoriteSearch.get("q") && !favoriteSearch.get("color");
84          const shouldBootFavorites = (shouldBootCatalog || firstPath === "favorites" || firstPath === "open-source" || hashIsFavorites)
85            && !isPagedLatestFavorites;
86          const me = window.XxdDeviceSession ? window.XxdDeviceSession.guard(() => grab("/api/me")) : grab("/api/me");
87          const authenticatedRead = (read) => me.then((session) => session?.authenticated ? read(session) : null);
88          const memberCatalogSort = () => "recommended";
89          // Visitor decks of the recommended feeds (src/app/feed-rotation.js):
90          // continue where the previous visit stopped.
91          const feedDeck = (surface) => {
92            const key = surface + ":" + (locale === "en" ? "en" : "zh");
93            let store = {};
94            try { store = JSON.parse(localStorage.getItem("xxdFeedDeck.v1") || "{}") || {}; } catch (e) {}
95            let deck = store[key];
96            if (!deck || !(Math.trunc(Number(deck.seed)) >= 1 && Math.trunc(Number(deck.seed)) <= 256)) {
97              deck = { seed: 1 + Math.floor(Math.random() * 256), from: null };
98              store[key] = deck;
99              try { localStorage.setItem("xxdFeedDeck.v1", JSON.stringify(store)); } catch (e) {}
100            }
101            return { seed: Math.trunc(Number(deck.seed)), from: deck.from ?? null };
102          };
103          const feedDecks = window.__XXD_FEED_DECKS = { member: feedDeck("member"), open: feedDeck("open") };
104          const memberDeckParams = "&seed=" + feedDecks.member.seed + (feedDecks.member.from ? "&from=" + encodeURIComponent(feedDecks.member.from) : "");
105          window.__XXD_SEED = seed;
106          window.__XXD_BOOT = {
107            seed: seed,
108            me,
109            stats: grab("/api/public-stats"),
110            catalogSort: shouldBootCatalog ? me.then(memberCatalogSort) : null,
111            catalog: shouldBootCatalog
112              ? authenticatedRead((session) => grab(`/api/catalog?page=1&size=36&sort=${memberCatalogSort(session)}${session?.is_admin ? "" : "&topics=none"}${memberDeckParams}`))
113              : null,
114            topicNavDefaults: shouldBootCatalog ? authenticatedRead(() => grab("/api/topic-nav/defaults")) : null,
115            topicNavPreferences: shouldBootCatalog ? authenticatedRead(() => grab("/api/topic-nav/preferences")) : null,
116            favorites: shouldBootFavorites ? authenticatedRead(() => grab("/api/favorites")) : null,
117            openSource: null,
118            openSourceParams: ""
119          };
120          if (firstPath === "open-source") {
121            const segments = logicalPathname.split("/").filter(Boolean).map((part) => { try { return decodeURIComponent(part); } catch (err) { return part; } });
122            const search = new URLSearchParams(location.search || "");
123            const params = new URLSearchParams({ page: "1", size: "36", sort: ["popular", "latest"].includes(search.get("sort")) ? search.get("sort") : "recommended" });
124            const q = String(search.get("q") || "").trim();
125            const objectRoute = segments[1] === "style" || segments[1] === "image";
126            if (search.get("kind") === "media" || (segments[1] === "image" && String(segments[2]).startsWith("media~"))) params.set("kind", "media");
127            if (q && !objectRoute) params.set("q", q);
128            if (segments[1] && !objectRoute) params.set("channel", segments[1]);
129            if (params.get("sort") === "recommended" && !params.has("kind")) {
130              params.set("seed", String(feedDecks.open.seed));
131              if (!params.has("q") && !params.has("channel") && feedDecks.open.from) params.set("from", String(feedDecks.open.from));
132            }
133            window.__XXD_BOOT.openSourceParams = params.toString();
134            // An uncached projection can take longer than 10 s. Aborting it would
135            // discard the server work and make the app start the same slow
136            // request again, so this prefetch waits for the real answer.
137            window.__XXD_BOOT.openSource = grab("/api/open-source/images?" + params.toString(), 45000);
138          }
139        } catch (e) {}
140      })();
141    </script>
141
142    
142<script>
143      (() => {
144        try {
145          const t = localStorage.getItem("xxdMemberTheme");
146          if (t === "dark" || t === "light") document.documentElement.dataset.theme = t;
147          if (localStorage.getItem("xxdMemberMono") === "on") document.documentElement.dataset.mono = "on";
148          if (localStorage.getItem("xxdQuietImageMode") === "true") document.documentElement.dataset.bootQuietImages = "on";
149        } catch (e) {}
150      })();
151    </script>
151
152    <link rel="preconnect" href="https://fonts.googleapis.com">
153    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
154    <!-- Load the font CSS non-render-blocking: fetch as a low-priority "print"
155         sheet, then flip to "all" once it arrives. Text paints immediately in
156         the system fallback (the URL carries display=swap) and swaps in the
157         web fonts with no first-paint stall. <noscript> keeps it working with
158         JS disabled. -->
159    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;700&family=Noto+Serif+SC:wght@600;700;900&display=swap" media="print" onload="this.media='all'">
160    <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;700&family=Noto+Serif+SC:wght@600;700;900&display=swap"></noscript>
161    <link rel="stylesheet" href="/styles.f221c28aa9.css">
162    <link rel="stylesheet" href="/admin-user-data.ec6286ca6d.css">
163    <!-- Self-hosted on the Cloudflare origin (reachable in mainland China). The
164         jsdelivr CDN is frequently blocked/throttled there, which left every nav
165         and action icon blank for the core audience. -->
166    
166<script src="/lucide-core.c2c43654fa.js" defer></script>
166
167  <meta property="og:type" content="website">
168    <meta property="og:site_name" content="Xiaoxiaodong">
169    <meta property="og:description" content="小小东精选的 AI 图片提示词、视觉风格、真实成图与会员创作工具。">
170    <meta property="og:url" content="https://vip.xiaoxiaodong.ai/favorites">
171    <meta property="og:image" content="https://vip.xiaoxiaodong.ai/social/default-zh-v1.png">
172    <meta property="og:image:secure_url" content="https://vip.xiaoxiaodong.ai/social/default-zh-v1.png">
173    <meta property="og:image:type" content="image/png">
174    <meta property="og:image:width" content="1200">
175    <meta property="og:image:height" content="630">
176    <meta property="og:image:alt" content="小小东 AI 提示词会员站品牌封面,配有熊头像">
177    <meta name="twitter:card" content="summary_large_image">
178    <meta name="twitter:description" content="小小东精选的 AI 图片提示词、视觉风格、真实成图与会员创作工具。">
179    <meta name="twitter:image" content="https://vip.xiaoxiaodong.ai/social/default-zh-v1.png">
180    <meta name="twitter:image:alt" content="小小东 AI 提示词会员站品牌封面,配有熊头像">
181    <link rel="canonical" href="https://vip.xiaoxiaodong.ai/favorites">
182    <link rel="alternate" hreflang="zh-Hans" href="https://vip.xiaoxiaodong.ai/favorites">
183    <link rel="alternate" hreflang="zh-Hant" href="https://vip.xiaoxiaodong.ai/zh-hant/favorites">
184    <link rel="alternate" hreflang="en" href="https://vip.xiaoxiaodong.ai/en/favorites">
185  <title>心动样张|收藏|小小东</title><meta property="og:title" content="心动样张|收藏|小小东"><meta name="twitter:title" content="心动样张|收藏|小小东"></head>
186  <body class="is-app-booting is-topic-nav-booting" data-locale="zh-Hans">
187    <aside class="app-rail" id="appRail" aria-label="主菜单">
188      <nav class="rail-nav">
189        <span id="railActiveIndicator" class="rail-active-indicator" aria-hidden="true"></span>
190        <span class="rail-boot-skeleton" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i></span>
191        <a href="/" data-app-view="public-home" aria-current="false" aria-label="首页" data-rail-tooltip="首页">
192          <span class="rail-symbol" aria-hidden="true">
193            <svg class="lucide rail-home-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
194              <path pathLength="100" d="m4 10 8-6.5 8 6.5"></path>
195              <path pathLength="100" d="M6 8.5V20h4v-6h4v6h4V8.5"></path>
196            </svg>
197          </span>
198          <em>首页</em>
199        </a>
200        <a href="/" data-app-view="archive" aria-current="page" aria-label="提示词" data-rail-tooltip="提示词">
201          <span class="rail-symbol" aria-hidden="true">
202            <svg class="lucide rail-prompt-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
203              <path pathLength="100" d="m4 10 8-6.5 8 6.5"></path>
204              <path pathLength="100" d="M6 8.5V20h4v-6h4v6h4V8.5"></path>
205            </svg>
206          </span>
207          <em>提示词</em>
208        </a>
209        <a href="/favorites" data-app-view="favorites" aria-label="收藏" aria-current="false" data-rail-tooltip="收藏">
210          <span class="rail-symbol" aria-hidden="true">
211            <svg class="lucide rail-bookmark-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
212              <path pathLength="100" d="M6 3.5h12v17l-6-4-6 4Z"></path>
213            </svg>
214          </span>
215          <em>收藏</em>
216        </a>
217        <a href="/open-source" data-app-view="open-source" aria-label="开源" aria-current="false" data-rail-tooltip="开源">
218          <span class="rail-symbol" aria-hidden="true">
219            <svg class="lucide rail-code-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
220              <path class="rail-code-left" d="m8 6-5 6 5 6"></path>
221              <path class="rail-code-right" d="m16 6 5 6-5 6"></path>
222              <path class="rail-code-slash" pathLength="100" d="m14 4-4 16"></path>
223            </svg>
224          </span>
225          <em>开源</em>
226        </a>
227        <a href="/skills" data-app-view="skills" aria-label="Skills" aria-current="false" data-rail-tooltip="Skills">
228          <span class="rail-symbol" aria-hidden="true">
229            <svg class="lucide rail-skills-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
230              <rect x="4.5" y="4.5" width="6" height="6"></rect>
231              <rect x="13.5" y="4.5" width="6" height="6"></rect>
232              <rect x="4.5" y="13.5" width="6" height="6"></rect>
233              <path class="rail-skills-add" pathLength="100" d="M16.5 13.5v6m-3-3h6"></path>
234            </svg>
235          </span>
236          <em>Skills</em>
237        </a>
238        <a href="/tools" data-app-view="articles" aria-label="工具箱" aria-current="false" data-rail-tooltip="工具箱">
239          <span class="rail-symbol" aria-hidden="true">
240            <svg class="lucide rail-toolbox-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
241              <path class="rail-toolbox-handle" d="M8.5 8V4.5h7V8"></path>
242              <path class="rail-toolbox-body" pathLength="100" d="M3.5 8h17v12h-17Z"></path>
243              <path class="rail-toolbox-lid" pathLength="100" d="M3.5 12.5H10V15h4v-2.5h6.5"></path>
244            </svg>
245          </span>
246          <em>工具箱</em>
247        </a>
248        <button id="articleNotificationButton" class="rail-nav-button article-notification-button" type="button" data-app-view="notifications" aria-label="查看通知文章" aria-pressed="false" aria-current="false" data-rail-tooltip="通知">
249          <span class="rail-symbol" aria-hidden="true">
250            <i data-lucide="bell"></i>
251            <span id="notificationUnreadBadge" class="rail-notify-badge" hidden>0</span>
252          </span>
253          <em>通知</em>
254        </button>
255        <a href="/media-library" data-app-view="admin-media-library" aria-label="共用素材" aria-current="false" data-rail-tooltip="共用素材">
256          <span class="rail-symbol" aria-hidden="true">
257            <svg class="lucide lucide-folder-open rail-folder-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
258              <path class="rail-folder-back" d="M3.5 9.5v-5h6l2.5 2.5h8.5v2.5"></path>
259              <path class="rail-folder-front" d="M3.5 9.5h17v10h-17Z"></path>
260            </svg>
261          </span>
262          <em>共用素材</em>
263        </a>
264        <a href="/image-generator" data-app-view="image-generator" aria-label="作图吧" aria-current="false" data-rail-tooltip="作图吧">
265          <span class="rail-symbol" aria-hidden="true">
266            <svg class="lucide rail-image-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
267              <rect x="3.5" y="3.5" width="17" height="17" pathLength="100"></rect>
268              <circle cx="16.5" cy="7.5" r="1.5"></circle>
269              <path d="m3.5 16.5 6-6 11 10"></path>
270            </svg>
271            <span id="imageGeneratorNotify" class="rail-notify-badge" hidden>0</span>
272          </span>
273          <em>作图吧</em>
274        </a>
275        <button id="openAdminControlPanelButton" class="rail-nav-button admin-control-button" data-rail-action="admin-control" data-rail-tooltip="管理员功能" type="button" aria-label="管理员功能" aria-haspopup="dialog" aria-controls="adminControlPanel" aria-expanded="false" aria-pressed="false" hidden>
276          <span class="rail-symbol admin-control-button-symbol" aria-hidden="true">
277            <i data-lucide="shield"></i>
278            <svg class="admin-control-check ui-icon" viewBox="0 0 24 24" fill="none" aria-hidden="true">
279              <path d="m9.4 12.4 1.8 1.8 3.5-4.1"></path>
280            </svg>
281          </span>
282          <em>管理员功能</em>
283        </button>
284        <button id="railMoreButton" class="rail-nav-button rail-more-button" type="button" aria-label="更多导航" data-rail-tooltip="更多导航" aria-haspopup="dialog" aria-expanded="false" aria-controls="railMoreMenu" popovertarget="railMoreMenu" hidden>
285          <span class="rail-symbol" aria-hidden="true"><i data-lucide="ellipsis"></i></span>
286          <em>更多</em>
287        </button>
288      </nav>
289      <button id="railMember" class="rail-account" type="button" data-rail-tooltip="账号" aria-haspopup="dialog" aria-expanded="false">
290        <span class="rail-symbol rail-account-icon" aria-hidden="true">
291          <i data-lucide="user-round"></i>
292        </span>
293        <em id="railMemberLabel">账号</em>
294      </button>
295    </aside>
296    <div id="railTooltip" class="rail-tooltip" role="tooltip" aria-hidden="true"></div>
297    <div id="railMoreMenu" class="rail-more-menu" popover="auto" role="dialog" aria-label="更多导航">
298      <div id="railMoreItems" class="rail-more-items"></div>
299    </div>
300
301    <div id="catalogMoreMenu" class="media-library-context-menu media-library-more-menu catalog-more-menu" popover="auto" role="menu" aria-label="更多操作" hidden>
302      <div data-catalog-menu-global>
303        <div class="media-library-menu-divider" data-catalog-context-divider role="separator"></div>
304        <button id="localeSwitch" class="media-library-context-menu-item" type="button" role="menuitem" aria-haspopup="menu" aria-expanded="false" data-catalog-language-menu tabindex="-1">
305          <i data-lucide="languages" aria-hidden="true"></i><span>语言偏好</span><span data-current-language class="media-library-sort-current" translate="no"></span><i data-lucide="chevron-right" aria-hidden="true"></i>
306        </button>
307        <button id="openAdminControlPanelMenuButton" class="media-library-context-menu-item" type="button" role="menuitem" aria-haspopup="dialog" aria-expanded="false" aria-controls="adminControlPanel" tabindex="-1" hidden>
308          <i data-lucide="shield" aria-hidden="true"></i><span>管理员面板</span>
309        </button>
310        <button id="themeToggle" class="media-library-context-menu-item theme-toggle-button" type="button" role="menuitem" aria-label="切换暗色模式" tabindex="-1">
311          <i data-lucide="moon" aria-hidden="true"></i><span>暗色模式</span>
312        </button>
313      </div>
314    </div>
315
316    <div id="accountMenu" class="account-menu ui-popover" hidden>
317      <div class="account-menu-head">
318        <span class="account-avatar" aria-hidden="true">
319          <img id="accountMenuAvatar" alt="" hidden>
320          <span id="accountMenuAvatarFallback" class="account-avatar-fallback">东</span>
321        </span>
322        <div>
323          <strong id="accountMenuTitle">未登录</strong>
324          <p id="accountMenuMeta">会员中心</p>
325        </div>
326      </div>
327      <button id="accountSettingsButton" type="button" hidden>
328        <i data-lucide="settings-2" aria-hidden="true"></i>
329        <span>设置中心</span>
330      </button>
331      <button id="accountShortcutSettingsButton" type="button" hidden>
332        <i data-lucide="keyboard" aria-hidden="true"></i>
333        <span>快捷键设置</span>
334      </button>
335      <button id="accountProfileButton" type="button" hidden>
336        <i data-lucide="user-round-pen" aria-hidden="true"></i>
337        <span>编辑资料</span>
338      </button>
339      <button id="accountLoginButton" type="button">登录</button>
340      <button id="accountLogoutButton" type="button" hidden>退出登录</button>
341    </div>
342
343    <a id="wechatSupportButton" class="wechat-support-button" href="https://work.weixin.qq.com/kfid/kfcccac384193047e7e" target="_blank" rel="noopener noreferrer" aria-label="通过微信客服咨询" hidden>
344      <i data-lucide="message-circle" aria-hidden="true"></i>
345      <span>微信客服</span>
346    </a>
347
348    <header class="site-header">
349      <span id="topicNavActiveIndicator" class="topic-nav-active-indicator" aria-hidden="true"></span>
350      <nav id="topicNav" class="topic-nav section-subnav" aria-label="提示词分类" aria-busy="true">
351        <span class="topic-nav-skeleton" role="status"><span class="sr-only">正在获取栏目…</span><i aria-hidden="true"></i><i aria-hidden="true"></i><i aria-hidden="true"></i><i aria-hidden="true"></i><i aria-hidden="true"></i><i aria-hidden="true"></i><i aria-hidden="true"></i></span>
352      </nav>
353      <div class="header-tools">
354        <a id="headerGithubLink" class="header-icon-button header-github-link" href="https://github.com/nevertoday" target="_blank" rel="noopener noreferrer" aria-label="打开 GitHub 主页" hidden>
355          <svg viewBox="0 0 24 24" aria-hidden="true">
356            <path d="M15 22v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 19 4.77 5.07 5.07 0 0 0 18.91 1S17.73.65 15 2.48a13.38 13.38 0 0 0-7 0C5.27.65 4.09 1 4.09 1A5.07 5.07 0 0 0 4 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 8 18.13V22"></path>
357            <path d="M8 19c-3 .9-5.5 0-7-2"></path>
358          </svg>
359        </a>
360        <span id="headerMoreAnchor" hidden></span>
361        <button id="headerStartButton" class="header-start-button" type="button" aria-haspopup="dialog" aria-controls="authDialog" hidden>开始使用</button>
362        <button id="headerAccountButton" class="header-icon-button header-account-button" type="button" aria-label="账号" aria-haspopup="dialog" aria-expanded="false">
363          <i data-lucide="user-round" aria-hidden="true"></i>
364        </button>
365      </div>
366    </header>
367
368    <main>
369      <!-- Boot curtain stand-in. `is-app-booting` hides every real section until
370           auth + routing settle, and member.html gets no `has-server-*` escape
371           hatch when a member session cookie is present (worker.js only injects
372           those for logged-out visitors) — so without this the whole shell is a
373           blank page for as long as /api/me takes, and D1 single-row reads have
374           been tailing past 10s. Decorative: the real grid replaces it. -->
375      <div id="bootSkeleton" class="boot-skeleton" role="status">
376        <span class="boot-skeleton-status boot-skeleton-status-zh sr-only">正在加载会员内容…</span>
377        <span class="boot-skeleton-status boot-skeleton-status-en sr-only">Loading your library…</span>
378        <p class="boot-skeleton-slow boot-skeleton-slow-zh">网络较慢,仍在加载…</p>
379        <p class="boot-skeleton-slow boot-skeleton-slow-en">The network is slow — still loading…</p>
380        <div class="boot-skeleton-composer" aria-hidden="true"><span></span><div><i></i><i></i><i></i></div></div>
381        <div class="boot-skeleton-toolbar" aria-hidden="true"><i></i><i></i><i></i><i></i></div>
382        <div class="ui-loading-skeleton waterfall-skeleton" aria-hidden="true"><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
383        <div class="boot-skeleton-content" aria-hidden="true"><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span><span><i></i><b></b><b></b></span></div>
384        <div class="boot-skeleton-settings" aria-hidden="true"><span><i></i><i></i><i></i><i></i><i></i><i></i></span><div><b></b><b></b><b></b><b></b><b></b><b></b><b></b></div></div>
385        <div class="boot-skeleton-generic" aria-hidden="true"><i></i><b></b><b></b><b></b></div>
386      </div>
387      <dialog id="authDialog" class="auth-dialog ui-dialog" aria-labelledby="authDialogTitle">
388        <div class="auth-dialog-head ui-dialog-head">
389          <div>
390            <p id="authDialogEyebrow" class="eyebrow" hidden></p>
391            <h2 id="authDialogTitle">欢迎来到小小东</h2><p class="auth-dialog-subtitle">登录或创建账号</p>
392          </div>
393          <button id="closeAuthButton" class="icon-button" type="button" aria-label="关闭"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
393<path d="m6 6 12 12M18 6 6 18"/></svg></button>
394        </div>
395        <div class="login-actions ui-dialog-card" aria-label="登录与会员激活">
396          <form id="loginForm" class="auth-panel" data-auth-step="email">
397            <div id="authMethodOptions" class="auth-method-options">
398              <button id="googleLoginButton" class="auth-google-button" type="button">
399                <svg class="google-brand-mark" viewBox="0 0 24 24" aria-hidden="true">
400                  <path fill="#4285F4" d="M21.6 12.2c0-.7-.1-1.4-.2-2.1H12v4h5.4a4.6 4.6 0 0 1-2 3v2.6h3.3c1.9-1.8 2.9-4.4 2.9-7.5Z"/>
401                  <path fill="#34A853" d="M12 22c2.7 0 5-.9 6.7-2.3l-3.3-2.6c-.9.6-2.1 1-3.4 1-2.6 0-4.8-1.8-5.6-4.1H3v2.7A10 10 0 0 0 12 22Z"/>
402                  <path fill="#FBBC05" d="M6.4 14a6 6 0 0 1 0-3.9V7.3H3a10 10 0 0 0 0 9.4L6.4 14Z"/>
403                  <path fill="#EA4335" d="M12 5.9c1.5 0 2.8.5 3.9 1.5l2.9-2.9A9.8 9.8 0 0 0 3 7.3l3.4 2.8C7.2 7.7 9.4 5.9 12 5.9Z"/>
404                </svg>
405                <span id="googleLoginLabel">使用 Google 继续</span>
406              </button>
407              <p id="googleMethodDescription" class="auth-google-note" hidden></p>
408              <div class="auth-method-divider" aria-hidden="true"><span>或使用邮箱</span></div>
409            </div>
410            <div class="auth-email-fields">
411              <label class="ui-field">
412                <span class="sr-only">邮箱地址</span>
413                <input id="emailInput" type="email" autocomplete="username" inputmode="email" autocapitalize="none" spellcheck="false" placeholder="输入邮箱地址" required>
414              </label>
415              <div id="authPasswordStep" class="auth-password-step" hidden>
416                <label class="ui-field">
417                  <span class="sr-only">密码</span>
418                  <input id="passwordInput" type="password" autocomplete="current-password" minlength="1" maxlength="1024" aria-describedby="passwordRequirements" placeholder="输入或设置密码" required disabled>
419                </label>
420                <p id="passwordRequirements" class="auth-password-requirements">已有账号请输入密码;首次使用请设置至少 8 位密码。</p>
421              </div>
422            </div>
423            <p id="loginStatus" class="login-status auth-form-status" role="status" aria-live="polite" aria-atomic="true"></p>
424            <div class="auth-submit-actions">
425              <button id="primaryAuthButton" class="auth-primary-button" type="submit" data-auth-action="continue" disabled>ç»§ç»­</button>
426              <button id="authBackButton" class="ui-dialog-cancel" type="button" hidden>返回</button>
427            </div>
428            <button id="forgotPasswordButton" class="forgot-password-button" type="button" hidden>忘记密码?</button>
429            <div class="auth-footer">
430              <p class="auth-legal-notice"><span>继续即表示同意</span> <a href="/terms" target="_blank" rel="noopener">服务条款</a> <span>和</span> <a href="/privacy" target="_blank" rel="noopener">隐私政策</a></p>
431            </div>
432          </form>
433          <div id="activationPanel" class="activation-panel" data-stage="choose" data-activation-method="pay" data-qrcode-src="/qrcode.min.8ddd0858f9.js" hidden>
434            <div class="activation-decision-layout">
435              <section class="activation-plan-card" aria-labelledby="activationTitle">
436                <div class="activation-plan-head">
437                  <div>
438                    <p id="activationPlanEyebrow" class="activation-plan-eyebrow">年度会员</p>
439                    <p id="activationTitle" class="activation-title">全量提示词会员</p>
440                  </div>
441                  <p class="activation-price" data-price-currency="CNY" aria-label="年费 699 元">
442                    <span class="activation-price-original" aria-hidden="true">ï¿¥1,398</span>
443                    <strong id="activationPriceAmount">ï¿¥699</strong>
444                    <span id="activationPriceCycle">/ å¹´</span>
445                    <span class="activation-price-badge">五折优惠</span>
446                  </p>
447                </div>
448                <p id="activationNote" class="activation-note">支付成功后立即开通当前账号,有效期增加 1 年。</p>
449                <p id="activationRenewalDisclosure" class="activation-renewal-disclosure" hidden>Waffo 国际方案为 US$99 / 年,按年自动续费;可在账号设置中取消后续续
449费。</p>
450              </section>
451
452              <div class="activation-purchase-flow">
453                <section class="activation-method-stage" aria-label="开通方式">
454                  <div id="activationMethodChoices" class="activation-method-choices" role="tablist" aria-label="开通方式">
455                    <button id="activationPayMethodButton" class="activation-method-button" type="button" role="tab" data-activation-method="pay" aria-selected="true" aria-controls="activationPayMethodPanel">
456                      <span><strong>在线购买</strong><small id="activationPayMethodSummary">微信 / 支付宝 / Waffo</small></span>
457                    </button>
458                    <button id="activationRedeemMethodButton" class="activation-method-button" type="button" role="tab" data-activation-method="redeem" aria-selected="false" aria-controls="activationRedeemDetails" tabindex="-1">
459                      <span><strong>兑换码开通</strong><small>已有兑换码</small></span>
460                    </button>
461                  </div>
462                </section>
463
464                <section id="activationPayMethodPanel" class="activation-method-panel activation-pay-method-panel" role="tabpanel" aria-labelledby="activationPayMethodButton">
465                  <p id="activationPaymentNote" class="activation-method-note">首选的可用方式已排在最前;暂不可用的方式会明确标注。</p>
466                  <div id="payMethodChoices" class="pay-method-choices" role="group" aria-label="选择支付方式">
467                    <button id="openPayButton" class="activation-pay-link pay-method-button" type="button" data-pay-provider="wechat" aria-pressed="false" aria-disabled="true" disabled>
468                      <span class="pay-method-mark pay-method-mark-wechat" aria-hidden="true">å¾®</span>
469                      <span class="pay-method-copy"><strong>微信支付</strong><small class="pay-method-detail" data-pay-description="扫码支付">扫码支付</small></span>
470                      <span class="pay-method-arrow" aria-hidden="true"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="M4 12h16m-6-6 6 6-6 6"/></svg></span>
471                    </button>
472                    <button id="alipayPayButton" class="activation-pay-link pay-method-button" type="button" data-pay-provider="alipay" aria-pressed="false" aria-disabled="true" disabled>
473                      <span class="pay-method-mark pay-method-mark-alipay" aria-hidden="true">支</span>
474                      <span class="pay-method-copy"><strong>支付宝</strong><small class="pay-method-detail" data-pay-description="新标签页支付">新标签页支付</small></span>
475                      <span class="pay-method-arrow" aria-hidden="true"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="M4 12h16m-6-6 6 6-6 6"/></svg></span>
476                    </button>
477                  </div>
478                  <p id="payChoiceStatus" class="activation-choice-status" role="status" aria-live="polite"></p>
479                </section>
480
481                <section id="activationRedeemDetails" class="activation-method-panel activation-redeem-method-panel" role="tabpanel" aria-labelledby="activationRedeemMethodButton" hidden>
482                  <p class="activation-method-note">兑换成功后,会员时长立即计入当前账号</p>
483                  <form id="activationRedeemForm" class="activation-redeem-form" novalidate>
484                    <label>
485                      <span>兑换码</span>
486                      <input id="redeemInput" type="text" autocomplete="off" placeholder="请输入兑换码" aria-describedby="redeemStatus">
487                    </label>
488                    <button id="redeemButton" type="submit">确认兑换</button>
489                  </form>
490                  <p id="redeemStatus" class="activation-redeem-status" role="status" aria-l
490ive="polite"></p>
491                </section>
492              </div>
493
494              <aside class="activation-benefit-panel" aria-labelledby="activationBenefitHeading">
495                <div class="activation-benefit-head">
496                  <p>会员服务</p>
497                  <h3 id="activationBenefitHeading">加入会员,你可以</h3>
498                </div>
499                <ul class="activation-benefit-list">
500                  <li>
501                    <span class="activation-benefit-icon" aria-hidden="true"><i data-lucide="layout-grid"></i></span>
502                    <span class="activation-benefit-copy"><strong>持续新增真实场景提示词</strong><small>会员提示词库持续扩充;当前数量以页面实时统计为准。</small></span>
503                  </li>
504                  <li>
505                    <span class="activation-benefit-icon" aria-hidden="true"><i data-lucide="message-circle"></i></span>
506                    <span class="activation-benefit-copy"><strong>作者本人及时答疑</strong><small>使用中有任何问题都可以直接问我;看到消息,我会第一时间回复。</small></span>
507                  </li>
508                  <li>
509                    <span class="activation-benefit-icon" aria-hidden="true"><i data-lucide="sparkles"></i></span>
510                    <span class="activation-benefit-copy"><strong>需要什么,我来开发</strong><small>告诉我你需要的提示词和使用场景,我会直接着手开发并补充进库。</small></span>
511                  </li>
512                </ul>
513              </aside>
514            </div>
515
516            <section id="payPanel" class="pay-panel" data-checkout-kind="" hidden aria-labelledby="payProviderTitle">
517              <div class="pay-checkout-head">
518                <div>
519                  <h3 id="payProviderTitle" tabindex="-1">完成支付</h3>
520                  <p id="payProviderNote">付款后,本页会自动确认并开通会员。</p>
521                </div>
522              </div>
523              <div class="pay-checkout-body">
524                <div id="payQr" class="pay-qr" aria-label="支付入口"></div>
525                <div class="pay-checkout-status">
526                  <p class="pay-status-label"><span aria-hidden="true"></span>订单状态</p>
527                  <p id="payStatus" class="login-status" role="status" aria-live="polite"></p>
528                  <p class="pay-auto-note">无需刷新页面,支付成功后会自动生效。</p>
529                  <button id="payCancelButton" class="activation-back-button ui-dialog-cancel" type="button">取消订单并返回</button>
530                </div>
531              </div>
532            </section>
533
534            <div class="activation-secondary-actions">
535              <button id="activationLogoutButton" class="activation-logout" type="button">不是当前账号?切换账号</button>
536            </div>
537            <p class="auth-legal-notice">购买或兑换即表示你同意<a href="/terms" target="_blank" rel="noopener">《服务条款》</a>,个人信息处理见<a href="/privacy" target="_blank" rel="noopener">《隐私政策》</a>。</p>
538            <p id="activationStatus" class="login-status auth-form-status" role="status" aria-live="polite"></p>
539          </div>
540        </div>
541      </dialog>
542
543      <section id="publicWelcome" class="public-welcome" aria-label="小小东会员提示词首页" hidden>
544        <section id="public-prompt-library" class="public-site-section public-site-prompt-library" data-public-home-section="prompt-library" aria-labelledby="publicHomeTitle">
545          <div class="public-site-intro">
546            <p class="public-site-eyebrow">prompt library</p>
547            <h1 id="publicHomeTitle">成员提示词库</h1>
548          </div>
549          <div class="public-site-prompt-entry" aria-label="成员提示词库入口">
550            <div class="public-site-count" aria-label="提示词风格数量">
551              <strong id="publicStyleCount" data-public-style-count>-</strong>
552              <span>套提示词风格</span>
553            </div>
554            <p id="gateNote" class="gate-note" hidden></p>
555            <div class="public-site-auth-cluster">
556              <p id="publicMembershipPriceNote" class="public-site-price-note" hidden>正在确认当前可用的年度方案…</p>
557              <div class="public-site-auth-actions" aria-label="账号入口">
558                <button id="openLoginButton" class="public-site-primary public-entry-primary" type="button" aria-haspopup="dialog" aria-controls="authDialog"><span>进入提示词库</span><span aria-hidden="true"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
558<path d="M4 12h16m-6-6 6 6-6 6"/></svg></span></button>
559                <a id="publicBrowseLink" class="public-entry-link" href="/open-source">浏览公开提示词</a>
560                <button id="openRegisterButton" class="public-membership-link" type="button">查看会员方案</button>
561                <button id="gatePayButton" class="public-site-primary gate-pay-button" type="button" hidden><span>立即加入</span><strong>¥699 / 年</strong><span class="gate-price-original" aria-hidden="true">¥1,398</span><span class="gate-price-badge">五折</span></button>
562                <button id="openActivateButton" class="public-site-secondary gate-redeem-button" type="button" hidden>我有兑换码</button>
563                <button id="gateLogoutButton" class="gate-logout-link" type="button" hidden>退出登录 / 换账号</button>
564              </div>
565            </div>
566            <section class="membership-preview" aria-label="年度会员权益">
567              <ul class="membership-preview-benefits">
568                <li><span class="membership-benefit-icon" aria-hidden="true"><i data-lucide="key-round"></i></span><strong>全量解锁</strong><span>提示词、参数与案例</span></li>
569                <li><span class="membership-benefit-icon" aria-hidden="true"><i data-lucide="sparkles"></i></span><strong>持续上新</strong><span>新提示词与实用场景</span></li>
570                <li><span class="membership-benefit-icon" aria-hidden="true"><i data-lucide="message-circle"></i></span><strong>作者答疑</strong><span>使用问题直接沟通</span></li>
571              </ul>
572            </section>
573          </div>
574        </section>
575
576        <section id="public-community" class="public-site-section public-site-community" data-public-home-section="community" aria-labelledby="publicCommunityTitle">
577          <div class="public-site-intro">
578            <p class="public-site-eyebrow">zhishixingqiu</p>
579            <h2 id="publicCommunityTitle">知识星球</h2>
580            <p>扫码加入星球,持续获取提示词更新、插件资料和项目答疑;星球会员也可以解锁成员提示词库。</p>
581          </div>
582          <a class="public-site-community-qr" href="https://wx.zsxq.com/group/15554814142882" target="_blank" rel="noopener noreferrer">
583            <img src="/site-assets/zsxq-qr.svg" alt="知识星球二维码" width="132" height="132" loading="lazy" decoding="async">
584            <span>扫码或点击加入知识星球</span>
585          </a>
586        </section>
587
588        <section id="public-contact" class="public-site-section public-site-contact" data-public-home-section="contact" aria-labelledby="publicContactTitle">
589          <div class="public-site-intro">
590            <p class="public-site-eyebrow">wechat</p>
591            <h2 id="publicContactTitle">认识小小东</h2>
592            <p>添加微信,获取提示词、插件、Skills 与 AI 出图支持</p>
593          </div>
594          <img class="public-site-wechat-qr" src="/site-assets/wechat-qr.png" alt="小小东微信二维码" width="519" height="534" loading="lazy" decoding="async">
595          <p class="public-site-contact-note">扫描,添加小小东个人微信</p>
596        </section>
597
598        <section id="public-projects" class="public-site-section public-site-projects" aria-labelledby="publicProjectsTitle">
599          <div class="public-site-intro public-site-projects-intro">
600            <p class="public-site-eyebrow">built by xiaoxiaodong</p>
601            <h2 id="publicProjectsTitle">我开发的项目</h2>
602            <p>谷歌插件和 GitHub 项目分开展示</p>
603            <strong>16 个可用项目</strong>
604          </div>
605          <div class="public-site-project-archive">
606            <section id="public-chrome-extensions" class="public-site-project-category" data-public-home-section="chrome-extensions" aria-labelledby="publicChromeTitle">
607              <header class="public-site-category-head">
608                <div><p class="public-site-eyebrow">chrome web store</p><h3 id="publicChromeTitle">谷歌插件</h3></div>
609                <strong>
60913 个谷歌插件</strong>
610              </header>
611              <div class="public-site-project-grid" data-public-chrome-grid aria-live="polite" aria-label="谷歌 Chrome 插件"></div>
612            </section>
613            <section id="public-github-projects" class="public-site-project-category" data-public-home-section="projects" aria-labelledby="publicGithubProjectsTitle">
614              <header class="public-site-category-head">
615                <div><p class="public-site-eyebrow">github</p><h3 id="publicGithubProjectsTitle">GitHub 项目</h3></div>
616                <strong>3 个 GitHub 项目</strong>
617              </header>
618              <div class="public-site-project-grid" data-public-github-grid aria-live="polite" aria-label="GitHub 项目"></div>
619            </section>
620          </div>
621        </section>
622
623        <section id="public-skills" class="public-site-section public-site-skills" data-public-home-section="skills" aria-labelledby="publicSkillsTitle">
624          <div class="public-site-intro public-site-skills-intro">
625            <p class="public-site-eyebrow">open skills</p>
626            <h2 id="publicSkillsTitle">开源 Skills</h2>
627            <p>把重复任务交给 Agent,少写说明,多出结果</p>
628            <a class="public-site-section-link" href="/skills">查看全部 Skills <i data-lucide="arrow-up-right" aria-hidden="true"></i></a>
629          </div>
630          <div class="public-site-skills-grid" data-public-skills-grid aria-label="小小东开源 Skills"></div>
631        </section>
632
633      </section>
634
635      <section class="toolbar" data-notice-toolbar aria-label="筛选" hidden>
636        <div class="search">
637          <span class="search-field">
638            <input id="searchInput" type="search" aria-label="搜索提示词" placeholder="风格、主题、文件名" autocomplete="off">
639            <span id="searchStyleCount" class="search-count" aria-hidden="true">正在加载</span>
640          </span>
641          <button id="adminHiddenStylesButton" class="admin-hidden-filter-button" type="button" aria-pressed="false" data-tooltip="查看下架的风格" hidden>
642            <i data-lucide="eye-off" aria-hidden="true"></i>
643            <span>下架的</span>
644            <strong id="adminHiddenStylesCount">0</strong>
645          </button>
646          <button id="adminRestoreAllHiddenStylesButton" class="admin-restore-all-hidden-button" type="button" hidden>
647            <i data-lucide="rotate-ccw" aria-hidden="true"></i>
648            <span>恢复全部上架</span>
649          </button>
650        </div>
651        <div class="generated-image-range-field" hidden>
652          <select id="generatedImageRangeSelect" aria-label="筛选生图任务和记录">
653            <option value="all">所有</option>
654            <option value="backfill" data-admin-only hidden disabled>补图</option>
655            <option value="today">今天</option>
656            <option value="yesterday">昨天</option>
657            <option value="week">最近一周</option>
658          </select>
659        </div>
660        <span id="promptColorFilterAnchor" hidden></span>
661        <div class="color-filter" aria-label="颜色过滤">
662          <button id="colorFilterMenuButton" class="color-filter-trigger" type="button" aria-label="打开颜色筛选" aria-expanded="false" aria-pressed="false" aria-controls="colorFilterPanel" data-tooltip="颜色筛选">
663            <span class="color-filter-swatch" aria-hidden="true"></span>
664          </button>
665          <span id="colorFilterLiveStatus" class="sr-only" role="status" aria-live="polite"></span>
666          <div id="colorFilterPanel" class="color-filter-panel" role="dialog" aria-label="颜色筛选面板" hidden>
667            <div class="color-filter-panel-head">
668              <div class="color-filter-heading"><strong>颜色筛选</strong><span id="colorFilterPanelValue" class="color-filter-panel-value">选择颜色,自动筛选</span></div>
669              <button class="color-filter-close" type="button" data-color-picker-close aria-label="完成选色"><svg class="ui-icon" viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m6 6 12 12M18 6 6 18" /></svg></button>
670            </div>
671            <div class="color-filter-picker" aria-label="自定义颜色">
672              <div id="colorFilterPlane" class="color-filter-plane" role="slider" tabindex="0" aria-label="调整颜色明度和饱和度" aria-valuemin="0" aria-valuemax="100" aria-valuenow="100" aria-describedby="colorFilterHelp"><span class="color-filter-plane-thumb" aria-hidden="true"></span></div>
673              <div id="colorFilterHue" class="color-filter-hue" role="slider" tabindex="0" aria-label="调整色相" aria-orientation="horizontal" aria-valuemin="0" aria-valuemax="360" aria-valuenow="0"><span class="color-filter-hue-thumb" aria-hidden="true"></span></div>
674              <span id="colorFilterHelp" class="sr-only">左右调整饱和度,上下调整明度;按住 Shift 加快调整。</span>
675            </div>
676            <div class="color-filter-preset-grid" role="group" aria-label="更多颜色">
677              <button class="color-filter-preset" type="button" data-color-filter-value="#ef4444" aria-label="红色" aria-pressed="false" style="--preset-color: #ef4444; --preset-check: #fff"><span aria-hidden="true"></span></button>
678              <button class="color-filter-preset" type="button" data-color-filter-value="#f59e0b" aria-label="橙色" aria-pressed="false" style="--preset-color: #f59e0b; --preset-check: #172019"><span aria-hidden="true"></span></button>
679              <button class="color-filter-preset" type="button" data-color-filter-value="#eab308" aria-label="黄色" aria-pressed="false" style="--preset-color: #eab308; --preset-check: #172019"><span aria-hidden="true"></span></button>
680              <button class="color-filter-preset" type="button" data-color-filter-value="#10b981" aria-label="绿色" aria-pressed="false" style="--preset-color: #10b981; --preset-check: #172019"><span aria-hidden="true"></span></button>
681              <button class="color-filter-preset" type="button" data-color-filter-value="#06b6d4" aria-label="青色" aria-pressed="false" style="--preset-color: #06b6d4; --preset-check: #172019"><span aria-hidden="true"></span></button>
682              <button class="color-filter-preset" type="button" data-color-filter-value="#2563eb" aria-label="蓝色" aria-pressed="false" style="--preset-color: #2563eb; --preset-check: #fff"><span aria-hidden="true"></span></button>
683              <button class="color-filter-preset" type="button" data-color-filter-value="#7c3aed" aria-label="紫色" aria-pressed="false" style="--preset-color: #7c3aed; --preset-check: #fff"><span aria-hidden="true"></span></button>
684              <button class="color-filter-preset" type="button" data-color-filter-value="#db2777" aria-label="粉色" aria-pressed="false" style="--preset-color: #db2777; --preset-check: #fff"><span aria-hidden="true"></span></button>
685              <button class="color-filter-preset" type="button" data-color-filter-value="#a16207" aria-label="棕色" aria-pressed="false" style="--preset-color: #a16207; --preset-check: #fff"><span aria-hidden="true"></span></button>
686              <button class="color-filter-preset" type="button" data-color-filter-value="#111827" aria-label="黑色" aria-pressed="false" style="--preset-color: #111827; --preset-check: #fff"><span aria-hidden="true"></span></button>
687              <button class="color-filter-preset" type="button" data-color-filter-value="#3f3f46" aria-label="深灰" aria-pressed="false" style="--preset-color: #3f3f46; --preset-check: #fff"><span aria-hidden="true"></span></button>
688              <button class="color-filter-preset" type="button" data-color-filter-value="#e5e7eb" aria-label="白色" aria-pressed="false" style="--preset-color: #e5e7eb; --preset-check: #172019"><span aria-hidden="true"></span></button>
689              <button class="color-filter-preset" type="button" data-color-filter-value="#f97316" aria-label="橙红" aria-pressed="false" style="--preset-color: #f97316; --preset-check: #fff"><span aria-hidden="true"></span></button>
690              <button class="color-filter-preset" type="button" data-color-filter-value="#84cc16" aria-label="黄绿色" aria-pressed="false" style="--preset-color: #84cc16; --preset-check: #172019"><span aria-hidden="true"></span></button>
691              <button class="color-filter-preset" type="button" data-color-filter-value="#22c55e" aria-label="亮绿" aria-pressed="false" style="--preset-color: #22c55e; --preset-check: #172019"><span aria-hidden="true"></span></button>
692              <button class="color-filter-preset" type="button" data-color-filter-value="#14b8a6" aria-label="青绿色" aria-pressed="false" style="--preset-color: #14b8a6; --preset-check: #172019"><span aria-hidden="true"></span></button>
693              <button class="color-filter-preset" type="button" data-color-filter-value="#0ea5e9" aria-label="天蓝" aria-pressed="false" style="--preset-color: #0ea5e9; --preset-check: #fff"><span aria-hidden="true"></span></button>
694              <button class="color-filter-preset" type="button" data-color-filter-value="#3b82f6" aria-label="亮蓝" aria-pressed="false" style="--preset-color: #3b82f6; --preset-check: #fff"><span aria-hidden="true"></span></button>
695              <button class="color-filter-preset" type="button" data-color-filter-value="#4f46e5" aria-label="靛蓝" aria-pressed="false" style="--preset-color: #4f46e5; --preset-check: #fff"><span aria-hidden="true"></span></button>
696              <button class="color-filter-preset" type="button" data-color-filter-value="#a855f7" aria-label="紫罗兰" aria-pressed="false" style="--preset-color: #a855f7; --preset-check: #fff"><span aria-hidden="true"></span></button>
697              <button class="color-filter-preset" type="button" data-color-filter-value="#d946ef" aria-label="洋红" aria-pressed="false" style="--preset-color: #d946ef; --preset-check: #fff"><span aria-hidden="true"></span></button>
698              <button class="color-filter-preset" type="button" data-color-filter-value="#e11d48" aria-label="玫红" aria-pressed="false" style="--preset-color: #e11d48; --preset-check: #fff"><span aria-hidden="true"></span></button>
699              <button class="color-filter-preset" type="button" data-color-filter-value="#92400e" aria-label="深棕" aria-pressed="false" style="--preset-color: #92400e; --preset-check: #fff"><span aria-hidden="true"></span></button>
700              <button class="color-filter-preset" type="button" data-color-filter-value="#94a3b8" aria-label="灰色" aria-pressed="false" style="--preset-color: #94a3b8; --preset-check: #172019"><span aria-hidden="true"></span></button>
701            </div>
702            <div class="color-filter-panel-foot">
703              <label class="color-filter-custom"><span class="color-filter-current" aria-hidden="true"></span><span class="color-filter-hex-label">HEX</span><input id="colorFilterHexInput" class="color-filter-hex-input" type="text" inputmode="text" autocomplete="off" autocapitalize="off" spellcheck="false" maxlength="7" placeholder="#FF4D4D" aria-label="输入十六进制颜色" aria-describedby="colorFilterError" /></label>
704              <button id="clearColorFilterButton" class="clear-color-filter" type="button" aria-label="重置颜色筛选" disabled>清除筛选</button>
705            </div>
706            <p id="colorFilterError" class="color-filter-error" data-color-picker-error role="status" hidden>请输入 3 位或 6 位 HEX 色值,如 #2563EB</p>
707          </div>
708        </div>
709        <div class="generated-image-date-field" hidden>
710          <button id="generatedImageDateButton" class="generated-image-date-trigger" type="button" aria-label="按日期筛选作图记录" aria-haspopup="dialog" aria-expanded="false" aria-controls="generatedImageDateCalendar" title="按日期筛选作图记录"><span data-date-icon aria-hidden="true"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false">
710<path d="M4 5h16v15.5H4Z M4 10h16M8 3v4m8-4v4"/></svg></span><span data-date-value>选择日期</span></button>
711          <input id="generatedImageDateInput" type="hidden" aria-hidden="true" />
712          <div id="generatedImageDateCalendar" class="generated-history-calendar" role="dialog" aria-label="按日期筛选作图记录" hidden>
713            <div class="generated-history-calendar-head"><button type="button" data-calendar-prev aria-label="上个月"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m15 6-6 6 6 6"/></svg></button><strong data-calendar-title></strong><button type="button" data-calendar-next aria-label="下个月"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m9 6 6 6-6 6"/></svg></button></div>
714            <div class="generated-history-calendar-weekdays" aria-hidden="true"><span>周日</span><span>周一</span><span>周二</span><span>周三</span><span>周四</span><span>周五</span><span>周六</span></div>
715            <div class="generated-history-calendar-grid" data-calendar-grid></div>
716            <p class="generated-history-calendar-status" data-calendar-status role="status" aria-live="polite">数字表示当天图片总数 · 再点已选日期清除</p>
717          </div>
718        </div>
719          <button id="adminBatchModeButton" class="style-grid-layout-mode-button admin-batch-mode-button" type="button" aria-pressed="false" aria-label="批量选中卡片并执行批量操作" title="批量管理" data-tooltip="批量选中卡片并执行批量操作" hidden>
720            <i data-lucide="mouse-pointer-2" aria-hidden="true"></i>
721          </button>
722        <div class="sort-segment" role="group" aria-label="排序方式">
723          <div class="sort-segment-options">
724            <button class="sort-segment-button" type="button" data-sort-value="recommended" aria-pressed="true">推荐</button>
725            <button class="sort-segment-button" type="button" data-sort-value="popular" aria-pressed="false">收藏量</button>
726            <button class="sort-segment-button" type="button" data-sort-value="latest" aria-pressed="false" aria-label="最新在前">最新在前</button>
727          </div>
728        </div>
729        <div class="toolbar-meta"></div>
730        <span id="imageGeneratorDock" class="image-generator-history-tools" hidden>
731          <button id="toggleGeneratedSelectionButton" class="style-grid-layout-mode-button" type="button" aria-pressed="false" aria-label="选择记录" title="选择记录" data-tooltip="选择记录" disabled>
732            <i data-lucide="mouse-pointer-2" aria-hidden="true"></i>
733          </button>
734        </span>
735        <span id="promptViewModeAnchor" hidden></span>
736        <span id="quietImageModeControl" class="quiet-image-mode-control view-mode-controls" role="group" aria-label="浏览视图控制" hidden>
737          <button id="catalogMoreButton" class="style-grid-layout-mode-button" type="button" aria-label="更多操作" aria-haspopup="menu" aria-expanded="false" aria-controls="catalogMoreMenu" popovertarget="catalogMoreMenu" data-tooltip="更多操作" hidden>
738            <i data-lucide="ellipsis" aria-hidden="true"></i>
739          </button>
740          <button id="styleGridLayoutModeButton" class="style-grid-layout-mode-button" type="button" aria-pressed="true" aria-label="当前:拼贴瀑布流,点击切换到行式单列" title="拼贴瀑布流 · 下一个:行式单列">
741            <i data-lucide="layout-grid" aria-hidden="true"></i>
742          </button>
743          <button id="quietImageModeButton" class="quiet-image-mode-button" type="button" aria-label="开启极简看图模式" aria-pressed="false" title="极简看图模式" hidden>
744            <i data-lucide="eye" aria-hidden="true"></i>
745            <span id="quietImageModeProgress" class="quiet-image-mode-progress" aria-hidden="true" hidden>
746              <span id="quietImageModeProgressNumerator" class="quiet-image-mode-progress-value quiet-image-mode-progress-numerator">0%</span>
747              <span class="quiet-image-mode-progress-rule"></span>
748              <span id="quietImageModeProgressDenominator" class="quiet-image-mode-progress-value quiet-image-mode-progress-denominator"></span>
749            </span>
750          </button>
751        </span>
752      </section>
753
754      <div class="color-filter-context" data-color-filter-status hidden>
755        <button class="color-filter-active-chip" type="button" data-color-filter-action="clear" aria-label="清除颜色筛选">
756          <span class="color-filter-active-dot" aria-hidden="true"></span>
757          <span>颜色</span>
758          <strong data-color-filter-value></strong>
759          <i data-lucide="x" aria-hidden="true"></i>
760        </button>
761        <p data-color-filter-summary role="status" aria-live="polite">正在计算符合当前颜色的内容…</p>
762        <button class="color-filter-context-clear" type="button" data-color-filter-action="clear">查看全部内容</button>
763      </div>
764
765      <div id="tagChipRail" class="tag-chip-rail" role="group" aria-label="已选标签" hidden></div>
766
767      <section id="topics" class="content-grid" hidden>
768        <section class="results">
769          <div id="styleGrid" class="style-grid"></div>
770          <div id="favoriteContentList" class="favorite-content-list" hidden></div>
771          <section id="vipCatalogGate" class="vip-catalog-gate" hidden aria-labelledby="vipCatalogGateTitle">
772            <span class="vip-catalog-gate-mark" aria-hidden="true">VIP</span>
773            <h2 id="vipCatalogGateTitle">你已看完 10 页免费内容</h2>
774            <p>开通 VIP,解锁完整提示词库。</p>
775            <button id="vipCatalogGateButton" class="activation-pay-link" type="button">开通年费会员 · ¥699 / 年</button>
776          </section>
777          <div id="gridSentinel" class="grid-sentinel" aria-hidden="true"></div>
778          <button id="loadMoreButton" class="load-more" type="button" hidden>继续加载</button>
779          <section class="color-filter-end-prompt" data-color-filter-end hidden aria-live="polite">
780            <strong data-color-filter-end-title>符合当前颜色的内容已经看完</strong>
781            <span data-color-filter-end-note>你看到的是颜色筛选结果,不是全部内容。</span>
782            <div class="color-filter-end-actions">
783              <button type="button" data-color-filter-action="adjust">调整颜色</button>
784              <button type="button" data-color-filter-action="clear">查看全部内容</button>
785            </div>
786          </section>
787        </section>
788      </section>
789
790      <section id="navigationSettingsView" class="navigation-settings-view settings-ui" hidden aria-label="栏目管理">
791      </section>
792
793      <section id="memberCenter" class="member-center settings-ui" hidden aria-label="设置中心">
794        <div id="memberSettingsHost" class="member-settings-stage"></div>
795      </section>
796
797      <section id="articlesView" class="articles-view tools-view" hidden aria-label="工具箱">
798        <div id="articleToolbar" class="article-toolbar" data-notice-toolbar aria-label="文章工具">
799          <label class="search article-search">
800            <span class="search-field">
801              <input id="articleSearchInput" type="search" aria-label="搜索文章" placeholder="搜索文章" autocomplete="off">
802              <span id="articleSearchCount" class="search-count" aria-hidden="true">0 篇</span>
803            </span>
804          </label>
805          <div class="article-sort-segment sort-segment" role="group" aria-label="文章排序">
806            <div class="sort-segment-options">
807              <button class="sort-segment-button" type="button" data-article-sort-value="default" aria-pressed="true">默认</button>
808              <button class="sort-segment-button" type="button" data-article-sort-value="popular" aria-pressed="false">收藏量</button>
809              <button class="sort-segment-button" type="button" data-article-sort-value="latest" aria-pressed="false">最新</button>
810            </div>
811          </div>
812          <button id="articleLayoutModeButton" class="style-grid-layout-mode-button article-layout-mode-button" type="button" aria-pressed="false" aria-label="当前:网格,点击切换到列表" title="网格 · 下一个:列表">
813            <i data-lucide="layout-grid" aria-hidden="true"></i>
814          </button>
815          <button id="articleAdminCreateButton" class="article-admin-create-inline" type="button" hidden>
816            <i data-lucide="plus" aria-hidden="true"></i>
817            <span>添加文章</span>
818          </button>
819        </div>
820        <div id="toolModulePanel" class="tool-module-panel" hidden></div>
821        <div id="articlesList" class="articles-list"><div class="ui-loading-skeleton content-skeleton content-skeleton--cards" aria-hidden="true"><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span></div></div>
822        <article id="articleDetail" class="article-detail panel-shell" hidden></article>
823      </section>
824
825      <section id="skillsView" class="skills-view articles-view tools-view" hidden aria-label="Skills">
826        <div class="article-toolbar skills-content-toolbar" data-notice-toolbar aria-label="Skills 工具">
827          <div class="search article-search skills-search">
828            <div id="skillsModeSwitch" class="media-library-mode-switch" data-mode="image">
829              <button id="skillsModeButton" class="media-library-mode-button" type="button" aria-label="Skill 类型:图片" aria-haspopup="menu" aria-expanded="false" aria-controls="skillsModeMenu" data-tooltip="切换 Skill 类型">
830                <span class="media-library-mode-icon" data-media-mode-icon="image"><i data-lucide="image" aria-hidden="true"></i></span>
831                <span class="media-library-mode-icon" data-media-mode-icon="text"><i data-lucide="file-text" aria-hidden="true"></i></span>
832                <span class="media-library-mode-icon" data-media-mode-icon="site"><i data-lucide="globe" aria-hidden="true"></i></span>
833                <svg class="media-library-mode-caret ui-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m6 9 6 6 6-6" /></svg>
834              </button>
835              <div id="skillsModeMenu" class="media-library-mode-menu" role="menu" aria-label="Skill 类型" hidden>
836                <button type="button" role="menuitemradio" data-skills-mode="image" aria-checked="true"><i data-lucide="image" aria-hidden="true"></i><span>图片</span></button>
837                <button type="button" role="menuitemradio" data-skills-mode="text" aria-checked="false"><i data-lucide="file-text" aria-hidden="true"></i><span>文本</span></button>
838                <button type="button" role="menuitemradio" data-skills-mode="site" aria-checked="false"><i data-lucide="globe" aria-hidden="true"></i><span>功能站</span></button>
839              </div>
840            </div>
841            <label class="search-field"><input id="skillsSearchInput" type="search" aria-label="搜索 Skills" placeholder="搜索 Skill 名称或用途" autocomplete="off"><span id="skillsCount" class="search-count" aria-hidden="true">0 个</span></label>
842          </div>
843          <div id="skillsBrowseTabs" class="article-sort-segment sort-segment" role="group" aria-label="Skills 浏览方式">
844            <div class="sort-segment-options">
845              <button class="sort-segment-button" type="button" data-skills-browse="recommended" aria-pressed="true">编辑推荐</button>
846              <button class="sort-segment-button" type="button" data-skills-browse="favorites" aria-pressed="false">收藏</button>
847              <button class="sort-segment-button" type="button" data-skills-browse="latest" aria-pressed="false">最新</button>
848            </div>
849          </div>
850          <div id="skillsSortControls" hidden class="article-sort-segment sort-segment" role="group" aria-label="Skills 排序">
851            <div class="sort-segment-options">
852              <button class="sort-segment-button" type="button" data-skills-sort="default" aria-pressed="true">默认</button>
853              <button class="sort-segment-button" type="button" data-skills-sort="stars" aria-pressed="false" title="按 GitHub 仓库星标数量从多到少">星标最多</button>
854              <button class="sort-segment-button" type="button" data-skills-sort="updated" aria-pressed="false" title="按 GitHub 仓库或内容的更新时间从新到旧">最近更新</button>
855            </div>
856          </div>
857          <button id="skillsLayoutModeButton" class="style-grid-layout-mode-button article-layout-mode-button" type="button" aria-pressed="false" aria-label="切换 Skills 布局"><i data-lucide="layout-grid" aria-hidden="true"></i></button>
858          <div id="skillsAdminActions" class="skills-admin-actions" hidden data-admin-only>
859            <button id="skillsAdminCreateButton" class="style-grid-layout-mode-button article-layout-mode-button" type="button" aria-label="管理 Skills" title="管理 Skills" hidden data-admin-only><i data-lucide="sliders-horizontal" aria-hidden="true"></i></button>
860          </div>
861        </div>
862        <p id="skillsStatus" class="skills-status sr-only" role="status">正在加载 Skills…</p>
863        <div id="skillsGrid" class="skills-grid content-browser-list" data-layout-mode="uniform"><div class="ui-loading-skeleton content-skeleton content-skeleton--cards" style="--content-skeleton-ratio: 16 / 9" aria-hidden="true"><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span><span class="content-skeleton-item"><i></i><b></b><b></b></span></div></div>
864        <p id="skillsEmpty" class="skills-empty" hidden>没有找到匹配的 Skill。</p>
865      </section>
866
867      <aside id="publicSkillPanel" class="article-detail public-skill-panel panel-shell" hidden aria-labelledby="publicSkillPanelTitle">
868        <div class="article-detail-actions panel-shell-head">
869          <p id="publicSkillPanelMeta" class="eyebrow"></p>
870          <div class="article-detail-actions-right panel-shell-actions">
871            <button id="closePublicSkillPanel" class="header-icon-button panel-shell-navigation right-panel-close-button" type="button" data-public-skill-panel-close aria-label="关闭 Skill 详情">
872              <i data-lucide="x" aria-hidden="true"></i>
873            </button>
874          </div>
875        </div>
876        <div id="publicSkillPanelScroll" class="article-detail-scroll panel-shell-body" tabindex="-1">
877          <header class="article-detail-head">
878            <h1 id="publicSkillPanelTitle"></h1>
879            <p id="publicSkillPanelExcerpt" class="article-detail-excerpt"></p>
880          </header>
881          <article id="publicSkillPanelContent" class="article-content public-skill-article-content"></article>
882        </div>
883      </aside>
884
885      <section id="openSourceView" class="open-source-view" hidden aria-label="开源图片">
886        <div class="toolbar open-source-toolbar" data-notice-toolbar aria-label="开源图片工具">
887          <div class="sort-segment open-source-kind" role="group" aria-label="开源内容类型">
888            <div class="sort-segment-options">
889              <button class="sort-segment-button" type="button" data-open-source-kind="style" aria-pressed="true">风格开源</button>
890              <button class="sort-segment-button" type="button" data-open-source-kind="media" aria-pressed="false">素材开源</button>
891            </div>
892          </div>
893          <div class="search open-source-search">
894            <span class="search-field">
895              <input id="openSourceSearchInput" type="search" aria-label="搜索全部开源图片" placeholder="搜索全部开源图片" autocomplete="off">
896              <span id="openSourceSearchCount" class="search-count" aria-hidden="true">0 å¼ </span>
897            </span>
898          </div>
899          <button id="openSourceChannelSettingsButton" class="ghost-button open-source-channel-settings-button" type="button" aria-label="频道设置" aria-controls="openSourceChannelSettingsPanel" aria-expanded="false" aria-pressed="false" hidden>
900            <i data-lucide="settings-2" aria-hidden="true"></i>
901            <span>频道设置</span>
902          </button>
903          <span id="openSourceColorFilterSlot" class="toolbar-color-filter-slot"></span>
904          <div class="sort-segment" role="group" aria-label="开源图片排序">
905            <div class="sort-segment-options">
906              <button class="sort-segment-button" type="button" data-open-source-sort="recommended" aria-pressed="true" aria-label="推荐">推荐</button>
907              <button class="sort-segment-button" type="button" data-open-source-sort="popular" aria-pressed="false">收藏量</button>
908              <button class="sort-segment-button" type="button" data-open-source-sort="latest" aria-pressed="false">最新</button>
909            </div>
910          </div>
911          <span id="openSourceViewModeSlot" class="toolbar-view-mode-slot"></span>
912        </div>
913        <div class="color-filter-context" data-color-filter-status hidden>
914          <button class="color-filter-active-chip" type="button" data-color-filter-action="clear" aria-label="清除颜色筛选">
915            <span class="color-filter-active-dot" aria-hidden="true"></span>
916            <span>颜色</span>
917            <strong data-color-filter-value></strong>
918            <i data-lucide="x" aria-hidden="true"></i>
919          </button>
920          <p data-color-filter-summary role="status" aria-live="polite">正在计算符合当前颜色的内容…</p>
921          <button class="color-filter-context-clear" type="button" data-color-filter-action="clear">查看全部内容</button>
922        </div>
923        <span id="openSourceStatus" class="sr-only" role="status">正在加载…</span>
924        <div id="openSourceSkeleton" class="open-source-skeleton" aria-hidden="true">
925          <p class="ui-loading-slow" hidden>正在获取内容,请稍候…</p>
926          <div class="boot-skeleton-toolbar"><i></i><i></i><i></i><i></i></div>
927          <div class="ui-loading-skeleton waterfall-skeleton" aria-hidden="true"><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span><span><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
928        </div>
929        <div id="openSourceGrid" class="open-source-grid style-grid"></div>
930        <section id="openSourceEmpty" class="open-source-empty grid-empty" role="status" aria-atomic="true" data-state="empty" hidden>
931          <i data-lucide="sprout" aria-hidden="true"></i>
932          <strong>还没有开源图片</strong>
933          <span>已开源的图片会显示在这里。</span>
934          <button class="grid-empty-clear-color" type="button" data-color-filter-action="clear" hidden>查看全部内容</button>
935          <div class="open-source-empty-actions">
936            <button type="button" data-open-source-empty-action="retry" hidden>重新加载</button>
937            <button type="button" data-open-source-empty-action="clear-search" hidden>清除搜索</button>
938          </div>
939        </section>
940        <div id="openSourceMoreSkeleton" class="open-source-more-skeleton" aria-hidden="true" hidden><i></i><i></i><i></i><i></i></div>
941        <button id="openSourceLoadMore" class="load-more" type="button" hidden>继续加载</button>
942        <section class="color-filter-end-prompt" data-color-filter-end hidden aria-live="polite">
943          <strong data-color-filter-end-title>符合当前颜色的内容已经看完</strong>
944          <span data-color-filter-end-note>你看到的是颜色筛选结果,不是全部内容。</span>
945          <div class="color-filter-end-actions">
946            <button type="button" data-color-filter-action="adjust">调整颜色</button>
947            <button type="button" data-color-filter-action="clear">查看全部内容</button>
948          </div>
949        </section>
950        <section id="openSourceUnlock" class="open-source-unlock" aria-labelledby="openSourceUnlockTitle" data-unlock-context="feed-end" hidden>
951          <div class="open-source-unlock-intro">
952            <p class="open-source-unlock-eyebrow">Members library</p>
953            <h2 id="openSourceUnlockTitle">你看到的,只是一小部分</h2>
954            <p class="open-source-unlock-lede"><span data-unlock-count-line hidden>会员库收录 <strong id="openSourceUnlockCount"></strong> 套提示词风格,</span><span>这里开放的只是精选样张,每周持续上新。</span></p>
955          </div>
956          <ul class="open-source-unlock-benefits" aria-label="会员权益">
957            <li><span class="open-source-unlock-icon" aria-hidden="true"><i data-lucide="key-round"></i></span><strong>全量解锁</strong><span>每个风格的完整提示词、参数和全部案例</span></li>
958            <li><span class="open-source-unlock-icon" aria-hidden="true"><i data-lucide="sparkles"></i></span><strong>持续上新</strong><span>每周新增风格,跟上最新的模型和玩法</span></li>
959            <li><span class="open-source-unlock-icon" aria-hidden="true"><i data-lucide="image"></i></span><strong>高清原图</strong><span>查看和下载原图,不再只是预览</span></li>
960            <li><span class="open-source-unlock-icon" aria-hidden="true"><i data-lucide="message-circle"></i></span><strong>作者答疑</strong><span>提示词、插件、Skills 用不好直接问</span></li>
961          </ul>
962          <div class="open-source-unlock-offer">
963            <div class="open-source-unlock-pricing">
964              <p class="open-source-unlock-price"><strong data-open-source-unlock-price>¥699 / 年</strong><span class="open-source-unlock-price-original" data-open-source-unlock-cny>¥1,398</span><span class="open-source-unlock-price-badge" data-open-source-unlock-cny>五折</span></p>
965              <p class="open-source-unlock-price-note" data-open-source-unlock-price-note>支付后立即开通 · 有效期一年</p>
966            </div>
967            <div class="open-source-unlock-actions">
968              <button id="openSourceUnlockSecondary" class="open-source-unlock-secondary" type="button" data-open-source-unlock-action="login">登录</button>
969              <button id="openSourceUnlockPrimary" class="open-source-unlock-primary" type="button" data-open-source-unlock-action="activate">查看会员方案</button>
970            </div>
971          </div>
972          <p class="open-source-unlock-community" data-open-source-unlock-community>还想先聊聊?<a href="https://wx.zsxq.com/group/15554814142882" target="_blank" rel="noopener noreferrer">加入知识星球</a><span aria-hidden="true">·</span><a href="https://work.weixin.qq.com/kfid/kfcccac384193047e7e" target="_blank" rel="noopener noreferrer">微信咨询小小东</a></p>
973        </section>
974        <div id="openSourceUpgradeDock" class="app-bottom-dock open-source-upgrade-
974dock" role="region" aria-label="开通会员查看全部风格" hidden>
975          <p class="open-source-upgrade-dock-copy">
976            <strong id="openSourceUpgradeDockCount">VIP 收录全部风格</strong>
977            <span>每周持续新增,开源的只是其中一小部分。</span>
978          </p>
979          <button id="openSourceUpgradeDockButton" class="app-bottom-dock-button" type="button">查看会员方案</button>
980        </div>
981      </section>
982
983      <section id="notificationHistoryView" class="notification-history-view" hidden aria-label="通知历史">
984        <div id="notificationToolbar" class="notification-toolbar" data-notice-toolbar aria-label="通知中心工具">
985          <div class="notification-search-group">
986            <label class="search notification-search">
987              <span class="search-field">
988                <input id="notificationSearchInput" type="search" aria-label="搜索通知" placeholder="搜索通知" autocomplete="off">
989                <span id="notificationSearchCount" class="search-count" aria-hidden="true">0 条</span>
990              </span>
991            </label>
992            <button id="newsletterMemberViewButton" class="quiet-image-mode-button newsletter-member-view-button" type="button" aria-pressed="true" aria-label="返回管理员视角" title="当前:普通用户视角 · 点击返回管理员视角" hidden>
993              <i data-lucide="eye-off" aria-hidden="true"></i>
994            </button>
995          </div>
996          <div class="notification-toolbar-actions">
997            <button id="notificationLayoutModeButton" class="style-grid-layout-mode-button notification-layout-mode-button" type="button" aria-pressed="false" aria-label="当前:均匀多列,点击切换到行式单列" title="通知布局:均匀多列 · 下一个:行式单列">
998              <i data-lucide="columns-3" aria-hidden="true"></i>
999            </button>
1000            <button id="notificationUnreadOnlyButton" class="notification-filter-button" type="button" aria-pressed="false">
1001              <i data-lucide="circle-dot" aria-hidden="true"></i>
1002              <span>未读</span>
1003            </button>
1004            <button id="markNotificationReadButton" class="notification-filter-button" type="button">
1005              <i data-lucide="check-check" aria-hidden="true"></i>
1006              <span>标记已读</span>
1007            </button>
1008            <button id="newNotificationButton" class="notification-new-button" type="button" data-admin-only>
1009              <i data-lucide="plus" aria-hidden="true"></i>
1010              <span>发布通知</span>
1011            </button>
1012          </div>
1013        </div>
1014        <section id="notificationRecordsPanel" class="notification-records-panel" aria-label="通知记录">
1015          <div id="notificationHistoryList" class="notification-history-list"></div>
1016          <div id="notificationHistoryEmpty" class="notification-history-empty" role="status" hidden>
1017            <strong>还没有通知</strong>
1018            <span>有新通知时会出现在这里。</span>
1019          </div>
1020        </section>
1021        <section id="notificationNewsletterPanel" class="notification-newsletter-view" aria-label="发文历史" hidden>
1022          <div id="newsletterCoverUploadQueue" class="newsletter-cover-upload-queue" role="status" aria-live="polite" aria-atomic="true" hidden data-admin-only>
1023            <div class="newsletter-cover-upload-queue-head">
1024              <strong id="newsletterCoverUploadQueueTitle">封面上传队列</strong>
1025              <span id="newsletterCoverUploadQueueCount">0 / 0</span>
1026            </div>
1027            <progress id="newsletterCoverUploadQueueProgress" value="0" max="1">0%</progress>
1028            <p id="newsletterCoverUploadQueueDetail">等待选择封面</p>
1029            <div class="newsletter-cover-upload-queue-actions">
1030              <button id="retryNewsletterCoverUploads" class="ui-button-secondary" type="button" hidden>
1031                <i data-lucide="rotate-ccw" aria-hidden="true"></i>
1032                <span>重试失败项</span>
1033              </button>
1034              <button id="dismissNewsletterCoverUploads" class="ghost-button" type="button" hidden>
1035                <i data-lucide="x" aria-hidden="true"></i>
1036                <span>收起结果</span>
1037              </button>
1038            </div>
1039          </div>
1040          <div id="newsletterIssueList" class="newsletter-issue-list" role="list"></div>
1041          <div id="newsletterIssueEmpty" class="notification-history-empty" role="status" hidden>
1042            <strong>还没有发文历史</strong>
1043            <span>有新发文时会出现在这里。</span>
1044          </div>
1045        </section>
1046      </section>
1047
1048      <section id="newsletterAdminView" class="newsletter-admin-view" hidden aria-label="Newsletter 群发设置">
1049        <section id="newsletterAdminPanel" class="newsletter-admin-panel" aria-label="Newsletter 群发设置">
1050          <div class="newsletter-workbench">
1051            <section class="newsletter-candidates-panel" aria-label="候选风格">
1052              <input id="newsletterDateInput" type="hidden">
1053              <div class="newsletter-candidate-toolbar" aria-label="筛选候选风格">
1054                <div class="search">
1055                  <span class="search-field">
1056                    <input id="newsletterCandidateSearchInput" type="search" aria-label="搜索候选风格" placeholder="搜索风格、主题、文件名" autocomplete="off">
1057                    <span id="newsletterCandidateCount" class="search-count" aria-hidden="true">0 个</span>
1058                  </span>
1059                  <button id="newsletterCandidateViewButton" class="quiet-image-mode-button newsletter-candidate-view-button" type="button" aria-pressed="false" aria-label="切换到普通用户视角" title="当前:管理员视角 · 点击切换到普通用户视角">
1060                    <i data-lucide="eye" aria-hidden="true"></i>
1061                  </button>
1062                </div>
1063                <label class="newsletter-locale-field" for="newsletterLocaleInput">
1064                  <span>邮件语言</span>
1065                  <select id="newsletterLocaleInput" aria-label="Newsletter 邮件语言">
1066                    <option value="zh-CN">中文</option>
1067                    <option value="en">English</option>
1068                  </select>
1069                </label>
1070                <div class="newsletter-range-segment sort-segment" role="group" aria-label="候选范围">
1071                  <div class="sort-segment-options">
1072                    <button class="sort-segment-button" type="button" data-newsletter-range="today" aria-pressed="false">今天</button>
1073                    <button class="sort-segment-button" type="button" data-newsletter-range="all" aria-pressed="false">全部</button>
1074                    <button class="sort-segment-button" type="button" data-newsletter-range="unused" aria-pressed="true">未使用</button>
1075                  </div>
1076                </div>
1077                <span class="newsletter-candidate-view-controls quiet-image-mode-control view-mode-controls" role="group" aria-label="候选视图控制">
1078                  <button id="newsletterCandidateLayoutModeButton" class="style-grid-layout-mode-button newsletter-candidate-layout-mode-button" type="button" aria-pressed="false" aria-label="当前:均匀瀑布流,点击切换到拼贴瀑布流" title="均匀瀑布流 · 下一个:拼贴瀑布流">
1079                    <i data-lucide="columns-3" aria-hidden="true"></i>
1080                  </button>
1081                  <button id="newsletterCandidateQuietModeButton" class="quiet-image-mode-button newsletter-candidate-quiet-mode-button" type="button" aria-label="开启极简看图模式" aria-pressed="false" title="极简看图模式">
1082                    <i data-lucide="eye" aria-hidden="true"></i>
1083                  </button>
1084                </span>
1085              </div>
1086              <div id="newsletterCandidateList" class="newsletter-candidate-list style-grid" role="list"></div>
1087            </section>
1088          </div>
1089        </section>
1090      </section>
1091
1092      <div id="newsletterSelectionDock" class="newsletter-selection-dock app-bottom-dock is-idle" role="region" aria-label="Newsletter 本次群发操作" hidden data-admin-only>
1093        <div id="newsletterDeliveryProgress" class="newsletter-dock-progress" role="status" aria-l
1093ive="polite" hidden>
1094          <span class="newsletter-dock-progress-track" role="progressbar" aria-label="Newsletter 发送进度" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
1095            <span id="newsletterDeliveryProgressBar"></span>
1096          </span>
1097          <span id="newsletterDeliveryProgressState" class="newsletter-dock-progress-state" aria-hidden="true"></span>
1098          <span class="newsletter-dock-progress-copy">
1099            <strong id="newsletterDeliveryProgressTitle">正在创建发送任务</strong>
1100            <span id="newsletterDeliveryProgressCounts" class="newsletter-dock-progress-counts">已发送 0 · 待发送 0</span>
1101            <span id="newsletterDeliveryProgressDetail" class="newsletter-dock-progress-detail">首批邮件正在发送。</span>
1102          </span>
1103          <button id="dismissNewsletterDeliveryProgress" class="newsletter-dock-progress-dismiss" type="button" aria-label="关闭发送结果" title="关闭发送结果" hidden>
1104            <i data-lucide="x" aria-hidden="true"></i>
1105          </button>
1106        </div>
1107        <div class="newsletter-dock-summary">
1108          <span class="newsletter-dock-kicker">本次群发</span>
1109          <span id="newsletterSelectedCount" class="newsletter-selected-count app-bottom-dock-meta" aria-live="polite">已选 0 组 · 0 人</span>
1110        </div>
1111        <div class="newsletter-dock-actions">
1112          <div class="newsletter-dock-selection-actions" aria-label="选择操作">
1113            <button id="previewNewsletterButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button" aria-pressed="false">
1114              <i data-lucide="mail-search" aria-hidden="true"></i>
1115              <span>预览邮件</span>
1116            </button>
1117            <button id="selectAllNewsletterStylesButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button">
1118              <i data-lucide="check-square" aria-hidden="true"></i>
1119              <span>全选</span>
1120            </button>
1121            <button id="clearNewsletterSelectionButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button">
1122              <i data-lucide="x" aria-hidden="true"></i>
1123              <span>清除</span>
1124            </button>
1125          </div>
1126          <div class="newsletter-dock-send-actions" aria-label="发送操作">
1127            <button id="testNewsletterButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button">
1128              <i data-lucide="send" aria-hidden="true"></i>
1129              <span>测试发送</span>
1130            </button>
1131            <button id="sendNewsletterButton" class="app-bottom-dock-button" type="button">
1132              <i data-lucide="mail" aria-hidden="true"></i>
1133              <span>发送给注册用户</span>
1134            </button>
1135          </div>
1136        </div>
1137      </div>
1138
1139      <div id="adminBatchDock" class="admin-batch-dock app-bottom-dock is-idle" role="region" aria-label="风格批量管理操作" hidden>
1140        <div class="admin-batch-dock-summary">
1141          <span class="admin-batch-dock-kicker">批量管理</span>
1142          <span id="adminBatchSelectedCount" class="admin-batch-selected-count app-bottom-dock-meta" aria-live="polite">已选 0 组</span>
1143        </div>
1144        <div class="admin-batch-dock-actions">
1145          <div class="admin-batch-dock-selection-actions" aria-label="选择操作">
1146            <button id="adminBatchSelectAllButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button" aria-pressed="false">
1147              <i data-lucide="list-checks" aria-hidden="true"></i>
1148              <span>全选</span>
1149            </button>
1150            <button id="adminBatchClearButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button">
1151              <i data-lucide="x" aria-hidden="true"></i>
1152              <span>清除</span>
1153            </button>
1154            <button id="adminBatchExitButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button">
1155              <i data-lucide="log-out" aria-hidden="true"></i>
1156              <span>退出</span>
1157            </button>
1158          </div>
1159          <div class="admin-batch-dock-primary-actions" aria-label="批量操作">
1160            <button id="adminBatchReplaceButton" class="app-bottom-dock-button" type="button" aria-label="为所选图片各生成一张新图并替换" hidden>
1161              <i data-lucide="refresh-cw" aria-hidden="true"></i>
1162              <span>替换所选</span>
1163            </button>
1164            <button id="adminBatchFillButton" class="app-bottom-dock-button" type="button" aria-label="为所选风格补全所有缺图" hidden>
1165              <i data-lucide="image-plus" aria-hidden="true"></i>
1166              <span>补全缺图</span>
1167            </button>
1168            <button id="adminBatchOpenSourceButton" class="app-bottom-dock-button" type="button" aria-label="开源所选样张">
1169              <i data-lucide="globe-2" aria-hidden="true"></i>
1170              <span>开源</span>
1171            </button>
1172            <button id="adminBatchUnpublishButton" class="app-bottom-dock-button" type="button" aria-label="取消所选样张的开源">
1173              <i data-lucide="eye-off" aria-hidden="true"></i>
1174              <span>取消开源</span>
1175            </button>
1176            <button id="adminBatchSampleButton" class="app-bottom-dock-button" type="button" aria-label="为所选风格批量补充样张">
1177              <i data-lucide="images" aria-hidden="true"></i>
1178              <span>补充样张</span>
1179            </button>
1180            <button id="adminBatchLibraryButton" class="app-bottom-dock-button" type="button" aria-label="将所选当前预览图加入图片库">
1181              <i data-lucide="folder-plus" aria-hidden="true"></i>
1182              <span>加入图片库</span>
1183            </button>
1184            <button id="adminBatchMoveButton" class="app-bottom-dock-button" type="button" aria-label="移动到其他栏目">
1185              <i data-lucide="folder-input" aria-hidden="true"></i>
1186              <span>移动栏目</span>
1187            </button>
1188            <button id="adminBatchTagButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button" aria-label="统一添加样张类目">
1189              <i data-lucide="tags" aria-hidden="true"></i>
1190              <span>加标签</span>
1191            </button>
1192          </div>
1193        </div>
1194      </div>
1195
1196      <section id="imageGeneratorView" class="image-generator-view" hidden aria-label="生成图片">
1197        <aside id="imageHubColumn" class="image-hub-column" aria-label="作图中心" hidden>
1198          <nav class="image-hub-tabs" aria-label="作图中心">
1199            <a id="imageHubMakeTab" class="image-hub-tab" href="/image-generator">做图</a>
1200            <a id="imageHubRecordsTab" class="image-hub-tab" href="/image-generator/general">记录</a>
1201            <button id="imageHubNewButton" class="image-hub-new" type="button" aria-label="开始新的作图">新作图</button>
1202          </nav>
1203          <div id="imageHubRecords" class="image-hub-records" hidden></div>
1204        </aside>
1205        <!-- The empty canvas (canvas-stage.js): result outlines, reference links and the member's latest images. -->
1206        <section id="imageCreateSkillsShelf" class="image-create-skills-shelf" hidden aria-label="开始做图"></section>
1207        <div class="image-generator-board">
1208          <section class="generated-images-panel" aria-label="生成结果">
1209            <p id="imageGenerationSummary" class="image-generation-summary" role="status" aria-live="polite" hidden></p>
1210            <div id="generatedImageResult" class="generated-image-result generated-image-grid style-grid"></div>
1211            <div id="imageGeneratorModeSurface" class="image-generator-mode-surface" hidden></div>
1212            <div id="imageGeneratorWip" class="image-generator-wip" role="status" hidden>
1213              <strong>正在建设中,预计一周后内上线。</strong>
1214            </div>
1215          </section>
1216        </div>
1217      </section>
1218
1219      <div id="generatedSelectionDock" class="generated-selection-dock image-generator-dock app-bottom-dock is-idle" role="region" aria-label="做图记录批量操作" hidden>
1220        <div class="image-generator-dock-copy">
1221          <strong id="generatedSelectionCount" aria-live="polite">已选 0 组</strong>
1222          <span>点击卡片选择或取消,删除后无法恢复</span>
1223        </div>
1224        <div class="image-generator-dock-actions">
1225          <button id="selectAllGeneratedButton" class="app-bottom-dock-button-secondary" type="button">
1226            <i data-lucide="copy-check" aria-hidden="true"></i>
1227            <span>全选</span>
1228          </button>
1229          <button id="transferSelectedGeneratedButton" class="app-bottom-dock-button-secondary" type="button" disabled hidden>
1230            <i data-lucide="folder-input" aria-hidden="true"></i>
1231            <span>加入图片库</span>
1232          </button>
1233          <button id="deleteSelectedGeneratedButton" class="app-bottom-dock-button generated-selection-delete" type="button" disabled>
1234            <i data-lucide="trash-2" aria-hidden="true"></i>
1235            <span>删除选中</span>
1236          </button>
1237          <button id="clearImageGeneratorHistoryButton" class="app-bottom-dock-button-secondary" type="button" disabled>清空记录</button>
1238          <button id="exitGeneratedSelectionButton" class="app-bottom-dock-icon-button" type="button" aria-label="退出选择" data-tooltip="退出选择">
1239            <i data-lucide="x" aria-hidden="true"></i>
1240          </button>
1241        </div>
1242      </div>
1243
1244      <section id="notFoundView" class="not-found-view" hidden aria-label="页面未找到">
1245        <div class="not-found-panel">
1246          <p class="eyebrow">Not found</p>
1247          <h2>没有找到这个页面</h2>
1248          <p id="notFoundPath">这个链接暂时没有对应内容。</p>
1249          <a class="ghost-button" href="/" data-app-view="archive">回到提示词库</a>
1250        </div>
1251      </section>
1252
1253      <section id="styleShareView" class="style-share-view" hidden aria-label="风格详情">
1254        <p id="styleShareStatus" class="style-share-status" role="status">正在加载风格详情…</p>
1255        <div id="styleShareSkeleton" class="detail-loading-skeleton style-share-skeleton" aria-hidden="true" hidden>
1256          <div class="detail-loading-prompt"><span><i></i><i></i><i></i></span><b></b><b></b><b></b><b></b></div>
1257          <div class="detail-loading-gallery-bar"><i></i><i></i></div>
1258          <div class="detail-loading-gallery"><span class="detail-loading-preview"></span><span></span><span></span><span></span><span></span></div>
1259        </div>
1260        <div id="styleShareHost"></div>
1261      </section>
1262
1263      <section id="styleUploadView" class="style-upload-view settings-ui" hidden aria-labelledby="styleUploadTitle" data-admin-only>
1264        <h1 id="styleUploadTitle" class="sr-only">风格管理</h1>
1265        <p id="styleUploadReady" class="form-status" role="status">正在加载上传工具…</p>
1266        <div id="styleBatchUpload" class="style-batch-upload" hidden></div>
1267      </section>
1268
1269      <section id="sampleClassificationView" hidden aria-label="标签管理" data-admin-only></section>
1270      <section id="skillsManagementView" class="skills-management" hidden aria-label="Skills 管理" data-admin-only></section>
1271      <section id="obsidianManagementView" class="obsidian-management settings-ui" hidden aria-labelledby="obsidianManagementTitle" data-admin-only></section>
1272      <section id="operationsDashboardView" class="operations-dashboard style-upload-view settings-ui" hidden aria-labelledby="operationsDashboardTitle" data-admin-only>
1273        <header class="operations-page-head"><div><h1 id="operationsDashboardTitle">运营数据</h1><p>北京时间 · 每分钟自动更新</p></div><div class="operations-page-actions">
1274          <label class="operations-admin-toggle"><input type="checkbox" data-dashboard-admins><span>包含管理员</span></label>
1275          <button type="button" class="settings-button" data-dashboard-refresh><i data-lucide="refresh-cw" aria-hidden="true"></i><span>刷新数据</span></button>
1276        </div></header>
1277        <p class="style-upload-task-note" data-dashboard-status role="status" aria-live="polite"></p>
1278        <div data-dashboard-alerts></div>
1279        <div class="operations-section-head"><h2>访问概况</h2><label class="operations-select" data-dashboard-daily-control hidden><span>每日趋势范围</span><select data-dashboard-trend><option value="7">近 7 天</option><option value="30">近 30 天</option></select></label></div>
1280        <div data-dashboard-overview></div>
1281        <div class="operations-section-head operations-business-head"><h2>业务表现</h2><label class="operations-select"><span>统计时段</span><select data-dashboard-period><option value="today">今日</option><option value="yesterday">昨日</option><option value="7d">近 7 天</option><option value="30d">近 30 天</option></select></label></div>
1282        <div data-dashboard-content></div>
1283      </section>
1284      <section id="accessReviewView" class="access-review-view style-upload-view settings-ui" hidden aria-labelledby="accessReviewTitle" data-admin-only>
1285        <header class="operations-page-head"><div>
1285<h1 id="accessReviewTitle">访问复核</h1><p>反复碰到访问上限的会员 · 系统先判断并给出建议,最终由你决定</p></div><div class="operations-page-actions">
1286          <button type="button" class="settings-button" data-access-review-refresh><i data-lucide="refresh-cw" aria-hidden="true"></i><span>刷新</span></button>
1287        </div></header>
1288        <p class="style-upload-task-note" data-access-review-status role="status" aria-live="polite"></p>
1289        <div class="access-review-content" data-access-review-content></div>
1290      </section>
1291      <section id="openSourceManageView" class="open-source-manage-view settings-ui" hidden aria-labelledby="openSourceManageTitle" data-admin-only>
1292        <h1 id="openSourceManageTitle" class="sr-only">开源管理</h1>
1293        <div class="open-source-manage-content" data-open-source-manage-content></div>
1294      </section>
1295      <section id="inviteLetterView" class="invite-letter-view settings-ui" hidden aria-labelledby="inviteLetterTitle" data-admin-only>
1296        <h1 id="inviteLetterTitle" class="sr-only">邀请信</h1>
1297        <div class="invite-letter-content" data-invite-letter-content></div>
1298      </section>
1299      <section id="styleStatisticsView" class="style-statistics-view style-upload-view settings-ui" hidden aria-labelledby="styleStatisticsTitle" data-admin-only>
1300        <h1 id="styleStatisticsTitle" class="sr-only">风格统计仪表盘</h1>
1301        <div class="style-upload-stats-toolbar">
1302          <label class="style-upload-topic"><span>统计范围</span><select id="styleStatsTopic"><option value="">全部分类</option></select></label>
1303          <button id="styleStatsRefresh" class="settings-button" type="button">刷新数据</button>
1304        </div>
1305        <p id="styleStatsStatus" class="style-upload-task-note" role="status"></p>
1306        <div id="styleStatsContent" class="style-dashboard"></div>
1307      </section>
1308
1309      <footer class="public-site-footer site-compliance-footer">
1310        <div class="public-site-footer-meta"><span>© 2026 xiaoxiaodong.ai</span><span><span id="publicFooterStyleCount" data-public-style-count>-</span> 套提示词风格</span></div>
1311        <nav aria-label="网站页脚导航"><a href="/terms">服务条款</a><a href="/privacy">隐私政策</a><a href="/acceptable-use">AIGC 可接受使用政策</a><a href="/en/terms" lang="en">English policies</a><a href="mailto:[email protected]">客服邮箱</a><a href="https://work.weixin.qq.com/kfid/kfcccac384193047e7e" target="_blank" rel="noopener noreferrer">微信客服</a></nav>
1312      </footer>
1313    </main>
1314
1315    <section id="imageCreatePanel" class="image-workspace-composer" aria-label="生成图片" hidden>
1316      <div class="image-workspace-context" hidden>
1317        <div>
1318          <p id="imageCreatePanelEyebrow" class="eyebrow">Image generator</p>
1319          <h2 id="imageCreatePanelTitle">生成图片</h2>
1320        </div>
1321        <button id="closeImageCreatePanel" class="header-icon-button" type="button" aria-label="结束本次引用">
1322          <i data-lucide="x" aria-hidden="true"></i>
1323        </button>
1324      </div>
1325      <div class="image-workspace-body">
1326
1327        <div id="imageApiSetupNotice" class="image-api-setup-notice" role="status" aria-live="polite" hidden>
1328          <div>
1329            <strong>请先设置图片生成 API</strong>
1330            <p>只需设置一次;保存后会自动回到这里,当前提示词和参考图都会保留。</p>
1331          </div>
1332          <button id="imageApiSetupNoticeButton" type="button">
1333            <i data-lucide="settings-2" aria-hidden="true"></i>
1334            <span>设置 API</span>
1335          </button>
1336        </div>
1337        <div class="image-reference-section" aria-labelledby="imageReferenceTitle">
1338          <div class="image-reference-heading">
1339            <div>
1340              <span id="imageReferenceTitle">参考图</span>
1341              <small>可选 · 最多 20 张</small>
1342            </div>
1343            <span id="imageReferenceMeta" class="image-reference-meta">垫图 + 提示词</span>
1344          </div>
1345          <input id="imageReferenceInput" type="file" accept="image/png,image/jpeg,image/webp" multiple hidden>
1346          <div id="imageReferenceList" class="image-reference-list" aria-label="已选择的参考图" hidden></div>
1347          <p id="imageReferenceHelp" class="image-reference-help">上传后,在提示词里写清要保留的构图、风格或角色,以及需要改变的内容。</p>
1348        </div>
1349        <div class="image-prompt-field">
1350          <span class="image-prompt-label"><strong>提示词</strong><small>描述最终画面</small></span>
1351          <div class="image-prompt-composer">
1352            <div
1353              id="imagePromptEditor"
1354              class="image-prompt-editor"
1355              contenteditable="true"
1356              role="textbox"
1357              aria-label="提示词"
1358              aria-multiline="true"
1359              aria-autocomplete="list"
1360              aria-controls="imagePromptMentionMenu"
1361              aria-expanded="false"
1362              data-placeholder="描述你想创作的画面…"
1363            ></div>
1364            <textarea id="imagePromptInput" rows="4" aria-hidden="true" tabindex="-1" hidden></textarea>
1365            <div id="imagePromptMentionMenu" class="image-prompt-mention-menu" role="dialog" aria-label="调用提示词" hidden></div>
1366          </div>
1367        </div>
1368        <p id="imageGenerateStatus" class="form-status" role="status"></p>
1369      </div>
1370      <div class="image-workspace-actions">
1371        <div class="image-create-primary-actions">
1372          <button id="generateImageButton" class="dock-button app-bottom-dock-button" type="button" aria-label="生成图片">
1373            <i data-lucide="send" aria-hidden="true"></i>
1374            <span>生成</span>
1375          </button>
1376        </div>
1377        <div class="image-workspace-tools">
1378          <div id="imageReferenceActions" class="image-reference-actions" hidden>
1379            <button id="imageReferenceMenuButton" class="image-reference-menu-trigger" type="button" aria-label="参考图" aria-haspopup="dialog" aria-controls="imageReferenceMenu" aria-expanded="false">
1380              <i data-lucide="images" aria-hidden="true"></i>
1381              <span id="imageReferenceCount" aria-live="polite" aria-atomic="true"></span>
1382            </button>
1383            <div id="imageReferenceMenu" class="image-reference-menu" role="dialog" aria-label="参考图" hidden>
1384              <button id="addImageReferenceButton" type="button"><i data-lucide="plus" aria-hidden="true"></i><span>继续添加参考图</span></button>
1385              <button id="clearImageReferenceButton" type="button"><i data-lucide="trash-2" aria-hidden="true"></i><span>清空所有参考图</span></button>
1386            </div>
1387          </div>
1388          <button id="imageReferenceDrop" class="image-reference-drop" type="button" aria-label="添加参考图" aria-describedby="imageReferenceHelp">
1389            <span class="image-reference-drop-icon" aria-hidden="true"><i data-lucide="image-plus"></i></span>
1390            <span class="image-reference-drop-copy">
1391              <strong>添加参考图</strong>
1392              <small>点击、拖入,或直接粘贴图片</small>
1393            </span>
1394            <span class="image-reference-drop-action" aria-hidden="true">选择</span>
1395          </button>
1396          <button id="imagePromptExpandButton" class="image-prompt-expand-button" type="button" aria-controls="imagePromptEditor" aria-expanded="false" aria-label="展开提示词" title="展开提示词">
1397            <i data-lucide="chevrons-up-down" aria-hidden="true"></i>
1398          </button>
1399          <select id="imageRatioSelect" aria-label="画面比例">
1400            <option value="auto">自动比例</option>
1401            <option value="1024x1024">方图 1:1</option>
1402            <option value="1024x1536">竖图 2:3</option>
1403            <option value="1536x1024">横图 3:2</option>
1404            <option value="864x1536">竖屏 9:16</option>
1405            <option value="1536x864">宽屏 16:9</option>
1406            <option value="custom" hidden>自定尺寸</option>
1407          </select>
1408          <div class="image-count-field">
1409            <select id="imageCountSelect" aria-label="输出张数">
1410              <option value="1">1 å¼ </option>
1411              <option value="2">2 å¼ </option>
1412              <option value="3">3 å¼ </option>
1413              <option value="4">4 å¼ </option>
1414              <option value="5">5 å¼ </option>
1415              <option value="6">6 å¼ </option>
1416              <option value="7">7 å¼ </option>
1417              <option value="8">8 å¼ </option>
1418              <option value="9">9 å¼ </option>
1419              <option value="10">10 å¼ </option>
1420            </select>
1421          </div>
1422        <details class="image-workspace-settings">
1423          <summary aria-label="作图设置">设置<span id="imageSettingsSummary"></span></summary>
1424        <div class="image-create-toolbar">
1425          <div class="image-api-mode-field">
1426            <div class="image-api-picker-row">
1427              <select id="imageApiModeSelect" aria-label="生成方式">
1428                <option value="__obsidian__">积分</option>
1429              </select>
1430              <button id="testSelectedImageApiButton" class="image-api-trigger image-api-quick-test" type="button" aria-label="测试连接" hidden>
1431                <i data-lucide="plug-zap" aria-hidden="true"></i>
1432                <span>测试</span>
1433              </button>
1434            </div>
1435          </div>
1436          <button id="openImageApiSettings" class="image-api-trigger" type="button" aria-label="API 设置" hidden>
1437            <i data-lucide="settings-2" aria-hidden="true"></i>
1438            <span>API</span>
1439          </button>
1440        </div>
1441        <div class="image-output-controls" aria-label="输出设置">
1442          <div class="image-size-field">
1443            <select id="imageSizeSelect" aria-label="图片尺寸">
1444              <option value="auto">自动尺寸</option>
1445              <option value="1024x1024">1:1 · 1024</option>
1446              <option value="2048x2048">1:1 · 2K</option>
1447              <option value="1536x1024">3:2 · 1536</option>
1448              <option value="2048x1360">3:2 · 2K</option>
1449              <option value="1024x1536">2:3 · 1536</option>
1450              <option value="1360x2048">2:3 · 2K</option>
1451              <option value="1536x864">16:9 · 1536</option>
1452              <option value="2048x1152">16:9 · 2K</option>
1453              <option value="3840x2160">16:9 · 4K</option>
1454              <option value="864x1536">9:16 · 1536</option>
1455              <option value="1152x2048">9:16 · 2K</option>
1456              <option value="2160x3840">9:16 · 4K</option>
1457              <option value="1536x1152">4:3 · 1536</option>
1458              <option value="1152x1536">3:4 · 1536</option>
1459              <option value="1280x1024">5:4 · 1280</option>
1460              <option value="1024x1280">4:5 · 1280</option>
1461              <option value="1600x640">5:2 · 1600</option>
1462              <option value="1792x768">21:9 · 1792</option>
1463              <option value="1536x768">2:1 · 1536</option>
1464              <option value="768x1536">1:2 · 1536</option>
1465              <option value="1536x512">3:1 · 1536</option>
1466              <option value="512x1536">1:3 · 1536</option>
1467            </select>
1468          </div>
1469          <div class="image-quality-field">
1470            <select id="imageQualitySelect" aria-label="图片画质">
1471              <option value="auto">自动画质</option>
1472              <option value="high">高画质</option>
1473              <option value="medium">标准</option>
1474              <option value="low">快速</option>
1475            </select>
1476          </div>
1477        </div>
1478        </details>
1479        </div>
1480      </div>
1481    </section>
1482
1483    <dialog id="passwordResetDialog" class="member-dialog ui-dialog" aria-labelledby="passwordResetDialogTitle">
1484      <form id="passwordResetForm" class="password-reset-dialog-card member-dialog-card ui-dialog-card">
1485        <div class="member-dialog-head ui-dialog-head">
1486          <h3 id="passwordResetDialogTitle">找回密码</h3>
1487          <button id="closePasswordResetButton" class="icon-button" type="button" aria-label="关闭"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m6 6 12 12M18 6 6 18"/></svg></button>
1488        </div>
1489        <p id="passwordResetIntro" class="password-reset-intro">输入注册邮箱,我们会发送一封重置邮件。</p>
1490        <label id="passwordResetEmailField" class="member-field ui-field">
1491          <span>邮箱</span>
1492          <input id="passwordResetEmailInput" type="email" autocomplete="email" placeholder="[email protected]">
1493        </label>
1494        <input id="passwordResetTokenInput" type="hidden">
1495        <label id="passwordResetNewPasswordField" class="member-field ui-field" hidden>
1496          <span>新密码</span>
1497          <input id="passwordResetNewPasswordInput" type="password" autocomplete="new-password" placeholder="至少 8 位">
1498        </label>
1499        <div class="member-actions ui-dialog-actions">
1500          <button id="requestPasswordResetButton" type="submit">发送重置邮件</button>
1501          <button id="confirmPasswordResetButton" type="submit" hidden>保存新密码</button>
1502        </div>
1503        <p id="passwordResetStatus" class="form-status" role="status" aria-live="polite"></p>
1504      </form>
1505    </dialog>
1506
1507    <dialog id="deleteConfirmDialog" class="member-dialog ui-dialog delete-confirm-dialog" aria-labelledby="deleteConfirmTitle" aria-describedby="deleteConfirmBody">
1508      <form method="dialog" class="member-dialog-card ui-dialog-card">
1509        <div class="member-dialog-head ui-dialog-head">
1510          <h3 id="deleteConfirmTitle">确认删除</h3>
1511          <button class="icon-button" value="cancel" type="submit" aria-label="关闭"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m6 6 12 12M18 6 6 18"/></svg></button>
1512        </div>
1513        <p id="deleteConfirmBody" class="delete-confirm-body">删除后将从网站中移除。</p>
1514        <ul id="deleteConfirmList" class="delete-confirm-list" hidden></ul>
1515        <div class="member-actions ui-dialog-actions delete-confirm-actions">
1516          <div class="delete-confirm-import-actions">
1517            <button id="cancelDeleteButton" class="ghost-button ui-dialog-cancel" type="button">取消</button>
1518            <button id="confirmDeleteButton" class="delete-confirm-danger delete-confirm-primary" type="button">
1519              <i data-lucide="trash-2" aria-hidden="true"></i>
1520              <span>删除</span>
1521            </button>
1522          </div>
1523          <div id="deleteConfirmExtraActions" class="delete-confirm-extra-actions" hidden>
1524            <p>清理动作会移入回收站,已星标、收藏或评分的图片会保留。</p>
1525            <button id="extraDeleteButton" class="ghost-button delete-confirm-extra" type="button" hidden>
1526              <i data-lucide="trash-2" aria-hidden="true"></i>
1527              <span></span>
1528            </button>
1529          </div>
1530        </div>
1531      </form>
1532    </dialog>
1533
1534
1535    <div id="detailResizer" class="detail-resizer" role="separator" aria-orientation="vertical" aria-label="拖动调整面板宽度" aria-valuemin="24" aria-valuemax="70" aria-valuenow="44" tabindex="0"></div>
1536
1537
1538    <aside id="articleEditorPanel" class="detail-panel article-editor-panel ui-sheet panel-shell" hidden aria-labelledby="articleEditorTitle" data-admin-only>
1539      <div class="dialog-head ui-dialog-head panel-shell-head">
1540        <div>
1541          <h2 id="articleEditorTitle">新建文章</h2>
1542        </div>
1543        <button id="closeArticleEditorPanel" class="icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭">
1544          <i data-lucide="x" aria-hidden="true"></i>
1545        </button>
1546      </div>
1547      <div class="article-editor-scroll panel-shell-body">
1548        <section id="articleEditorForm" class="article-editor-form" aria-label="文章编辑">
1549          <section id="articleTranslationWorkspace" class="article-translation-workspace" aria-label="English companion workflow" hidden>
1550            <div class="article-translation-summary">
1551              <span id="articleTranslationStatusBadge" class="article-translation-status" data-status="missing">EN 未创建</span>
1552              <p id="articleTranslationStatusHint">英文草稿不会在英文站显示,只有明确发布后才会上线。</p>
1553            </div>
1554            <details id="articleTranslationSourceReference" class="article-translation-source">
1555              <summary>对照中文源稿</summary>
1556              <h3 id="articleTranslationSourceTitle"></h3>
1557              <p id="articleTranslationSourceExcerpt"></p>
1558              <pre id="articleTranslationSourceMarkdown"></pre>
1559            </details>
1560            <div id="articleTranslationQa" class="article-translation-qa" role="status" hidden></div>
1561          </section>
1562          <label id="articleTranslationCoverModeField" class="member-field ui-field article-translation-cover-mode" hidden>
1563            <span>英文封面方案</span>
1564            <select id="articleTranslationCoverModeInput">
1565              <option value="reuse">复用中文封面(适合无文字图)</option>
1566              <option value="independent">使用独立英文封面</option>
1567              <option value="none">不显示封面</option>
1568            </select>
1569          </label>
1570          <label id="articleTitleField" class="member-field ui-field">
1571            <span>标题 <em aria-hidden="true">*</em></span>
1572            <input id="articleTitleInput" type="text" maxlength="180" placeholder="一句话说清这篇文章" autocomplete="off" required aria-required="true">
1573          </label>
1574          <label id="articleMarkdownField" class="member-field ui-field article-markdown-field">
1575            <span>正文 <em aria-hidden="true">*</em></span>
1576            <textarea id="articleMarkdownInput" rows="16" maxlength="80000" placeholder="支持 Markdown;可直接粘贴完整文章" required aria-required="true"></textarea>
1577          </label>
1578          <section class="article-publishing-settings" aria-labelledby="articlePublishingSettingsTitle">
1579            <div class="article-publishing-settings-head">
1580              <h3 id="articlePublishingSettingsTitle">发布设置</h3>
1581              <p>发布前请确认访问范围;分类和日期已自动预填。</p>
1582            </div>
1583            <label id="articleMemberOnlyField" class="member-field ui-field article-member-only-field" data-access="public">
1584              <span>访问范围 <span id="articleMemberOnlyState" class="article-member-only-state" data-access="public" aria-live="polite">当前:公开可见</span></span>
1585              <span class="ui-checkbox-row">
1586                <input id="articleMemberOnlyInput" type="checkbox" role="switch" aria-describedby="articleMemberOnlyHelp articleMemberOnlyState">
1587                <span class="article-member-only-copy"><strong>仅会员可见</strong><small id="articleMemberOnlyHelp">开启后只有已激活会员和管理员可阅读;关闭时所有访客均可阅读。</small></span>
1588              </span>
1589            </label>
1590            <div class="article-editor-grid">
1591              <label class="member-field ui-field">
1592                <span>分类</span>
1593                <select id="articleCategoryInput">
1594                  <option value="articles">文章</option>
1595                  <option value="skills">skills</option>
1596                  <option value="chrome-plugins">Chrome 插件</option>
1597                  <option value="other">其他</option>
1598                </select>
1599              </label>
1600              <label class="member-field ui-field">
1601                <span>日期</span>
1602                <input id="articleDateInput" type="date">
1603              </label>
1604            </div>
1605            <label class="member-field ui-field">
1606              <span>标签</span>
1607              <input id="articleTagInput" type="text" maxlength="80" placeholder="标签">
1608            </label>
1609            <label class="member-field ui-field">
1610              <span>摘要</span>
1611              <textarea id="articleExcerptInput" rows="3" maxlength="500" placeholder="可选,留空将根据正文自动生成"></textarea>
1612            </label>
1613            <details id="articleEditorOptions" class="article-editor-options">
1614              <summary><span>封面与高级设置</span><small>可选</small></summary>
1615              <div class="article-editor-options-body">
1616                <div id="articleEditorCoverControls" class="article-editor-cover-controls">
1617                  <label id="articleEditorCoverDrop" class="article-editor-cover-drop" tabindex="0">
1618                    <img id="articleEditorCoverPreview" alt="" hidden>
1619                    <span id="articleEditorCoverPlaceholder">拖拽封面到这里</span>
1620                    <input id="articleEditorCoverInput" type="file" accept="image/png,image/jpeg,image/webp">
1621                  </label>
1622                  <button id="articleEditorCoverLibraryButton" class="editor-cover-library-button cover-library-button ui-button-secondary" type="button">
1623                    <i data-lucide="images" aria-hidden="true"></i>
1624                    <span>从图片库选择封面</span>
1625                  </button>
1626                  <button id="articleEditorRemoveCoverButton" class="ui-button-secondary" type="button" hidden>移除封面</button>
1627                </div>
1628                <div class="article-editor-grid">
1629                  <label class="member-field ui-field">
1630                    <span>封面说明</span>
1631                    <input id="articleCoverAltInput" type="text" maxlength="500" placeholder="用于无障碍阅读">
1632                  </label>
1633                  <label class="member-field ui-field">
1634                    <span>封面提示词</span>
1635                    <input id="articleCoverPromptInput" type="text" maxlength="4000" placeholder="保留生成封面的提示词">
1636                  </label>
1637                </div>
1638              </div>
1639            </details>
1640          </section>
1641        </section>
1642        <section id="articleTranslationPreview" class="article-translation-preview" aria-label="English article preview" hidden>
1643          <div class="article-translation-preview-head">
1644            <span id="articleEditorPreviewLabel">文章预览</span>
1645            <button id="closeArticleTranslationPreviewButton" class="ui-button-secondary" type="button">返回编辑</button>
1646          </div>
1647          <figure id="articleTranslationPreviewCover" class="article-translation-preview-cover" hidden>
1648            <img id="articleTranslationPreviewCoverImage" alt="">
1649          </figure>
1650          <h2 id="articleTranslationPreviewTitle"></h2>
1651          <p id="articleTranslationPreviewExcerpt"></p>
1652          <div id="articleTranslationPreviewContent" class="article-content"></div>
1653        </section>
1654      </div>
1655      <div class="article-editor-dock panel-shell-dock app-bottom-dock app-bottom-panel-dock">
1656        <p id="articleEditorStatus" class="form-status article-editor-dock-status" role="status" aria-live="polite"></p>
1657        <button id="rebaseArticleTranslationButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button" hidden>保留英文并同步源稿</button>
1658        <button id="resetArticleTranslationButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button" hidden>以新源稿重置</button>
1659        <button id="withdrawArticleTranslationButton" class="ui-button-secondary app-bottom-dock-button-secondary article-translation-withdraw" type="button" hidden>撤回英文版</button>
1660        <button id="previewArticleTranslationButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button" hidden>预览</button>
1661        <button id="cancelArticleEditorButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button">取消</button>
1662        <button id="saveArticleEditorButton" class="dock-button app-bottom-dock-button" type="button">
1663          <i data-lucide="save" aria-hidden="true"></i>
1664          <span>保存</span>
1665        </button>
1666        <button id="publishArticleTranslationButton" class="dock-button app-bottom-dock-button" type="button" hidden>
1667          <i data-lucide="languages" aria-hidden="true"></i>
1668          <span>发布英文版</span>
1669        </button>
1670      </div>
1671    </aside>
1672
1673    <aside id="notificationCenterPanel" class="detail-panel notification-center-panel ui-sheet panel-shell" hidden aria-labelledby="notificationCenterTitle" data-admin-only>
1674      <div class="dialog-head ui-dialog-head panel-shell-head">
1675        <div class="notification-detail-head-title">
1676          <h2 id="notificationCenterTitle">发送设置</h2>
1677        </div>
1678        <div class="notification-detail-head-actions panel-shell-actions">
1679          <button id="deleteCurrentNotificationButton" class="notification-admin-icon-button notification-admin-delete-button panel-shell-danger-action" type="button" aria-label="删除这条通知" title="删除通知" hidden>
1680            <i data-lucide="trash-2" aria-hidden="true"></i>
1681          </button>
1682          <button id="editCurrentNotificationButton" class="notification-admin-icon-button" type="button" aria-label="编辑当前通知" title="编辑通知" hidden>
1683            <i data-lucide="square-pen" aria-hidden="true"></i>
1684          </button>
1685          <button id="closeNotificationCenterPanel" class="icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭">
1686            <i data-lucide="x" aria-hidden="true"></i>
1687          </button>
1688        </div>
1689      </div>
1690      <div class="notification-center-body panel-shell-body">
1691        <section id="notificationCurrent" class="notification-current" aria-label="当前通知" hidden>
1692          <figure id="notificationCenterCover" class="notification-current-cover" hidden>
1693            <img id="notificationCenterCoverImage" alt="">
1694          </figure>
1695          <p id="notificationCenterMeta" class="notification-meta" hidden></p>
1696          <h3 id="notificationCenterMessageTitle" hidden></h3>
1697          <div id="notificationCenterContent" class="notification-markdown" hidden></div>
1698          <div class="notification-current-actions">
1699            <button id="openArticleNotificationButton" class="ghost-button notification-article-link" type="button" hidden>
1700              <i data-lucide="book-open-text" aria-hidden="true"></i>
1701              <span>文章</span>
1702            </button>
1703          </div>
1704        </section>
1705        <section id="notificationCurrentEmpty" class="notification-empty" role="status" hidden>
1706          <strong>还没有通知</strong>
1707          <span>有新消息时会显示在这里。</span>
1708        </section>
1709        <section id="notificationAdminEditor" class="notification-admin-editor article-editor-form" aria-label="发布通知" hidden>
1710          <section id="notificationImportSection" class="article-import-section notification-import-section" aria-labelledby="notificationImportTitle">
1711            <div class="article-import-head">
1712              <div>
1713                <span class="article-import-eyebrow">快速导入</span>
1714                <h3 id="notificationImportTitle">导入文章或 Markdown</h3>
1715              </div>
1716              <p>粘贴公开的 X 文章链接,或选择 Markdown 文件,内容会填入下面的通知编辑器。</p>
1717            </div>
1718            <div class="article-import-form notification-import-form">
1719              <div class="notification-import-option notification-import-url-option">
1720                <div class="notification-import-option-head">
1721                  <strong>X 文章链接</strong>
1722                  <span>同步标题、封面和正文</span>
1723                </div>
1724                <label class="member-field ui-field notification-import-url-field">
1725                  <span>文章链接</span>
1726                  <input id="notificationImportUrlInput" type="url" inputmode="url" placeholder="https://x.com/.../status/..." autocomplete="off">
1727                </label>
1728                <button id="importNotificationArticleButton" class="ui-button-secondary article-import-button" type="button">
1729                  <i data-lucide="download" aria-hidden="true"></i>
1730                  <span>读取 X 文章</span>
1731                </button>
1732              </div>
1733              <div class="notification-import-option notification-import-file-option">
1734                <div class="notification-import-option-head">
1735                  <strong>Markdown 文件</strong>
1736                  <span>适合导入已有文稿</span>
1737                </div>
1738                <input id="notificationMarkdownFileInput" type="file" accept=".md,.markdown,text/markdown,text/plain" hidden>
1739                <button id="importNotificationMarkdownButton" class="ui-button-secondary article-import-button" type="button">
1740                  <i data-lucide="file-up" aria-hidden="true"></i>
1741                  <span>导入 Markdown 文件</span>
1742                </button>
1743                <p class="notification-import-file-help">支持 .md、.markdown 和 .txt,导入后仍可在下方编辑。</p>
1744              </div>
1745            </div>
1746            <div id="notificationImportPreview" class="article-import-preview" hidden>
1747              <img id="notificationImportPreviewCover" alt="" hidden>
1748              <div class="article-import-preview-copy">
1749                <strong id="notificationImportPreviewTitle"></strong>
1750                <p id="notificationImportPreviewMeta"></p>
1751                <p id="notificationImportPreviewExcerpt"></p>
1752              </div>
1753            </div>
1754            <p id="notificationImportStatus" class="form-status" role="status" aria-live="polite"></p>
1755          </section>
1756          <div class="notification-editor-cover-field">
1757            <label id="notificationCoverDrop" class="article-editor-cover-drop notification-editor-cover-drop" tabindex="0">
1758              <img id="notificationCoverPreview" alt="" hidden>
1759              <span id="notificationCoverPlaceholder">拖拽封面到这里</span>
1760              <input id="notificationCoverInput" type="file" accept="image/png,image/jpeg,image/webp">
1761            </label>
1762            <button id="notificationCoverLibraryButton" class="editor-cover-library-button cover-library-button ui-button-secondary" type="button">
1763              <i data-lucide="images" aria-hidden="true"></i>
1764              <span>从图片库选择封面</span>
1765            </button>
1766            <button id="removeNotificationCoverButton" class="notification-editor-cover-remove ui-button-secondary" type="button" hidden>
1767              <i data-lucide="x" aria-hidden="true"></i>
1768              <span>移除封面</span>
1769            </button>
1770          </div>
1771          <label class="member-field ui-field">
1772            <span>标题</span>
1773            <input id="notificationTitleInput" type="text" maxlength="120" placeholder="标题">
1774          </label>
1775          <label class="member-field ui-field">
1776            <span>正文</span>
1777            <textarea id="notificationMarkdownInput" rows="10" maxlength="12000" placeholder="正文"></textarea>
1778          </label>
1779          <p id="notificationCenterStatus" class="form-status" role="status"></p>
1780        </section>
1781        <section id="newsletterSendPanel" class="newsletter-send-panel" aria-label="Newsletter 发送设置" hidden>
1782          <div class="newsletter-admin-head">
1783            <div>
1784              <strong>发送设置</strong>
1785              <span>先在瀑布流里选风格,再确认注册用户邮箱。</span>
1786            </div>
1787          </div>
1788          <label class="member-field ui-field">
1789            <span>标题</span>
1790            <input id="newsletterSubjectInput" type="text" maxlength="120" placeholder="小小东-今日风格推荐-2026-06-27-第1期">
1791          </label>
1792          <label class="member-field ui-field">
1793            <span>开场</span>
1794            <textarea id="newsletterIntroInput" rows="2" maxlength="1000" placeholder="今天挑几组能直接开工的风格。"></textarea>
1795          </label>
1796          <div class="newsletter-recipient-head">
1797            <span>注册用户邮箱</span>
1798            <button id="toggleNewsletterRecipientsButton" class="ghost-button" type="button">
1799              <i data-lucide="check-check" aria-hidden="true"></i>
1800              <span>全选</span>
1801            </button>
1802          </div>
1803          <div id="newsletterRecipientList" class="newsletter-recipient-list" role="list"></div>
1804          <p id="newsletterStatus" class="form-status" role="status"></p>
1805        </section>
1806        <section id="newsletterPreviewPanel" class="newsletter-preview-panel" aria-label="Newsletter 预览" hidden>
1807          <div class="newsletter-preview-head">
1808            <span>邮件预览</span>
1809            <h3 id="newsletterPreviewSubject"></h3>
1810            <p id="newsletterPreviewIntro"></p>
1811          </div>
1812          <div id="newsletterPreviewStyles" class="newsletter-preview-styles" role="list"></div>
1813          <p id="newsletterPreviewEmpty" class="newsletter-preview-empty" role="status" hidden>还没有选择风格。</p>
1814        </section>
1815      </div>
1816      <div id="notificationAdminDock" class="notification-admin-dock panel-shell-dock app-bottom-dock app-bottom-panel-dock" hidden>
1817        <nav id="notificationIssueNavigation" class="newsletter-issue-navigation" aria-label="发文历史导航" hidden></nav>
1818        <button id="cancelNotificationEditorButton" class="ui-button-secondary app-bottom-dock-button-secondary" type="button" hidden>取消</button>
1819        <button id="saveNotificationButton" class="dock-button app-bottom-dock-button notification-admin-save-button" type="button" hidden>
1820          <i data-lucide="save" aria-hidden="true"></i>
1821          <span>保存</span>
1822        </button>
1823      </div>
1824    </aside>
1825
1826    <aside id="detailPanel" class="detail-panel ui-sheet panel-shell" hidden aria-label="风格详情面板">
1827      <div class="dialog-head ui-dialog-head panel-shell-head">
1828        <div>
1829          <p id="detailMeta" class="eyebrow"></p>
1830          <h2 id="detailTitle"></h2>
1831          <button id="detailTitleToggle" class="detail-title-toggle" type="button" aria-expanded="false" aria-controls="detailTitle" hidden>展开名称</button>
1832        </div>
1833        <div class="dialog-head-actions panel-shell-actions">
1834          <details id="detailAdminActions" class="detail-admin-actions" hidden>
1835            <summary class="header-icon-button" aria-label="更多操作" aria-controls="detailMoreMenu"><i data-lucide="ellipsis" aria-hidden="true"></i></summary>
1836            <div id="detailMoreMenu" class="detail-admin-menu">
1837            <button id="detailDeliverButton" class="detail-admin-icon-button" type="button" aria-label="发布到小程序" title="发布到小程序">
1838              <i data-lucide="smartphone" aria-hidden="true"></i>
1839            </button>
1840            <button id="detailResyncButton" class="detail-admin-icon-button" type="button" aria-label="强制重新同步到小程序" title="强制重新同步到小程序" hidden>
1841              <i data-lucide="refresh-cw" aria-hidden="true"></i>
1842            </button>
1843            <button id="detailShareButton" class="detail-admin-icon-button detail-share-button" type="button" aria-label="获取分享链接" data-tooltip="复制风格主页链接" data-member-facing-locale hidden>
1844              <i data-lucide="share-2" aria-hidden="true"></i>
1845            </button>
1846            <button id="detailRedoButton" class="detail-admin-icon-button" type="button" aria-label="整组重做样张" hidden>
1847              <i data-lucide="refresh-cw" aria-hidden="true"></i>
1848            </button>
1849            <button id="detailDeleteButton" class="detail-admin-icon-button detail-admin-delete-button" type="button" aria-label="删除风格">
1850              <i data-lucide="trash-2" aria-hidden="true"></i>
1851            </button>
1852            </div>
1853          </details>
1854          <button id="closeDetailButton" class="header-icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭">
1855            <i data-lucide="x" aria-hidden="true"></i>
1856          </button>
1857        </div>
1858      </div>
1859      <div class="detail-body panel-shell-body">
1860        <div id="detailLoadingSkeleton" class="detail-loading-skeleton" role="status" hidden>
1861          <span class="sr-only">正在加载风格详情…</span>
1862        </div>
1863        <div id="detailTagRail" class="detail-tag-rail" role="group" aria-label="风格标签" hidden></div>
1864        <aside class="prompt-panel" aria-label="提示词操作">
1865          <section class="copy-panel prompt-code-block" aria-labelledby="basePromptHeading">
1866            <div id="basePromptViewer" class="prompt-code-viewer" tabindex="0" aria-label="原始提示词">
1867              <div class="prompt-code-toolbar">
1868                <button id="basePromptToggle" class="prompt-code-title-button" type="button" aria-expanded="false" aria-controls="basePromptContent" aria-label="展开原始提示词" title="展开原始提示词" disabled>
1869                  <span id="basePromptHeading" class="prompt-code-label">原始提示词</span>
1870                  <span id="basePromptMeta" class="prompt-code-meta"></span>
1871                  <span id="basePromptExpandIcon" class="prompt-expand-icon" aria-hidden="true" hidden><i data-lucide="chevron-down"></i></span>
1872                </button>
1873                <div class="prompt-code-actions">
1874                  <button id="copyBaseButton" class="prompt-code-action" type="button" aria-label="复制原始提示词" data-tooltip="复制原始提示词">
1875                    <i data-lucide="copy" aria-hidden="true"></i>
1876                  </button>
1877                </div>
1878              </div>
1879              <div id="basePromptContent" class="prompt-code-scroll-body">
1880                <div class="prompt-code-loading-lines" aria-hidden="true"><b></b><b></b><b></b><b></b></div>
1881                <pre><code id="basePromptCode"></code></pre>
1882              </div>
1883            </div>
1884            <div class="prompt-input-shell" aria-hidden="true">
1885              <textarea id="basePrompt" class="prompt-code-source" readonly tabindex="-1"></textarea>
1886            </div>
1887          </section>
1888          <section id="detailStyleRating" class="style-rating" role="group" aria-label="给这个风格打分" hidden></section>
1889        </aside>
1890        <section id="detailTaskInfo" class="detail-task-info" aria-label="生成任务详情" hidden></section>
1891        <section id="detailGallerySection" class="detail-gallery" aria-label="全部样张" hidden>
1892          <div class="detail-gallery-bar">
1893            <span id="detailGalleryLabel" class="detail-gallery-label">全部样张</span>
1894            <button id="detailFillMissingButton" class="detail-fill-missing-button" type="button" hidden>补全缺图</button>
1895            <button id="detailSampleConflictButton" class="detail-sample-conflict-button" type="button" hidden>需要处理</button>
1896            <div class="view-toggle" role="group" aria-label="样张操作">
1897              <button id="galleryLayoutToggle" class="view-toggle-btn" type="button" aria-pressed="false" title="当前:瀑布流,点击切换为单列竖排" aria-label="当前:瀑布流,点击切换为单列竖排">
1898                <i data-lucide="layout-grid" aria-hidden="true"></i>
1899              </button>
1900              <button id="manualSampleEntryButton" class="view-toggle-btn detail-add-sample-button" type="button" aria-label="添加样张" title="添加样张" hidden>
1901                <i data-lucide="plus" aria-hidden="true"></i>
1902              </button>
1903            </div>
1904          </div>
1905          <div id="detailGallery" class="detail-gallery-grid"></div>
1906        </section>
1907        <section id="detailLabelSection" class="detail-label-section" aria-label="标签" hidden></section>
1908        <section id="detailSimilarSection" class="detail-similar" aria-label="类似风格推荐" hidden>
1909          <div class="detail-similar-head">
1910            <span class="detail-similar-label">类似风格</span>
1911            <div class="detail-similar-tabs" role="group" aria-label="类似风格排序">
1912              <button class="detail-similar-tab" type="button" data-detail-similar-mode="color" aria-pressed="true">色彩相似</button>
1913              <button class="detail-similar-tab" type="button" data-detail-similar-mode="prompt" aria-pressed="false">提示词相似</button>
1914            </div>
1915          </div>
1916          <div id="detailSimilarColorRail" class="detail-similar-color-rail" role="group" aria-label="选择相似色" hidden></div>
1917          <div id="detailSimilarGrid" class="detail-similar-grid"></div>
1918          <div id="detailSimilarSentinel" class="detail-similar-sentinel" aria-hidden="true"></div>
1919          <button id="loadMoreSimilarButton" class="text-link-button detail-similar-more" type="button">再看 8 个</button>
1920        </section>
1921        <button id="detailPublicId" class="detail-public-id" type="button" hidden></button>
1922      </div>
1923      <div class="detail-dock panel-shell-dock app-bottom-dock app-bottom-panel-dock" hidden>
1924        <div id="detailLabelEditBar" class="detail-label-edit-bar" role="group" aria-label="逐张调整标签" hidden></div>
1925        <div id="detailTaskActions" class="detail-task-actions" hidden></div>
1926        <button id="makeSimilarButton" class="dock-button app-bottom-dock-button" type="button">
1927          <i data-lucide="wand-sparkles" aria-hidden="true"></i>
1928          <span id="makeSimilarLabel">用原始提示词作图</span>
1929        </button>
1930        <div id="detailDownloadControl" class="dock-download" data-download-mode="markdown">
1931          <button id="downloadDetailMenuButton" class="dock-icon-button app-bottom-dock-icon-button dock-download-menu-button" type="button" aria-label="导出提示词或样张" aria-haspopup="menu" aria-expanded="false" data-tooltip="导出提示词或样张">
1932            <i data-lucide="download" aria-hidden="true"></i>
1933          </button>
1934          <div id="downloadDetailMenu" class="dock-download-menu" role="menu" hidden>
1935            <button type="button" role="menuitemradio" data-detail-download-mode="markdown" aria-checked="true">
1936              <i data-lucide="file-down" aria-hidden="true"></i>
1937              <span>下载提示词 Markdown</span>
1938            </button>
1939            <button type="button" role="menuitemradio" data-detail-download-mode="zip" aria-checked="false">
1940              <i data-lucide="archive" aria-hidden="true"></i>
1941              <span>下载样张 ZIP</span>
1942            </button>
1943          </div>
1944        </div>
1945      </div>
1946    </aside>
1947
1948    <aside id="imageSkillLibraryPanel" class="detail-panel image-skill-library-panel ui-sheet panel-shell" hidden aria-label="管理作图 Skills"></aside>
1949
1950    <aside id="manualSamplePanel" class="detail-panel manual-sample-panel ui-sheet panel-shell" hidden aria-label="添加样张面板" data-admin-only>
1951      <div class="dialog-head ui-dialog-head panel-shell-head">
1952        <div>
1953          <p class="eyebrow">样张管理</p>
1954          <h2 id="manualSamplePanelTitle">添加样张</h2>
1955        </div>
1956        <button id="manualSampleBackButton" class="header-icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭">
1957          <i data-lucide="x" aria-hidden="true"></i>
1958        </button>
1959      </div>
1960      <div id="manualSampleWorkbench" class="manual-sample-workbench manual-sample-panel-body panel-shell-body">
1961        <div class="manual-sample-tabs" role="tablist" aria-label="添加样张方式">
1962          <button id="manualSampleGenerateTab" type="button" role="tab" data-manual-sample-tab="generate" aria-selected="true" aria-controls="manualSampleGeneratePanel">AI 生成</button>
1963          <button id="manualSampleManualTab" type="button" role="tab" data-manual-sample-tab="manual" aria-selected="false" aria-controls="manualSampleManualPanel">上传图片</button>
1964          <button id="manualSampleJsonTab" type="button" role="tab" data-manual-sample-tab="json" aria-selected="false" aria-controls="manualSampleJsonPanel">导入 JSON</button>
1965        </div>
1966        <div id="manualSampleManualPanel" class="manual-sample-source-panel" role="tabpanel" aria-labelledby="manualSampleManualTab" hidden>
1967          <label class="manual-sample-upload">
1968            <i data-lucide="image-up" aria-hidden="true"></i>
1969            <span>选择多张图片</span>
1970            <input id="manualSampleFileInput" type="file" accept="image/png,image/jpeg,image/webp" multiple>
1971          </label>
1972          <p>选择多张图片后,为每张图片填写对应提示词。</p>
1973        </div>
1974        <div id="manualSampleJsonPanel" class="manual-sample-source-panel" role="tabpanel" aria-labelledby="manualSampleJsonTab" hidden>
1975          <div class="manual-sample-json-head">
1976            <div>
1977              <h3>JSON 数据</h3>
1978              <p>粘贴图片地址和提示词,一次添加多张样张。</p>
1979            </div>
1980          </div>
1981          <textarea id="manualSampleJson" rows="12" spellcheck="false" aria-label="导入 JSON 内容" aria-describedby="manualSampleJsonHint manualSampleStatus" placeholder="在这里粘贴 JSON"></textarea>
1982          <p id="manualSampleJsonHint" class="manual-sample-json-hint">每张图需有 sourceId、prompt,以及 imageUrl 或 imageDataUrl。</p>
1983          <div class="manual-sample-json-actions">
1984            <button id="copyManualSampleJsonTemplateButton" class="manual-sample-json-copy" type="button" aria-label="复制 JSON 示例" title="复制 JSON 示例">
1985              <i data-lucide="copy" aria-hidden="true"></i>
1986              <span>复制示例</span>
1987            </button>
1988            <button id="parseManualSampleJsonButton" class="manual-sample-parse" type="button">检查并预览</button>
1989          </div>
1990        </div>
1991        <div id="manualSampleGeneratePanel" class="manual-sample-source-panel manual-sample-generate-panel" role="tabpanel" aria-labelledby="manualSampleGenerateTab">
1992          <div class="manual-sample-generate-intro">
1993            <strong>只写每张图要改什么</strong>
1994            <p>当前风格的提示词会自动带上,不用重复粘贴。</p>
1995          </div>
1996          <div class="manual-sample-current-prompt">
1997            <span>自动使用</span>
1998            <strong id="manualSampleCurrentPromptLabel">当前风格原始提示词</strong>
1999          </div>
2000          <label class="manual-sample-generate-field">
2001            <span>这批图片分别要改什么</span>
2002            <textarea id="manualSampleAdditionalRequirements" rows="10" aria-describedby="manualSampleGenerateHint manualSampleGenerateMeta manualSampleGenerateResultHint manualSampleStatus" placeholder="ä¾
2002‹å¦‚:竖版构图,暖色纸张质感&#10;&#10;---&#10;&#10;例如:横版构图,黑红高对比标题"></textarea>
2003          </label>
2004          <div class="manual-sample-generate-summary">
2005            <p id="manualSampleGenerateHint">每组要求生成 1 张;多张之间用单独一行的 <code>---</code> 分隔,最多 10 张。</p>
2006            <strong id="manualSampleGenerateMeta" role="status">尚未填写</strong>
2007          </div>
2008          <p id="manualSampleGenerateResultHint" class="manual-sample-generate-result-hint"><i data-lucide="images" aria-hidden="true"></i><span>生成后自动回到“全部样张”,进度卡会原位变成正式样张。</span></p>
2009        </div>
2010        <p id="manualSampleStatus" class="manual-sample-status" role="status"></p>
2011        <div id="manualSamplePreviewHead" class="manual-sample-preview-head" hidden>
2012          <span>预览</span>
2013          <strong id="manualSamplePreviewCount">0 å¼ </strong>
2014        </div>
2015        <div id="manualSamplePreviewList" class="manual-sample-preview-list" aria-live="polite"></div>
2016      </div>
2017      <div class="manual-sample-panel-dock panel-shell-dock app-bottom-dock app-bottom-panel-dock">
2018        <button id="saveManualSamplesButton" class="manual-sample-save dock-button app-bottom-dock-button" type="button" disabled>
2019          <span>先填写图片要求</span>
2020        </button>
2021      </div>
2022    </aside>
2023
2024    <aside id="adminControlPanel" class="detail-panel admin-control-panel ui-sheet panel-shell" hidden aria-label="管理员功能面板">
2025      <div class="dialog-head ui-dialog-head panel-shell-head">
2026        <div>
2027          <p class="eyebrow">Admin</p>
2028          <h2>管理员功能</h2>
2029        </div>
2030        <button id="closeAdminControlPanel" class="icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭管理员功能">
2031          <i data-lucide="x" aria-hidden="true"></i>
2032        </button>
2033      </div>
2034      <div class="admin-control-panel-body panel-shell-body settings-ui">
2035        <section class="admin-control-section" aria-label="全部管理员功能">
2036          <div class="admin-workspace-toolbar">
2037            <input id="adminControlFunctionSearch" class="settings-input" type="search" aria-label="搜索管理员功能" placeholder="搜索全部管理功能">
2038            <button id="adminControlManageFunctions" class="settings-button" type="button">管理栏目</button>
2039          </div>
2040          <div id="adminControlFunctionList" class="admin-control-entry-list">
2041            <button id="adminControlDashboardEntry" class="admin-control-entry" type="button"><i data-lucide="chart-no-axes-combined" aria-hidden="true"></i><span><strong>运营数据</strong><em>查看用户增长、收入、AI 使用与待处理事项。</em></span></button>
2042            <button id="adminControlUserDataEntry" class="admin-control-entry" type="button"><i data-lucide="users" aria-hidden="true"></i><span><strong>用户数据</strong><em>查看会员账号与使用数据。</em></span></button>
2043            <button id="adminControlDailyReportsEntry" class="admin-control-entry" type="button"><i data-lucide="notebook-tabs" aria-hidden="true"></i><span><strong>运营日报</strong><em>预览午报与晚报,查看发送历史和收件设置。</em></span></button>
2044            <button id="adminControlActivationCodesEntry" class="admin-control-entry" type="button"><i data-lucide="ticket" aria-hidden="true"></i><span><strong>激活码管理</strong><em>批量生成激活码,查看库存与兑换记录。</em></span></button>
2045            <button id="adminControlObsidianSettingsEntry" class="admin-control-entry" type="button"><i data-lucide="gem" aria-hidden="true"></i><span><strong>积分设置</strong><em>设置会员价、非会员价,管理积分兑换码。</em></span></button>
2046            <button id="adminControlImageSkillsEntry" class="admin-control-entry" type="button"><i data-lucide="blocks" aria-hidden="true"></i><span><strong>作图 Skills</strong><em>新建、测试并发布会员可用的作图工作流。</em></span></button>
2047            <button id="adminControlStyleStatisticsEntry" class="admin-control-entry" type="button"><i data-lucide="chart-column" aria-hidden="true"></i><span><strong>风格统计</strong><em>查看风格库存、分类和使用情况。</em></span></button>
2048            <button id="adminControlMediaLibraryEntry" class="admin-control-entry" type="button"><i data-lucide="images" aria-hidden="true"></i><span><strong>素材库</strong><em>按分类整理和复用常用图片。</em></span></button>
2049            <button id="adminControlStyleUploadEntry" class="admin-control-entry" type="button"><i data-lucide="upload-cloud" aria-hidden="true"></i><span><strong>导入风格</strong><em>进入独立上传页面,整理文件夹、检查分类并上传存档。</em></span></button>
2050            <button id="adminControlClassificationEntry" class="admin-control-entry" type="button"><i data-lucide="sparkles" aria-hidden="true"></i><span><strong>智能整理</strong><em>整理内容分类,查看分类任务和处理进度。</em></span></button>
2051            <button id="adminControlBackfillEntry" class="admin-control-entry" type="button"><i data-lucide="wand-sparkles" aria-hidden="true"></i><span><strong>样张任务</strong><em>补图与替换的进度、需要处理的新图和待补图的风格。</em></span></button>
2052            <button id="adminControlHiddenStylesEntry" class="admin-control-entry" type="button"><i data-lucide="eye-off" aria-hidden="true"></i><span><strong>下架风格</strong><em>查看已下架内容,必要时恢复展示。</em></span></button>
2053            <button id="adminControlStyleStudiosEntry" class="admin-control-entry" type="button"><i data-lucide="panels-top-left" aria-hidden="true"></i><span><strong>风格专题</strong><em>配置专题可见范围、做同款工作流、案例审核和次数券。</em></span></button>
2054            <button id="adminControlOpenSourceContentEntry" class="admin-control-entry" type="button"><i data-lucide="sprout" aria-hidden="true"></i><span><strong>开源内容</strong><em>进入开源页,检查公开图片与频道展示。</em></span></button>
2055            <button id="adminControlOpenSourceChannelsEntry" class="admin-control-entry" type="button"><i data-lucide="tags" aria-hidden="true"></i><span><strong>开源素材频道</strong><em>管理素材频道;开源样图跟随会员库共享标签。</em></span></button>
2056            <button id="adminControlArticleEntry" class="admin-control-entry" type="button"><i data-lucide="file-plus-2" aria-hidden="true"></i><span><strong>写文章</strong><em>打开文章编辑器,发布工具箱内容。</em></span></button>
2057            <button id="adminControlNotificationEntry" class="admin-control-entry" type="button"><i data-lucide="bell-plus" aria-hidden="true"></i><span><strong>通知中心</strong><em>发布或编辑会员通知。</em></span></button>
2058            <button id="adminControlNewsletterEntry" class="admin-control-entry" type="button"><i data-lucide="send" aria-hidden="true"></i><span><strong>Newsletter</strong><em>进入群发工作台,选择风格和收件人。</em></span></button>
2059            <button id="adminControlTipsEntry" class="admin-control-entry" type="button"><i data-lucide="lightbulb" aria-hidden="true"></i><span><strong>小 Tips 中心</strong><em>
2059用瀑布流管理使用技巧,并设置间歇触达节奏。</em></span></button>
2060            <button id="adminControlMiniprogramDeliveriesEntry" class="admin-control-entry" type="button"><i data-lucide="smartphone" aria-hidden="true"></i><span><strong>小程序投递</strong><em>查看推过哪些风格、成功与否(投递日志,非实时状态)。</em></span></button>
2061            <button id="adminControlPaymentSuccessEmailEntry" class="admin-control-entry" type="button"><i data-lucide="mail-check" aria-hidden="true"></i><span><strong>购买成功提醒</strong><em>查看通知管理员并发送测试邮件。</em></span></button>
2062            <button id="adminControlImageApiEntry" class="admin-control-entry" type="button"><i data-lucide="plug-zap" aria-hidden="true"></i><span><strong>我的 API</strong><em>管理仅自己使用的图片与文本接口。</em></span></button>
2063            <button id="adminControlObsidianEntry" class="admin-control-entry" type="button"><i data-lucide="gem" aria-hidden="true"></i><span><strong>平台 API</strong><em>管理全站连接与积分服务规则。</em></span></button>
2064            <button id="adminControlTopicNavigationEntry" class="admin-control-entry" type="button"><i data-lucide="list-filter" aria-hidden="true"></i><span><strong>管理栏目</strong><em>调整当前管理员账号看到的栏目和顺序。</em></span></button>
2065            <button id="adminControlTopicDefaultsEntry" class="admin-control-entry" type="button"><i data-lucide="list-tree" aria-hidden="true"></i><span><strong>设置默认导航</strong><em>设置尚未创建个人导航用户看到的分类和顺序。</em></span></button>
2066            <button id="adminControlAdministratorsEntry" class="admin-control-entry" type="button"><i data-lucide="shield-check" aria-hidden="true"></i><span><strong>管理员日报设置</strong><em>查看管理员并设置每位管理员的日报接收开关。</em></span></button>
2067            <button id="adminControlSoftwareEntry" class="admin-control-entry" type="button"><i data-lucide="package-check" aria-hidden="true"></i><span><strong>会员软件</strong><em>查看并调整会员软件的分发状态。</em></span></button>
2068          </div>
2069          <p id="adminControlFunctionEmpty" class="style-upload-task-note" role="status" hidden>没有匹配的管理功能</p>
2070        </section>
2071        <section class="admin-control-summary" aria-label="管理状态">
2072          <span>
2073            <strong id="adminControlBackfillCount">0</strong>
2074            <em>待补图</em>
2075          </span>
2076          <span>
2077            <strong id="adminControlHiddenStylesCount">0</strong>
2078            <em>下架</em>
2079          </span>
2080        </section>
2081        <section class="admin-control-section admin-control-administrators" aria-labelledby="adminControlAdministratorsTitle">
2082          <div class="admin-control-section-head admin-control-administrators-head">
2083            <div>
2084              <p class="eyebrow">Administrators</p>
2085              <h3 id="adminControlAdministratorsTitle" tabindex="-1">管理员</h3>
2086            </div>
2087            <span id="adminControlAdministratorCount" aria-live="polite">--</span>
2088          </div>
2089          <div id="adminControlAdministratorList" class="admin-control-administrator-list" aria-live="polite">
2090            <div class="admin-control-administrator-state" data-tone="loading">
2091              <i data-lucide="loader-circle" aria-hidden="true"></i>
2092              <span>正在读取管理员...</span>
2093            </div>
2094          </div>
2095          <p id="adminControlAdministratorStatus" class="admin-control-administrator-status" role="status" aria-live="polite"></p>
2096        </section>
2097        <section class="admin-control-section admin-control-software" aria-labelledby="adminControlSoftwareTitle">
2098          <div class="admin-control-section-head admin-control-software-head">
2099            <div>
2100              <p class="eyebrow">Software</p>
2101              <h3 id="adminControlSoftwareTitle" tabindex="-1">会员软件</h3>
2102            </div>
2103            <span id="adminControlSoftwareCount" aria-live="polite">--</span>
2104          </div>
2105          <div id="adminControlSoftwareList" class="admin-control-software-list" aria-live="polite">
2106            <div class="admin-control-administrator-state" data-tone="loading">
2107              <i data-lucide="loader-circle" aria-hidden="true"></i>
2108              <span>正在读取分发状态...</span>
2109            </div>
2110          </div>
2111          <p id="adminControlSoftwareStatus" class="admin-control-administrator-status" role="status" aria-live="polite"></p>
2112        </section>
2113      </div>
2114    </aside>
2115
2116    <aside id="openSourceChannelSettingsPanel" class="detail-panel open-source-channel-settings-panel ui-sheet panel-shell" hidden aria-labelledby="openSourceChannelSettingsTitle" data-admin-only>
2117      <div class="dialog-head ui-dialog-head panel-shell-head">
2118        <div>
2119          <p class="eyebrow">Open source · Channels</p>
2120          <h2 id="openSourceChannelSettingsTitle">开源素材频道设置</h2>
2121        </div>
2122        <button id="closeOpenSourceChannelSettingsPanel" class="icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭开源频道设置">
2123          <i data-lucide="x" aria-hidden="true"></i>
2124        </button>
2125      </div>
2126      <div id="openSourceChannelSettingsBody" class="open-source-channel-settings-body panel-shell-body">
2127        <p class="open-source-channel-settings-loading">正在加载频道设置…</p>
2128      </div>
2129      <div class="open-source-channel-settings-dock panel-shell-dock app-bottom-dock app-bottom-panel-dock" hidden>
2130        <p id="openSourceChannelSettingsHint" class="open-source-channel-settings-hint" role="status" aria-live="polite"></p>
2131        <button id="discardOpenSourceChannelSettingsButton" class="app-bottom-dock-button-secondary" type="button" disabled>撤销编辑</button>
2132        <button id="saveOpenSourceChannelSettingsButton" class="open-source-channel-settings-save dock-button app-bottom-dock-button" type="button" disabled>保存编辑</button>
2133      </div>
2134    </aside>
2135
2136    <aside id="imageSkillsAdminPanel" class="detail-panel image-skills-admin-panel ui-sheet panel-shell" hidden aria-labelledby="imageSkillsAdminTitle">
2137      <div class="dialog-head ui-dialog-head panel-shell-head">
2138        <div>
2139          <p class="eyebrow">Image skills</p>
2140          <h2 id="imageSkillsAdminTitle">Skills</h2>
2141        </div>
2142        <button id="closeImageSkillsAdminPanel" class="icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭作图 Skills">
2143          <i data-lucide="x" aria-hidden="true"></i>
2144        </button>
2145      </div>
2146      <div id="imageSkillsAdminBody" class="image-skills-admin-body panel-shell-body">
2147        <section id="imageSkillsAdminEditor" class="image-skills-admin-editor" aria-label="编辑作图 Skill" hidden>
2148          <div class="skill-editor-tabs" role="tablist" aria-label="Skill 编辑步骤">
2149            <button type="button" role="tab" id="skillEditorBasicsTab" aria-controls="skillEditorBasics" data-editor-tab="basics">基础信息</button>
2150            <button type="button" role="tab" id="skillEditorConfigTab" aria-controls="skillEditorConfig" data-editor-tab="config">配置</button>
2151            <button type="button" role="tab" id="skillEditorPreviewTab" aria-controls="skillEditorPreview" data-editor-tab="preview">预览与发布</button>
2152          </div>
2153          <form id="imageSkillsAdminForm" class="image-skills-admin-form" novalidate>
2154            <div id="skillEditorBasics" role="tabpanel" aria-labelledby="skillEditorBasicsTab" data-editor-tabpanel="basics">
2155            <section class="image-skills-admin-section" aria-labelledby="imageSkillsBasicsTitle">
2156              <div class="image-skills-admin-section-head">
2157                <p class="eyebrow">Basics</p>
2158                <h3 id="imageSkillsBasicsTitle">基础信息</h3>
2159              </div>
2160              <div class="image-skills-admin-basics-grid">
2161                <label class="image-skills-admin-field"><span>名称 *</span><input id="imageSkillNameInput" name="name" type="text" autocomplete="off" maxlength="80" required></label>
2162                <label class="image-skills-admin-field image-skills-admin-field-wide" hidden><span>功能站网址</span><input id="siteSkillUrlInput" name="siteUrl" type="url" maxlength="2000" placeholder="https://" autocomplete="off"><small>未上线可留空保存草稿,发布前填写正式网址。</small></label>
2163                <label class="image-skills-admin-field image-skills-admin-field-wide"><span>简介</span><textarea id="imageSkillSummaryInput" name="summary" rows="3" maxlength="240" placeholder="告诉会员这个 Skill 适合完成什么"></textarea></label>
2164                <div class="image-skills-admin-field image-skills-admin-field-wide"><span>Skill 封面</span>
2165                  <img id="imageSkillCoverPreview" class="image-skills-admin-cover-preview" alt="Skill 封面预览" hidden>
2166                  <div class="image-skills-admin-cover-row"><button id="imageSkillChooseCoverButton" class="image-skills-admin-secondary-button" type="button"><i data-lucide="image-plus" aria-hidden="true"></i><span>
2166选择或上传封面</span></button><button id="imageSkillRemoveCoverButton" class="image-skills-admin-secondary-button" type="button" hidden>移除封面</button><input id="imageSkillCoverUrlInput" name="coverUrl" type="url" placeholder="选择后自动填充封面地址" readonly></div>
2167                  <div class="image-skills-admin-cover-meta"><input id="imageSkillCoverWidthInput" name="coverWidth" type="number" min="1" placeholder="宽度" aria-label="封面宽度" readonly><span>×</span><input id="imageSkillCoverHeightInput" name="coverHeight" type="number" min="1" placeholder="高度" aria-label="封面高度" readonly><small>选择一张代表作品,按原图比例展示</small></div>
2168                </div>
2169                <div class="image-skills-admin-field-wide"><div id="skillGalleryManager"></div><details class="image-skills-admin-advanced"><summary>高级:图片地址</summary><label class="image-skills-admin-field image-skills-admin-field-wide"><span>作品预览图片</span><textarea id="imageSkillGalleryInput" name="gallery" rows="4" placeholder="每行一个 HTTPS 图片地址,最多 8 张;封面会自动作为第一张"></textarea></label></details></div>
2170                <details class="image-skills-admin-advanced image-skills-admin-field-wide"><summary>高级设置:URL 标识、图标和结果类型</summary>                <label class="image-skills-admin-field"><span>URL 标识 *</span><input id="imageSkillSlugInput" name="slug" type="text" autocomplete="off" inputmode="url" pattern="[a-z0-9]+(?:-[a-z0-9]+)*" placeholder="ä¾
2170‹å¦‚ xiaohongshu-card" required></label>
2171                <label class="image-skills-admin-field"><span>Lucide 图标</span><input id="imageSkillIconInput" name="icon" type="text" autocomplete="off" placeholder="例如 notebook-tabs"></label>
2172                <label class="image-skills-admin-field"><span>结果类型</span><select id="imageSkillResultKindSelect" name="resultKind"><option value="image-set">图片组</option><option value="card-set">卡片组</option><option value="slide-deck">PPT 页组</option><option value="comic-strip">漫画组</option></select></label>
2173</details>
2174              </div>
2175            </section>
2176
2177            </div><div id="skillEditorConfig" role="tabpanel" aria-labelledby="skillEditorConfigTab" data-editor-tabpanel="config" hidden>
2178            <section class="image-skills-admin-section" aria-labelledby="imageSkillsFieldsTitle">
2179              <div class="image-skills-admin-section-head image-skills-admin-section-head-action">
2180                <div><p class="eyebrow">Inputs</p><h3 id="imageSkillsFieldsTitle">用户输入</h3></div>
2181                <button id="addImageSkillFieldButton" class="image-skills-admin-secondary-button" type="button" data-image-skills-action="add-field"><i data-lucide="plus" aria-hidden="true"></i><span>添加字段</span></button>
2182              </div>
2183              <p class="image-skills-admin-help">字段会按顺序生成会员表单;选项每行填写“值 | 显示名称”。</p>
2184              <div id="imageSkillFieldsList" class="image-skills-admin-builder-list"></div>
2185            </section>
2186
2187            <section class="image-skills-admin-section" aria-labelledby="imageSkillsWorkflowTitle">
2188              <div class="image-skills-admin-section-head"><p class="eyebrow">Workflow</p><h3 id="imageSkillsWorkflowTitle">工作流</h3></div>
2189              <label class="image-skills-admin-field"><span>执行指令 *</span><textarea id="imageSkillInstructionsInput" name="instructions" rows="8" required placeholder="描述 Skill 如何理解输入、组织画面并生成结果"></textarea></label>
2190              <label class="image-skills-admin-field" hidden><span>文字卡片示例</span><textarea id="textSkillExampleInput" rows="6" maxlength="4000" placeholder="填写这个 Skill 的代表性文字作品,用于卡片预览"></textarea></label>
2191              <label class="image-skills-admin-field"><span>记录标题模板</span><input id="imageSkillTitleTemplateInput" name="titleTemplate" type="text" autocomplete="off" placeholder="ä¾
2191‹å¦‚ {{topic}} · 小红书卡片"></label>
2192              <div class="image-skills-admin-template-tools">
2193                <p class="image-skills-admin-help">先聚焦指令、标题或任务提示词,再点击变量插入。可选内容使用 <code>{{#field}}…{{/field}}</code>,长标题可用 <code>{{field|truncate:16}}</code>。</p>
2194                <div id="imageSkillTemplateVariables" class="image-skills-admin-variable-list" aria-label="可插入的模板变量"></div>
2195                <p id="imageSkillPlanLimitSummary" class="image-skills-admin-plan-limit" role="status" aria-live="polite"></p>
2196              </div>
2197              <div class="image-skills-admin-section-head image-skills-admin-section-head-action image-skills-admin-jobs-head">
2198                <div><p class="eyebrow">Jobs</p><h3>出图任务</h3></div>
2199                <button id="addImageSkillJobButton" class="image-skills-admin-secondary-button" type="button" data-image-skills-action="add-job"><i data-lucide="plus" aria-hidden="true"></i><span>添加任务</span></button>
2200              </div>
2201              <div id="imageSkillJobsList" class="image-skills-admin-builder-list"></div>
2202              <p class="image-skills-admin-tool-note"><i data-lucide="shield-check" aria-hidden="true"></i><span>当前仅允许调用 <code>image.generate</code>。</span></p>
2203            </section>
2204
2205            </div><div id="skillEditorPreview" role="tabpanel" aria-labelledby="skillEditorPreviewTab" data-editor-tabpanel="preview" hidden>
2206            <section class="image-skills-admin-section" aria-labelledby="imageSkillsTestTitle">
2207              <div class="image-skills-admin-section-head"><p class="eyebrow">Validate</p><h3 id="imageSkillsTestTitle">校验预览</h3></div>
2208              <p class="image-skills-admin-help">填写下方预览表单后校验;只检查配置和任务参数,不会调用模型、扣费或保存草稿。</p>
2209              <details class="image-skills-admin-advanced"><summary>高级调试:JSON 输入(可选)</summary><label class="image-skills-admin-field"><span>示例输入 JSON</span><textarea id="imageSkillSampleInput" name="sampleInput" rows="6" spellcheck="false" placeholder='例如 {"topic":"夏日旅行"}'></textarea><button id="imageSkillFillSampleButton" class="image-skills-admin-secondary-button" type="button">自动生成 JSON 示例</button></label></details>
2210              <div id="skillValidationErrors" role="status"></div><details class="image-skills-admin-advanced"><summary>校验详情 JSON</summary><pre id="imageSkillValidationPreview" class="image-skills-admin-preview" tabindex="0" hidden></pre></details>
2211            </section>
2212            <section class="image-skills-admin-section" aria-labelledby="imageSkillsMemberPreviewTitle">
2213              <div class="image-skills-admin-section-head"><p class="eyebrow">Member view</p><h3 id="imageSkillsMemberPreviewTitle">会员端预览</h3></div>
2214              <div id="imageSkillMemberPreview" class="image-skills-admin-member-preview" aria-live="polite"></div>
2215              <button id="imageSkillUsePreviewButton" class="image-skills-admin-secondary-button" type="button">使用表单作为测试输入</button>
2216            </section>
2217
2218            <section id="imageSkillLifecycleSection" class="image-skills-admin-section image-skills-admin-lifecycle" aria-labelledby="imageSkillLifecycleTitle" hidden>
2219              <div class="image-skills-admin-section-head"><p class="eyebrow">Versions</p><h3 id="imageSkillLifecycleTitle">版本与归档</h3></div>
2220              <div class="image-skills-admin-lifecycle-controls">
2221                <label class="image-skills-admin-field"><span>回退到已发布版本</span><select id="imageSkillRollbackVersionSelect" aria-describedby="imageSkillLifecycleStatus"><option value="">暂无可回退版本</option></select></label>
2222                <button id="rollbackImageSkillButton" class="image-skills-admin-secondary-button" type="button" disabled><i data-lucide="history" aria-hidden="true"></i><span>切换版本</span></button>
2223              </div>
2224              <p id="imageSkillLifecycleStatus" class="image-skills-admin-help"></p>
2225              <button id="skillEditorLiveButton" class="image-skills-admin-secondary-button" type="button" hidden>上架</button>
2226              <button id="archiveImageSkillButton" class="image-skills-admin-secondary-button image-skills-admin-danger-button" type="button"><i data-lucide="archive" aria-hidden="true"></i><span>归档 Skill</span></button>
2227            </section>
2228            </div>
2229            <p id="imageSkillsAdminEditorStatus" class="image-skills-admin-status" role="status" aria-l
2229ive="polite"></p>
2230          </form>
2231        </section>
2232      </div>
2233      <div id="imageSkillsAdminEditorDock" class="image-skills-admin-dock image-skills-admin-editor-dock panel-shell-dock app-bottom-dock app-bottom-panel-dock" hidden>
2234        <button id="validateImageSkillButton" class="app-bottom-dock-button-secondary" type="button" data-image-skills-action="validate"><i data-lucide="flask-conical" aria-hidden="true"></i><span>校验预览</span></button>
2235        <button id="saveImageSkillDraftButton" class="app-bottom-dock-button-secondary" type="button" data-image-skills-action="save"><i data-lucide="save" aria-hidden="true"></i><span>保存草稿</span></button>
2236        <button id="publishImageSkillButton" class="dock-button app-bottom-dock-button" type="button" data-image-skills-action="publish"><i data-lucide="send" aria-hidden="true"></i><span>发布</span></button>
2237      </div>
2238    </aside>
2239
2240
2241    <aside id="imageApiPanel" class="detail-panel image-api-panel ui-sheet panel-shell" hidden aria-label="作图 API 配置面板">
2242      <div class="dialog-head ui-dialog-head panel-shell-head">
2243        <div>
2244          <p id="imageApiMeta" class="eyebrow">API</p>
2245          <h2 id="imageApiTitle">API 管理</h2>
2246        </div>
2247        <button id="closeImageApiPanel" class="icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭">
2248          <i data-lucide="x" aria-hidden="true"></i>
2249        </button>
2250      </div>
2251      <div class="image-api-manager panel-shell-body">
2252        <section class="image-api-library" aria-labelledby="imageApiLibraryTitle">
2253          <div class="image-api-section-head">
2254            <p id="imageApiLibraryTitle" class="image-api-library-count"><span id="imageApiCount">0 个接口</span></p>
2255            <div class="image-api-library-actions">
2256              <button id="addImageApiButton" class="image-api-add-button" type="button" aria-label="新增接口">
2257                <i data-lucide="plus" aria-hidden="true"></i>
2258                <span>新增接口</span>
2259              </button>
2260              <button id="imageApiLibraryMore" class="image-api-tool-button" type="button" aria-label="更多操作" title="更多操作">
2261                <i data-lucide="ellipsis" aria-hidden="true"></i>
2262              </button>
2263              <div id="imageApiLibraryMenu" class="image-api-menu" hidden>
2264                <button id="importImageApiButton" class="image-api-card-action" type="button" aria-label="导入 API 配置">
2265                  <i data-lucide="file-up" aria-hidden="true"></i><span>导入配置</span>
2266                </button>
2267                <button id="exportImageApiButton" class="image-api-card-action" type="button" aria-label="导出 API 配置">
2268                  <i data-lucide="file-down" aria-hidden="true"></i><span>导出备份</span>
2269                </button>
2270              </div>
2271              <input id="imageApiImportInput" type="file" accept="application/json,.json" hidden>
2272            </div>
2273          </div>
2274          <p id="imageApiManagerStatus" class="form-status image-api-manager-status" role="status" aria-live="polite"></p>
2275          <div id="imageApiGrid" class="image-api-grid" aria-label="已保存的作图 API"></div>
2276        </section>
2277      </div>
2278    </aside>
2279
2280    <form id="imageApiForm" class="detail-panel image-api-editor-dialog image-api-form ui-sheet panel-shell settings-ui" role="dialog" aria-modal="true" aria-labelledby="imageApiEditorTitle" autocomplete="off" data-lpignore="true" data-1p-ignore="true" data-bwignore="true" data-form-type="other" hidden>
2281      <div class="dialog-head ui-dialog-head image-api-editor-head panel-shell-head">
2282        <div>
2283          <p id="imageApiEditorMeta" class="eyebrow" hidden></p>
2284          <h2 id="imageApiEditorTitle">编辑接口</h2>
2285        </div>
2286        <button id="closeImageApiEditorDialog" class="header-icon-button panel-shell-navigation right-panel-close-button" type="button" aria-label="关闭接口编辑" title="关闭">
2287          <i data-lucide="x" aria-hidden="true"></i>
2288        </button>
2289      </div>
2290      <div class="image-api-editor-body panel-shell-body">
2291        <div class="image-api-fields">
2292          <fieldset id="imageApiScopeField" class="image-api-scope-field" hidden>
2293            <legend>适用范围</legend>
2294            <div class="image-api-scope-options">
2295              <label><input id="imageApiPersonalScope" type="checkbox" checked disabled><span>个人</span></label>
2296              <label><input id="imageApiPlatformScope" type="checkbox"><span>平台</span></label>
2297            </div>
2298            <small>可同时用于个人调用和平台积分服务。</small>
2299          </fieldset>
2300          <label>
2301            <span>服务商</span>
2302            <select id="imageApiProviderKind" autocomplete="off">
2303              <option value="openai">OpenAI</option>
2304              <option value="google_gemini">Google Gemini</option>
2305              <option value="xai_grok">xAI / Grok</option>
2306              <option value="openai_compatible">OpenAI 兼容接口</option>
2307            </select>
2308          </label>
2309          <label>
2310            <span>接口名称</span>
2311            <input id="imageApiName" type="text" autocomplete="off" placeholder="例如:OpenAI 官方">
2312          </label>
2313          <label id="imageApiEndpointField">
2314            <span>接口地址</span>
2315            <input id="imageApiEndpoint" type="url" autocomplete="off" inputmode="url" placeholder="https://api.openai.com/v1 或 http://host:port/v1">
2316            <small id="imageApiProviderHint" class="image-api-field-hint"></small>
2317          </label>
2318          <label>
2319            <span>API Key</span>
2320            <span class="image-api-secret-control">
2321              <input id="imageApiKey" class="image-api-secret-input" type="password" autocomplete="off" autocapitalize="off" spellcheck="false" data-lpignore="true" data-1p-ignore="true" data-bwignore="true" data-form-type="other" placeholder="输入 API Key">
2322              <span class="image-api-secret-actions">
2323                <button id="copyImageApiKeyButton" class="image-api-secret-toggle" type="button" aria-label="复制 API Key" title="复制 API Key">
2324                  <i data-lucide="copy" aria-hidden="true"></i>
2325                </button>
2326                <button id="toggleImageApiKeyVisibility" class="image-api-secret-toggle" type="button" aria-label="显示 API Key" aria-pressed="false">
2327                  <i data-lucide="eye" aria-hidden="true"></i>
2328                </button>
2329              </span>
2330            </span>
2331          </label>
2332          <label>
2333            <span>图片模型(可选)</span>
2334            <select id="imageApiModelPreset" autocomplete="off" aria-label="选择图片模型"></select>
2335            <input id="imageApiModel" type="text" autocomplete="off" maxlength="160" placeholder="输入自定义图片模型 ID" hidden>
2336            <small class="image-api-field-hint">选择当前服务商的预设;列表中没有时可选择“自定义模型…”。</small>
2337          </label>
2338          <label>
2339            <span>文本模型(可选)</span>
2340            <select id="imageApiTextModelPreset" autocomplete="off" aria-label="选择文本模型"></select>
2341            <input id="imageApiTextModel" type="text" autocomplete="off" maxlength="160" placeholder="输入自定义文本模型 ID" hidden>
2342            <small class="image-api-field-hint">选择当前服务商的预设;列表中没有时可选择“自定义模型…”。</small>
2343          </label>
2344          <p class="image-api-note">图片模型和文本模型至少填写一个。</p>
2345          <div class="image-api-inline-actions">
2346            <button id="testImageApiButton" class="ghost-button image-api-inline-test" type="button" hidden>
2347              <i data-lucide="plug-zap" aria-hidden="true"></i>
2348              <span>测试连接(可选)</span>
2349            </button>
2350          </div>
2351        </div>
2352        <p class="image-api-note">不同服务商会使用各自的鉴权、请求格式和模型目录。Key 加密保存;支持 HTTP 和 HTTPS,HTTP 会明文传输 Key。</p>
2353      </div>
2354      <div class="image-api-editor-dock panel-shell-dock app-bottom-dock app-bottom-panel-dock">
2355        <p id="imageApiStatus" class="form-status" role="status" aria-live="polite"></p>
2356        <div class="image-api-actions">
2357          <button id="saveImageApiButton" class="dock-button app-bottom-dock-button" type="submit">
2358            <i data-lucide="save" aria-hidden="true"></i>
2359            <span>保存配置</span>
2360          </button>
2361        </div>
2362      </div>
2363    </form>
2364
2365    <dialog id="imageApiTransferDialog" class="member-dialog ui-dialog image-api-transfer-dialog" aria-labelledby="imageApiTransferTitle">
2366      <form method="dialog" class="member-dialog-card ui-dialog-card image-api-transfer-card">
2367        <div class="member-dialog-head ui-dialog-head">
2368          <div>
2369            <p class="image-api-section-kicker">API 迁移</p>
2370            <h3 id="imageApiTransferTitle">导入 API 配置</h3>
2371          </div>
2372          <button id="closeImageApiTransferDialog" class="icon-button" type="button" aria-label="关闭">
2373            <i data-lucide="x" aria-hidden="true"></i>
2374          </button>
2375        </div>
2376        <p id="imageApiTransferMessage" class="image-api-transfer-message"></p>
2377        <div id="imageApiTransferWarning" class="image-api-transfer-warning" role="note" hidden>
2378          <i data-lucide="triangle-alert" aria-hidden="true"></i>
2379          <span>导出文件包含完整 API Key。请存放在安全位置,不要上传到公开网盘或代码仓库。</span>
2380        </div>
2381        <div id="imageApiImportPreview" class="image-api-import-preview" hidden>
2382          <div class="image-api-import-preview-head">
2383            <span>待导入接口</span>
2384            <small id="imageApiImportSummary"></small>
2385          </div>
2386          <div id="imageApiImportList" class="image-api-import-list"></div>
2387          <label class="image-api-import-policy">
2388            <input id="imageApiImportPolicy" type="checkbox" checked>
2389            <span>同时恢复主接口和轮换方式</span>
2390          </label>
2391        </div>
2392        <p id="imageApiTransferStatus" class="form-status" role="status"></p>
2393        <div class="member-actions ui-dialog-actions image-api-transfer-actions">
2394          <button id="cancelImageApiTransferButton" class="ghost-button ui-dialog-cancel" type="button">取消</button>
2395          <button id="confirmImageApiTransferButton" type="button">
2396            <i data-lucide="download" aria-hidden="true"></i>
2397            <span>确认导出</span>
2398          </button>
2399        </div>
2400      </form>
2401    </dialog>
2402
2403    <div id="imageLightbox" class="lightbox ui-lightbox" hidden aria-modal="true" role="dialog" aria-label="大图预览">
2404      <button id="lightboxClose" class="lightbox-close" type="button" aria-label="关闭大图查看器 (Esc)" title="关闭大图查看器"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m6 6 12 12M18 6 6 18"/></svg></button>
2405      <div class="lightbox-head" id="lightboxHead">
2406        <output id="lightboxPanelCount" class="lightbox-panel-count" hidden></output>
2407        <button id="lightboxLocate" class="lightbox-tray-toggle" type="button" hidden>定位当前图</button>
2408        <button id="lightboxThumbToggle" class="lightbox-tray-toggle" type="button" aria-controls="lightboxThumbs" aria-expanded="false" hidden>缩略图</button>
2409        <button id="lightboxPanelToggle" class="lightbox-tray-toggle lightbox-panel-toggle" type="button" aria-controls="lightboxDetailSlot" aria-expanded="false" aria-label="展开右侧详情" title="展开右侧详情" hidden><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m15 6-6 6 6 6"/></svg></button>
2410      </div>
2411      <div class="lightbox-stage" id="lightboxStage" tabindex="0" aria-describedby="lightboxHint">
2412        <div id="lightboxPlaceholder" class="lightbox-placeholder" aria-hidden="true"></div>
2413        <img id="lightboxPreview" class="lightbox-preview" alt="" aria-hidden="true">
2414        <img id="lightboxImage" class="lightbox-image" alt="">
2415        <div id="lightboxImageStatus" class="lightbox-image-status" role="status" aria-live="polite" hidden>
2416          <span id="lightboxImageStatusText"></span>
2417          <button id="lightboxRetry" type="button">重试</button>
2418        </div>
2419      </div>
2420      <div id="lightboxDetailSlot" class="lightbox-detail-slot" hidden></div>
2421      <div id="lightboxTray" class="lightbox-tray" hidden>
2422        <div id="lightboxThumbs" class="lightbox-thumbs" role="listbox" aria-label="同组图片缩略图" tabindex="0" hidden></div>
2423        <div id="lightboxMeta" class="lightbox-meta" hidden>
2424          <p id="lightboxTagsHeading" class="lightbox-meta-heading" hidden>当前样张标签</p>
2425          <div id="lightboxTags" class="lightbox-tags" role="list" hidden></div>
2426          <p id="lightboxTopicsHeading" class="lightbox-meta-heading" hidden>图片所属栏目</p>
2427          <nav id="lightboxTopics" class="lightbox-topics" aria-label="图片所属栏目" hidden></nav>
2428        </div>
2429      </div>
2430      <div class="lightbox-dock">
2431        <div class="lightbox-toolbar">
2432          <div id="lightboxNavigation" class="lightbox-navigation" role="group" aria-label="图片翻页">
2433            <button id="lightboxPrev" class="lightbox-nav lightbox-prev" t
2433ype="button" aria-label="上一张"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m15 6-6 6 6 6"/></svg></button>
2434            <output id="lightboxCount" class="lightbox-count" aria-live="polite"></output>
2435            <button id="lightboxNext" class="lightbox-nav lightbox-next" type="button" aria-label="下一张"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="m9 6 6 6-6 6"/></svg></button>
2436          </div>
2437          <div class="lightbox-tools">
2438            <div id="lightboxZoomControls" class="lightbox-zoom-controls" role="group" aria-label="图片缩放">
2439              <button id="lightboxZoomOut" type="button" aria-label="缩小 (−)" title="缩小 (−)"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="M5 12h14"/></svg></button>
2440              <button id="lightboxFit" class="lightbox-fit" type="button" aria-label="适合屏幕 (0)" title="适合屏幕 (0)">适合屏幕</button>
2441              <button id="lightboxZoomIn" type="button" aria-label="放大 (+)" title="放大 (+)"><svg class="ui-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="miter" aria-hidden="true" focusable="false"><path d="M12 5v14M5 12h14"/></svg></button>
2442            </div>
2443            <button id="lightboxTopicsToggle" class="lightbox-tray-toggle" type="button" aria-controls="lightboxMeta" aria-expanded="false" hidden></button>
2444          </div>
2445        </div>
2446      </div>
2447      <span class="sr-only" id="lightboxHint"></span>
2448    </div>
2449
2450    <template id="styleCardTemplate">
2451      <article class="style-card">
2452        <div class="style-card-open ui-card-surface">
2453          <button type="button" class="style-card-hit"></button>
2454          <div class="thumb"></div>
2455          <div class="card-copy">
2456            <h3></h3>
2457            <p class="card-meta-line">
2458              <span class="card-topic"></span>
2459              <span class="thumb-count"></span>
2460            </p>
2461          </div>
2462        </div>
2463      </article>
2464    </template>
2465
2466    
2466<script src="/store.b3a89920b3.js" defer></script>
2466
2467    
2467<script src="/api-client.91a2d55ae3.js" defer></script>
2467
2468    
2468<script src="/catalog-identity.452a3b566b.js" defer></script>
2468
2469    
2469<script src="/favorites-view.fa3f53f784.js" defer></script>
2469
2470    
2470<script src="/style-sort.21ebe772cb.js" defer></script>
2470
2471    
2471<script src="/catalog-pagination.8e8b27c980.js" defer></script>
2471
2472    
2472<script src="/page-switcher.31c30766dd.js" defer></script>
2472
2473    
2473<script src="/button-loading.d454953540.js" defer></script>
2473
2474    
2474<script src="/global-error-guard.87d1ac31a5.js" defer></script>
2474
2475    
2475<script src="/image-size.d6355dd45a.js" defer></script>
2475
2476    
2476<script src="/image-api-config.ac25cc3d62.js" defer></script>
2476
2477    
2477<script src="/color-utils.2b1f35206d.js" defer></script>
2477
2478    
2478<script src="/style-similarity.238e996ad0.js" defer></script>
2478
2479    
2479<script src="/avatar-kernel.078c93204a.js" defer></script>
2479
2480    
2480<script src="/backfill-kernel.c053bce5b1.js" defer></script>
2480
2481    
2481<script src="/generated-image-kernel.28e349638e.js" defer></script>
2481
2482    
2482<script>
2483      window.XxdLazyAssets = {
2484        sampleClassification: "/sample-classification.4834e83dd9.js",
2485        mediaZip: "/admin-media-zip.98508af349.js",
2486        mediaLibrary: "/admin-media-library.9ada1f2b69.js",
2487        adminRoutePages: "/admin-route-pages.9f584eac57.js",
2488        obsidianManagement: "/admin-obsidian-management.53f765705d.js",
2489        obsidianGeneration: "/admin-obsidian-generation.de15d46438.js",
2490        memberObsidianSettings: "/member-obsidian-settings.a85a0253b6.js",
2491        editorialCovers: "/editorial-covers.846556c03f.js",
2492        adminStyleControls: "/admin-style-controls.bd680e70a0.js",
2493        textSkillChat: "/text-skill-chat.8dd98434ef.js",
2494        skillReadme: "/skill-readme.7ae0d21999.js",
2495        openSource: "/open-source-page.f094add646.js",
2496        openSourceChannelSettings: "/admin-open-source-channels.2c21fe5c39.js",
2497        adminDialogs: "/admin-dialogs.a4920a96bc.js",
2498        adminBatchSelection: "/admin-batch-selection.c9d9968937.js",
2499        communications: "/communications.01efe08dae.js",
2500        memberTips: "/member-tips.72256742ad.js",
2501        articles: "/articles-page.d49fade780.js",
2502        skillsPage: "/skills-page.ce6b8cd00a.js",
2503        conversationDirectory: "/image-conversation-directory.7903bb96a0.js",
2504        lightbox: "/lightbox-page.50f761f34e.js",
2505        styleUpload: "/admin-style-upload.d759467fdd.js",
2506        manualSamples: "/admin-manual-samples.f02141e44d.js",
2507        imageSkills: "/admin-image-skills.f3476b3fea.js",
2508      };
2509    </script>
2509
2510    
2510<script id="appLocaleBundles" type="application/json">{"zh-Hans":"/app-zh-hans.08eaee8bbd.js","zh-Hant":"/app-zh-hant.ee1566b43d.js","en":"/app-en.c90288914b.js"}</script>
2510
2511    
2511<script src="/app-zh-hans.08eaee8bbd.js" defer></script>
2511
2512  
2512<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"461458c6e2d34e0ea33d169145b8e0ed","r":1,"spa":2}' crossorigin="anonymous"></script>
vendor: 1 bytes, line 2512
2512
2513<script>(function(){function c(){var b=a.contentDocument||(a.contentWindow&&a.contentWindow.document);if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'a44facd87c500ef9',t:'MTc5MTA2OTYwMg=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
2513</body>
2514</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.