/* ===== 长明灯沉浸页（/qifu/lamp v20260905a 重做）=====
   结构：固定背景层(实拍酥油灯殿 + 缓推 + 光尘) → 顶栏 → 首屏(题字+统计+CTA) → 灯墙(CSS油灯) → 点灯弹窗
   动效：背景缓推(lp-ken)、光尘升腾(lp-rise)、火苗摇曳(lp-flick)、光晕呼吸(lp-breathe)、CTA辉光(lp-cta)
   prefers-reduced-motion 下全部静止 */

html { -webkit-text-size-adjust: 100%; }
body.lp-body { margin: 0; background: #0b0704; color: #e9dcbe;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; overflow-x: hidden; }
.lp-serif { font-family: Georgia, "Times New Roman", "STZhongsong", "STSong", "SimSun", "Noto Serif SC", serif; }

/* ===== 固定背景层 ===== */
.lp-bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; background: #0b0704; }
.lp-bg-move { position: absolute; inset: 0; will-change: transform; }
.lp-bg-photo { position: absolute; inset: -5%;
  background: #0b0704 url('https://wanjiafo-img.oss-cn-beijing.aliyuncs.com/img/lamp/bg.jpg') center / cover no-repeat;
  animation: lp-ken 46s ease-in-out infinite alternate; }
@media (max-aspect-ratio: 3/4) { .lp-bg-photo { background-image: url('https://wanjiafo-img.oss-cn-beijing.aliyuncs.com/img/lamp/bg_m.jpg'); } }
@keyframes lp-ken { from { transform: scale(1.05) translate(0, 0); }
  to { transform: scale(1.14) translate(-1.4%, 1.2%); } }
/* 明暗罩：顶部压暗保题字、底部压暗保CTA/页脚、四周暗角 */
.lp-bg-shade { position: absolute; inset: 0;
  background:
    radial-gradient(120% 90% at 50% 6%, rgba(10, 6, 3, .12), rgba(0, 0, 0, 0) 52%),
    linear-gradient(180deg, rgba(8, 5, 2, .62) 0%, rgba(8, 5, 2, .28) 24%, rgba(6, 4, 2, .34) 58%, rgba(5, 3, 1, .80) 100%),
    radial-gradient(140% 100% at 50% 50%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .5) 100%); }
