/* ============================================================
   爱在大学城 · 表白墙  样式表
   配色沿用茅福官网视觉体系：茅山赭红 / 鎏金 / 宣纸米
   ============================================================ */

:root{
  --red:#8C3B2E;          /* 茅山赭红 */
  --red-deep:#6E2C21;
  --red-dark:#3E1813;
  --red-soft:#F6E9E5;
  --gold:#C9A24D;         /* 鎏金 */
  --gold-lt:#E3C077;
  --gold-soft:#F8F1E1;
  --paper:#F7F4EE;        /* 宣纸米 */
  --paper-deep:#EFEAE0;

  --ink:#2A2522;
  --ink2:#57504A;
  --ink3:#938A80;
  --line:#E5DFD5;
  --white:#FFFDFA;

  --green:#3F7D5C;
  --green-soft:#EBF3EE;

  --r-sm:6px;
  --r:12px;
  --r-lg:18px;

  --sh-sm:0 1px 2px rgba(60,45,35,.05), 0 2px 8px rgba(60,45,35,.04);
  --sh:0 2px 8px rgba(60,45,35,.07), 0 14px 34px rgba(60,45,35,.06);
  --sh-lg:0 10px 30px rgba(60,45,35,.10), 0 30px 60px rgba(60,45,35,.08);

  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  --kai:"STKaiti","KaiTi","Kaiti SC","Songti SC","SimSun",serif;

  --wrap:1180px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  font-size:15px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img{display:block;max-width:100%}
.kai{font-family:var(--kai)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}

/* ---------------- 按钮 ---------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:11px 24px;border-radius:var(--r-sm);font-size:14px;font-weight:600;
  transition:all .18s ease;white-space:nowrap;
}
.btn-sm{padding:7px 15px;font-size:13px}
.btn-primary{background:var(--red);color:#fff}
.btn-primary:hover{background:var(--red-deep);transform:translateY(-1px);box-shadow:0 6px 16px rgba(140,59,46,.24)}
.btn-gold{background:linear-gradient(135deg,var(--gold),#B98F35);color:#fff}
.btn-gold:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(201,162,77,.34)}
.btn-outline{border:1px solid var(--line);background:var(--white);color:var(--ink2)}
.btn-outline:hover{border-color:var(--red);color:var(--red);background:var(--red-soft)}
.btn-block{width:100%}

/* ---------------- 顶栏 ---------------- */
.nav{
  position:sticky;top:0;z-index:60;
  background:rgba(247,244,238,.9);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:0 22px;height:62px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--kai);font-size:20px;font-weight:700;letter-spacing:.5px}
.brand .seal{
  width:32px;height:32px;border-radius:8px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--red),var(--red-deep));
  color:#fff;font-size:17px;font-family:var(--kai);box-shadow:0 3px 10px rgba(140,59,46,.22);
}
.brand em{font-style:normal;color:var(--red)}
.nav-sp{flex:1}
.nav-links{display:flex;gap:4px}
.nav-links a{
  padding:7px 13px;border-radius:var(--r-sm);font-size:14px;color:var(--ink2);font-weight:500;
  transition:all .16s;
}
.nav-links a:hover,.nav-links a.on{color:var(--red);background:var(--red-soft)}
#navUser{display:flex;align-items:center;gap:10px}
.user-chip{
  display:flex;align-items:center;gap:8px;padding:5px 13px 5px 5px;
  background:var(--white);border:1px solid var(--line);border-radius:30px;
  font-size:13.5px;font-weight:600;cursor:pointer;transition:all .16s;
}
.user-chip:hover{border-color:var(--gold);box-shadow:var(--sh-sm)}
.avatar-dot{
  width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--gold),#B98F35);color:#fff;font-size:12.5px;
}
.nav-bal{font-size:13px;color:var(--ink3)}
.nav-bal b{color:var(--red);font-size:15px}

