/* ==========================================================================
   DJB 联脑 · Daylight Signal 设计系统（唯一验收口径：UI-BASELINE-2026-11-01）
   --------------------------------------------------------------------------
   1. Token       2. 基础/排版     3. 布局         4. 顶栏与导航
   5. 按钮        6. 卡片/Hero     7. KPI/表格     8. 徽标/步骤
   9. 表单        10. tabs/drawer/modal/toast      11. 提示条/空状态
   12. 证据/代码  13. 页脚         14. 控制台兼容层 15. 动效与响应式
   无 JavaScript（CSP script-src 'none'）：交互只用 <details> / :focus / 原生表单。
   对比度备注见 ops/uta/evidence/wp1/CONTRAST-NOTES.md。
   ========================================================================== */

/* 1. Token ---------------------------------------------------------------- */
:root {
  color-scheme: light;
  /* 底色与表面（design/15 §1.1 day：藕粉晨光） */
  --bg: #F5F1FA;
  --bg-2: #EDE7F6;
  --surface: #FFFFFF;
  --surface-2: #FAF7FE;
  --surface-3: #F3EDFA;
  /* 文字：ink/ink-2 在 --bg 上 17.6/12+；muted 只做说明文字（≥4.5:1） */
  --ink: #1B1530;
  --ink-2: #3C3457;
  --muted: #6B6385;
  --line: rgba(60, 40, 110, .14);
  --line-2: rgba(60, 40, 110, .24);
  /* 控件边界色：规范 §1.1 --line-3，仅用于表单控件描边 */
  --line-3: rgba(60, 40, 110, .55);
  /* 主色：温和玉绿（§2.3；实心按钮底上的字用 --on-accent） */
  --mint: #2F7D66;
  --mint-strong: #256B57;
  --mint-strong-hover: #2A735E;
  --mint-text: #256B57;
  --mint-2: #3FA184;
  --mint-3: #DDF3EA;
  /* 状态色：等待=琥珀 / 真失败=珊瑚（不参与紫粉轮换） */
  --amber: #9A6A16;
  --amber-text: #8A5D12;
  --red: #B94F47;
  --red-text: #A84540;
  --red-3: #FBEAE8;
  --cyan: #2F7F9E;
  --cyan-text: #2A6E8C;
  --lime: #5F7F3A;
  /* 第二强调：紫（导航/链接 hover/选中/信息徽标） */
  --violet: #6A4FBF;
  --violet-2: #8A6FE0;
  --violet-3: #EEE8FF;
  --violet-text: #5B3FA8;
  /* 第三强调：粉（eyebrow/装饰徽标/渐变末端/选中底；不承担状态语义） */
  --pink: #B93C7E;
  --pink-2: #D967A6;
  --pink-3: #FBE7F3;
  --pink-text: #A83270;
  /* 圆角 */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 14px;
  --r-pill: 999px;
  /* 阴影只有两级（E11 浅色低海拔尺度；色相随紫墨底改冷紫） */
  --shadow-1: 0 1px 2px rgba(27, 21, 48, .06), 0 12px 32px rgba(27, 21, 48, .08);
  --shadow-2: 0 18px 50px rgba(27, 21, 48, .14);
  /* 字体 */
  --font: Inter, "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "SFMono-Regular", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;
  /* 字号阶梯 12/13/14/16/20/24/32/44 */
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-20: 20px;
  --fs-24: 24px;
  --fs-32: 32px;
  --fs-44: 44px;
  /* 间距 4/8/12/16/24/32/48/64 */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  /* 尺寸 */
  --topbar-h: 64px;
  --sidebar-w: 248px;
  --grid-max: 1280px;
  --hit: 44px;
  --hit-mobile: 48px;
  /* 焦点与动效 */
  --focus-ring: 2px solid var(--mint);
  --focus-offset: 2px;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --t-hover: 160ms;
  --t-enter: 320ms;
  --t-drawer: 250ms;
  --t-toast: 200ms;
  /* 兼容别名（旧模板仍引用这些变量名，只做指向，不新增色值） */
  --fg: var(--ink);
  --brand: var(--mint);
  --danger: var(--red);
  --warn: var(--amber);
  --ok: var(--mint);
}

/* 2. 基础与排版 ------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: var(--fs-16);
  line-height: 1.6;
  font-feature-settings: "tnum" 1;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  margin: 0 0 var(--s-3);
  color: var(--ink);
  font-weight: 650;
  letter-spacing: -.01em;
  line-height: 1.22;
}
h1 { font-size: var(--fs-44); }
h2 { font-size: var(--fs-24); }
h3 { font-size: var(--fs-20); }
h4 { font-size: var(--fs-16); }

p { margin: 0 0 var(--s-3); }
p:last-child { margin-bottom: 0; }

a { color: var(--mint-strong); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }

code, kbd, samp, pre { font-family: var(--font-mono); font-size: .92em; }
code {
  padding: 2px 6px;
  border-radius: var(--r-sm);
  background: var(--mint-3);
  color: var(--ink);
  word-break: break-word;
}
pre code { padding: 0; background: none; }

ul, ol { margin: 0 0 var(--s-3); padding-left: 1.25em; }
li { margin-bottom: var(--s-2); }

hr { height: 1px; margin: var(--s-5) 0; border: 0; background: var(--line); }

strong, b { font-weight: 650; }

/* 焦点：2px 实心 mint + 2px 外扩（鼠标点击不显示，键盘必须可见） */
:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-radius: var(--r-sm);
}
:focus:not(:focus-visible) { outline: none; }

/* 跳转链接：默认藏起来，聚焦时出现 */
.skip-link {
  position: absolute;
  left: var(--s-4);
  top: -120px;
  z-index: 100;
  padding: var(--s-3) var(--s-4);
  min-height: var(--hit);
  display: inline-flex;
  align-items: center;
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--line-2);
  box-shadow: var(--shadow-1);
  transition: top var(--t-hover) var(--ease);
}
.skip-link:focus { top: var(--s-3); text-decoration: none; }

#main:focus { outline: none; }

/* 排版助手 */
/* 12px 小标签：文字用 --ink-2 承载（必须可读），标记点用粉 --pink（§2.2-1，
   纯装饰、不表达状态；发光只加在点上，不加在文字上）。 */
.eyebrow, .kicker {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  margin: 0 0 var(--s-3);
  color: var(--ink-2);
  font-size: var(--fs-12);
  font-weight: 650;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.eyebrow::before, .kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: var(--pink);
  box-shadow: 0 0 10px var(--glow-3);
  flex: 0 0 auto;
}
.lead { color: var(--ink-2); font-size: var(--fs-16); max-width: 68ch; }
.meta { color: var(--muted); font-size: var(--fs-13); }
.muted { color: var(--muted); }
.fineprint { color: var(--ink-2); font-size: var(--fs-12); max-width: 76ch; }
.section-index {
  margin: 0 0 var(--s-2);
  color: var(--muted);
  font-size: var(--fs-12);
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.section-links { margin-top: var(--s-5); color: var(--ink-2); font-size: var(--fs-14); }
.section-links a { font-weight: 600; }
.section-links a:hover, .lead a:hover, .fineprint a:hover { color: var(--violet-text); }

/* 3. 布局 ----------------------------------------------------------------- */
.wrap {
  width: 100%;
  max-width: var(--grid-max);
  margin-inline: auto;
  padding-inline: clamp(20px, 4.5vw, 80px);
}

.page-document { padding-block: var(--s-7) var(--s-8); }
.page-document > * + * { margin-top: var(--s-5); }
.page-head { max-width: 76ch; }
.page-head h1 { margin-bottom: var(--s-3); }
.page-head .lead { font-size: var(--fs-20); color: var(--ink-2); }

.section { padding-block: var(--s-8); }
.section-alt { background: var(--bg-2); }
.section-head { max-width: 70ch; margin-bottom: var(--s-6); }
.section-head h2 { margin-bottom: var(--s-3); }
.section-lead { color: var(--ink-2); }

.grid { display: grid; gap: var(--s-5); }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.mt-16 { margin-top: var(--s-4); }
.mt-24 { margin-top: var(--s-5); }
.compact { margin-bottom: var(--s-3); }
.inline-form { display: inline; margin: 0; }

/* 4. 顶栏与导航 ------------------------------------------------------------ */
.topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  min-height: var(--topbar-h);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  border-bottom: 1px solid var(--line);
  backdrop-filter: saturate(1.2) blur(8px);
}
@supports not (background: color-mix(in srgb, red 50%, blue)) {
  .topbar { background: var(--surface); }
}
.topbar-inner {
  display: flex;
  align-items: center;
  gap: var(--s-5);
  min-height: var(--topbar-h);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: var(--s-3);
  min-height: var(--hit);
  color: var(--ink);
  flex: 0 0 auto;
}
.brand:hover { text-decoration: none; }
.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: var(--r-sm);
  background: var(--mint);
  color: var(--on-accent);
  font-size: var(--fs-12);
  font-weight: 700;
  letter-spacing: .04em;
}
.brand-text { display: flex; flex-direction: column; font-weight: 650; line-height: 1.15; }
.brand-text small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .18em;
}

