云游戏页实测数据

本页是 云游戏页 引用的原始数据。所有数值来自 2026-10-24 在浏览器中读取《云·终末地》官网的计算样式与样式表规则；没有转存官方的样式文件、图片或字体。

• 页面：https://endfield.hypergryph.com/cloud，挂在官网域名下；各视图的入口见 官方来源。
• 测量：2026-10-24，在浏览器里读计算样式、元素几何和样式表规则。样式表是跨源的，读不到 cssRules，是把文本取回来自己解析的；仓库里不存任何官方文件。每份原始记录都另做过一遍独立复测，本页取复测更正后的值。
• 视口：1440×810（主测，html 16px）、1024×768；375×812 量了两种——桌面版载入后直接缩窗，和换成移动平台（Android UA）重新载入。
• 样式表文件名 index.83cf05.css。类名是 6 位哈希，每次构建都会变，下文统一去掉哈希，按角色称呼部件；图片也去掉文件名里的哈希，只记文件名和原图尺寸。
• 未登录的视图在全新的无头浏览器 profile 里量；登录后的视图在维护者自己已登录的会话里量，UID、头像、时长、余额、记录一律不记，商城价格也不记。
• 来源标记：规则 = 样式表原文；计算 = 计算样式与实测几何；观察 = 看得到但没有可读数值（图片像素、SVG 内容）；脚本 = 读页面脚本得出的行为或常量。没标的默认是规则加计算。
• 官网首页的数据在 官网实测数据。两边是两套构建，根字号、字体、颜色都不同，数值不通用。
• 官网会改版。数值过期时以重新测量为准，并更新本页日期。

1. 尺寸基准#

页面脚本把根字号写进 html 元素的内联样式：

• 写法：先写目标值 a，再读一次计算值 l，不相等就改写成 a²/l，抵消浏览器的最小字号限制；Android 上的 QQ 浏览器和鸿蒙 UA 跳过这一步。（脚本）
• 平台（body 的 data-platform）只在模块载入时判定一次：平板类（iPad、不带 Mobile 的 Android、粗指针无悬停等）判成 mobile；其余桌面 UA 一律 desktop，非桌面 UA 短边 ≤600 判成 mobile。改窗口大小不会换平台，要重新载入。（脚本）
• 移动平台进游戏、开公告时会强制横屏：body 宽高互换并转 90°（data-rotate="1"），字号按转过之后的宽高算。（脚本）
• 样式表里没有按宽度写的桌面断点，布局断点在脚本里（1180 / 2560），移动端规则写成"平台属性 + 方向"。唯一一条和 16px 区间对齐的媒体查询是未登录宣传图的尺寸（8.4）。

验证（每次改尺寸后派发 resize 再读）：

下文的 rem 在 1180 – 2560 宽时就是 16px，括号里的像素值都按 1440×810 写。

几处另有尺度：

• "更多"视图是一块 2560px 宽的设计画布，用 transform: scale() 整体缩放：scale = (容器宽 − 侧栏宽) / 2560，桌面上侧栏宽变量是 0，所以 1440 宽时 0.5625、1024 宽时 0.4；画布高 = 可视高 / scale。它的规则全用 px，下文记作"设计 px"，屏幕 px = 设计 px × scale。画布里的页脚再用 zoom 反缩放回原尺寸。（脚本）
• 下载弹窗按 108.5 × 53.5rem 排版（1736 × 856 设计 px）后整体缩放，桌面上约占视口宽的 1736 / 2560 = 67.8%（8.10）。
• 公告面板是另一个站点的内嵌页，根字号自己算（8.12）；商城面板内联写了 font-size: 视口宽 / 1194 × 16px，只影响继承文字（9.4）；页脚来自鹰角网页 SDK，全用固定 px（8.7）；鹰角账号 SDK 不用 rem，用自己的 --base-em-size 字号档（11.3）；支付 SDK 用 --pay-sdk-size（9.4）。

