/* 登录页自带配色：/static 下的 tokens.css 要登录后才能取 */
:root {
  --bg: #0b0f14; --panel: #121821; --line: #243041; --fg: #e6edf3; --muted: #8b98a8;
  --accent: #7df3a3; --accent-fg: #06210f; --err: #ff8a8a;
  color-scheme: dark;
}
:root[data-theme="light"] {
  --bg: #f4f6f8; --panel: #ffffff; --line: #d9e0e7; --fg: #1a2330; --muted: #5d6b7a;
  --accent: #1f9d55; --accent-fg: #ffffff; --err: #c62828;
  color-scheme: light;
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  background: var(--bg); color: var(--fg);
  font-family: "IBM Plex Sans", -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.card {
  width: 100%; max-width: 360px; background: var(--panel); border: 1px solid var(--line);
  border-radius: 14px; padding: 36px 28px 28px; text-align: center;
}
.brand { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 28px; }
.brand img { width: 56px; height: 56px; }
.brand h1 { margin: 0; font-size: 26px; letter-spacing: .04em; font-weight: 600; }
.brand p { margin: 0; color: var(--muted); font-size: 13px; }
form { display: flex; flex-direction: column; gap: 12px; }
/* 字号 16px：iOS 上小于 16px 的输入框一聚焦就会把整页放大 */
input[type=password] {
  width: 100%; padding: 11px 12px; font-size: 16px; border-radius: 8px;
  border: 1px solid var(--line); background: var(--bg); color: var(--fg);
  outline: none; transition: border-color .15s, box-shadow .15s;
}
/* 聚焦：边框变色 + 贴着边框的光晕，框本身不变大、和按钮保持一样宽 */
input[type=password]:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}
/* 浏览器 / 密码管理器自动填充会刷一层浅色底：用内阴影盖回页面底色 */
input[type=password]:-webkit-autofill {
  -webkit-text-fill-color: var(--fg); caret-color: var(--fg);
  box-shadow: inset 0 0 0 100px var(--bg);
  transition: background-color 100000s;
}
input[type=password]:-webkit-autofill:focus {
  box-shadow: inset 0 0 0 100px var(--bg), 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}
button {
  padding: 11px 12px; font-size: 15px; font-weight: 600; border: 0; border-radius: 8px;
  background: var(--accent); color: var(--accent-fg); cursor: pointer;
}
button:hover { filter: brightness(1.05); }
.error { margin: 0; color: var(--err); font-size: 13px; }
.error:empty { display: none; }