.topbar-nav { flex: 1 1 auto; min-width: 0; display: flex; gap: var(--s-5); flex-wrap: wrap; }
.nav-group { display: flex; flex-direction: column; gap: 2px; }
.nav-group-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.nav-items { display: flex; gap: var(--s-3); margin: 0; padding: 0; list-style: none; flex-wrap: wrap; }
.nav-items li { margin: 0; }
.nav-items a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 2px;
  color: var(--ink-2);
  font-size: var(--fs-14);
  border-bottom: 2px solid transparent;
  transition: color var(--t-hover) var(--ease), border-color var(--t-hover) var(--ease);
}
.nav-items a:hover { color: var(--violet-text); text-decoration: none; border-bottom-color: var(--violet); }
/* 当前项：玉绿文字 + 玉绿→紫渐变下划线（§2.1-1）。边框画不出渐变，用背景条替代。 */
.nav-items a[aria-current="page"] {
  color: var(--ink);
  font-weight: 650;
  border-bottom-color: transparent;
  background-image: linear-gradient(90deg, var(--mint), var(--violet));
  background-repeat: no-repeat;
  background-size: 100% 2px;
  background-position: 0 100%;
}

.topbar-actions { display: flex; align-items: center; gap: var(--s-3); flex: 0 0 auto; }

.lang-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--hit);
  min-height: 32px;
  padding: 0 var(--s-2);
  border: 1px solid var(--line-2);
  border-radius: var(--r-pill);
  color: var(--ink-2);
  font-size: var(--fs-13);
  font-weight: 600;
  transition: border-color var(--t-hover) var(--ease), color var(--t-hover) var(--ease);
}
.lang-switch:hover { color: var(--mint-strong); border-color: var(--mint-strong); text-decoration: none; }

/* 状态点：唯一允许的呼吸动效（2s），只出现在状态点上 */
.status-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  min-height: 32px;
  padding: 0 var(--s-3);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--surface-2);
  color: var(--ink-2);
  font-size: var(--fs-12);
  white-space: nowrap;
  transition: border-color var(--t-hover) var(--ease);
}
.status-chip:hover { text-decoration: none; border-color: var(--line-2); }
.dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--muted);
  flex: 0 0 auto;
}
.status-ok .dot { background: var(--mint-2); animation: breathe 2s ease-in-out infinite; }
.status-warn .dot { background: var(--amber); animation: breathe 2s ease-in-out infinite; }
.status-unknown .dot { background: var(--muted); }
.status-chip.status-warn { color: var(--amber-text); border-color: color-mix(in srgb, var(--amber) 30%, var(--line)); }
.status-chip.status-ok { color: var(--ink-2); }

@keyframes breathe {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .45; transform: scale(.82); }
}

/* 5. 按钮 ----------------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  min-height: var(--hit);
  padding: var(--s-2) var(--s-4);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  font-family: inherit;
  font-size: var(--fs-14);
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  text-decoration: none;
  transition: background var(--t-hover) var(--ease), border-color var(--t-hover) var(--ease),
              box-shadow var(--t-hover) var(--ease), transform var(--t-hover) var(--ease);
}
.btn:hover { border-color: var(--violet-2); box-shadow: var(--shadow-1), 0 0 0 3px var(--glow-2); text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn[disabled], .btn:disabled, .btn[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .55;
  box-shadow: none;
  transform: none;
}
.btn-primary { background: var(--mint-strong); border-color: var(--mint-strong); color: var(--on-accent); }
.btn-primary:hover { background: var(--mint-strong-hover); border-color: var(--mint-strong-hover); color: var(--on-accent); }
.btn-quiet { background: transparent; border-color: transparent; color: var(--ink-2); }
.btn-quiet:hover { background: var(--surface-2); border-color: var(--line); box-shadow: none; }
.btn-lg { min-height: var(--hit-mobile); padding: var(--s-3) var(--s-5); font-size: var(--fs-16); }
.btn-sm { min-height: var(--hit); padding: var(--s-1) var(--s-3); font-size: var(--fs-13); }
.btn-block { width: 100%; }
/* 旧模板类名（控制台/认证页仍在使用，仅做视觉对齐） */
.button, .button-secondary, .button-violet, .button-danger, .button-inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  min-height: var(--hit);
  padding: var(--s-2) var(--s-4);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-size: var(--fs-14);
  font-weight: 600;
  cursor: pointer;
  transition: background var(--t-hover) var(--ease), border-color var(--t-hover) var(--ease),
              box-shadow var(--t-hover) var(--ease);
}
.button { background: var(--mint-strong); border-color: var(--mint-strong); color: var(--on-accent); }
.button:hover, .button-secondary:hover, .button-inline:hover { box-shadow: var(--shadow-1); }
.button-violet { background: var(--violet); border-color: var(--violet); color: var(--on-accent); }
.button-violet:hover { border-color: var(--violet-2); box-shadow: var(--shadow-1), 0 0 0 3px var(--glow-2); }
.button-danger { background: var(--red); border-color: var(--red); color: var(--on-accent); }
.button-inline { padding: var(--s-1) var(--s-3); font-size: var(--fs-13); }

/* 6. 卡片与 Hero ----------------------------------------------------------- */
.card {
  padding: var(--s-5);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
  box-shadow: var(--shadow-1);
  transition: box-shadow var(--t-hover) var(--ease), border-color var(--t-hover) var(--ease),
              transform var(--t-hover) var(--ease);
}
.card > h2:first-child, .card > h3:first-child { margin-top: 0; }
a.card:hover, .card-interactive:hover { border-color: var(--line-2); box-shadow: var(--shadow-2); transform: translateY(-2px); }
.card-surface { background: var(--surface-2); box-shadow: none; }
.note-card { background: var(--surface-2); }

.hero { padding-block: clamp(32px, 6vw, 64px) var(--s-7); }
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr);
  gap: var(--s-7);
  align-items: start;
}
.hero-copy h1 {
  margin-bottom: var(--s-4);
  font-size: clamp(32px, 5.2vw, 44px);
  line-height: 1.12;
  letter-spacing: -.02em;
}
.hero-accent { display: block; color: var(--mint-strong); }
.hero-lead { max-width: 60ch; margin-bottom: var(--s-5); color: var(--ink-2); font-size: var(--fs-20); line-height: 1.5; }
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-bottom: var(--s-4); }
.hero-panel { padding: var(--s-5); }
.panel-title { margin-bottom: var(--s-4); font-size: var(--fs-14); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.panel-link { display: inline-flex; align-items: center; min-height: var(--hit); font-size: var(--fs-14); font-weight: 600; }

.chip-row { display: flex; flex-wrap: wrap; gap: var(--s-2); margin: 0 0 var(--s-4); padding: 0; list-style: none; }
.chip {
  margin: 0;
  padding: 5px var(--s-3);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--surface);
  color: var(--ink-2);
  font-size: var(--fs-12);
  font-weight: 600;
}

/* 角色卡（首页两侧入口） */
.role-grid { align-items: stretch; }
.role-card { display: flex; flex-direction: column; gap: var(--s-3); }
.role-title { margin: 0; font-size: var(--fs-24); }
.role-lead { color: var(--ink-2); }
.role-card .steps { flex: 1 1 auto; }
.role-foot { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; margin-top: auto; }
.entry-cta { flex: 1 1 auto; }