2. 字体#

2.1 字族#

页面样式表里的 @font-face 共 13 条（Bebas 那条一模一样地声明了 6 次）：

• 一个字族名只对应一个字重：换字重靠换字族名，不靠 font-weight 选面。字阶里的 btn2_w600 是 CloudGameRegular 配 600，靠浏览器合成加粗，用户中心下拉的条目就是它（9.2）。
• 字族名和文件名都直接写着 HarmonyOS Sans SC。这支持 官网首页 "改了名的中文字体是 HarmonyOS Sans SC"的推断，但不能证明：两边是不同的构建，也没做字形比对。
• 页面没有给 html、body、#root 设字体。没写字体的元素继承浏览器默认字体（测量机上是 Noto Sans SC），例如顶栏容器、"更多"侧栏下载按钮的本体、节点选择的表头（9.5）。另有系统字体栈：-apple-system 一组 4 次（其中有"更多"加载层的百分比），PingFang 一组 1 次（游戏内跑马灯）。
• SDK 自带字体：页脚用 SDK_Sans（8.7），账号 SDK 弹窗用 sans-serif 和 Arial（11.3），支付 SDK 用 "HG Source Han Sans"（9.4）。

2.2 字阶#

字阶是一组只含字族、字号、字重、行高的原子类。同一份字阶模块被约 52 个组件各引入一次，全表 4,161 条、去重后 199 种。令牌名取自脚本里 CSS Modules 的映射。

A. 应用字阶（rem，各视图通用）：

胶囊按钮的五档尺寸借 btn0 – btn5 的字号，但后面一条特异度相同的尺寸规则把行高改成了定值：s44、s40 为 1.25rem，s34 为 1.125rem，s28 为 1rem，s24 为 .875rem（8.3）。

B. 首页与加载层字阶（rem，约 5 份；和 A 同名的键在这些模块里换成了下面的值）：HarmonyOS Black 的 h1 5rem（80px）、h2 2.9rem、h3 2.5rem、mh1 4rem；HarmonyOS Bold 的 h4 1.875rem（30px）；b1 4.05rem（64.8px，Black / Medium / 思源黑体三档）、b2 3.25rem、b3 1.6875rem；思源黑体的 mh2 3.2rem、mc1 1.75rem、c1 – c3 1.1875 / 1.125 / .875rem；mc0 – mc4 在 1.9375 – 1.5rem 之间；行高都是 1.2。数字 num 用 BebasNeueOfficial，15.25rem（244px），移动 18rem，行高 1。

C. "更多"视图：A、B 合并后的 px 版（1 份），数值等于 rem × 16，整块再随画布缩放。

典型角色（1440×810）：顶栏页签、浮层与弹窗标题是 CloudGame Medium 或 Bold 1.125rem（18px）；导航项和浮层按钮文字 CloudGame Medium 1rem；胶囊按钮文字 CloudGame Medium 1.125rem、行高 1.4；提示条正文 CloudGame Regular 1rem；"更多"的目录名、标题、标语分别是 CloudGame Bold 32、HarmonyOS Black 80、思源黑体 60 设计 px（屏幕 18 / 45 / 33.75px，标语在字阶里是 64.8，这里覆盖成 60）；下载卡标题 HarmonyOS Bold 1.875rem，随面板缩到约 16.9px。

3. 颜色#

3.1 根上的变量与回退值#

:root 上只定义了 13 个颜色变量（另有一条内联样式定义四个 --safe-area-inset-*）。名字按"明暗面 - 层级 - 用途"分层：dark-1-text-* 是深底上的文字，general-3-btn-* 是按钮。

更多令牌 :root 没定义，只出现在 var() 的后备值里——实际生效的就是后备值：