/* 光尘容器 */
.lp-motes { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.lp-motes i { position: absolute; bottom: -2%; border-radius: 50%;
  background: radial-gradient(circle, #ffe9b0 0%, rgba(255, 200, 110, .7) 40%, rgba(255, 170, 70, 0) 75%);
  filter: blur(.4px); opacity: 0;
  animation: lp-rise var(--dur, 12s) linear infinite; animation-delay: var(--delay, 0s); }
@keyframes lp-rise {
  0% { transform: translate(0, 0); opacity: 0; }
  8% { opacity: var(--op, .4); }
  88% { opacity: var(--op, .4); }
  100% { transform: translate(var(--dx, 20px), -104vh); opacity: 0; } }

/* ===== 顶栏 ===== */
.lp-top { position: fixed; top: 0; left: 0; right: 0; z-index: 50; display: flex; align-items: center;
  justify-content: space-between; padding: 0 18px; height: 52px;
  background: linear-gradient(180deg, rgba(10, 6, 3, .58), rgba(10, 6, 3, .16));
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(201, 161, 90, .16); }
.lp-brand { font-family: Georgia, "Times New Roman", "STZhongsong", "STSong", "SimSun", serif;
  font-size: 19px; letter-spacing: .34em; text-indent: .34em; color: #f0d9a8; text-decoration: none;
  text-shadow: 0 0 12px rgba(240, 190, 90, .35); }
.lp-topnav { display: flex; gap: 4px; }
.lp-topnav a { font-size: 13px; color: rgba(232, 208, 160, .82); text-decoration: none;
  padding: 6px 12px; border-radius: 999px; transition: color .2s, background .2s; white-space: nowrap; }
.lp-topnav a:hover { color: #f5df9e; background: rgba(232, 196, 118, .12); }
@media (max-width: 640px) { .lp-hide-m { display: none; } .lp-brand { font-size: 17px; } }

/* ===== 首屏 ===== */
.lp-page { position: relative; z-index: 1; }
.lp-hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center; padding: 76px 18px 56px; box-sizing: border-box; }
.lp-hero-glow { position: absolute; left: 50%; top: 46%; width: min(72vw, 640px); height: min(46vh, 380px);
  transform: translate(-50%, -50%); pointer-events: none; filter: blur(2px);
  background: radial-gradient(closest-side, rgba(255, 168, 66, .20), rgba(255, 140, 40, .08) 55%, rgba(255, 120, 30, 0) 75%);
  animation: lp-breathe 4.5s ease-in-out infinite; }
@keyframes lp-breathe { 0%, 100% { opacity: .72; } 50% { opacity: 1; } }
.lp-hero-kicker { margin: 0 0 10px; font-size: 13px; letter-spacing: .5em; text-indent: .5em; color: #caa25e; }
.lp-hero-kicker b { color: rgba(202, 162, 94, .55); font-weight: 400; margin: 0 10px; }
.lp-hero-title { margin: 0 0 14px; font-size: clamp(38px, 7vw, 72px); font-weight: 700;
  letter-spacing: .16em; text-indent: .16em; line-height: 1.18;
  background: linear-gradient(180deg, #fbe7b0, #ecc879 55%, #c99a45);
  -webkit-background-clip: text; background-clip: text; color: transparent; }
.lp-hero-sub { margin: 0 0 26px; font-size: clamp(13px, 2.2vw, 16px); letter-spacing: .42em; text-indent: .42em;
  color: rgba(233, 220, 190, .78); }
.lp-hero-stat { display: inline-flex; align-items: center; padding: 9px 22px; border-radius: 999px;
  border: 1px solid rgba(201, 161, 90, .3); background: rgba(14, 9, 4, .42);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  font-size: 14px; color: #d9c294; letter-spacing: .08em; margin-bottom: 34px; }
.lp-hero-stat b { color: #f5df9e; font-size: 20px; margin: 0 3px; font-family: Georgia, serif; }
.lp-hero-cta { display: flex; gap: 14px; align-items: center; justify-content: center; flex-wrap: wrap; }
.lp-btn-main { min-width: 232px; padding: 15px 34px; border: 0; cursor: pointer; border-radius: 999px;
  font-size: 18px; letter-spacing: .3em; text-indent: .3em; color: #fff;
  font-family: Georgia, "Times New Roman", "STZhongsong", "STSong", "SimSun", serif;
  background: linear-gradient(180deg, #c4452f, #96301f);
  box-shadow: 0 6px 26px rgba(190, 70, 40, .42), inset 0 1px 0 rgba(255, 220, 180, .35),
    0 0 0 1px rgba(240, 200, 130, .35);
  transition: transform .2s; animation: lp-cta 2.8s ease-in-out infinite; }
.lp-btn-main:hover { transform: translateY(-2px); }
.lp-btn-main:active { transform: translateY(0); }
@keyframes lp-cta {
  0%, 100% { box-shadow: 0 6px 26px rgba(190, 70, 40, .40), inset 0 1px 0 rgba(255, 220, 180, .35),
      0 0 0 1px rgba(240, 200, 130, .35); }
  50% { box-shadow: 0 8px 34px rgba(220, 90, 45, .60), inset 0 1px 0 rgba(255, 220, 180, .45),
      0 0 0 1px rgba(245, 210, 140, .55); } }
.lp-btn-ghost { display: inline-block; padding: 13px 26px; border-radius: 999px; text-decoration: none;
  border: 1px solid rgba(232, 196, 118, .45); color: #e8c476; background: rgba(20, 12, 6, .35);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  font-size: 14px; letter-spacing: .24em; text-indent: .24em; transition: background .2s, color .2s; }
.lp-btn-ghost:hover { background: rgba(232, 196, 118, .12); color: #f5df9e; }
.lp-hero-note { margin: 30px 0 0; font-size: 12px; letter-spacing: .12em; color: rgba(217, 194, 148, .55); }

/* 迷你火苗（统计行等处复用） */
.lp-mini-flame { display: inline-block; width: 9px; height: 14px; margin-right: 10px; vertical-align: -2px;
  background: radial-gradient(50% 65% at 50% 78%, #fff3cd, #ffd76a 40%, #ff9d2e 70%, rgba(255, 110, 30, 0));
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
  filter: drop-shadow(0 0 5px rgba(255, 170, 60, .9));
  animation: lp-flick 1.1s ease-in-out infinite alternate; }

/* ===== 灯墙 ===== */
.lp-wall { max-width: 1080px; margin: 0 auto; padding: 30px 16px 40px; }
.lp-wall-head { text-align: center; margin-bottom: 26px; }
.lp-wall-head h2 { margin: 0 0 8px; font-size: clamp(24px, 4vw, 32px); letter-spacing: .3em; text-indent: .3em;
  font-weight: 700; color: #f0d9a8; display: flex; align-items: center; justify-content: center; gap: 18px; }
.lp-wall-head h2:before, .lp-wall-head h2:after { content: ''; flex: 0 0 clamp(40px, 10vw, 90px); height: 1px;
  background: linear-gradient(90deg, rgba(201, 161, 90, 0), rgba(201, 161, 90, .8)); }
.lp-wall-head h2:after { background: linear-gradient(270deg, rgba(201, 161, 90, 0), rgba(201, 161, 90, .8)); }
.lp-wall-head p { margin: 0; font-size: 13px; letter-spacing: .3em; color: rgba(217, 194, 148, .6); }
.lp-wall-box { border: 1px solid rgba(201, 161, 90, .22); border-radius: 18px; padding: 26px 16px 30px;
  background: linear-gradient(180deg, rgba(12, 8, 4, .55), rgba(8, 5, 2, .68));
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.lp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(108px, 1fr)); gap: 24px 8px; }
.lp-empty-tip { grid-column: 1 / -1; text-align: center; color: rgba(217, 194, 148, .65);
  font-size: 14px; letter-spacing: .12em; padding: 8px 0 4px; }
.lp-cell { text-align: center; padding: 8px 4px 6px; border-radius: 10px; transition: background .25s; }
.lp-cell:hover { background: rgba(255, 190, 90, .08); }
.lp-cell.is-slot { cursor: pointer; }

/* CSS 油灯：碗 + 火苗 + 光晕 + 灯板 */
.lp-lamp { position: relative; width: 54px; height: 40px; margin: 0 auto; }
.lp-glow { position: absolute; bottom: 4px; left: 50%; width: 74px; height: 46px; margin-left: -37px;
  border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(255, 180, 80, .38), rgba(255, 150, 50, 0) 70%);
  animation: lp-breathe 2.6s ease-in-out infinite; animation-delay: var(--gd, 0s); }
.lp-flame { position: absolute; bottom: 19px; left: 50%; width: 10px; height: 17px; margin-left: -5px;
  background: radial-gradient(50% 65% at 50% 78%, #fff6d8 0%, #ffd76a 35%, #ff9d2e 65%, rgba(255, 90, 20, 0) 100%);
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%; transform-origin: 50% 100%;
  filter: drop-shadow(0 0 6px rgba(255, 170, 60, .9)) drop-shadow(0 0 14px rgba(255, 140, 30, .45));
  animation: lp-flick .9s ease-in-out infinite alternate; animation-delay: var(--fd, 0s); }
@keyframes lp-flick {
  0% { transform: scaleY(1) scaleX(1) rotate(-1.5deg); }
  30% { transform: scaleY(1.08) scaleX(.94) rotate(1deg); }
  60% { transform: scaleY(.95) scaleX(1.05) rotate(-1deg); }
  100% { transform: scaleY(1.05) scaleX(.97) rotate(2deg); } }
.lp-bowl { position: absolute; bottom: 0; left: 50%; width: 42px; height: 21px; margin-left: -21px;
  background: radial-gradient(ellipse at 50% 0%, #e8c476 0%, #c9973f 32%, #8a5f22 62%, #5d3f14 100%);
  border-radius: 0 0 48% 48% / 0 0 92% 92%;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .55), inset 0 -3px 6px rgba(0, 0, 0, .35); }
.lp-bowl:before { content: ''; position: absolute; top: -2px; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, #7a5a20, #f7e2a0 20%, #fff3c4 50%, #f7e2a0 80%, #7a5a20);
  border-radius: 50%; }
.lp-bowl:after { content: ''; position: absolute; bottom: -4px; left: 50%; width: 16px; height: 5px; margin-left: -8px;
  background: linear-gradient(180deg, #8a5f22, #4a3010); border-radius: 0 0 4px 4px; } /* 灯座 */
.lp-board { width: 66%; height: 7px; margin: 3px auto 0; border-radius: 2px 2px 3px 3px;
  background: linear-gradient(180deg, #5d452b 0%, #3a2814 55%, #241606 100%);
  box-shadow: 0 5px 12px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 215, 150, .18); }
.lp-name { margin-top: 7px; font-size: 14px; font-weight: 700; color: #f0dcab; letter-spacing: .04em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-meta { margin-top: 3px; font-size: 11px; line-height: 1.6; color: rgba(217, 194, 148, .62); }
/* 待点亮空位：暗灯 */
.lp-cell.is-slot .lp-lamp { filter: brightness(.5) saturate(.55); }
.lp-cell.is-slot .lp-name { color: rgba(232, 196, 118, .42); letter-spacing: .18em; font-weight: 400; }
.lp-cell.is-slot:hover .lp-name { color: rgba(232, 196, 118, .8); }
.lp-wall-cta { text-align: center; margin-top: 26px; }
.lp-btn-sm { min-width: 200px; padding: 12px 28px; font-size: 15px; }

/* ===== 页脚 ===== */
.lp-foot { position: relative; padding: 30px 16px calc(30px + env(safe-area-inset-bottom, 0px)); text-align: center;
  font-size: 12px; color: rgba(217, 194, 148, .55); }
.lp-foot a { color: rgba(232, 196, 118, .78); text-decoration: none; margin: 0 10px; }
.lp-foot a:hover { color: #f5df9e; }
.lp-foot p { margin: 10px 0 0; letter-spacing: .1em; }

/* ===== 点灯弹窗（三态：表单/支付/成功） ===== */
.lp-modal { position: fixed; inset: 0; z-index: 60; display: none; align-items: center; justify-content: center;
  padding: 18px; }
.lp-modal.on { display: flex; }
.lp-mask { position: absolute; inset: 0; background: rgba(6, 4, 2, .74);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.lp-panel { position: relative; width: 100%; max-width: 430px; max-height: 88vh; overflow-y: auto;
  background: linear-gradient(180deg, rgba(32, 23, 12, .97), rgba(18, 12, 6, .98));
  border: 1px solid rgba(201, 161, 90, .5); border-radius: 16px; padding: 24px 20px 22px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .65); animation: lp-pop .3s ease-out; }
@keyframes lp-pop { from { opacity: 0; transform: translateY(14px) scale(.98); }
  to { opacity: 1; transform: none; } }
.lp-close { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border: 0; border-radius: 50%;
  background: transparent; color: rgba(217, 194, 148, .55); font-size: 20px; line-height: 1; cursor: pointer; }
.lp-close:hover { color: #f5df9e; background: rgba(232, 196, 118, .1); }
.lp-panel h3 { margin: 2px 0 4px; font-size: 20px; letter-spacing: .24em; color: #f0d9a8; text-align: center;
  font-family: Georgia, "Times New Roman", "STZhongsong", "STSong", "SimSun", serif; }
.lp-panel .sub { margin: 0 0 16px; font-size: 12px; color: rgba(217, 194, 148, .6); text-align: center;
  letter-spacing: .06em; }
.lp-label { font-size: 13px; color: #d9c294; margin: 12px 0 6px; letter-spacing: .08em; }
.lp-input { width: 100%; box-sizing: border-box; padding: 11px 12px; border-radius: 8px; font-size: 15px;
  border: 1px solid rgba(201, 161, 90, .35); background: rgba(255, 248, 235, .06); color: #f3e6c8;
  transition: border-color .2s, box-shadow .2s; }
.lp-input:focus { outline: none; border-color: #e8c476; box-shadow: 0 0 0 3px rgba(232, 196, 118, .15); }
.lp-input::placeholder { color: rgba(243, 230, 200, .35); }
select.lp-input option { color: #3d2c14; background: #fff8eb; }
.lp-row2 { display: flex; gap: 10px; }
.lp-row2 > div { flex: 1; min-width: 0; }
.lp-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 4px; }
.lp-plan { position: relative; border: 1px solid rgba(201, 161, 90, .32); border-radius: 10px;
  padding: 13px 6px 10px; text-align: center; cursor: pointer; background: rgba(255, 240, 210, .04);
  transition: border-color .2s, background .2s; }
.lp-plan:hover { border-color: rgba(232, 196, 118, .6); }
.lp-plan.on { border-color: #e8c476; background: rgba(232, 196, 118, .10);
  box-shadow: inset 0 0 0 1px #e8c476, 0 6px 18px rgba(0, 0, 0, .35); }
.lp-plan .nm { font-size: 13px; color: #d9c294; letter-spacing: .22em; text-indent: .22em; }
.lp-plan .pr { font-size: 22px; color: #f5df9e; font-weight: 700; margin: 5px 0 3px;
  font-family: Georgia, serif; }
.lp-plan .mo { font-size: 11px; color: rgba(217, 194, 148, .58); }
.lp-plan .tag { position: absolute; top: -9px; right: -5px; font-size: 10px; padding: 2px 8px; border-radius: 8px;
  background: linear-gradient(180deg, #c4452f, #96301f); color: #ffe9d2; letter-spacing: .1em; }
.lp-plan input { display: none; }
.lp-go { display: block; width: 100%; margin-top: 18px; padding: 13px; border: 0; border-radius: 10px;
  background: linear-gradient(180deg, #c4452f, #96301f); color: #fff; font-size: 16px; letter-spacing: .3em;
  text-indent: .3em; cursor: pointer;
  font-family: Georgia, "Times New Roman", "STZhongsong", "STSong", "SimSun", serif;
  box-shadow: 0 5px 20px rgba(190, 70, 40, .4), inset 0 1px 0 rgba(255, 220, 180, .3); }
.lp-go:hover { filter: brightness(1.08); }
.lp-tip { margin: 12px 0 0; font-size: 12px; line-height: 1.8; color: rgba(217, 194, 148, .55); text-align: center; }
.lp-qr { min-height: 190px; margin-top: 10px; }
/* 支付通道选择（手机浏览器：双码扫不了自己屏幕） */
.lp-chs { display: flex; gap: 10px; margin-top: 12px; }
.lp-chs button { flex: 1; padding: 12px 6px; border-radius: 10px; cursor: pointer; font-size: 15px;
  letter-spacing: .08em; border: 1px solid rgba(201, 161, 90, .35);
  background: rgba(255, 240, 210, .04); color: #d9c294; transition: border-color .2s, background .2s; }
.lp-chs button.on { border-color: #e8c476; background: rgba(232, 196, 118, .10); color: #f5df9e;
  box-shadow: inset 0 0 0 1px #e8c476; }
.lp-paytip { margin: 10px 0 0; font-size: 12px; color: rgba(217, 194, 148, .6); text-align: center; }
/* h5 微信支付引导块（手机浏览器选微信出二维码时展示，切支付宝隐藏；静态无动画） */
.lp-wxguide[hidden] { display: none; }
.lp-wxguide { margin: 12px 0 0; padding: 13px 14px 14px; border-radius: 12px;
  border: 1px solid rgba(232, 196, 118, .4);
  background: rgba(16, 10, 5, .66);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  box-shadow: inset 0 1px 0 rgba(255, 235, 190, .07), 0 8px 22px rgba(0, 0, 0, .3); }
.lp-wxguide .wg-title { margin: 0 0 10px; font-size: 14.5px; font-weight: 700; letter-spacing: .14em;
  color: #f0d9a8; text-shadow: 0 0 10px rgba(240, 190, 90, .25); }
.lp-wxguide .wg-item { margin: 0 0 8px; font-size: 12.5px; line-height: 1.8; color: rgba(233, 220, 190, .85); }
.lp-wxguide .wg-item b { color: #e8c476; font-weight: 700; margin-right: 8px; }
.lp-wxguide .wg-copy { display: block; width: 100%; margin-top: 4px; padding: 11px; border-radius: 999px;
  border: 1px solid rgba(232, 196, 118, .55); background: rgba(232, 196, 118, .12); color: #f5df9e;
  font-size: 14px; letter-spacing: .14em; text-indent: .14em; cursor: pointer; }
.lp-wxguide .wg-copy:active { background: rgba(232, 196, 118, .24); }
/* 支付态标题行 */
.lp-payhead { text-align: center; }
.lp-payhead .amt { font-size: 30px; color: #f5df9e; font-weight: 700; font-family: Georgia, serif; margin: 2px 0 4px; }
.lp-payhead .pl { font-size: 12px; color: rgba(217, 194, 148, .6); margin-bottom: 4px; }
/* 成功态 */
.lp-ok { text-align: center; padding: 12px 0 6px; }
.lp-ok-flame { width: 26px; height: 42px; margin: 4px auto 16px;
  background: radial-gradient(50% 65% at 50% 78%, #fff6d8 0%, #ffd76a 35%, #ff9d2e 65%, rgba(255, 90, 20, 0) 100%);
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
  filter: drop-shadow(0 0 10px rgba(255, 170, 60, .95)) drop-shadow(0 0 26px rgba(255, 140, 30, .5));
  animation: lp-flick 1s ease-in-out infinite alternate; }
.lp-ok h4 { margin: 0 0 6px; font-size: 19px; letter-spacing: .2em; color: #f5df9e; }
.lp-ok p { margin: 0; font-size: 13px; color: rgba(217, 194, 148, .7); line-height: 1.9; }

/* 移动端：弹窗变底部抽板（底部留出 Home 指示条安全区） */
@media (max-width: 640px) {
  .lp-modal { align-items: flex-end; padding: 0; }
  .lp-panel { max-width: none; border-radius: 16px 16px 0 0; max-height: 88vh;
    padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)); }
  .lp-hero-cta { flex-direction: column; gap: 12px; }
  .lp-hero-note { margin-top: 24px; }
  .lp-grid { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 20px 4px; }
}

/* 减动效：全部静止（火苗保持满亮） */
@media (prefers-reduced-motion: reduce) {
  .lp-bg-photo, .lp-hero-glow, .lp-mini-flame, .lp-flame, .lp-glow, .lp-btn-main,
  .lp-motes i, .lp-ok-flame, .lp-panel { animation: none !important; }
}