/* 7. KPI 与表格 ------------------------------------------------------------ */
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); }
.kpi-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kpi { display: flex; flex-direction: column; gap: var(--s-1); padding: var(--s-4) var(--s-5); }
.kpi-label { margin: 0; color: var(--muted); font-size: var(--fs-12); font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.kpi-value { margin: 0; color: var(--ink); font-size: var(--fs-32); font-weight: 650; line-height: 1.1; font-variant-numeric: tabular-nums; }
.kpi-value-sm { font-size: var(--fs-16); font-weight: 500; }
.kpi-note { margin: 0; color: var(--muted); font-size: var(--fs-12); }

/* 旧模板里 .stat / .stat-label 的等价物 */
.stat { margin: 0; font-size: var(--fs-32); font-weight: 650; line-height: 1.1; font-variant-numeric: tabular-nums; }
.stat-label { margin: 0 0 var(--s-1); color: var(--muted); font-size: var(--fs-12); font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.metric-grid { align-items: stretch; }

/* 表格标题：放在表格外，不随横向滚动被裁（390 下也一直可见） */
.table-caption {
  margin: 0 0 var(--s-2);
  color: var(--muted);
  font-size: var(--fs-13);
}
.table-caption:last-child { margin-bottom: 0; }

.table-checks th:first-child, .table-checks td:first-child { width: 46%; }
.table-wrap, .table-scroll {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface);
}
.table-scroll { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: var(--fs-14); }
caption {
  padding: var(--s-3) var(--s-4);
  color: var(--muted);
  font-size: var(--fs-12);
  text-align: left;
  border-bottom: 1px solid var(--line);
}
th, td { padding: 8px var(--s-4); text-align: left; vertical-align: middle; }
thead th {
  position: sticky;
  top: 0;
  background: var(--surface-2);
  color: var(--ink-2);
  font-size: var(--fs-12);
  font-weight: 650;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
tbody tr { height: 36px; border-bottom: 1px solid var(--line); }
tbody tr:last-child { border-bottom: 0; }
tbody tr:hover { background: var(--surface-2); }
td code { background: transparent; padding: 0; color: var(--ink-2); }

/* 8. 徽标与步骤 ------------------------------------------------------------ */
.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-pill);
  background: var(--surface-2);
  color: var(--ink-2);
  font-size: var(--fs-12);
  font-weight: 600;
  white-space: nowrap;
}
.pill-ok { background: var(--mint-3); border-color: color-mix(in srgb, var(--mint) 26%, var(--mint-3)); color: var(--mint-text); }
.pill-warn { background: color-mix(in srgb, var(--amber) 12%, var(--surface)); border-color: color-mix(in srgb, var(--amber) 34%, var(--line)); color: var(--amber-text); }
.pill-danger { background: color-mix(in srgb, var(--red) 10%, var(--surface)); border-color: color-mix(in srgb, var(--red) 30%, var(--line)); color: var(--red); }
.pill.muted, .pill-muted { background: var(--surface-2); border-color: var(--line-2); color: var(--ink-2); }
/* 默认徽标 = 紫色（非状态强调 §2.1-4）；状态徽标仍走 .pill-ok/.pill-warn/.pill-danger */
.badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: var(--r-sm); background: var(--violet-3); color: var(--violet-text); font-size: var(--fs-12); font-weight: 650; }

.step-list { margin: 0; padding: 0; list-style: none; counter-reset: step; }
.step-list > li {
  position: relative;
  margin: 0 0 var(--s-3);
  padding-left: 40px;
  color: var(--ink-2);
  counter-increment: step;
}
.step-list > li::before {
  content: counter(step, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 0;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--mint-strong);
  font-family: var(--font-mono);
  font-size: var(--fs-12);
  font-weight: 700;
}
.step-list > li:last-child { margin-bottom: 0; }

.point-list { margin: 0; padding: 0; list-style: none; }
.point { margin: 0 0 var(--s-5); padding-bottom: var(--s-4); border-bottom: 1px solid var(--line); }
.point:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.point-index { margin: 0 0 var(--s-1); color: var(--muted); font-family: var(--font-mono); font-size: var(--fs-12); letter-spacing: .06em; }
.point h3 { margin-bottom: var(--s-2); font-size: var(--fs-20); }

.research-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--s-6); align-items: start; }
.metric-card { display: flex; flex-direction: column; gap: var(--s-2); background: var(--surface); }
.metric-value { margin: 0; color: var(--mint-strong); font-size: clamp(32px, 4.6vw, 44px); font-weight: 700; letter-spacing: -.02em; line-height: 1.05; }
.metric-label { margin: 0; color: var(--ink-2); font-size: var(--fs-14); font-weight: 600; }
.metric-note { margin: 0; color: var(--muted); font-size: var(--fs-12); }
.metric-links { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-3); }

.split-bar { display: flex; height: 40px; margin-bottom: var(--s-4); border-radius: var(--r-sm); overflow: hidden; border: 1px solid var(--line); }
.split-platform { display: grid; place-items: center; width: 15%; background: var(--ink-2); color: var(--on-accent); font-size: var(--fs-12); font-weight: 650; }
.split-provider { display: grid; place-items: center; width: 85%; background: var(--mint-strong); color: var(--on-accent); font-size: var(--fs-12); font-weight: 650; }

.platform-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); margin: 0 0 var(--s-5); padding: 0; list-style: none; }
.platform { margin: 0; padding: var(--s-4); border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface-2); }
.platform-name { margin: 0 0 var(--s-1); font-weight: 650; }
.platform-req { margin: 0 0 var(--s-3); color: var(--muted); font-size: var(--fs-13); }

.copy-list { margin: 0; padding-left: 1.1em; color: var(--ink-2); }
.copy-list li { margin-bottom: var(--s-2); }

.spec-list { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--s-2) var(--s-4); margin: 0; }
.spec-list dt { color: var(--muted); font-size: var(--fs-13); font-weight: 600; }
.spec-list dd { margin: 0; color: var(--ink-2); font-size: var(--fs-14); }
.spec-list-tight { gap: var(--s-1) var(--s-4); margin-top: var(--s-4); }

/* 9. 表单 ----------------------------------------------------------------- */
.field { margin-bottom: var(--s-4); }
.label, label.label { display: block; margin-bottom: var(--s-2); color: var(--ink-2); font-size: var(--fs-13); font-weight: 650; }
.field-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); margin-bottom: var(--s-2); }
.field-row .label { margin-bottom: 0; }
.hint { margin: var(--s-1) 0 0; color: var(--muted); font-size: var(--fs-12); }
.input, input[type="text"], input[type="search"], input[type="email"], input[type="number"],
input[type="password"], input[type="date"], select, textarea {
  width: 100%;
  min-height: var(--hit);
  padding: var(--s-2) var(--s-3);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  font-family: inherit;
  font-size: var(--fs-14);
  transition: border-color var(--t-hover) var(--ease), box-shadow var(--t-hover) var(--ease);
}
.input:hover, select:hover, textarea:hover { border-color: var(--muted); }
input:disabled, select:disabled, textarea:disabled {
  background: var(--surface-2);
  color: var(--muted);
  cursor: not-allowed;
}
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
textarea { min-height: 120px; resize: vertical; }
.field-row .input { flex: 1 1 220px; width: auto; }
.check-label { display: inline-flex; align-items: center; gap: var(--s-2); min-height: var(--hit); color: var(--ink-2); font-size: var(--fs-14); }
input[type="checkbox"], input[type="radio"] { width: 18px; height: 18px; accent-color: var(--mint-strong); }
form { margin: 0; }

/* 10. tabs / drawer / modal / toast --------------------------------------- */
.tabs { display: flex; flex-wrap: wrap; gap: var(--s-1); margin-bottom: var(--s-4); border-bottom: 1px solid var(--line); }
.tabs a, .tabs button {
  display: inline-flex;
  align-items: center;
  min-height: var(--hit);
  padding: 0 var(--s-3);
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: var(--ink-2);
  font: inherit;
  font-size: var(--fs-14);
  font-weight: 600;
  cursor: pointer;
}
.tabs a:hover, .tabs button:hover { color: var(--ink); border-bottom-color: var(--line-2); text-decoration: none; }
.tabs [aria-selected="true"], .tabs .is-active { color: var(--ink); border-bottom-color: var(--mint-strong); }

/* 抽屉/弹层：默认隐藏，用 :target 或 .open 打开（无 JS） */
.drawer, .modal {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: grid;
  place-items: center;
  padding: var(--s-4);
  background: color-mix(in srgb, var(--ink) 42%, transparent);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--t-drawer) var(--ease), visibility var(--t-drawer) var(--ease);
}
.drawer:target, .modal:target, .drawer.open, .modal.open { opacity: 1; visibility: visible; }
.drawer-panel, .modal-panel {
  width: min(560px, 100%);
  max-height: 86vh;
  overflow: auto;
  padding: var(--s-5);
  border-radius: var(--r-lg);
  background: var(--surface);
  box-shadow: var(--shadow-2);
  transform: translateY(8px);
  transition: transform var(--t-drawer) var(--ease);
}
.drawer:target .drawer-panel, .modal:target .modal-panel,
.drawer.open .drawer-panel, .modal.open .modal-panel { transform: translateY(0); }
.drawer-panel { margin-left: auto; height: 100%; max-height: none; border-radius: var(--r-lg) 0 0 var(--r-lg); }

.toast {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  min-height: var(--hit);
  padding: var(--s-2) var(--s-4);
  border-radius: var(--r-sm);
  background: var(--ink);
  color: var(--bg);
  font-size: var(--fs-14);
  box-shadow: var(--shadow-1);
  animation: toast-in var(--t-toast) var(--ease) both;
}
@keyframes toast-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* 11. 提示条 / 空状态 ------------------------------------------------------ */
.banner {
  display: block;
  margin: var(--s-4) 0;
  padding: var(--s-3) var(--s-4);
  border: 1px solid var(--line-2);
  border-left: 3px solid var(--muted);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  font-size: var(--fs-14);
}
.banner strong { display: inline; }
.banner ul { margin: var(--s-2) 0 0; }
.banner-warn { border-left-color: var(--amber); background: color-mix(in srgb, var(--amber) 7%, var(--surface)); }
.banner-danger { border-left-color: var(--red); background: color-mix(in srgb, var(--red) 7%, var(--surface)); }
.banner-ok { border-left-color: var(--mint-strong); background: var(--mint-3); }