• white-mask-10 有一处后备值误写成 .2，用在游戏内选项块的悬停边上，生效的是 .2（9.5）。反过来，dark-1-text-primary 一处后备写 #CCC，因为 :root 有定义，这个后备不生效。
• --general-1-border-dark、--light-toast-offset 没有后备值，:root 也没定义；--light-toast-offset 由跑马灯组件内联写，--general-1-border-dark 的值没量到。color-scheme 是 light only，theme-color 是 #000000；页面没有暗色模式。
• 鹰角账号 SDK 有自己的三套皮肤变量（11.2），支付 SDK 有自己的皮肤令牌（9.4），都不在这两张表里。

3.2 出现频率最高的值#

按样式表原文的声明计（先去掉 url()，var() 后备值和 -webkit- 副本都算），共 133 种、767 次。按次数排：

#FFFFFF 72（文字 38、背景 26、遮罩图 6）、#EEEEEE 62（文字 47）、#000000 37（文字 14、背景 11、遮罩图 10）、#FFF100 34（文字 19、背景 11）、rgba(255,255,255,.2) 30（边 15、背景 10）、#BFBFBF 29、rgba(255,255,255,.1) 25、#292929 与 #A7A7A7 各 23、rgba(0,0,0,.8) 19、#787878 与 #737373 各 16、rgba(255,255,255,.05) 13、#E6E6E6 与 #333333 各 12、rgba(0,0,0,.2) / rgba(0,0,0,.5) / transparent / #666666 各 11，然后是三色竖条的 #FE1AAB、#3BFFB7、#FEFB3C 各 10（3.4）。

white、black、red、gray 这几个关键字在声明里一次都没出现，#FF0000、#808080 也是 0 次。

3.3 黄色#

图里的黄是读到的像素，多数和 CSS 的两种黄不一致；时长记录头图（PNG 原图）和公告 NEW 角标的黄正好是 #FFF100。

3.4 三色竖条#

CSS 画的（分享浮层，linear-gradient 从上往下硬分段）：

游戏内"下载"浮层每栏左缘也有一根（.125rem 宽，规则写作 .625 / .6875 / 1.75rem 三段）。

图里的（下载卡背景 modal-item-bg.png，655×484，1 倍图，单位是设计 px；观察）：贴白卡左缘，x 18 – 24（实色 19 – 22）；从上往下品红 #FF1AAC y 58 – 82（24）→ 薄荷绿 #00FFA2 y 82 – 106（24）→ 黄 #FFFA00 y 106 – 131 实色，再往下约 40px 渐到白，y≈171 才全白。

两版色值略有出入：CSS 版三段是 7 : 8 : 19，图版三段等长、黄段再加一截渐隐。另有两处横向的三色，顺序和比例都不同：时长记录弹窗头部底边约 2px 高的一条（图，原图是硬边纯色：绿 #00FFA2 58.9% → 品牌黄 #FFF100 30.2% → 品红 #FF00F0 10.9%），和首页宣传图平台条右上角的黄、青、粉小色块。

3.5 灰阶与状态色#

页面自己的文字与底色令牌全是纯灰（R = G = B）；带色偏的 #252726、#CCCCCA、#F2F1EF、#9F9EA0 都来自 SDK。

4. 圆角#

次数只数写成单个值的那些；"用在哪"一栏把同尺寸的单角和四值写法也算进去了（如弹窗头的 .25rem .25rem 0 0）。另有 25 种写法各 1 – 2 次，例如 .34375rem（商城横幅 5.5px）、.35rem（账号卡下半 5.6px，和上半的 6px 不一样）、1rem（官方版钱包胶囊）、1.25rem（游戏条款弹窗）。尺度不同的几处："更多"侧栏的下载按钮 2 设计 px（屏幕 1.125px）；下载弹窗的平台按钮 .25rem，随面板缩到 2.25px；公告页的面板与列表项 7.5px；账号 SDK 的卡片 E(20)（1440 下 16px）、输入框是胶囊（11.4）；支付 SDK 的按钮 40px（9.4）。

4 – 8px 这几档看不大出形状；真正改变形状的是胶囊按钮、开关和 SDK 的胶囊输入框。

