/* 三张账号页共用样式（V1.6b4 spec §10.2）：:root / body / .top / .logo / select#lang / h1 / .status / footer / .btn / [hidden]
   逐字抽自 account.html（同一族页面，视觉一致）；首个多页共享样式文件，只服务 signin / verify / reset——account.html /
   pricing.html 的内联样式不动（不重构）。表单样式是本文件新增。 */
:root { --ink: #16130e; --paper: #faf9f5; --accent: #1f6feb; --soft: #6b6558; --line: #eee8dc; --ok: #1a7f37; --warn: #b45309; }
* { box-sizing: border-box; margin: 0; }
body { font: 17px/1.65 ui-sans-serif, system-ui, -apple-system, "PingFang SC", "Noto Sans CJK SC", sans-serif; background: var(--paper); color: var(--ink); }
main { max-width: 480px; margin: 0 auto; padding: 56px 24px 96px; }
.top { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 40px; }
.logo { font-weight: 700; letter-spacing: -.02em; text-decoration: none; color: var(--ink); }
.logo span { color: var(--accent); }
select#lang { font: inherit; font-size: 13px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); }
h1 { font-size: clamp(26px, 5vw, 34px); line-height: 1.15; letter-spacing: -.02em; margin-bottom: 16px; }
h1:focus { outline: none; } /* 切视图时把焦点放到标题（屏幕阅读器播报新视图），不要画焦点框 */
.status { min-height: 28px; font-size: 15px; margin-bottom: 20px; }
.status.err, .status.warn { color: var(--warn); }
.status.ok { color: var(--ok); }
footer { font-size: 13px; color: var(--soft); display: flex; gap: 16px; flex-wrap: wrap; align-items: center; margin-top: 48px; }
footer a { color: var(--soft); }
.btn { display: inline-block; padding: 12px 20px; font: inherit; font-size: 15px; font-weight: 600; color: var(--ink); background: #fff; border: 1.5px solid #d8d3c8; border-radius: 10px; text-decoration: none; cursor: pointer; }
.btn:hover { border-color: var(--ink); }
.btn[disabled] { opacity: .5; cursor: default; }
.btn.primary { color: #fff; background: var(--ink); border-color: var(--ink); }
.btn.primary:hover { background: #000; }
.btn.block { display: block; width: 100%; text-align: center; }
/* 表单：字段竖排；密码框右侧（RTL 下左侧，用逻辑属性）叠一个「显示密码」文字按钮 */
.field { display: grid; gap: 6px; margin-bottom: 18px; }
.field label { font-size: 14px; font-weight: 600; }
.field input { font: inherit; padding: 11px 12px; border: 1.5px solid #d8d3c8; border-radius: 10px; background: #fff; color: var(--ink); width: 100%; }
.field input:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.pw { position: relative; }
.pw input { padding-inline-end: 110px; }
.pw .toggle { position: absolute; inset-inline-end: 8px; top: 50%; transform: translateY(-50%); font: inherit; font-size: 13px; background: none; border: 0; color: var(--accent); cursor: pointer; padding: 4px 6px; }
.hint { font-size: 13px; color: var(--soft); }
.err { font-size: 14px; color: var(--warn); margin-bottom: 12px; }
/* 不用 display:none：那样空块会被摘出可访问性树，写入错误文案时是「从不存在到存在」，aria-live 的第一次播报在
   一些屏幕阅读器上会丢——margin:0 让它保持零高度但一直留在树里，写文案只是内容变化，播报才可靠触发 */
.err:empty { margin: 0; }
.row { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 14px 0 0; font-size: 14px; }
.or { display: flex; align-items: center; gap: 12px; color: var(--soft); font-size: 13px; margin: 22px 0; }
.or::before, .or::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
.note { font-size: 13px; color: var(--soft); margin-top: 16px; }
.panel { padding: 16px; border: 1.5px solid var(--line); border-radius: 12px; background: #fff; }
.panel p + p { margin-top: 10px; }
.panel .btn + .btn { margin-inline-start: 8px; }
/* 作者规则里设了 display 的元素会盖过 UA 的 [hidden]（account.html 同款坑，Playwright 实测），统一兜底 */
[hidden] { display: none !important; }