.empty-state {
  margin: var(--s-3) 0 0;
  padding: var(--s-5);
  border: 1px dashed var(--line-2);
  border-radius: var(--r-sm);
  background: var(--surface-2);
  color: var(--muted);
  font-size: var(--fs-14);
  text-align: center;
}

.callout {
  margin: var(--s-4) 0 0;
  padding: var(--s-4) var(--s-5);
  border-left: 3px solid var(--mint);
  border-radius: var(--r-sm);
  background: var(--mint-3);
  color: var(--ink);
}
.callout h3 { margin-bottom: var(--s-2); font-size: var(--fs-16); }
.callout-warn { border-left-color: var(--amber); background: color-mix(in srgb, var(--amber) 9%, var(--surface)); color: var(--ink-2); font-size: var(--fs-13); }
.error-text { margin: var(--s-2) 0 0; color: var(--red); font-size: var(--fs-13); }

/* 12. 证据 / 代码 ---------------------------------------------------------- */
.evidence {
  margin-top: var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface-2);
}
.evidence > summary {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  min-height: var(--hit);
  padding: var(--s-2) var(--s-4);
  color: var(--ink-2);
  font-size: var(--fs-13);
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}
.evidence > summary::-webkit-details-marker { display: none; }
.evidence > summary::before {
  content: "＋";
  color: var(--mint-strong);
  font-family: var(--font-mono);
  font-weight: 700;
}
.evidence[open] > summary::before { content: "－"; }
.evidence[open] > summary { border-bottom: 1px solid var(--line); }
.evidence > *:not(summary) { padding-inline: var(--s-4); }
.evidence > *:not(summary):first-of-type { margin-top: var(--s-3); }
.evidence > *:not(summary):last-child { margin-bottom: var(--s-4); }
.evidence-models { margin-top: var(--s-5); }

.faq {
  border-bottom: 1px solid var(--line);
  background: transparent;
}
.faq:last-of-type { border-bottom: 0; }
.faq > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3);
  min-height: var(--hit);
  cursor: pointer;
  color: var(--ink);
  font-size: var(--fs-14);
  font-weight: 600;
  list-style: none;
}
.faq > summary::-webkit-details-marker { display: none; }
.faq > summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--mint-strong);
  font-family: var(--font-mono);
  font-size: var(--fs-16);
  font-weight: 700;
}
.faq[open] > summary::after { content: "−"; }
.faq[open] > summary { color: var(--mint-strong); }
.faq > summary:hover { color: var(--mint-strong); }
.faq > p { padding-bottom: var(--s-3); color: var(--ink-2); }

.code-block {
  overflow-x: auto;
  margin: var(--s-4) 0 var(--s-2);
  padding: var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface-2);
  color: var(--ink);
  font-size: var(--fs-13);
  line-height: 1.7;
  tab-size: 2;
}
.form-panel { padding: var(--s-5); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--shadow-1); }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); margin-top: var(--s-4); }
.risk-zone { margin-top: var(--s-6); padding: var(--s-4) var(--s-5); border: 1px solid color-mix(in srgb, var(--red) 34%, var(--line)); border-radius: var(--r-md); background: color-mix(in srgb, var(--red) 5%, var(--surface)); }
.risk-note { color: var(--ink-2); font-size: var(--fs-13); }

/* 13. 页脚 ---------------------------------------------------------------- */
.site-footer {
  margin-top: var(--s-8);
  padding-block: var(--s-7) var(--s-5);
  border-top: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink-2);
  font-size: var(--fs-14);
}
.footer-inner { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr); gap: var(--s-7); align-items: start; }
.footer-brand strong { display: block; margin-bottom: var(--s-2); color: var(--ink); font-size: var(--fs-14); letter-spacing: .04em; }
.footer-tagline { margin: 0 0 var(--s-3); color: var(--ink-2); }
.footer-note { margin: 0; max-width: 46ch; color: var(--muted); font-size: var(--fs-12); line-height: 1.7; }
.footer-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.footer-col-title { margin: 0 0 var(--s-2); color: var(--muted); font-size: var(--fs-12); font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.footer-col ul { margin: 0; padding: 0; list-style: none; }
.footer-col li { margin: 0; }
.footer-col a { display: inline-flex; align-items: center; min-height: 32px; color: var(--ink-2); font-size: var(--fs-14); }
.footer-col a:hover { color: var(--violet-text); }
.footer-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-4); justify-content: space-between; margin-top: var(--s-6); padding-top: var(--s-4); border-top: 1px solid var(--line); color: var(--muted); font-size: var(--fs-12); }
.footer-meta .evidence { flex: 1 1 420px; margin-top: 0; background: var(--surface-2); }
.footer-meta .meta { margin: 0; }

/* 14. 控制台兼容层（控制台模板可见文案不在这里改，只给它们穿衣服） ---------- */
.page-workspace, .console-layout { font-size: var(--fs-14); }

.workspace-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-4);
  padding-block: var(--s-2);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: var(--fs-12);
}
.workspace-bar a { font-weight: 600; }
.workspace-marker { margin-right: var(--s-2); color: var(--mint-strong); }
.workspace-separator { margin: 0 var(--s-2); color: var(--line-2); }
.workspace-bar strong { color: var(--ink); }

.console-layout {
  display: grid;
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
  gap: var(--s-6);
  align-items: start;
  padding-block: var(--s-5) var(--s-8);
}
.console-content { min-width: 0; }
.console-content > * + * { margin-top: var(--s-5); }
.console-content h1 { font-size: var(--fs-32); }

.subnav {
  position: sticky;
  top: calc(var(--topbar-h) + var(--s-3));
  padding: var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
  box-shadow: var(--shadow-1);
  font-size: var(--fs-14);
}
.subnav h2 { margin: var(--s-1) 0 var(--s-3); font-size: var(--fs-16); }
.workspace-switch { display: flex; gap: var(--s-2); margin-bottom: var(--s-3); }
.workspace-switch a {
  flex: 1 1 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--hit);
  padding: 0 var(--s-2);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink-2);
  font-size: var(--fs-13);
  font-weight: 600;
}
.workspace-switch a:hover { border-color: var(--mint-strong); color: var(--mint-strong); text-decoration: none; }
.workspace-menu { margin: 0; padding: 0; list-style: none; }
.workspace-menu li { margin: 0; }
.workspace-menu a {
  display: flex;
  align-items: center;
  min-height: var(--hit);
  padding: 0 var(--s-3);
  border-radius: var(--r-sm);
  color: var(--ink-2);
  font-size: var(--fs-14);
}
.workspace-menu a:hover { background: var(--surface-2); color: var(--ink); text-decoration: none; }
.workspace-menu a[aria-current="page"] { background: var(--mint-3); color: var(--ink); font-weight: 650; }
.workspace-menu .nav-group {
  margin-top: var(--s-3);
  padding: var(--s-2) var(--s-3) var(--s-1);
  color: var(--muted);
  font-size: var(--fs-12);
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.subnav-support { margin-top: var(--s-4); border-top: 1px solid var(--line); padding-top: var(--s-2); }
.subnav-support > summary {
  display: flex;
  align-items: center;
  min-height: var(--hit);
  color: var(--ink-2);
  font-size: var(--fs-13);
  font-weight: 600;
  cursor: pointer;
}
.subnav-support a { display: flex; align-items: center; min-height: var(--hit); font-size: var(--fs-13); }

.task-dock, .provider-dock {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s-3);
  margin: 0;
}
.task-dock a, .provider-dock a {
  display: grid;
  gap: 2px;
  min-height: var(--hit);
  padding: var(--s-3) var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--shadow-1);
  transition: border-color var(--t-hover) var(--ease), box-shadow var(--t-hover) var(--ease), transform var(--t-hover) var(--ease);
}
.task-dock a:hover, .provider-dock a:hover { border-color: var(--line-2); box-shadow: var(--shadow-2); transform: translateY(-2px); text-decoration: none; }
.task-dock strong, .provider-dock strong { font-size: var(--fs-14); }
.task-dock small, .provider-dock small { color: var(--muted); font-size: var(--fs-12); }

.onboarding-panel {
  padding: var(--s-5);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
  box-shadow: var(--shadow-1);
}
.onboarding-panel h2 { font-size: var(--fs-20); }
.action-composer { padding: var(--s-4); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface-2); }
.composer-guide { color: var(--muted); font-size: var(--fs-12); }
.notification-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3) var(--s-4);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface-2);
  font-size: var(--fs-13);
}
.notice-list { margin: 0; padding-left: 1.1em; color: var(--ink-2); font-size: var(--fs-13); }