5. 阴影与背景模糊#

全表 29 种 box-shadow。和官网首页"全部零偏移"不同，这里的浮层阴影都向下偏。

背景模糊：

• backdrop-filter: blur(.3125rem)（5px）23 条（-webkit- 24 条），是全站统一的毛玻璃：顶栏、浏览器提示条、分享浮层、用户中心下拉、账号卡的三块、下载弹窗与通用弹窗的遮罩、最小化排队胶囊、游戏内提示条与菜单浮层。公告与 CDKEY 的外壳是脚本内联的 blur(5px)，固定 px。
• 例外：桌面版商城的遮罩不模糊（手机版模糊）。filter: blur(8px) 用在"更多"加载层的底图上。
• 降级：body[data-backdrop-filter="0"] 时所有元素 backdrop-filter: none !important，顶栏改成 #1A1A1A、账号卡的畅玩卡块和时长块改成 rgb(26,26,26) 实底。这个属性由入口脚本在启动时按 UA 设置，针对华为、荣耀、鸿蒙的浏览器（UA 含 HuaweiBrowser、HonorBrowser、HarmonyOS、HONOR、HUAWEI 等），不是检测浏览器支不支持。（脚本）
• iOS（@supports (-webkit-touch-callout: none)）在强制横屏时也关掉模糊和动画。

6. 纹理与装饰#

CSS 画的：

图片（尺寸是原图；内容是观察）：

7. 动效#

样式表里的过渡与动画：

全表 7 条自定义曲线：cubic-bezier(.5,0,.5,1) 13 次（"更多"侧栏的字色与淡入淡出、活动 banner）；(.2,0,.1,1) 9 次（"更多"标题、标语、块状大字，写作 var(--ease-out-extreme, …)，变量没定义）；(.33,0,.67,1) 6 次（"更多"加载层的揭幕；手机版"更多"的底字淡入、主图擦出、标题组移入）；(.16,1,.3,1) 4 次（排队活动图刷出）；(.4,0,.2,1) 3 次（排队面板展开）；(.17,.17,.83,.83) 2 次、(.1,0,.1,1) 1 次（手机版"更多"的装饰）。脚本里另有 anime.js 和 lottie（排队胶囊的时钟），不在 CSS 里。

关键帧：页面样式表 62 条，加支付 SDK 6 条、云 webview 1 条、账号 SDK 1 条，共 70 条；公告页是另一个站点的样式表，另有 4 条（下表的公告橙点就在其中），不算在内。主要的几类（名字取脚本里的语义名）：

prefers-reduced-motion: reduce 下有 9 块、18 条规则：顶栏页签指示、"更多"侧栏各项的进出（字色直接给终态）、加载层与活动 banner 的过渡都去掉；"更多"内容区的整棵子树 animation-duration 改成 .01ms，手机版的整棵子树 animation-duration 和 transition-duration 都改成 .01ms，都只播一次、无延迟；账号卡进场 animation: none。点目录时的滚动也从 smooth 换成 auto（脚本）。

账号 SDK 的交互时长见 11.4、11.7，支付 SDK 的见 9.4。

8. 公开视图的控件#

8.1 顶栏#

8.2 顶栏右侧的导航项#

8.3 胶囊按钮#

全站共用的胶囊按钮组件：七种变体 × 五档尺寸（侧栏下载、分享、下载弹窗的按钮各自另写）。首屏那一对不带尺寸档，单独定尺寸。

1024 宽时首屏一对是 100.3 × 25.6px（字 9.6px）。移动竖屏两颗都是 s40，各 153.8 × 38.5px（字 15.4px）；横屏规则写 12rem 宽，又被 flex: 1 盖掉，实际 151.4 × 36.9px。

8.4 宣传块#

8.5 浏览器提示条#

8.6 适龄角标#

8.7 页脚#

