Portal UI
入口網站服務多種意圖，而登陸頁面只服務一個。如果頁面只有一個訴求與一個行動，請停止並使用登陸頁面技能。本檔案是針對個人作品呈現的決策層。
兩個來源設定了本檔案不再重述的預設值。視覺風格禁令遵循 Leonxlnx/taste-skill (MIT)。間距、焦點與動畫時序遵循 elayadesign/ai-design-skills 的 landing-page-design (MIT)，但僅限於本檔案明確提及之處。當兩者對入口網站產生衝突時，以本檔案為準。
概念
在開始編輯前，先寫一句話：
在這一頁，[一個僅存在於此的成品] 成為 [那個唯一的即時裝置]。
終端機、正在運行的專案或真實介面才算數。掃描線、霓虹網格或「SYS.ONLINE」不算：因為同樣的句子對任何開發者都適用。保留一個即時裝置。它必須能用拇指操作、具備無腳本時的備用方案，且絕不能阻擋作品內容。
用 data-ui 標記真實的介面片段。等寬字體僅限於該片段內部、pre/code 中，以及表格數字上。
頁面順序
- 第一屏：這是誰、他們做什麼、即時裝置。一個
h1，在任何寬度下不超過兩行。其下一句說明要做什麼。 - 個人作品，附上真實圖片或片段。他人的軟體僅作為引導使用。在引導列中標註作者姓名。不要把它放在作品網格中。
- 可選的即時清單（如動態消息、排名），前提是實際上有擷取資料。
- 引導：如何使用的說明，一句話即可。星號計數是次要資訊，可自行更新。
- 已存在的文件。不要用沒有任何文件的區塊來當作網站標題。承諾的部落格必須有真實清單，否則從標題中移除該字詞。
- 頁尾：名稱、聯絡方式，以及任何付費或支援選項。支援選項不能與作品並列。
導覽列中的每一項都有標題與實際目標。手機版佈局保留該導覽列。如果選單列在某一斷點以下隱藏，則加入一個控制項，開啟全高平面面板。連結依閱讀順序出現，間隔 60 毫秒，總時長低於 400 毫秒。面板背景為頁面底色，不使用模糊效果。
視覺刪減
在添加任何東西之前，先移除這些：文字漸層、玻璃橫條、掃描線、動畫網格、圓錐邊框、發光效果、標題中的表情符號、索引編號（例如 01 //）、標題上方的藥丸徽章，以及超過一個的背景特效。
保留現有的底色、文字色與一個強調色（如果網站已有）。不要引入第二個顯示字型。字重保持在 700 以下。
動畫使用 cubic-bezier(0.22, 1, 0.36, 1)。僅對 transform 和 opacity 做動畫。每個區塊使用 IntersectionObserver 揭露一次。必須存在的滾動監聽器需透過 requestAnimationFrame 進行節流。prefers-reduced-motion 保留每個字元在畫面上，並取消移動效果。
共用 CSS：將入口網站專用的樣式放在首頁樣式表中。僅當所有頁面都有的錯誤（例如缺少焦點環）時，才變更共用檔案。
發佈
- 跳過連結（Skip link），
:focus-visible可見，當前導覽項目已標記。 - 沒有
href="#"。 og:image是作品的大尺寸圖片。Twitter 卡片為summary_large_image。- 作品圖片需有替代文字。即時裝置需有可存取名稱。
檢查
從此技能執行 node scripts/check.mjs <index.html> <css 檔案>。然後在 1440、768 和 390 寬度下開啟頁面。在手機上，開啟選單並追蹤每個連結。在縮減動畫模式下，第一屏仍需顯示人物姓名與作品。
修正腳本回報的「FAIL」。不要為了符合首頁樣式而重新調整其他頁面的樣式。