/* 认证页（登录 / MFA / step-up） */
.auth-stage { display: grid; place-items: center; padding-block: var(--s-8); }
.auth-surface { width: min(520px, 100%); padding: var(--s-6); border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow-2); }
.auth-emblem { display: inline-grid; place-items: center; width: 40px; height: 40px; margin-bottom: var(--s-3); border-radius: var(--r-sm); background: var(--mint-3); color: var(--mint-strong); font-weight: 700; }
.auth-statement { color: var(--ink-2); font-size: var(--fs-14); }
.auth-story { margin-top: var(--s-4); color: var(--muted); font-size: var(--fs-12); }

/* 认证页分栏（设计源 product-suite-v1 portal/#/login：45/55 左右分栏）
   --------------------------------------------------------------------------
   只加不改：旧 .auth-stage 单列版式保留给 MFA / step-up 等短流程页；
   登录页改用 .auth-split。左栏恒为深紫渐变（两主题共用），右栏随主题。 */
.auth-split {
  display: grid;
  grid-template-columns: minmax(320px, 45fr) minmax(420px, 55fr);
  min-height: calc(100vh - 68px - 34px);
  padding: 0;
  max-width: none;
  width: 100%;
}
.auth-split-panel {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--s-6);
  background:
    radial-gradient(720px 520px at 12% 92%, var(--login-panel-b), transparent 68%),
    radial-gradient(520px 380px at 78% 8%, rgba(244, 166, 215, .16), transparent 70%),
    linear-gradient(160deg, var(--login-panel-a), var(--login-panel-b));
  color: var(--login-panel-ink);
  isolation: isolate;
}
/* 网格 + 同心圆装饰（纯 CSS，不占布局、不接鼠标） */
.auth-split-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(120% 90% at 30% 20%, #000 30%, transparent 88%);
  opacity: .8;
  pointer-events: none;
}
.auth-split-panel::after {
  content: "";
  position: absolute;
  right: -18%;
  bottom: -26%;
  width: 78%;
  aspect-ratio: 1;
  z-index: -1;
  border-radius: 50%;
  border: 1px solid rgba(244, 166, 215, .20);
  box-shadow:
    0 0 0 46px rgba(185, 162, 255, .06),
    0 0 0 120px rgba(185, 162, 255, .045),
    0 0 0 220px rgba(143, 217, 190, .035);
  pointer-events: none;
  animation: auth-orbit 48s linear infinite;
}
@keyframes auth-orbit {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.auth-split-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  letter-spacing: -.02em;
  font-size: 15px;
  color: var(--login-panel-ink);
}
.auth-split-brand .brand-mark {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 800;
  background: var(--mint-2);
  color: #08221b;
}
.auth-split-brand small {
  display: block;
  font-family: var(--mono, ui-monospace);
  font-size: 9px;
  letter-spacing: .16em;
  opacity: .62;
  font-weight: 500;
}
.auth-split-copy { max-width: 30ch; }
.auth-split-copy h1 {
  font-size: clamp(30px, 3.2vw, 46px);
  line-height: 1.1;
  letter-spacing: -.035em;
  margin: 10px 0 14px;
  color: var(--login-panel-ink);
}
.auth-split-copy h1 em {
  font-style: normal;
  /* 深紫底上跳过紫色段：只走玉绿→粉，保证 4.5:1 以上可读 */
  background: linear-gradient(100deg, var(--mint-2) 0%, var(--pink-2) 92%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.auth-split-copy p {
  font-size: var(--fs-14);
  line-height: 1.75;
  color: color-mix(in oklab, var(--login-panel-ink) 74%, transparent);
}
.auth-split-points {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.auth-split-points li {
  position: relative;
  padding-left: 20px;
  font-size: var(--fs-13);
  line-height: 1.6;
  color: color-mix(in oklab, var(--login-panel-ink) 80%, transparent);
}
.auth-split-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .55em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--pink);
  box-shadow: 0 0 10px var(--glow-3);
}
.auth-split-foot {
  display: flex;
  justify-content: space-between;
  gap: var(--s-4);
  font-family: var(--mono, ui-monospace);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: color-mix(in oklab, var(--login-panel-ink) 48%, transparent);
  border-top: 1px solid rgba(198, 183, 255, .16);
  padding-top: 12px;
}
.auth-split-form {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(28px, 4vw, 56px) clamp(20px, 4vw, 48px);
  background: var(--bg);
}
.auth-split-form-inner {
  width: min(420px, 100%);
  display: grid;
  gap: var(--s-4);
}
/* 登录页左右栏入场（M9）：与公共站同一曲线，面板先、表单后 */
.auth-split-panel { animation: auth-rise 520ms cubic-bezier(.22, .61, .36, 1) both; }
.auth-split-form-inner > * { animation: auth-rise 520ms cubic-bezier(.22, .61, .36, 1) both; }
.auth-split-form-inner > :nth-child(1) { animation-delay: 60ms; }
.auth-split-form-inner > :nth-child(2) { animation-delay: 90ms; }
.auth-split-form-inner > :nth-child(3) { animation-delay: 120ms; }
.auth-split-form-inner > :nth-child(4) { animation-delay: 150ms; }
.auth-split-form-inner > :nth-child(5) { animation-delay: 180ms; }
.auth-split-form-inner > :nth-child(6) { animation-delay: 210ms; }
@keyframes auth-rise {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
.auth-split-form-inner > .eyebrow { color: var(--pink-text); }
.auth-split-form-inner h2 {
  font-size: var(--fs-32);
  letter-spacing: -.03em;
  line-height: 1.15;
}
.auth-split-form-inner .lead { color: var(--muted); font-size: var(--fs-13); line-height: 1.7; }
/* 主按钮：分栏内用品牌渐变 + sheen（M6） */
.auth-split-form-inner button[type="submit"] {
  position: relative;
  overflow: hidden;
  min-height: 44px;
  border-radius: var(--r-sm);
  font-weight: 600;
}
.auth-split-form-inner button[type="submit"]::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .32) 50%, transparent 65%);
  transform: translateX(-120%);
  animation: djb-sheen 2.6s ease-in-out infinite;
  pointer-events: none;
}
.auth-split-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: var(--fs-12);
}
.auth-split-sub {
  font-size: var(--fs-16);
  letter-spacing: -.02em;
  color: var(--ink);
  margin: 2px 0 -4px;
}
.auth-split-divider::before,
.auth-split-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line);
}
/* 窄屏退化单列；MFA / step-up 等短流程页保持旧单列 */
@media (max-width: 900px) {
  .auth-split { grid-template-columns: 1fr; min-height: 0; }
  .auth-split-panel { min-height: 240px; }
  .auth-split-panel::after { right: -40%; bottom: -60%; width: 90%; }
  .auth-split-copy h1 { font-size: 30px; }
  .auth-split-form { padding-block: var(--s-7); }
}

/* 其他页型 */
.page-identity { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-3); margin-bottom: var(--s-4); }
.flow-wrap, .error-wrap { padding-block: var(--s-7); }
.error-wrap h1 { font-size: var(--fs-32); }
.error-wrap .lead { margin-bottom: var(--s-4); }

