給工具型介面的一套 token 與元件
深色為底、琥珀色為訊號。密度偏高、圓角克制、陰影只用來分層而不裝飾。
這頁是規格本體：所有數值都來自 tokens.css，元件不寫死任何色碼。
色彩
主色與副色直接取樣自 LOGO：琥珀 #FFBC50 扛所有「可操作」訊號，紅 #FF0741 只留給促銷與倒數。點色票可複製色碼。
字級
base 14px、行高 1.43。標題靠字重與字距收緊，不靠放大字級——這是工具型介面該有的密度。
間距與圓角
一律 4 的倍數。圓角只有四個值，愈大的容器不代表愈圓——容器維持 4px，只有按鈕例外用 5px。
陰影與動態
深色底的陰影要靠不透明度撐起來，淺色那組數值直接搬過來會完全看不見——所以兩套主題各有一組。
按鈕
一個畫面只有一顆 primary。hover 加陰影不放大，active 下沉 1px——位移比縮放更適合密集介面。
表單
欄位聚焦用邊框變色＋3px 柔光，不用粗邊框，避免整排欄位在輸入時抖動。
標籤與狀態
狀態一律「色點＋文字」，不做純色塊——色弱使用者只看色塊分不出成功與警告。
卡片
卡片預設幾乎沒有陰影，只有可點擊的卡片在 hover 時浮起來——陰影是互動訊號，不是裝飾。
抓取四家代購平台的手續費、國際運費與活動檔期，差異超過門檻就推播。上次執行 8 月 4 日，四家全部成功。
表格
不用斑馬紋，靠 1px 分隔線與 hover 底色定位。數字欄靠右並用等寬數字，掃視時位數才會對齊。
| 訂單 | 頻道 | 狀態 | 金額（¥） | 建立時間 |
|---|---|---|---|---|
| BB-240812-0031 | 代標 | 已出貨 | 128,400 | 08-12 09:14 |
| BB-240812-0030 | Mercari | 待補款 | 8,900 | 08-12 08:52 |
| BB-240811-0298 | 代購 | 已出貨 | 45,200 | 08-11 22:07 |
| BB-240811-0297 | 日貨 | 流標 | 3,180 | 08-11 19:33 |
| BB-240811-0296 | 挖寶市集 | 草稿 | 21,750 | 08-11 16:20 |
回饋
訊息條用左側 3px 色條分類，底色維持 surface——四種顏色的底色鋪滿會讓整頁像交通號誌。
浮層
選單、提示、對話框共用同一組陰影與進場曲線（0.3s ease-out），差別只在疊層高度。
疊層
z-index 只能從這張表取值。來源的導覽列用 2147483647（int 上限）——那不是設計、是投降，這裡收斂成 2100。
組合起來長這樣
同一組 token 拼成一個實際區塊，確認密度與層次在真實情境下站得住。
| 名稱 | 頻率 | 狀態 | 上次執行 |
|---|---|---|---|
| 競品費率監控 | 週一 09:00 | 正常 | 08-05 09:00 |
| 公仔趨勢監控 | 週一、四 09:30 | 正常 | 08-08 09:30 |
| 市場觀察產生器 | 每月 1、15 日 | 逾時重試 | 08-01 06:00 |
| 每日業績抓取 | 每日 07:00 | 失敗 | 08-09 07:00 |