設計 token
唯一的顏色來源是 app/globals.css。這一頁只是把它渲染出來對照。
表面
- ink頁面底色#17130f
- char卡片表面#241d18
- crust分隔線、內層表面#30271f
文字與強調
- porcelain主要文字16.2:1
- sesame次要文字、單位、軸線5.8:1
- yolk強調、CTA、趨勢線8.6:1
- celadon正向、蛋白質達成7.0:1
- clay提醒（強度上限，不當警報）5.2:1
對比值是對 ink 底色實測。放在 char 或 crust 上會更低，globals.css 有完整三欄數字： clay 只能用在 ink 或 char 上。沒有紅色 token，永遠不要加。
字級
- text-hero · 56px64.8
- text-xl · 34px趨勢往哪走
- text-lg · 24px本週蛋白質
- text-base · 18px拍一張就記錄完
- text-sm · 15px今天比目標多 320，明天調整一下就好
- text-xs · 13px早餐 · 08:12
- text-2xs · 11pxKCAL / PROTEIN
數字樣式
64.8kg
numeral utility：寬體 Archivo（wdth 115）加 tabular figures，數字變動時不會抖。
1234567890
中文襯線（稀有使用）
今天比目標多 320，明天調整一下就好。
只用在每日總結卡的那一句話，其他地方一律用 body。
圓角
- rounded-card
20px - rounded-photo
16px - rounded-btn
12px