/* 15. 动效与响应式 --------------------------------------------------------- */
/* 入场：只播一次，240–420ms；用 --reveal-delay 做同屏错峰 */
@keyframes rise {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
.reveal { animation: rise var(--t-enter) var(--ease) both; }
.reveal-2 { animation-delay: 90ms; }

@media (max-width: 1080px) {
  .hero-grid, .research-grid { grid-template-columns: minmax(0, 1fr); }
  .console-layout { grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }
  .subnav { position: static; }
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .platform-grid, .footer-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-inner { grid-template-columns: minmax(0, 1fr); gap: var(--s-5); }
}

@media (max-width: 820px) {
  body { font-size: var(--fs-16); }
  .section { padding-block: var(--s-7); }
  .grid-2, .grid-3, .grid-4, .kpi-grid, .kpi-grid-3,
  .task-dock, .provider-dock, .footer-nav, .platform-grid { grid-template-columns: minmax(0, 1fr); }
  .topbar-inner { flex-wrap: wrap; padding-block: var(--s-2); gap: var(--s-3); }
  .topbar { position: static; }
  .topbar-nav { order: 3; flex-basis: 100%; }
  .nav-group { flex: 1 1 100%; }
  .nav-group-label { display: none; }
  .nav-items { gap: var(--s-2); }
  .nav-items a { min-height: var(--hit-mobile); padding: 0 var(--s-2); }
  .topbar-actions { margin-left: auto; gap: var(--s-2); }
  .btn, .btn-sm, .btn-lg, .lang-switch, .status-chip { min-height: var(--hit-mobile); }
  .hero-actions .btn { flex: 1 1 100%; }
  h1 { font-size: var(--fs-32); }
  .hero-copy h1 { font-size: var(--fs-32); }
  .hero-lead { font-size: var(--fs-16); }
  .kpi-value { font-size: var(--fs-24); }
  .table-wrap { border-radius: var(--r-sm); }
  th, td { padding: 8px var(--s-3); }
}

/* 尊重系统偏好：所有动画与过渡一律关掉 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { animation: none; }
  .status-ok .dot, .status-warn .dot { animation: none; }
  .auth-split-panel::after { animation: none; }
  .auth-split-panel, .auth-split-form-inner > * { animation: none; }
  .auth-split-form-inner button[type="submit"]::after { animation: none; display: none; }
}

/* 打印：去掉阴影与动效，保证可读 */
@media print {
  .topbar, .site-footer, .skip-link { display: none; }
  body { background: #fff; }
  .card, .banner { box-shadow: none; }
}

/* ==========================================================================
   16. 公共站排版守卫
   pages.css（页面层）用 body.portal 前缀描述共享骨架，特异性高于本节之前的
   单类选择器；公共站的正文尺寸与左右留白在这里用同等特异性重申，
   只作用于 body.public（公共站），不影响控制台。
   ========================================================================== */
body.portal.public {
  font-size: var(--fs-16);
  line-height: 1.6;
}
body.portal.public .wrap {
  max-width: var(--grid-max);
  padding-inline: clamp(20px, 4.5vw, 80px);
}
body.portal.public .grid,
body.portal.public .grid-2,
body.portal.public .grid-3,
body.portal.public .grid-4 { gap: var(--s-4); }
body.portal.public .kpi-grid { gap: var(--s-3); }
body.portal.public .card { padding: var(--s-5); }
/* ≤820：表格不挤成竖条，改为容器内横向滚动（模型 ID / 状态列保持可读） */
@media (max-width: 820px) {
  body.portal.public .table-scroll > table { min-width: 640px; }
  body.portal.public .table-scroll { -webkit-overflow-scrolling: touch; }
}
body.portal.public .input,
body.portal.public input[type="text"], body.portal.public input[type="search"],
body.portal.public input[type="email"], body.portal.public input[type="number"],
body.portal.public input[type="password"], body.portal.public input[type="date"],
body.portal.public select, body.portal.public textarea { border-color: var(--line-3); }
/* 按钮：页面层把 .btn 当主按钮（40px 实心薄荷）；公共站要 44px 命中区 +
   主次分明，这里按设计系统重申一次。 */
body.portal.public .btn {
  min-height: var(--hit);
  padding: var(--s-2) var(--s-4);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  font-size: var(--fs-14);
  font-weight: 600;
}
body.portal.public .btn:hover { background: var(--surface-2); border-color: var(--violet-2); color: var(--ink); }
body.portal.public .btn-primary {
  min-height: var(--hit);
  padding: var(--s-3) var(--s-5);
  border-color: transparent;
  background: var(--mint-strong);
  color: var(--on-accent);
  font-size: var(--fs-14);
}
body.portal.public .btn-primary:hover { background: var(--mint-strong-hover); color: var(--on-accent); }
body.portal.public .btn-lg { min-height: var(--hit-mobile); padding: var(--s-3) var(--s-6); font-size: var(--fs-16); }
body.portal.public .btn-sm { min-height: var(--hit); padding: var(--s-1) var(--s-3); font-size: var(--fs-13); }
body.portal.public .btn-quiet { background: transparent; border-color: transparent; color: var(--ink-2); }
body.portal.public .btn-quiet:hover { background: var(--surface-2); color: var(--ink); }
@media (max-width: 820px) {
  body.portal.public .wrap { padding-inline: var(--s-4); }
}
@media print {
  body.portal.public .wrap { padding-inline: 0; }
}

/* ── 高对比（Windows 强制配色 / forced-colors）────────────────────────────
   系统性回退：不覆盖系统配色，只保证结构（按钮、卡片、表格、表单）仍然有边界，
   焦点环用系统 Highlight。设计稿的「高对比备用主题」是另一层能力，这里只做 OS 级适配。 */
@media (forced-colors: active) {
  .btn, .btn-primary, .card, .stat, .pill, input, select, textarea, table, th, td {
    border-color: CanvasText;
  }
  .btn-primary, .button-primary { background: Highlight; color: HighlightText; }
  :focus-visible { outline: 2px solid Highlight; outline-offset: 2px; }
}

/* ── 高对比备用主题（prefers-contrast: more）───────────────────────────────
   不是第二套配色：仍是 Daylight 语义，只把文本/边界推到更深，满足「高对比备用主题」
   这一设计承诺（forced-colors 是 OS 级回退，这里是我们自己的主题分支）。 */
@media (prefers-contrast: more) {
  :root {
    --ink: #00120F;
    --ink-2: #08201C;
    --muted: #2E4A45;
    --line: #8FA9A1;
    --line-2: #5F7A72;
    --line-3: #3F5A53;
    --mint-strong: #00463A;
    --mint-strong-hover: #00332A;
    --amber-text: #5A3E0C;
    --cyan-text: #164C63;
    --red: #8A2E27;
  }
  .btn, .card, input, select, textarea, table, th, td { border-width: 2px; }
  .btn:focus-visible, a:focus-visible { outline-width: 3px; }
}

/* ==========================================================================
   17. 双主题赛博层（Day / Night）· 2026-11-01
   验收口径：ops/uta/DESIGN-DUAL-THEME-2026-11-01.md
   --------------------------------------------------------------------------
   theme.css 给色板与动效原语（.ticker/.orbit/.ambient/.grid-bg/.reveal…），
   本节只做三件事：
     ① 补公共站自己的派生 token（theme.css 没有的第二层语义色）；
     ② 把公共站的语义变量接回主题（pages.css 的 --dl-* 只服务控制台）；
     ③ 给公共站加「质感层」：玻璃顶栏、光晕、轨道图、卡片描边。
   两套主题用同一套结构与同一组动效，只换颜色与光晕强度（alpha 差 ≤ .15）。
   ========================================================================== */

/* 17.1 派生 token ---------------------------------------------------------- */
/* 与主题无关的推导式：一处定义，两套主题各自成立（不写死第二套颜色）。 */
html:root {
  --mono: var(--font-mono);
  --mint-2: color-mix(in oklab, var(--mint) 78%, #fff);
  --mint-3: color-mix(in srgb, var(--mint) 16%, transparent);
  --mint-text: color-mix(in oklab, var(--mint) 88%, var(--ink));
  --cyan-text: color-mix(in oklab, var(--cyan) 86%, var(--ink));
  --line-3: color-mix(in srgb, var(--ink) 55%, transparent);   /* 兜底：theme.css 载入更晚，规范值以 theme.css 为准 */
  --mint-strong-hover-fallback: var(--mint);
  --shadow-1: var(--shadow);
  --shadow-2: var(--shadow);
  --glass: color-mix(in srgb, var(--surface) 78%, transparent);
  --hairline: color-mix(in srgb, var(--ink) 10%, transparent);
  --accent-wash: color-mix(in srgb, var(--mint) 8%, transparent);
  --accent-line: color-mix(in srgb, var(--mint) 45%, transparent);
  --warn-tint: color-mix(in srgb, var(--amber) 16%, transparent);
  --bad-tint: color-mix(in srgb, var(--red) 16%, transparent);
  /* 品牌渐变：玉绿→紫→粉（§1.1；theme.css 载入更晚，以规范字面值 --brand-grad 为准） */
  --brand-grad: linear-gradient(120deg, var(--mint) 0%, var(--violet) 58%, var(--pink) 100%);
  --edge-grad: linear-gradient(90deg, var(--mint), var(--violet) 52%, var(--pink) 86%, transparent);
}

/* 需要「一套主题一组值」的少数几个（其余全部由 theme.css 的 token 推导）：
   night = 默认分支（theme.css 无 data-theme 时就是夜色）。 */
html:root {
  --mint-strong: #C9F5E5;          /* 夜色玉绿：实心按钮底/强调文字（§1.1） */
  --mint-strong-hover: #A5E4CC;    /* 悬停 = --mint-hover */
  --on-accent: #08221B;            /* 压在主色实心上的字（--btn-ink） */
  --amber: #F0C56B;                /* 等待/同步（状态色，不参与紫粉轮换） */
  --amber-text: #F7DCA6;
  --red: #FF9B93;                  /* 真失败/危险（状态色） */
  --red-text: #FFC4BF;
}
html:root[data-theme="day"] {
  --mint-strong: #256B57;          /* 白字 5.68:1（§1.1） */
  --mint-strong-hover: #2A735E;
  --on-accent: #FFFFFF;
  --amber: #9A6A16;
  --amber-text: #8A5D12;
  --red: #B94F47;
  --red-text: #A84540;
}
@media (prefers-color-scheme: light) {
  html:root:not([data-theme]) {
    --mint-strong: #256B57;
    --mint-strong-hover: #2A735E;
    --on-accent: #FFFFFF;
    --amber: #9A6A16;
    --amber-text: #8A5D12;
    --red: #B94F47;
    --red-text: #A84540;
  }
}

/* 17.2 公共站语义变量接回主题 --------------------------------------------- */
body.portal.public {
  --fg: var(--ink);
  --panel: var(--surface);
  --border: var(--line-2);
  --brand: var(--mint);
  --brand-2: var(--mint-2);
  --brand-soft: var(--mint-3);
  --on-brand: var(--on-accent);
  --ok: var(--mint-strong);
  --ok-soft: var(--mint-3);
  --warn: var(--amber);
  --warn-soft: var(--warn-tint);
  --danger: var(--red);
  --danger-soft: var(--bad-tint);
  --dl-link: var(--mint-strong);
  --dl-link-hover: var(--violet-text);          /* §2.1-2：hover 转紫 */
  --dl-link-line: var(--accent-line);
  --dl-select-bg: color-mix(in srgb, var(--violet) 26%, transparent);   /* §2.1-3：选中底紫 */
  --dl-surface-hover: var(--surface-2);
  --dl-surface-unread: color-mix(in srgb, var(--pink) 8%, transparent); /* §2.2-4：未读底粉 */
  --dl-skeleton-a: var(--surface-2);
  --dl-skeleton-b: var(--bg-2);
  /* 底色交给 <html>：body 必须透明，负层的环境光斑与网格才看得见 */
  background-color: transparent;
  color: var(--ink);
}

/* 背景层：两套主题都在动（M3/M4），夜色只是光晕更亮 */
body.portal.public .ambient::before,
body.portal.public .ambient::after,
body.portal.public .ambient > i {
  filter: blur(42px);
}
body.portal.public .grid-bg { opacity: .9; }

/* 17.3 顶栏与 ticker ------------------------------------------------------- */
body.portal.public .topbar {
  background: color-mix(in srgb, var(--bg) 74%, transparent);
  border-bottom: 1px solid var(--line);
  backdrop-filter: saturate(1.5) blur(16px);
  box-shadow: 0 1px 0 var(--hairline), 0 20px 44px -36px var(--glow);
}
body.portal.public .brand-mark {
  background: var(--brand-grad);
  color: var(--on-accent);
  box-shadow: 0 0 0 1px var(--line-2), 0 8px 22px -12px var(--glow);
}
body.portal.public .nav-group-label { display: none; }
body.portal.public .topbar-nav { align-items: center; gap: var(--s-4); }
body.portal.public .nav-items a { min-height: 32px; }
/* 当前项：玉绿→紫渐变下划线（§2.1-1）。文字不加 text-shadow（§2.5 正文不发光）。 */
body.portal.public .nav-items a[aria-current="page"] {
  color: var(--ink);
  border-bottom-color: transparent;
  background-image: linear-gradient(90deg, var(--mint), var(--violet));
  background-repeat: no-repeat;
  background-size: 100% 2px;
  background-position: 0 100%;
}
body.portal.public .nav-items a:hover {
  color: var(--violet-text);
  border-bottom-color: var(--violet);
}
body.portal.public .ticker {
  background: color-mix(in srgb, var(--bg-2) 82%, transparent);
  border-bottom: 1px solid var(--line);
}
body.portal.public .status-chip {
  background: color-mix(in srgb, var(--surface) 72%, transparent);
}
/* 主题切换按钮：pages.css 的 body.portal button 会把它涂成薄荷实心，
   公共站要的是「玻璃胶囊」，这里整块重申（含文字色与描边）。 */
body.portal.public .theme-toggle {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--surface) 74%, transparent);
  color: var(--ink-2);
  font-size: var(--fs-12);
  font-weight: 600;
}
body.portal.public .theme-toggle:hover {
  border-color: var(--mint);
  color: var(--ink);
  box-shadow: 0 0 0 3px var(--glow);
}
body.portal.public .theme-toggle:active { transform: scale(.97); }

/* 17.4 Hero 与轨道图 ------------------------------------------------------- */
body.portal.public .hero {
  position: relative;
  padding-block: clamp(28px, 4.6vw, 56px) clamp(20px, 3.4vw, 36px);
  background:
    radial-gradient(120% 100% at 10% -20%, var(--glow-2) 0%, transparent 58%),
    radial-gradient(80% 70% at 92% -10%, var(--glow-3) 0%, transparent 60%);
}
/* 只在宽屏保留两栏：这条规则特异性高于 §15 的 `.hero-grid` 收窄，
   不套媒体查询会把 390 的「单栏」重新顶回两栏（横向溢出 53px）。 */
@media (min-width: 1081px) {
  body.portal.public .hero-grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  }
}
body.portal.public .hero-grid {
  gap: clamp(24px, 3.4vw, 48px);
  align-items: center;
}
body.portal.public .hero-copy h1 { letter-spacing: -.03em; }
body.portal.public .hero-accent {
  /* 渐变要能整段走完绿→紫→粉：块级盒缩到文字宽（不改变行内断行，仍是独立一行）。 */
  width: fit-content;
  max-width: 100%;
  background: var(--brand-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
body.portal.public .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  padding: 4px 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--surface) 66%, transparent);
  color: var(--ink-2);
}
body.portal.public .hero-visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-5);
  min-width: 0;
}
body.portal.public .hero-panel { width: min(390px, 100%); }
body.portal.public .orbit { width: min(340px, 100%); }
/* 轨道图加一层内辉光 + 外圈霓虹描边，两套主题只是强度不同 */
body.portal.public .orbit::before {
  content: "";
  position: absolute;
  inset: 6%;
  border-radius: 50%;
  background: radial-gradient(circle, var(--accent-wash), transparent 68%);
}
body.portal.public .orbit-ring { border-color: var(--accent-line); }
body.portal.public .orbit-ring:nth-child(3) { border-color: color-mix(in srgb, var(--violet) 42%, transparent); }
body.portal.public .orbit-ring:nth-child(1) { border-style: dashed; opacity: .55; }
/* 外圈霓虹不用 .orbit-ring 做：它不是圆（border-radius 不改变元素盒），
   旋转后的外接方框 = 边长×1.414，340px 的环会顶出 470px → 390 上横向溢出。
   改成静态伪元素，尺寸不随动画膨胀。 */
