Display Lock / 展示效果锁定

Zeno 是全新实现，但不是全新视觉方向。当前 Kulin 的关键展示效果是硬约束。

不允许顺手改 UI

实现过程中不得因为重写前端、换框架、接 API 或重构组件而改变以下效果：

• 首页服务器卡片结构：默认 classic 必须继续保持原样；只有管理员显式选择 capsule 时，才允许启用下述节点舱布局。
• OS 图标、国旗、服务器名与右上角状态圆点 / 在线离线文字的位置关系。
• CPU / 内存 / 硬盘 / 月流量细进度条固定为两列两行，条上显示名称与百分比，条下左侧显示“负载 / 占用”、右侧显示对应值；CPU 标签前保留图标。
• 卡片底部上传、下载、剩余天数和账单金额固定为两列两行，标签和值同一行左右分布；延迟与丢包率使用独立紧凑的 12 小时历史区。
• 数字与容量、速率、延迟单位之间保留空格。
• 桌面端三列卡片网格观感。
• dark/light 主题整体风格。
• 详情页多目标延迟图的 Nezha-like 观感。

服务器卡片主题边界

• classic 是兼容主题和默认值；升级后、字段缺失或旧数据库读取时都必须回退到 classic。
• capsule 只重排服务器卡片内部：隐藏独立规格行，把核心数、负载和容量放进四个资源格，资源格保持 2×2，并增加细状态边；上传、下载、剩余、账单和两条 12 小时质量条继续复用经典卡片组件。
• 两种卡片都必须继续使用现有背景、透明度、圆角、阴影、主题色、明暗主题和桌面三列/手机单列规则；不得借卡片主题切换修改导航、首页概览、详情页或后台整体风格。
• 切换入口只能位于后台外观设置并持久化为站点设置；不能依赖浏览器本地状态制造不同用户看到不同主题。

实现和展示分离

允许改变：

• 前端框架。
• 组件拆分方式。
• CSS 命名。
• API 字段名。
• 后端实现。
• DB schema。

不允许改变：

• 用户看到的核心结构。
• 延迟统计口径。
• 延迟图表默认行为。
• 首页卡片的信息密度和层级。

验收方式

每次 UI 改动必须至少验证：

1. 首页桌面宽度下每行三张卡片。
2. 首页移动端单列不溢出。
3. dark/light 主题均可读。
4. CPU / 内存 / 硬盘 / 月流量条有容量或 quota 文案。
5. 延迟图多目标同图，线条细，尖峰不被抹平。
6. tooltip 显示时间、target、latency、loss。

优先级

如果技术方案和展示效果冲突：

展示效果 > 技术洁癖 > 框架默认样式

要改 UI 方向必须单独确认，不能顺手改。