/* ---------------- 首屏 ---------------- */
.hero{padding:40px 0 22px;text-align:center}
.hero h1{
  font-family:var(--kai);font-size:clamp(30px,4.6vw,46px);font-weight:700;
  letter-spacing:2px;line-height:1.3;margin-bottom:14px;
}
.hero h1 em{font-style:normal;color:var(--red)}
.hero h1 i{font-style:normal;color:var(--gold)}
.hero .sub{font-size:15.5px;color:var(--ink2);max-width:600px;margin:0 auto 22px;line-height:1.85}
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero-stats{display:flex;gap:34px;justify-content:center;margin-top:28px;flex-wrap:wrap}
.hero-stats div{text-align:center}
.hero-stats strong{display:block;font-family:var(--kai);font-size:26px;color:var(--red);line-height:1.3}
.hero-stats span{font-size:12.5px;color:var(--ink3);letter-spacing:.5px}

/* ============================================================
   巨幅滚动表白墙
   ============================================================ */
.wall-stage{
  position:relative;width:100%;height:600px;margin:34px 0 0;overflow:hidden;
  background:
    radial-gradient(1200px 480px at 50% -10%, rgba(201,162,77,.20), transparent 60%),
    radial-gradient(900px 420px at 12% 110%, rgba(201,162,77,.12), transparent 60%),
    linear-gradient(160deg,#4A1D17 0%,#3E1813 46%,#2E110D 100%);
}
/* 织纹质感 */
.wall-stage::before{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.022) 0 2px,transparent 2px 5px);
}
/* 上下渐隐 */
.wall-stage::after{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:3;
  background:linear-gradient(180deg,#3E1813 0%,transparent 16%,transparent 84%,#3E1813 100%);
}

.wall-head{
  position:absolute;top:0;left:0;right:0;z-index:5;
  display:flex;align-items:center;justify-content:center;gap:12px;
  padding:18px;pointer-events:none;
}
.wall-head .tag{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 18px;border-radius:30px;
  background:rgba(255,253,250,.10);border:1px solid rgba(227,192,119,.34);
  color:var(--gold-lt);font-size:13px;letter-spacing:1.4px;font-weight:600;
  backdrop-filter:blur(6px);
}
.wall-head .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-lt);animation:pulse 1.8s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}

.wall-cols{
  position:absolute;inset:0;display:grid;gap:16px;padding:64px 0 40px;
  grid-template-columns:repeat(5,1fr);
}
.wall-col{position:relative;overflow:hidden;padding:0 4px}
.wall-col:hover .wall-track{animation-play-state:paused}
.wall-track{
  display:flex;flex-direction:column;
  /* 用 margin 而非 gap 做间距：两份内容拼接后 translateY(-50%) 才能精确无缝 */
  animation-name:scrollUp;animation-timing-function:linear;animation-iteration-count:infinite;
  will-change:transform;
}
.wall-track .wcard{margin-bottom:14px}
@keyframes scrollUp{from{transform:translateY(0)}to{transform:translateY(-50%)}}