body.portal.public .orbit::after {
  content: "";
  position: absolute;
  inset: -2%;
  border: 1px solid color-mix(in srgb, var(--mint) 34%, transparent);
  border-radius: 50%;
  opacity: .55;
  pointer-events: none;
}
body.portal.public .orbit-dot {
  width: 9px;
  height: 9px;
  background: var(--dot-ink, var(--mint));
  box-shadow: 0 0 14px var(--dot-glow, var(--glow)),
              0 0 0 3px color-mix(in srgb, var(--dot-ink, var(--mint)) 16%, transparent);
}
body.portal.public .orbit-dot:nth-of-type(1) { --dot-ink: var(--mint); --dot-glow: var(--glow); }
body.portal.public .orbit-dot:nth-of-type(2) { --dot-ink: var(--violet); --dot-glow: var(--glow-2); }
body.portal.public .orbit-dot:nth-of-type(3) { --dot-ink: var(--pink); --dot-glow: var(--glow-3); }
body.portal.public .orbit-core {
  align-content: center;
  gap: 2px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: .12em;
  text-align: center;
}
body.portal.public .orbit-core small {
  display: block;
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .18em;
}
body.portal.public .orbit-label {
  position: absolute;
  padding: 3px 8px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  color: var(--mint-text);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .14em;
  white-space: nowrap;
  box-shadow: 0 0 0 1px var(--accent-wash);
}
body.portal.public .orbit-label-1 { top: 0; left: 50%; transform: translateX(-50%); }
body.portal.public .orbit-label-2 { top: 52%; right: -2%; }
body.portal.public .orbit-label-3 { bottom: 4%; left: -2%; }
body.portal.public .hero-panel {
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  border-color: var(--line-2);
  backdrop-filter: blur(12px);
  box-shadow: var(--shadow-1), inset 0 1px 0 var(--hairline);
}

/* 17.5 卡片 / KPI / 表格：加一层极薄的薄荷光，白天也有质感 ----------------- */
body.portal.public .card {
  position: relative;
  background-color: var(--surface);
  background-image:
    linear-gradient(160deg, var(--accent-wash), transparent 46%),
    radial-gradient(120% 90% at 100% 0%, color-mix(in srgb, var(--violet) 8%, transparent), transparent 62%);
  border-color: var(--line);
  box-shadow: var(--shadow-1);
}
body.portal.public .card > h2:first-child::after,
body.portal.public .card > h3:first-child::after {
  content: "";
  display: block;
  width: 34px;
  height: 2px;
  margin-top: var(--s-2);
  border-radius: 2px;
  background: var(--edge-grad);
  opacity: .8;
}
body.portal.public .kpi { position: relative; overflow: hidden; }
/* 只换字体与字距：字号交给 §7 的 .kpi-value / .kpi-value-sm，
   否则时间戳这类长值会被顶到 32px 撑破卡片。 */
body.portal.public .kpi-value {
  font-family: var(--mono);
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
}
body.portal.public .kpi-value code { font-size: inherit; }
body.portal.public .kpi::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 2px;
  background: linear-gradient(90deg, var(--mint), var(--violet) 48%, transparent 86%);
  opacity: .6;
}
body.portal.public .section-alt {
  border-block: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg-2) 78%, transparent);
}
body.portal.public .section-head h2 { letter-spacing: -.02em; }
body.portal.public .kicker { color: var(--violet-text); }

