## Context

登录页面已经使用黑洞背景和玻璃面板，但最新截图显示两个问题：其一，Chrome/Edge 的自动填充在停留或重绘后仍会向原生 `<input>` 绘制浅色内部矩形；其二，现有面板仍偏左、按钮蓝色过亮，与用户最新提供的目标图不一致。该变更只能调整前端登录页面视觉，不得改变已有登录数据流。

## Goals / Non-Goals

**Goals:**

- 让账号、密码输入框在普通、获得焦点、已自动填充和页面停留后保持同样的深色透明视觉，不再出现浅灰或白色内层矩形。
- 使用实际 Chrome/Edge 验证最终自动填充效果，而不是只依赖构建结果。
- 以最新参考图为基准校准 1920px 桌面布局：面板位于约 19% 视口宽度处，卡片右边缘接近黑洞左侧发光区域但不遮挡亮环。
- 降低主按钮亮度，改为低饱和的深蓝紫渐变，并保留可辨识的主操作状态。
- 在 1200px、768px 断点保留安全边距和居中回退。

**Non-Goals:**

- 不修改登录接口、表单字段、账号记忆的存储键、Token、路由跳转、权限或后端代码。
- 不增加新的第三方依赖或独立演示页面。

## Decisions

### 使用“覆盖浏览器绘制层”而非超长过渡

对 `input:-webkit-autofill` 同时设置文本颜色、背景裁剪和与字段玻璃层一致的极低透明 inset shadow，并删除 `9999s` 背景过渡。长过渡只能延后浏览器浅色背景出现，不能阻止其重绘；即时覆盖才能在停留后保持稳定。

备选方案是给输入本体设置不透明深色底色。该方案可以隐藏白底，但会破坏用户要求的透明玻璃效果，因此不采用。

### 字号由输入本体统一控制

普通、聚焦和自动填充选择器必须使用同一个显式字号与行高。浏览器自动填充状态不再单独继承或覆盖字号，避免首次进入和点击后视觉跳变。

### 按最新参考图重新校准面板位置与色彩

桌面端将以参考图的约 19% 视口左距作为视觉基准，并使用 `clamp` 计算而非单一像素值；1200px 以下缩小偏移，768px 以下居中。按钮采用暗蓝紫低饱和渐变和轻微边缘高光，避免当前浅蓝按钮脱离黑洞背景。

此前的 `left: clamp(140px, 12.5vw, 240px)` 规则不再作为最终桌面视觉基准，因为最新参考图明确要求更靠右的位置。

## Risks / Trade-offs

- [Chrome 与 Edge 版本对自动填充伪类的绘制差异] → 在两个浏览器中实际触发已保存账号密码并等待重绘后截图验证；必要时采用与外层字段一致的极低透明内阴影作为兼容回退。
- [卡片右移后可能与黑洞亮环重叠] → 以 1920×1080、1440×900、1366×768 三个视口进行截图比对，按参考图微调背景定位和 `clamp` 区间。
- [按钮变暗降低可见性] → 保持白色文字、明确边框与轻微悬停提亮，不牺牲可读性。
