不等大跨度
grid-template + span 组合出 1×1、2×1、2×2 的节奏：卡片大小即信息优先级，重要内容天然获得更大的舞台。本卡即为一张 2×1。
General · No.39 · Bento Box Grid
像便当一样，把信息装进恰当的格子
模块化不等大卡片：重要的占 2×2，次要的占 1×1。24px 圆角、若有若无的阴影、#F5F5F7 中性底——克制的苹果式秩序感。
本周活跃用户
128,400
大格子承载主角指标，渐变只允许出现在强调卡上。
满意度
4.9
近 30 天深色卡
1×1
对比节奏点
周访问趋势
风格特性
三条网格法则：跨度分级、圆角一致、阴影收敛。
24px 圆角
全站统一 --card-radius，圆角是系统而非装饰。
克制的动效
悬停仅放大 1.02 并轻抬阴影，节奏安静不抢戏。
按钮与控件
胶囊按钮 + iOS 式开关，状态过渡温和。
新功能
Beta
申请模板
表单也住在卡片里：浅灰输入面、14px 圆角。
配色板
中性灰阶为底，单一品牌蓝点睛。
页面底
#F5F5F7卡片白
#FFFFFF品牌蓝
#0071E3渐变紫
#6E3FF3石墨黑
#1D1D1F次级灰
#6E6E73字体级阶
Inter 全家桶：加粗收紧做展示，常规松弛做正文。
Display · Inter 900 · 45px秩序感，装进格子
Heading · Inter 700 · 24px模块化信息陈列
Body · Inter 400 · 16px便当盒网格的秘诀在于留白与跨度：格子之间 16px 等距呼吸，内容大小对应重要程度，视线自然按优先级流动。
Label · Inter 700 · 12pxGrid · 4 Col · Gap 16