/* 滚动卡片 */
.wcard{
  position:relative;padding:15px 16px 13px;border-radius:12px;cursor:pointer;
  background:linear-gradient(160deg,#FFFDFA,#F6F1E8);
  border:1px solid rgba(255,255,255,.5);
  box-shadow:0 6px 18px rgba(0,0,0,.20);
  transition:transform .2s ease, box-shadow .2s ease;
}
.wcard:hover{transform:translateY(-3px) scale(1.015);box-shadow:0 14px 30px rgba(0,0,0,.30)}
.wcard .wc-top{display:flex;align-items:center;gap:7px;margin-bottom:9px}
.wcard .wc-av{
  width:22px;height:22px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--red),var(--red-deep));color:#fff;font-size:11px;font-weight:600;
}
.wcard .wc-nick{font-size:12.5px;color:var(--ink2);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wcard .wc-time{margin-left:auto;font-size:11px;color:var(--ink3);flex:none}
.wcard .wc-text{
  font-family:var(--kai);font-size:16.5px;line-height:1.62;color:var(--ink);
  letter-spacing:.4px;
}
.wcard .wc-text .sch{color:var(--red);font-weight:700}
.wcard .wc-text .per{color:#A9761F;font-weight:700;border-bottom:1.5px solid rgba(201,162,77,.5)}
.wcard .wc-foot{
  display:flex;align-items:center;gap:12px;margin-top:11px;padding-top:10px;
  border-top:1px dashed var(--line);font-size:11.5px;color:var(--ink3);
}
.wcard .wc-foot .reg{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wcard .wc-foot .sp{margin-left:auto;display:flex;gap:9px;flex:none}
.wcard .wc-foot b{color:var(--red);font-weight:600}

/* 移动端列数 */
@media (max-width:1080px){
  .wall-cols{grid-template-columns:repeat(3,1fr)}
  .wall-stage{height:520px}
}
@media (max-width:640px){
  .wall-cols{grid-template-columns:repeat(2,1fr);gap:10px}
  .wall-stage{height:430px}
  .wcard{padding:12px 13px 11px}
  .wcard .wc-text{font-size:15px}
}

/* ---------------- 区块标题 ---------------- */
.sec{padding:52px 0}
.sec-head{text-align:center;margin-bottom:30px}
.sec-head h2{
  font-family:var(--kai);font-size:27px;font-weight:700;letter-spacing:1.5px;margin-bottom:9px;
}
.sec-head h2 em{font-style:normal;color:var(--red)}
.sec-head p{color:var(--ink3);font-size:13.5px}
.sec-head .line{
  width:52px;height:2px;margin:14px auto 0;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

/* ---------------- 广告位 ---------------- */
.ad-slot{
  position:relative;margin:38px auto;max-width:var(--wrap);
  min-height:96px;border-radius:var(--r);overflow:hidden;
  background:repeating-linear-gradient(45deg,#F2EEE6,#F2EEE6 12px,#EDE8DE 12px,#EDE8DE 24px);
  border:1px dashed #D8D0C2;
  display:flex;align-items:center;justify-content:center;
}
.ad-slot .ad-label{
  position:absolute;top:7px;left:9px;z-index:2;
  font-size:10px;letter-spacing:1.2px;color:#A99F90;
  background:rgba(255,255,255,.8);padding:1.5px 6px;border-radius:3px;
}
.ad-slot .ad-body{text-align:center;color:#B0A695;font-size:13px;line-height:2}
.ad-slot .ad-body strong{display:block;color:#8E8474;font-size:14px;letter-spacing:.6px}
.ad-slot .ad-body code{
  font-size:11.5px;background:rgba(255,255,255,.85);padding:2px 7px;border-radius:4px;color:#9A8F7D;
}
.ad-slot.tall{min-height:150px}

/* ---------------- 「我也要表白」 ---------------- */
.cta-band{
  position:relative;overflow:hidden;border-radius:var(--r-lg);
  padding:44px 30px;text-align:center;color:#fff;
  background:linear-gradient(135deg,var(--red),var(--red-deep) 62%,#5A241B);
  box-shadow:var(--sh);
}
.cta-band::after{
  content:'';position:absolute;right:-40px;top:-40px;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,rgba(227,192,119,.30),transparent 68%);
}
.cta-band h3{font-family:var(--kai);font-size:25px;letter-spacing:1.6px;margin-bottom:10px}
.cta-band p{color:rgba(255,255,255,.8);font-size:14px;margin-bottom:22px}
.cta-band .btn-gold{background:linear-gradient(135deg,var(--gold-lt),var(--gold));color:#4A2411}
.cta-band .fmt{
  display:inline-block;margin-top:22px;padding:11px 22px;border-radius:10px;
  background:rgba(0,0,0,.20);border:1px solid rgba(227,192,119,.32);
  font-family:var(--kai);font-size:16px;color:var(--gold-lt);letter-spacing:1px;
}
.cta-band .fmt b{color:#fff}

/* ---------------- 地区导航 ---------------- */
.tabs{
  display:inline-flex;gap:5px;padding:5px;background:var(--white);
  border:1px solid var(--line);border-radius:30px;margin:0 auto 24px;
  box-shadow:var(--sh-sm);
}
.tabs-wrap{text-align:center}
.tabs button{
  padding:9px 24px;border-radius:24px;font-size:14px;font-weight:600;color:var(--ink2);
  transition:all .18s;
}
.tabs button.on{background:var(--red);color:#fff;box-shadow:0 4px 12px rgba(140,59,46,.24)}

.prov-grid{
  display:grid;gap:9px;
  grid-template-columns:repeat(auto-fill,minmax(122px,1fr));
}
.prov{
  padding:11px 10px;border-radius:var(--r-sm);text-align:center;cursor:pointer;
  background:var(--white);border:1px solid var(--line);font-size:14px;color:var(--ink2);
  transition:all .16s;font-weight:500;
}
.prov:hover{border-color:var(--red);color:var(--red);background:var(--red-soft);transform:translateY(-1px)}
.prov.on{background:var(--red);border-color:var(--red);color:#fff}
.prov em{font-style:normal;font-size:11px;color:var(--ink3);margin-left:4px}
.prov.on em{color:rgba(255,255,255,.7)}

.city-panel{
  margin-top:16px;padding:18px;border-radius:var(--r);
  background:var(--white);border:1px solid var(--line);box-shadow:var(--sh-sm);
}
.city-panel .cp-head{
  display:flex;align-items:center;gap:9px;margin-bottom:14px;padding-bottom:12px;
  border-bottom:1px solid var(--line);font-size:14px;
}
.city-panel .cp-head strong{font-family:var(--kai);font-size:16px;color:var(--red)}
.city-panel .cp-head span{color:var(--ink3);font-size:12.5px}
.city-grid{display:flex;flex-wrap:wrap;gap:8px}
.city-chip{
  padding:7px 15px;border-radius:30px;font-size:13px;cursor:pointer;
  background:var(--paper);border:1px solid var(--line);color:var(--ink2);transition:all .16s;
}
.city-chip:hover{background:var(--red);border-color:var(--red);color:#fff;transform:translateY(-1px)}
.city-chip b{font-weight:600;color:var(--red);margin-left:5px;font-size:11.5px}
.city-chip:hover b{color:rgba(255,255,255,.85)}

/* ---------------- 友情链接 ---------------- */
.friend-links{
  display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
}
.flink{
  display:flex;align-items:center;gap:12px;padding:17px 18px;border-radius:var(--r);
  background:var(--white);border:1px solid var(--line);transition:all .18s;
}
.flink:hover{border-color:var(--gold);box-shadow:var(--sh);transform:translateY(-2px)}
.flink .fi{
  width:38px;height:38px;border-radius:10px;flex:none;display:grid;place-items:center;
  font-size:17px;background:var(--gold-soft);border:1px solid rgba(201,162,77,.28);
}
.flink .ft{min-width:0}
.flink .ft strong{display:block;font-size:14.5px;font-weight:600;margin-bottom:1px}
.flink .ft span{font-size:12px;color:var(--ink3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------------- 页脚 ---------------- */
.foot{
  margin-top:56px;padding:34px 0 40px;border-top:1px solid var(--line);
  text-align:center;color:var(--ink3);font-size:12.5px;background:var(--paper-deep);
}
.foot .fl{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.foot .fl a:hover{color:var(--red)}
.foot .fl i{font-style:normal;color:#CFC7BA}

/* ============================================================
   弹层
   ============================================================ */
.modal{
  position:fixed;inset:0;z-index:200;display:none;
  align-items:center;justify-content:center;padding:20px;
  background:rgba(42,37,34,.55);backdrop-filter:blur(4px);
  overflow-y:auto;
}
.modal.show{display:flex}
.mbox{
  width:100%;max-width:460px;background:var(--white);border-radius:var(--r-lg);
  box-shadow:var(--sh-lg);overflow:hidden;animation:pop .22s ease;
  margin:auto;
}
.mbox.wide{max-width:600px}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.mhead{
  padding:20px 24px 16px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:10px;
}
.mhead h3{font-family:var(--kai);font-size:19px;font-weight:700;letter-spacing:.8px}
.mhead .x{margin-left:auto;font-size:21px;color:var(--ink3);line-height:1;padding:0 4px}
.mhead .x:hover{color:var(--red)}
.mbody{padding:22px 24px 24px}
.mfoot{padding:0 24px 22px;display:flex;gap:10px}

.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:600;color:var(--ink2);margin-bottom:7px}
.field label i{font-style:normal;color:var(--red)}
.field input[type=text],.field input[type=tel],.field select,.field textarea{
  width:100%;padding:11px 14px;border:1px solid var(--line);border-radius:var(--r-sm);
  font-size:14.5px;font-family:inherit;background:var(--white);color:var(--ink);
  transition:border-color .16s, box-shadow .16s;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(140,59,46,.10);
}
.field .hint{font-size:11.5px;color:var(--ink3);margin-top:6px;line-height:1.6}
.field .hint b{color:var(--red);font-weight:600}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:540px){ .row2{grid-template-columns:1fr} }

/* 表白文案预览 */
.preview{
  margin-top:6px;padding:16px;border-radius:var(--r);text-align:center;
  background:linear-gradient(135deg,var(--gold-soft),#FDF9F0);
  border:1px dashed rgba(201,162,77,.45);
}
.preview .lb{font-size:11.5px;color:var(--ink3);letter-spacing:1.2px;margin-bottom:7px}
.preview .tx{font-family:var(--kai);font-size:20px;color:var(--ink);letter-spacing:.8px}
.preview .tx .sch{color:var(--red);font-weight:700}
.preview .tx .per{color:#A9761F;font-weight:700;border-bottom:2px solid rgba(201,162,77,.5)}
.preview .tx .ph{color:#C4BAA9}

/* 声明勾选 */
.notice-box{
  margin-top:16px;padding:14px 15px;border-radius:var(--r-sm);
  background:var(--red-soft);border:1px solid rgba(140,59,46,.16);
  font-size:12px;line-height:1.85;color:var(--ink2);
}
.notice-box b{color:var(--red)}
.chk{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;color:var(--ink2);margin-top:10px;cursor:pointer;line-height:1.65}
.chk input{width:15px;height:15px;flex:none;margin-top:3px;accent-color:var(--red)}

/* ---------------- 详情弹层 ---------------- */
.detail-love{
  padding:24px 22px;border-radius:var(--r);text-align:center;margin-bottom:18px;
  background:linear-gradient(135deg,#FFF9F0,#F7F1E5);
  border:1px solid rgba(201,162,77,.28);
}
.detail-love .txt{font-family:var(--kai);font-size:24px;line-height:1.6;letter-spacing:1px}
.detail-love .txt .sch{color:var(--red);font-weight:700}
.detail-love .txt .per{color:#A9761F;font-weight:700;border-bottom:2px solid rgba(201,162,77,.5)}
.detail-love .meta{margin-top:12px;font-size:12.5px;color:var(--ink3);display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.detail-love .meta b{color:var(--ink2)}

.d-act{display:flex;align-items:center;gap:12px;padding:0 0 16px;border-bottom:1px solid var(--line)}
.d-act .grow{flex:1}

/* 投票按钮 */
.vote{display:inline-flex;gap:7px}
.vote button{
  display:inline-flex;align-items:center;gap:5px;padding:7px 14px;border-radius:30px;
  background:var(--paper);border:1px solid var(--line);font-size:13px;color:var(--ink2);
  transition:all .16s;font-weight:600;
}
.vote button:hover{border-color:var(--red);color:var(--red)}
.vote button.on-up{background:var(--red);border-color:var(--red);color:#fff}
.vote button.on-down{background:#5A6B7A;border-color:#5A6B7A;color:#fff}
.vote.sm button{padding:5px 11px;font-size:12.5px}

/* 道具条 */
.prop-bar{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.prop-btn{
  display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:30px;
  background:var(--white);border:1px solid var(--line);font-size:13px;transition:all .16s;
}
.prop-btn:hover{border-color:var(--gold);background:var(--gold-soft);transform:translateY(-1px)}
.prop-btn .pe{font-size:15px}
.prop-btn .pn{font-weight:600;color:var(--ink2)}
.prop-btn .pp{color:var(--red);font-weight:700;font-size:12.5px}
.prop-counts{display:flex;gap:11px;font-size:12.5px;color:var(--ink3);flex-wrap:wrap}
.prop-counts span{background:var(--paper);padding:3px 9px;border-radius:20px;border:1px solid var(--line)}

/* 评论 */
.cmt-box{margin-top:18px}
.cmt-title{font-size:13px;font-weight:600;color:var(--ink2);margin-bottom:11px}
.cmt-title em{font-style:normal;color:var(--red)}
.cmt-item{
  display:flex;gap:9px;align-items:baseline;padding:9px 0;border-bottom:1px dashed var(--line);
  font-size:13px;flex-wrap:wrap;
}
.cmt-item .who{color:var(--red);font-weight:600;flex:none}
.cmt-item .what{color:var(--ink2);flex:1;min-width:120px}
.cmt-item .when{color:var(--ink3);font-size:11.5px;flex:none;margin-left:auto}
.cmt-empty{font-size:12.5px;color:var(--ink3);padding:10px 0}
.cmt-form{display:flex;gap:9px;margin-top:12px}
.cmt-form input{
  flex:1;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-sm);
  font-size:14px;font-family:inherit;
}
.cmt-form input:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(140,59,46,.10)}

/* 详情里的操作行 */
.d-ops{display:flex;gap:14px;align-items:center;margin-top:14px;font-size:12.5px;color:var(--ink3)}
.d-ops button{color:var(--ink3);font-size:12.5px;text-decoration:underline;text-underline-offset:3px}
.d-ops button:hover{color:var(--red)}

/* ---------------- Toast ---------------- */
.toast{
  position:fixed;left:50%;bottom:44px;transform:translate(-50%,20px);z-index:900;
  max-width:80vw;padding:12px 24px;border-radius:30px;
  background:rgba(42,37,34,.94);color:#fff;font-size:14px;
  opacity:0;pointer-events:none;transition:all .26s ease;box-shadow:var(--sh);
}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------------- 表白墙分站页 ---------------- */
.wall-hero{
  padding:38px 0 26px;text-align:center;
  background:linear-gradient(180deg,#FBF8F2,var(--paper));
  border-bottom:1px solid var(--line);
}
.wall-hero .crumb{font-size:13px;color:var(--ink3);margin-bottom:14px}
.wall-hero .crumb a:hover{color:var(--red)}
.wall-hero .crumb i{font-style:normal;margin:0 7px;color:#CFC7BA}
.wall-hero h1{font-family:var(--kai);font-size:clamp(24px,3.6vw,34px);letter-spacing:1.5px;margin-bottom:10px}
.wall-hero h1 em{font-style:normal;color:var(--red)}
.wall-hero .wall-line{
  font-family:var(--kai);font-size:14.5px;letter-spacing:2.2px;
  color:var(--ink3);margin-bottom:14px;
}
.wall-hero .stat{font-size:13.5px;color:var(--ink3);display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
.wall-hero .stat b{color:var(--red);font-weight:700}

.bb-list{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));padding:30px 0}
@media (max-width:520px){ .bb-list{grid-template-columns:1fr} }

.bb-card{
  padding:20px 20px 17px;border-radius:var(--r);background:var(--white);
  border:1px solid var(--line);box-shadow:var(--sh-sm);transition:all .2s;
  position:relative;overflow:hidden;
}
.bb-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--gold),var(--red));opacity:.75;
}
.bb-card:hover{box-shadow:var(--sh);transform:translateY(-2px)}
.bb-card .bc-top{display:flex;align-items:center;gap:8px;margin-bottom:13px}
.bb-card .bc-av{
  width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--red),var(--red-deep));color:#fff;font-size:12px;font-weight:600;
}
.bb-card .bc-nick{font-size:13.5px;font-weight:600;color:var(--ink2)}
.bb-card .bc-time{margin-left:auto;font-size:11.5px;color:var(--ink3)}
.bb-card .bc-text{font-family:var(--kai);font-size:19px;line-height:1.62;letter-spacing:.6px;margin-bottom:14px}
.bb-card .bc-text .sch{color:var(--red);font-weight:700}
.bb-card .bc-text .per{color:#A9761F;font-weight:700;border-bottom:2px solid rgba(201,162,77,.5)}
.bb-card .bc-foot{
  display:flex;align-items:center;gap:12px;padding-top:13px;border-top:1px dashed var(--line);flex-wrap:wrap;
}
.bb-card .bc-reg{font-size:12px;color:var(--ink3);background:var(--paper);padding:3px 10px;border-radius:20px;border:1px solid var(--line)}
.bb-card .bc-cmt{font-size:12.5px;color:var(--ink3)}
.bb-card .bc-cmt:hover{color:var(--red)}
.bb-card .bc-sp{margin-left:auto;display:flex;gap:9px;font-size:12px;color:var(--ink3)}

.empty{
  text-align:center;padding:70px 20px;color:var(--ink3);
}
.empty .big{font-size:44px;margin-bottom:16px;opacity:.5}
.empty p{font-size:14px;margin-bottom:20px}

.section-note{
  margin:0 auto 22px;max-width:760px;padding:13px 18px;border-radius:var(--r-sm);
  background:var(--gold-soft);border:1px solid rgba(201,162,77,.3);
  font-size:12.5px;line-height:1.8;color:var(--ink2);text-align:center;
}
.section-note b{color:var(--red)}

/* ============================================================
   煽情文案组
   首页的情绪层：首屏一句话、语录带、CTA 小字、弹层与页脚收尾
   ============================================================ */

/* ---------------- 首屏 · 那句话 ---------------- */
.hero-line{
  display:inline-flex;align-items:center;gap:16px;
  font-family:var(--kai);font-size:clamp(16px,2vw,19.5px);letter-spacing:2.6px;
  color:var(--red);margin:2px 0 18px;opacity:.94;
}
.hero-line::before,.hero-line::after{
  content:'';width:36px;height:1px;flex:none;
}
.hero-line::before{background:linear-gradient(90deg,transparent,var(--gold))}
.hero-line::after{background:linear-gradient(270deg,transparent,var(--gold))}
.hero-line b{font-weight:700}

/* ---------------- 语录带 ---------------- */
.quote-band{
  max-width:var(--wrap);margin:0 auto;padding:62px 24px 14px;text-align:center;
}
.quote-band .q{
  font-family:var(--kai);font-size:clamp(17px,2.1vw,21px);line-height:2.05;
  letter-spacing:1.8px;color:var(--ink2);max-width:640px;margin:0 auto;
}
.quote-band .q b{color:var(--red);font-weight:700}
.quote-band .q i{font-style:normal;color:#A9761F;font-weight:700}
.quote-band .sep{
  width:5px;height:5px;border-radius:50%;background:var(--gold);
  margin:28px auto;opacity:.5;
}

/* ---------------- CTA · 一句催 ---------------- */
.cta-band p.cta-em{
  font-family:var(--kai);font-size:17px;letter-spacing:2.4px;
  color:var(--gold-lt);margin-bottom:12px;opacity:.95;
}

/* ---------------- 弹层 · 收尾小字 ---------------- */
.m-note{
  text-align:center;font-family:var(--kai);font-size:14.5px;
  letter-spacing:1.8px;color:var(--ink3);margin:20px 0 4px;line-height:1.8;
}

/* ---------------- 页脚 · 收尾 ---------------- */
.foot .foot-line{
  font-family:var(--kai);font-size:15.5px;letter-spacing:2.4px;
  color:var(--ink2);margin-bottom:18px;
}
.foot .foot-line em{font-style:normal;color:var(--red)}

/* ---------------- 登记 · 验证码一行 ---------------- */
.code-row{display:flex;gap:10px;align-items:stretch}
.code-row input{flex:1;min-width:0}
.code-row .btn{flex:none;white-space:nowrap;padding-left:16px;padding-right:16px}
.code-row .btn[disabled]{opacity:.55;cursor:not-allowed}

/* ---------------- 详情弹层加载态 ---------------- */
.d-loading{
  padding:46px 20px;text-align:center;color:var(--ink3);font-size:14px;
}

/* ================= 广告位 ================= */
.ad-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  align-items: flex-start;
}
.ad-box {
  background: #FFFDF8;
  border: 1px solid #EFE7DA;
  border-radius: 14px;
  overflow: hidden;
  max-width: 100%;
}