/* 17.6 模板里用到的公共站组件类（此前没有规则，裸渲染） ------------------- */
.page-home { display: block; }
.research-body {
  display: grid;
  gap: var(--s-3);
  align-content: start;
  color: var(--ink-2);
}
.research-body ul, .research-body ol { margin: 0; padding-left: 1.15em; }
.research-body li { margin: 0 0 var(--s-1); }
.live-grid { align-items: stretch; }
.live-grid > * { min-width: 0; }

.promise-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  overflow: hidden;
  padding: var(--s-5);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
  box-shadow: var(--shadow-1);
}
.promise-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: var(--edge-grad);
}
.promise-card h3 { margin: 0; font-size: var(--fs-20); }
.promise-card p { margin: 0; color: var(--ink-2); }

.nav-items-flat { gap: var(--s-4); align-items: center; }
.nav-items-flat a { font-size: var(--fs-14); }

.pill-wait {
  border-color: color-mix(in srgb, var(--amber) 34%, var(--line));
  background: var(--warn-tint);
  color: var(--amber-text);
}
.pill-wait::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--amber);
  box-shadow: 0 0 8px var(--glow-2);
  animation: djb-pulse 2s ease-in-out infinite;
}

.txid {
  font-family: var(--mono);
  font-size: var(--fs-13);
  color: var(--ink-2);
  word-break: break-all;
}

/* 证据折叠条：pages.css 给 details.evidence > summary 写死了 rgba(255,255,255,.6)
   （控制台的浅色口径），公共站在夜色下会变成一条亮灰条 → 这里按主题重申。 */
body.portal.public details.evidence > summary {
  border-color: var(--line-2);
  background: color-mix(in srgb, var(--surface) 68%, transparent);
  color: var(--ink-2);
}
body.portal.public details.evidence > summary:hover { background: var(--surface-2); }
body.portal.public details.evidence {
  border-color: var(--line);
  background: color-mix(in srgb, var(--surface-2) 80%, transparent);
}

/* 定价页的分成条：两段都用主题薄荷（原先是 ink-2 + mint-strong，
   夜色下两块都是近白色，看不出 15/85 的分界）。 */
body.portal.public .split-platform {
  background: color-mix(in srgb, var(--mint) 22%, var(--surface-2));
  color: var(--ink);
}
body.portal.public .split-provider {
  background: var(--mint-strong);
  color: var(--on-accent);
}

/* M10 的 reveal 用 fill-mode:both 会一直保持末帧 transform，
   把 theme.css 里 .card:hover 的 translateY(-2px) 永久压住（悬停不抬升）。
   末帧本来就等于静止态，改成 backwards 即可两全。 */
body.portal.public .reveal,
body.portal.public .section,
body.portal.public .card {
  animation-fill-mode: backwards;
}

/* 17.7 内页版式：不留大片空白 --------------------------------------------- */
body.portal.public .page-document {
  padding-block: clamp(24px, 3.4vw, 44px) var(--s-8);
}
body.portal.public .page-document > * + * { margin-top: var(--s-5); }
body.portal.public .page-head h1 { letter-spacing: -.03em; }
body.portal.public .page-head .lead { color: var(--ink-2); }
body.portal.public .page-document > section.card { padding: var(--s-6); }
@media (max-width: 820px) {
  body.portal.public .page-document > section.card { padding: var(--s-5); }
}

/* 17.8 页脚：与顶栏同一种玻璃质感 ----------------------------------------- */
body.portal.public .site-footer {
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  border-top: 1px solid var(--line);
  box-shadow: 0 -1px 0 var(--hairline), 0 -24px 48px -40px var(--glow);
}
body.portal.public .footer-col a:hover,
body.portal.public .footer-meta a:hover { color: var(--violet-text); }

/* 17.9 无障碍与降级 ------------------------------------------------------- */
/* 渐变字在强制配色下会整段消失 → 退回普通文字色 */
@media (forced-colors: active) {
  body.portal.public .hero-accent {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: CanvasText;
  }
}
/* 减少动效：装饰层（光斑/网格/轨道）停下，信息层照旧可读 */
@media (prefers-reduced-motion: reduce) {
  body.portal.public .grid-bg,
  body.portal.public .ambient::before,
  body.portal.public .ambient::after,
  body.portal.public .ambient > i,
  body.portal.public .orbit-ring,
  body.portal.public .orbit-dot,
  body.portal.public .promise-card::before { animation: none; }
}
@media print {
  body.portal.public .ambient,
  body.portal.public .grid-bg,
  body.portal.public .orbit { display: none; }
  body.portal.public .card { box-shadow: none; background-image: none; }
}

/* 图形验证码（防撞库）：cloud 回 captcha_required 时才渲染整块 */
.captcha-field .captcha-row{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-2)}
.captcha-field .captcha-img{display:inline-flex;align-items:center;justify-content:center;
  min-width:132px;min-height:44px;padding:4px 8px;border:1px solid var(--line);
  border-radius:var(--r-2,6px);background:#fff}
.captcha-field .captcha-img svg{display:block;max-width:100%;height:auto}
.captcha-field .captcha-refresh{font-size:var(--fs-13);color:var(--mint);text-decoration:none;
  border-bottom:1px dotted currentColor}
.captcha-field .captcha-refresh:hover,.captcha-field .captcha-refresh:focus-visible{color:var(--ink)}

/* ── 登录失败弹窗（2026-11-05 主人：报错就用浮层说一句白话，别在表单里堆说明）
   容器 pointer-events:none：浮层不挡下面的表单，用户可以直接改了重试；
   卡片自己 pointer-events:auto，里面的「重新输入」按钮可点。 ───────────────── */
.auth-dialog {
  position: fixed;
  inset-inline: 0;
  top: clamp(16px, 6vh, 72px);
  z-index: 90;
  display: flex;
  justify-content: center;
  padding: 0 16px;
  pointer-events: none;
}
.auth-dialog-card {
  pointer-events: auto;
  width: min(420px, 100%);
  display: grid;
  gap: 10px;
  padding: 18px 18px 16px;
  border-radius: 14px;
  border: 1px solid color-mix(in oklab, var(--red) 34%, var(--line));
  border-left: 3px solid var(--red);
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 18px 48px rgba(10, 8, 24, .28);
  animation: auth-dialog-in 220ms cubic-bezier(.22, .61, .36, 1) both;
}
.auth-dialog-kicker {
  margin: 0;
  font-family: var(--mono, ui-monospace);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: color-mix(in oklab, var(--red) 70%, var(--ink));
}
.auth-dialog-msg {
  margin: 0;
  font-size: 17px;
  line-height: 1.45;
  font-weight: 600;
}
.auth-dialog-close {
  justify-self: start;
  margin-top: 2px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.auth-dialog-close:hover,
.auth-dialog-close:focus-visible { border-color: var(--ink); }
@keyframes auth-dialog-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .auth-dialog-card { animation: none; } }

/* ── UX-20261106 热修复（lead 2026-11-06）─────────────────────────────
   ① 390 下登录页左栏占掉首屏 698px，把表单推到 y≈979（首屏 0 个输入框）。
      窄屏只留表单，品牌在顶栏已有。② 控件边界对比度 1.58:1 → --line-3
      （WCAG 1.4.11 要求 3:1）。只动控件，不动装饰性分隔线。 */
@media (max-width: 600px) {
  .auth-split-panel { display: none; }
  .auth-split { min-height: 0; }
}
input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
select, textarea { border-color: var(--line-3); }
.btn:not(.btn-primary):not(.btn-sell):not(.btn-quiet) { border-color: var(--line-3); }

/* 390 顶栏一行塞不下 5 个动作的溢出问题未在本次热修解决：根因在 brand.css / pages.css
   的顶栏断点（品牌层），需要改源文件而非在 portal.css 里加 !important。见 REPORT §3.1 P1-08。 */

/* 2026-11-06：页脚兜底分支（footer_groups 为空时）把全站 9 个入口竖排成一列，
   比旁边几列高出一大截，视觉上像条尾巴。桌面改两列，窄屏保持单列。 */
/* 所有宽度都两列：窄屏单列时 9 项竖排要滚很久，正是主人反馈的"太长"。 */
.footer-col ul.footer-nav-grid {
  display: grid;                                   /* 盖住 .footer-col ul 的默认块级流 */
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 24px;
}
@media (max-width: 600px) {
  .footer-col ul.footer-nav-grid { column-gap: 12px; }
  .footer-col ul.footer-nav-grid a { font-size: var(--fs-13); min-height: 28px; }
}

/* 2026-11-06：登录按钮正下方的注册入口，给一点点存在感（不要抢主按钮的注意力） */
.auth-register-hint { margin: 10px 0 0; }
.auth-register-hint a { font-weight: 600; }