鹰角网页 SDK（3.0.3）插进来的组件，样式全用固定 px，不随根字号缩放。它在首屏以下（1440 下从 y = 810 开始），要在滚动容器里往下滚才看到；1440 下整页可滚高度 1227px。

8.8 更多视图的侧栏#

设计 px 和 1440 下的屏幕 px（× 0.5625）：

1024 宽时一律 × 0.4：侧栏 113.6 × 732，目录项 107.6 × 40，名称 12.8px，下载按钮 100.8 × 22.4。

8.9 卖点页#

排法与切换：

一节里的元素（A 布局，设计 px；括号是 1440 屏幕 px）：

入场（A 布局；B 布局时长相同、方向镜像）：段落线淡入 .25s，第 1 节延迟 1.5s、其余 .65s；刻度尺和斜纹条闪烁进场 .25s、延迟 .65s，端部装饰 .3s、延迟 .75s；标题卡底淡入、黄条闪烁，都是 .25s、延迟 .5s；主图宽 0 → 100% 擦出（A 从右往左，B 从左往右）.25s ease-out、延迟 .5s；标题、标语上移 30 并淡入，.4s / .35s，延迟 .6s / .75s，cubic-bezier(.2,0,.1,1)；角块闪烁 .25s、延迟 .75s；块状大字淡入 .1s 加从右 100 滑入 1.5s，延迟 .65s，同一条曲线；刻度尺延迟 .9s 后开始 40s 一圈的滚动。闪烁和淡入都是 linear。

手机竖屏是另一套组件：没有侧栏和目录，五节排成五张卡（每张 20.9513rem、322px 高），主体 24.375rem 宽（= 390 设计 px），再按 --portrait-scale 缩放（375 宽时 1）。卡顶一张 #F0F0F0 的大字图，淡入 .35s 同时左移 2.93375rem（.7s，cubic-bezier(.1,0,.1,1)）；主图 21.2381 × 11.9394rem，从左往右擦出 .4s、延迟 .25s，角块在左上和右下（桌面是右上和左下）；标题横幅通宽 × 3.02438rem（#F0E000 黄横幅加浅灰段的图），标题 HarmonyOS Black 1.375rem #1A1A1A 和标语思源黑体 1.375rem 在同一行。每个部件露出 10% 时各自触发（脚本）。手机横屏用第三套（2276 宽的画布加 rem 侧栏），没有实测。

8.10 下载弹窗#

图里的东西（设计 px；观察）：

• 面板：可见部分 x 18 – 1718、y 18 – 838（1700 × 820），外面 5 – 17px 一圈很淡的白色外晕（alpha 7 – 18 / 255），不是黑阴影。头带 y 18 – 158（屏幕 78.75px），#000000 – #202020 拼的矩形块纹样，下面 9px 的 #CCCCCC 灰条；标题是图，白色字形约 52 高，带 #F3F329 点缀，左边一组灰色条码竖纹。主体 #F0F0F0 叠一层约 1.5px 的淡网格（竖线间距 50 / 68 交替，横线约每 168），底部 90px 是 #E5E5E5。
• 卡片：白卡 619 × 449，四周约 17px 黑色外阴影（alpha 最高约 31 / 255）；左上三色条（3.4）；标题第一个字左上角下垫一个 20 × 20 的 #FDFD1F 方块；标题与副标题之间一条 2px 虚线（划 4 空 2，#D7D7D7）；副标题下一行灰色英文小字；卡底 30px 的"/"向 45° 斜纹（横竖周期 8px：3px #D9D9D9 + 1px #F1F1F1 + 3px 近白 + 1px #F1F1F1）。
• 二维码框：左侧 42px 的 #333333 竖条，里面是图片的白色正立竖排"扫码下载"，底部一个白色直角楔形；码槽 #CDCDCD 底、1 – 2px 深色边；四个外角各一个 11 × 11 的小方块（8 × 8 白芯 + 1px 深色边）。

