/* 移动端优先：微信浏览器内打开，大按钮大字号 */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", sans-serif;
  background: #f2f3f7; color: #1f2329; font-size: 17px; line-height: 1.6;
}
.wrap { max-width: 640px; margin: 0 auto; padding: 20px 16px 48px; }

/* ---------- 对外页（宣传/问卷/结果） ---------- */
.hero {
  background: linear-gradient(135deg, #2b5cff, #6a3df0);
  color: #fff; border-radius: 16px; padding: 28px 22px; text-align: center;
}
.hero h1 { font-size: 26px; line-height: 1.35; margin-bottom: 12px; }
.card { background: #fff; border-radius: 16px; padding: 22px; margin-top: 16px; box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.promo-body p { margin-bottom: 10px; color: #333; }
.qr-box { text-align: center; }
.qr-box img { width: 230px; height: 230px; border: 1px solid #eee; border-radius: 12px; padding: 8px; background:#fff; }
.qr-hint { color: #888; font-size: 14px; margin-top: 8px; }
.btn {
  display: block; width: 100%; text-align: center; text-decoration: none; border: none; cursor: pointer;
  background: #2b5cff; color: #fff; font-size: 20px; font-weight: 600;
  padding: 16px; border-radius: 12px; margin-top: 16px;
}
.btn:active { opacity: .85; }
.btn.small { font-size: 15px; padding: 8px 14px; width: auto; display: inline-block; margin-top: 0; }
.btn.gray { background: #8a8f99; }
.btn.red { background: #d64545; }

.q-item { margin-bottom: 22px; }
.q-title { font-size: 18px; font-weight: 600; margin-bottom: 10px; }
.q-title .req { color: #d64545; margin-left: 4px; }
.opt {
  display: block; background: #f6f7fb; border: 2px solid transparent; border-radius: 12px;
  padding: 14px 16px; margin-bottom: 10px; font-size: 17px; cursor: pointer;
}
.opt input { margin-right: 10px; transform: scale(1.3); }
.opt:has(input:checked) { border-color: #2b5cff; background: #eef3ff; }
.text-input, textarea, select {
  width: 100%; font-size: 17px; padding: 12px 14px; border: 1px solid #d5d8e0; border-radius: 10px;
  background: #fff; font-family: inherit;
}
.text-input:focus, textarea:focus { outline: 2px solid #2b5cff; border-color: #2b5cff; }
.hp { position: absolute; left: -9999px; height: 0; overflow: hidden; } /* 蜜罐：用户不可见 */
.error-box { background: #fdecec; color: #b33232; border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; }
.ok-box { background: #e8f7ee; color: #1c7c3e; border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; }

.result-icon { font-size: 52px; text-align: center; }
.result-title { text-align: center; font-size: 22px; font-weight: 700; margin: 8px 0 4px; }
.result-sub { text-align: center; color: #777; font-size: 15px; }
.wechat-id { text-align: center; font-size: 19px; font-weight: 600; margin-top: 10px; }

.neutral { text-align: center; padding-top: 80px; color: #555; }
.neutral h1 { font-size: 22px; margin-bottom: 10px; }

/* ---------- 后台 ---------- */
.nav {
  background: #1f2329; color: #fff; padding: 12px 16px; display: flex; flex-wrap: wrap; gap: 4px 14px;
  align-items: center; font-size: 15px; position: sticky; top: 0; z-index: 9;
}
.nav a { color: #cfd6e4; text-decoration: none; padding: 6px 4px; }
.nav a:hover { color: #fff; }
.nav .who { margin-left: auto; color: #8a93a6; font-size: 13px; }
.page { max-width: 960px; margin: 0 auto; padding: 18px 14px 60px; }
.page h2 { font-size: 20px; margin: 14px 0 12px; }
.panel { background: #fff; border-radius: 12px; padding: 16px; margin-bottom: 18px; box-shadow: 0 1px 6px rgba(0,0,0,.05); }
.panel h3 { font-size: 17px; margin-bottom: 12px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 14px; white-space: nowrap; }
th, td { text-align: left; padding: 10px 8px; border-bottom: 1px solid #eef0f4; }
th { color: #8a8f99; font-weight: 500; }
tr:hover td { background: #fafbfd; }
.badge { display: inline-block; background: #eef3ff; color: #2b5cff; border-radius: 999px; padding: 2px 10px; font-size: 13px; }
.badge.tag { background: #e8f7ee; color: #1c7c3e; }
.badge.off { background: #f1f1f1; color: #999; }
.form-row { margin-bottom: 12px; }
.form-row label { display: block; font-size: 14px; color: #666; margin-bottom: 4px; }
.form-inline { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.form-inline .form-row { margin-bottom: 0; }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.stat { background: #fff; border-radius: 12px; padding: 16px; text-align: center; box-shadow: 0 1px 6px rgba(0,0,0,.05); }
.stat .num { font-size: 28px; font-weight: 700; color: #2b5cff; }
.stat .lbl { color: #888; font-size: 13px; }
.login-box { max-width: 380px; margin: 90px auto; background: #fff; border-radius: 14px; padding: 28px 24px; box-shadow: 0 4px 20px rgba(0,0,0,.08); }
.login-box h1 { font-size: 20px; text-align: center; margin-bottom: 18px; }
.muted { color: #999; font-size: 13px; }
.qr-thumb { width: 64px; height: 64px; border-radius: 8px; border: 1px solid #eee; }
a.link { color: #2b5cff; text-decoration: none; }
.answers dt { font-weight: 600; margin-top: 10px; }
.answers dd { background: #f6f7fb; border-radius: 8px; padding: 8px 12px; margin-top: 4px; }
