/* 各页样式（原本是 pages/xxx/index.wxss）
 * 小程序里每个页面的 wxss 是独立作用域，
 * 网页里我们合成一个文件，靠页面根节点的 class 来区分。
 */


/* ===== auth ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */


/* ===== form ===== */
/* 自动换算卡片 */
.card.auto {
  margin: 0; padding: 16px;
  background: #FDF3E0; border-color: #F5E2BF;
}
.arow { display: flex; align-items: baseline; gap: 10px; }
.ak { font-size: 12.5px; color: #A9752A; flex: 0 0 65px; }
.av { font-size: 16px; color: #7A4A18; font-weight: 600; }
.adesc { font-size: 12px; color: #A9752A; line-height: 1.8; margin-top: 2px; padding-left: 75px; }


/* ===== friend ===== */
.card.match { text-align: center; background: #FDF6F3; border-color: #F6D5CB; }
.mh { font-size: 14px; color: #8A4A32; margin-bottom: 4px; }
.mnum { font-size: 38px; font-weight: 600; color: #E8785C; line-height: 1.2; }
.mnum text { font-size: 16px; }
.mbar { height: 6px; background: #F7F2EB; border-radius: 3px; overflow: hidden; margin: 10px 0 14px; }
.mbar i { display: block; height: 100%; background: linear-gradient(90deg,#F2A03C,#E8785C); border-radius: 3px; }
.mdim { display: flex; justify-content: space-between; align-items: baseline; padding: 5px 0; }
.mname { font-size: 12.5px; color: #8A7F75; flex: 0 0 60px; }
.mtext { font-size: 12.5px; color: #5A4C42; flex: 1; text-align: right; }


/* ===== friend-edit ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */


/* ===== friend-invite ===== */
/* 邀请页专用：这一页要的就是「一条横排的清单」，跟别处的卡片列表不太一样 */

.card.row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 17px;
}

.arow-t {
  font-size: 14px;
  font-weight: 600;
  color: #3D3630;
}

.arow-v {
  font-size: 12.5px;
  color: #B5AA9E;
  flex: 0 0 auto;
}

.card.center {
  text-align: center;
  padding: 28px 20px;
}

.card.center .fh {
  margin-bottom: 0;
}

/* 回执码预览：等宽字体 + 浅底，看起来像一段「机器说的话」 */
.codebox {
  font-family: Menlo, Consolas, monospace;
  font-size: 11px;
  line-height: 1.7;
  color: #8A7F75;
  background: #F7F2EB;
  border-radius: 6px;
  padding: 10px 11px;
  word-break: break-all;
}

/* 「新增 12 条」这种一行一行的结果 */
.arow {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 6px 0;
  border-bottom: 0.5px solid #F3EDE4;
}

.arow:last-child {
  border-bottom: none;
}

.ak {
  font-size: 13px;
  color: #5A4C42;
}

.av {
  font-size: 13px;
  color: #B5AA9E;
}

/* ===== gender ===== */
.gopt { font-size: 17px; padding: 14px 34px; }


/* ===== home ===== */
.banner {
  background: #FDF3E0; border: 0.5px solid #F5E2BF;
  border-radius: 16px; padding: 16px; margin-bottom: 14px;
}
.bfh { font-size: 13.5px; color: #A9752A; margin-bottom: 8px; }
.bf { display: flex; justify-content: space-between; align-items: baseline; padding: 4px 0; }
.bn { font-size: 14.5px; color: #7A4A18; }
.bd { font-size: 12.5px; color: #A9752A; }
.fh { font-size: 14px; font-weight: 600; margin-bottom: 12px; }


/* ===== launch ===== */
.launch {
  min-height: 100vh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  background: #FFFBF6;
}
.logo {
  font-family: 'Songti SC', 'STSong', serif;
  font-size: 44px; font-weight: 700; color: #E8785C;
  letter-spacing: .1em; margin-bottom: 12px;
}
.sub { font-size: 13.5px; color: #B5AA9E; }


/* ===== lead-in ===== */
.leadin { display: flex; flex-direction: column; min-height: 78vh; justify-content: center; }
.leadbox { padding: 8px 0; }
.leadline {
  font-size: 16px; line-height: 2.3; color: #5A463C; text-align: center;
  opacity: 0; transform: translateY(10px); transition: opacity .9s ease, transform .9s ease;
  font-family: 'Songti SC', 'STSong', serif;
}
.leadline.in { opacity: 1; transform: translateY(0); }


/* ===== parallel ===== */
/* 平行世界整幅卡片 */
.pwbox {
  position: relative; border-radius: 24px; overflow: hidden;
  min-height: 520px; padding: 30px 22px 26px; color: #fff;
  box-shadow: 0 8px 30px rgba(60,45,50,.18);
}
.pwart { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; }
.pwimg { width: 100%; height: 100%; display: block; }
.pwveil { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; }
.pwbody { position: relative; z-index: 2; }

.pwtop { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.pwho { font-size: 11.5px; color: rgba(255,255,255,.8); }
.pswap {
  font-size: 11px; padding: 5px 13px; border-radius: 499.5px;
  background: rgba(255,255,255,.2); border: 0.5px solid rgba(255,255,255,.3); color: #fff;
}

.pwtitle {
  font-family: 'Songti SC', 'STSong', serif; font-style: italic;
  font-size: 25px; font-weight: 700; letter-spacing: .03em; margin-bottom: 9px;
}
.pwlabel {
  display: inline-block; font-size: 11px; letter-spacing: .16em;
  padding: 5px 16px; border-radius: 499.5px; margin-bottom: 26px;
}

.pl {
  text-align: center; font-size: 14.5px; line-height: 2.1; margin-bottom: 4px;
  opacity: 0; transition: opacity .7s;
}
.pl.in { opacity: 1; }

.pwend {
  margin-top: 24px; border-radius: 16px; padding: 18px; text-align: center;
  opacity: 0; transition: opacity .8s;
}
.pwend.in { opacity: 1; }
.pweye { font-size: 10px; letter-spacing: .16em; margin-bottom: 8px; }
.pendtext { font-size: 13.5px; line-height: 2.05; }

.pwsign {
  text-align: center; font-size: 11px; letter-spacing: .08em; margin: 18px 0 6px;
  opacity: 0; transition: opacity .7s;
}
.pwsign.in { opacity: 1; }

.pwend2 {
  text-align: center; font-size: 16px; line-height: 2.1;
  opacity: 0; transition: opacity .8s;
}
.pwend2.in { opacity: 1; }

.bgrow { margin-top: 4px; }

/* 离屏画布：视觉上藏起来，但必须留在文档流里才能取到尺寸。
   绘制缓冲区在 JS 里设成 1080×1920，这里只需要一个占位尺寸。 */
.poster {
  position: fixed; left: -9999px; top: 0;
  width: 375px; height: 667px; opacity: 0; pointer-events: none;
}


/* ===== poster ===== */
.card.center {
  text-align: center;
  padding: 28px 20px;
}

.card.center .fh {
  margin-bottom: 0;
}

.arow {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 7px 0;
  border-bottom: 0.5px solid #F3EDE4;
}

.arow:last-child {
  border-bottom: none;
}

.ak {
  font-size: 13.5px;
  color: #5A4C42;
}

.av {
  font-size: 13.5px;
  color: #B5AA9E;
}

/* 画布本身不显示，但必须留在页面里（display:none 拿不到 node） */
.canvasbox {
  position: fixed;
  left: -4999.5px;
  top: 0;
  width: 1080px;
  height: 10px;
  overflow: hidden;
}

.poster {
  width: 1080px;
  height: 10px;
}


/* ===== quiz ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */


/* ===== quiz-intro ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */


/* ===== reminders ===== */
.rrow { display: flex; gap: 7px; margin-top: 8px; }
.rtag {
  font-size: 11.5px; padding: 5px 11px; border-radius: 499.5px;
  border: 0.5px solid #EFE6DC; background: #FAF6F1; color: #B5AA9E;
}
.rtag.on { background: #FDF0E9; border-color: #F5D5C8; color: #C2553C; }


/* ===== result ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */


/* ===== search ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */


/* ===== settings ===== */
/* 称谓选项（她 / 他 / ta） */
.gopt { font-size: 17px; padding: 14px 34px; }


/* ===== welcome ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */


/* ===== word ===== */
/* 样式用全局 app.wxss，这里只放本页特有的 */