移动端是另一个组件：缩放由脚本写成内联值（375 宽时 .3472 = 375 / 1080；CSS 默认 min(1, 100vw / 67.5rem)）；面板 58.75 × 72.4375rem，两张卡换成两个图片页签；二维码 19.8rem；平台按钮高 5rem、#333333、圆角 .25rem、字 1.75rem；Android UA 下只有"安卓下载"。手机竖屏且在游戏中时仍用桌面组件，缩放上限 .72。

8.11 分享浮层与确认框#

"收藏页面"打开的是通用确认框（同一个弹窗组件，账号、商城、游戏内的提示也用它）：

8.12 公告面板#

点"公告"打开一个全屏内嵌页 ef-webview.hypergryph.com/page/cloud_bulletin。它跨源，父页面读不到里面；下表是把这个地址（去掉带令牌的查询参数）单独打开来量的。它有自己的样式表和根字号：160 × (宽 / 高 > 16/9 ? 高 / 1080 : 宽 / 1920) px，1440×810 下 120px、1024×768 下 85.333px（面板随之缩到 925.9 × 480）。

外壳（父页面）：fixed 铺满，z-index 1050，rgba(0,0,0,.5) + blur(5px)（内联，固定 px）；内嵌页 opacity 0 → 1，.1s ease-in-out。实测时间线（50ms 采样，受后台节流影响）：容器和底部加载条一起出现 → 约 1.0s 加载条用 .5s 滑出 → 约 1.53s 内嵌页淡入 → 页内根节点再淡入 .3s。手机上打开时 body 转成横屏，按 812 × 375 排。CDKEY 兑换用同一个外壳。

公告页本身（1440×810，1rem = 120px）：

8.13 加载层#

启动加载层（首次进入时盖住整页）：

启动看门狗（页面入口里的内联脚本）：任一等待阶段 30s 没完成（每进入一个新阶段重新计时），或脚本主动报错，就在底部弹一条提示：div[role=alert]，fixed、离底 24px、水平居中，z-index 2147483647，#222222 底、白字、1px #888888 边、内边距 16px、最宽 90vw，14px sans-serif；文字"页面启动未完成，请检查网络后重新加载。"加一颗原生的"重新加载"按钮。

"更多"加载层（每次从首页切到"更多"都重放；设计 px，括号是 1440 屏幕 px）：

这和官网首页的加载页（官网实测数据 8.13）是同一个设计：左缘黄条、跟着走的读数、"Updating..."、偏右的标志和标语、最后黄色铺满再淡出。不同的是标志、单位（这里是设计 px）、铺满的缓动和时长（官网 .6s cubic-bezier(1,0,.7,1)，这里 1s）。

云 webview 加载条（公告、CDKEY 兑换打开时）：贴底，通宽 × 20% 高（1440×810 下 162px），z-index 1000，rgba(0,0,0,.7)，叠在外壳的黑 50% 和模糊上；进出 translateY(105%) ↔ 0，.5s ease-in-out。中间一张 480×186 的内联图（白色 ENDFIELD 字标，下面一条带刻度的细线），高 60%、居中（约 250.8 × 97.2）；它下面压一个白色倒三角（正方形的下半，SVG），高 70%、不透明度 .3，1s steps(1) 无限，每 .25s 跳转 90°。

9. 登录后的视图#

登录态只在维护者自己的会话里拿到过一次，之后的重载回到了未登录态（没有做任何登录或退出操作）。账号数据（UID、头像是哪张、各项时长和余额、记录条目）一律不记，写作"（数值）"；商城价格也不记。9.4 的收银台和 9.5 的排队与游戏内都没有渲染出来，只有规则、脚本和探针。

9.1 账号卡#

登录后首页右侧的宣传块换成一张账号卡：活动 banner → 通行证卡（头部 + 畅玩卡块）→ 时长块 → 一颗宽"开始游戏"。

9.2 用户中心下拉#

9.3 账号与安全、消费记录、兑换、功能设置#

