/* ---
 * generated_by: builtin:bigmodel-coding-plan/GLM-5.3
 * generated_at: 2026-10-08
 * core_logic: #page-invite 邀请落地页（FRIENDS F2）页面级布局——出生表单字段组/城市搜索
 *   结果列表/状态与错误行/joined 双列 Big Three 与三条相位。横幅视觉全复用 home.css 的
 *   .home-eros 全局类（水彩晕染+贴纸+人物舞台），本文件零横幅样式；令牌全取
 *   styles/tokens.css（纸墨/苔绿/陶锈），形态镜像 birth-edit.css（be-* 同构 iv-*）。
 *   红线：零 prefers-reduced-motion 分支（全站约定）。
 * --- */

#page-invite .iv-form {
  display: flex;
  flex-direction: column;
  gap: var(--reflect-space-16, 16px);
  margin-top: var(--reflect-space-16, 16px);
  max-width: 560px;
}

#page-invite .iv-field {
  display: flex;
  flex-direction: column;
  gap: var(--reflect-space-4, 4px);
}

#page-invite .iv-field > label {
  font-family: var(--reflect-sans);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--reflect-ink-soft);
}

#page-invite .iv-field > input[type="date"],
#page-invite .iv-field > input[type="time"],
#page-invite .iv-field > input[type="text"] {
  font-family: var(--reflect-sans);
  font-size: 16px;
  color: var(--reflect-ink);
  background: var(--reflect-paper-light);
  border: 1px solid var(--reflect-line);
  border-radius: var(--reflect-radius-md, 8px);
  padding: 12px 14px;
  min-height: 44px; /* 触控目标 */
  width: 100%;
}

#page-invite .iv-field > input:focus-visible {
  outline: 2px solid var(--reflect-moss);
  outline-offset: 2px;
}

#page-invite .iv-field-status {
  margin: 0;
  font-family: var(--reflect-sans);
  font-size: 12px;
  color: var(--reflect-ink-soft);
  min-height: 16px;
}

#page-invite .iv-place-results {
  display: flex;
  flex-direction: column;
  background: var(--reflect-paper-light);
  border: 1px solid var(--reflect-line);
  border-radius: var(--reflect-radius-md, 8px);
  overflow: hidden;
}

#page-invite .iv-place-results[hidden] { display: none; }

#page-invite .iv-place-results button {
  font-family: var(--reflect-sans);
  font-size: 14px;
  color: var(--reflect-ink);
  text-align: left;
  background: none;
  border: none;
  border-bottom: 1px solid var(--reflect-line);
  padding: 10px 14px;
  min-height: 40px;
  cursor: pointer;
}

#page-invite .iv-place-results button:last-child { border-bottom: none; }

#page-invite .iv-place-results button:hover,
#page-invite .iv-place-results button:focus-visible {
  background: var(--reflect-moss-pale);
}

#page-invite .iv-field-error {
  margin: 0;
  font-family: var(--reflect-sans);
  font-size: 13px;
  color: var(--reflect-rust-deep, var(--reflect-rust));
}

#page-invite .iv-field-error[hidden] { display: none; }

#page-invite .iv-free {
  font-size: 13px;
  color: var(--reflect-ink-soft);
}

#page-invite .iv-privacy {
  max-width: 560px;
  font-size: 13px;
  color: var(--reflect-ink-soft);
}

#page-invite .iv-note {
  margin: var(--reflect-space-8, 8px) 0 0;
  font-family: var(--reflect-sans);
  font-size: 14px;
  color: var(--reflect-rust-deep, var(--reflect-rust));
}

#page-invite .iv-note[hidden] { display: none; }

/* joined：双方 Big Three 并排（窄屏自然换列）+ 三条相位 + 双入口 */
#page-invite .iv-joined-three {
  display: flex;
  flex-wrap: wrap;
  gap: var(--reflect-space-16, 16px);
  margin-top: var(--reflect-space-8, 8px);
}

#page-invite .iv-joined-col {
  flex: 1 1 220px;
  max-width: 560px;
}

#page-invite .iv-aspect-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--reflect-space-4, 4px);
  max-width: 560px;
}

#page-invite .iv-aspect-list .compare-aspect {
  font-family: var(--reflect-sans);
  font-size: 14px;
  color: var(--reflect-ink);
  background: var(--reflect-paper-light);
  border: 1px solid var(--reflect-line);
  border-radius: var(--reflect-radius-md, 8px);
  padding: 8px 12px;
}

#page-invite .iv-joined-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--reflect-space-12, 12px);
  margin: var(--reflect-space-16, 16px) 0;
}