设计规范

灵感来自《刀剑神域：序列之争》中的 Augma：在真实环境之上，以清晰、轻盈、克制的方式呈现信息。这里将这一方向提炼为原创的 Web 界面语言。

表面与层级

白色与冰灰构成主要表面。透明度与细线边框建立层次，切角只用于可操作入口，环形元素用于状态和进度。阅读区域保持安静，复杂背景上的面板应有足够实色背景，保证文字对比。

颜色

Token	浅色值	用途
--agm-bg	#ffffff	页面背景
--agm-surface	#f3f6f8	次级表面
--agm-text	#263442	主要文字
--agm-muted	#5c7187	辅助说明
--agm-accent	#b75e08	主要操作与强调
--agm-highlight	#f28c12	装饰性高亮与 HUD 图形
--agm-cyan	#258ca4	连续控制
--agm-success	#287947	成功
--agm-danger	#bc394a	错误

在应用根部覆盖变量即可定制主题。改变强调色时同时检查 --agm-on-accent 的文字对比。状态必须包含文字，不能仅用颜色表达。

字体与排版

站点使用 Exo 2 的几何字形，中文回退系统无衬线字体。组件通过 --agm-font 接受宿主字体；CSS 包不请求外部字体。正文与控件保持易读尺寸，数字适合展示实时状态。

操作与动效

按钮、开关等操作区至少提供 44px 的触控高度或足够的周边操作空间。焦点环保持完整，不被切角裁剪。动效用于解释状态变化，尊重 prefers-reduced-motion。

组合

Panel 建立信息分组；HudStatus 说明当前状态；HudProgress 表达过程。先确定信息层级，再选择视觉元素。文档页和工作界面无需复用主页上的装饰轨道。

来源

设计方向参考 Augma 官方设备介绍。这是独立的界面实验，与作品版权方没有关联。