账号与安全打开鹰角通行证的用户中心（新窗口，被拦截时整页跳过去），不属于本页，没有打开；退出登录弹通用确认框"确认登出账号？"（取消 / 确认登出），没有点；CDKEY 兑换打开 ef-webview.hypergryph.com/page/cloud-giftcode，用公告那套外壳和加载条（8.12、8.13），兑换页本身没量到。

消费记录、功能设置用同一个带标题的通用弹窗（9.5 的节点选择也是它）：fixed、z-index 1000；遮罩 rgba(0,0,0,.6) + 5px 模糊（不模糊时 rgba(0,0,0,.62)）；主体 33.25rem（532px）宽、rgba(0,0,0,.8)、圆角 .25rem；头 3.25rem（52px），CloudGame Medium 1.125rem #EEEEEE 居中，下边 1px 白 10%；关闭 1.5rem，#EEEEEE → 悬停白 → 按下 #BFBFBF；内容内边距 1.25rem。进出同 8.11 的确认框。

"时长记录"弹窗（消费记录查询）：

"功能设置"弹窗：

账号卡"更多"打开的"免费时长 & 协议点时长说明"是 info 型确认框，调用方写死 width: 528px：头 3rem；正文 CloudGame Medium 1rem / 1.4 #787878 左对齐；没有按钮，只能点叉关。

9.4 续期与充值#

"续期"（或"开通"）和"充值"打开的是同一个"云·采购中心"，默认停在第一个页签。

收银台是支付 SDK 的 cloud_endfield 皮肤。它没有真的出现（要点商品卡下单），下面来自支付 SDK 注入的样式表（规则）和隐藏的探针元素（计算·探针）：

9.5 排队、节点选择与游戏内#

这些界面在点"开始游戏"之后才出现。测量时没有点，一个都没有渲染过：下表全部是规则（含脚本里的常量和组件结构），1440 下的像素是 rem × 16 算的。

层级常量（脚本）：加载 900、悬浮球 950（二级浮层 951）、弹窗与排队面板 1000、内嵌页外壳 1050、商城 1100、商城加载 1200、分享二级 1220、提示框 1300、条款弹窗 1310、跑马灯 1350、最小化排队 1400、轻提示 1800、输入条 1900、提示 2000、浏览器提示条 2100。

排队与进入：

游戏内：

转圈图标两张：浅色版 48×48，圆环里一道锥形渐变，半圈透明、半圈从透明渐到白 70% 的"彗尾"；深色版同构、#292929；都是 1s linear 旋转。手机竖屏进游戏时整页转 90°；样式表和脚本里都没有"请旋转手机"的提示界面。

10. 视图一览#

11. 鹰角账号 SDK 弹窗#

这是鹰角各游戏共用的账号组件（登录、实名、协议更新等），不属于终末地站点自己的设计；这里只记它在 /cloud 上的样子，供对照。

尺寸都写作 E(n)：E(n) = calc(var(--base-em-size, 16px) * n / 16)。1440×810 下 E(n) = 0.8n px，375 宽和 1920×1080 下 E(n) = n px（11.3）。

11.1 版本与皮肤#

• 版本：账号 SDK 3.5.0，/cloud 与官网首页相同；外壳是网页 SDK 3.0.3（页脚和 SDK_Sans 字体来自它）。两份灰度配置里的稳定版也是这两个。
• 样式全部是 SDK 运行时插入的内联样式，登录相关的那部分在打开登录框时才懒加载；页面自己的样式表里没有。
• 皮肤模块默认值是 "ak"，set() 只认 "ef" 和 "ak"，别的值一律回落 ak。皮肤类挂在每个层容器自己身上，不在祖先上。（脚本）
• 载入时 SDK 先插一个空的遮罩节点，调登录时再插一个装层的（或复用空的），关掉后都留在 body 里。

11.2 三套皮肤的变量#

58 个变量，ef 和 ak 各多 13 个补充变量，复测逐个对过。下表挑影响外观的（变量名去掉前缀 --）：

ak 和 ef 只在品牌色、悬停色、高亮文字与链接、标题栏、按钮、头部图标钮这几组上不同；默认皮肤是深色卡片配荧光绿，完全是另一种样子。

11.3 字号档与字体#

SDK 不用 rem，页面的根字号对它没有影响。弹窗根上按媒体查询给 --base-em-size：

• 加载转圈的容器挂在遮罩下、不在弹窗根里，取不到基准，E(n) 走回退值 16px：任何视口都是 80 × 80px、圆角 4px。
• 字体：弹窗是 sans-serif、E(16)、行高 1.5；按钮和输入框没写字体也不继承，在 Windows 的 Chrome 里是 Arial。SDK_Sans 只给页脚用，弹窗里没有元素用它。
• 支付 SDK 的 --pay-sdk-size 见 9.4。

11.4 外壳：遮罩、圆角、阴影、进出场#

另有一组 scale(.88) 淡入的进出场规则，登录框不用；用在哪没查到，样式表里同构的另一组写给角色选择弹窗，推测是同类弹窗用的。

11.5 弹窗头#

11.6 登录层#

快速登录（已登录过的账号）和验证码登录（未登录时的首屏）。值按 ef 皮肤、1440×810 写：

11.7 确认层与设备验证#

12. 没有量到的东西#

• 烧在图里的文字（首页宣传块、下载弹窗标题与"扫码下载"、"更多"的块状大字和微缩字、公告 NEW 角标）只有位置和像素颜色，字体、字号、字形内容都读不到。图里的颜色、条纹角度和周期是读像素的近似值，没有逐像素还原（SDK 的 ef 装饰图只做了像素统计）。
• 真悬停量过的只有首页的导航项、页签、胶囊按钮，用户中心条目的字色，账号卡的提示图标与气泡，以及账号 SDK 的按钮、链接、输入行和关闭钮；下载弹窗、"更多"侧栏、公告页、商城的悬停与按下只读了规则。后台标签页不出帧，"更多"的入场动画也没看到实际画面，时长、延迟、缓动全部来自规则。
• 手机横屏的首页、"更多"、商城、分享浮层只有规则；强制横屏下的实际字号和 SDK 字号档没量。移动端只在 Android 模拟（宽 768 以下）下测过，iPhone、iPad、鸿蒙 UA 在内置浏览器里没测；Android UA 重新载入后页脚是空的，无头 Edge 换 iPhone UA 时页脚正常，原因没查清。
• 设了最小字号的浏览器上字号校正会生效，排版会和表里不同。
• 浏览器提示条"正常版本的 Edge 不出现"是按兼容表推的；移动版和应用内浏览器版没有出现过。
• 全局提示组件没有在页面上触发过：复制链接、添加到桌面的结果提示和公告页底部的提示都没看到样式。"更多"第 2 – 4 节的视频只读了文件规格，播放行为没有实测。
• 启动加载层真实出现时的计算值：复测时登录状态确认得很快，尺寸是把同类名的节点临时挂上去量的。
• CDKEY 兑换页（跨源）、账号与安全（会离开本页）、退出登录（会改账号状态）都没有打开；未登录时点"用户中心"只在手机模拟下点过一次，弹出的是账号 SDK 登录框，没有量。
• 登录态只拿到过一次：账号卡在 1024 宽和移动端都没有计算值；时长说明弹窗是在未登录页面上用同样的参数调出来的。收银台、排队面板、节点选择、悬浮球菜单、游戏内提示全部没有渲染，只有规则和探针。
• 账号 SDK：设备验证、实名、挽留、未成年、防沉迷、扫码视图、密码登录都没渲染；勾选框和二维码角标在 ef 下没有真悬停；带授权参数的登录路径和 1920×1080 没量。
• 公告页什么时候切暗色主题、它 body 上的自定义光标为什么没生效，都没查。