:root{
  --gold:#c9a44a;
  --gold-2:#e8c97a;
  --gold-deep:#a07c2c;
  --gold-line:#8f7331;
  --ink:#f5eacf;
  --ink-soft:#d9c79a;
  --paper:rgba(18,14,11,.88);
  --paper-2:rgba(32,26,20,.82);
  --red:#c84b4b;
  --red-soft:#e08a8a;
  --bg-1:#0a0807;
  --bg-2:#14100d;
  --jade:#5a7a72;
  --shadow:rgba(0,0,0,.6);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;height:100%;}
body{
  font-family:"Songti SC","STSong","SimSun",serif;
  background:#050403;
  color:var(--ink); display:flex; justify-content:center; align-items:center;
  min-height:100vh; overflow:hidden;
}
.phone{
  position:relative; width:100%; max-width:430px; height:100vh; max-height:920px;
  background:
    radial-gradient(circle at 50% 8%, rgba(201,164,74,.14), transparent 52%),
    radial-gradient(circle at 18% 88%, rgba(90,122,114,.07), transparent 40%),
    radial-gradient(circle at 85% 75%, rgba(160,124,44,.06), transparent 38%),
    linear-gradient(180deg, #0f0c0a 0%, #161210 46%, #0b0908 100%);
  overflow:hidden; box-shadow:0 30px 90px rgba(0,0,0,.75);
}
.phone::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(90deg, rgba(255,255,255,.015) 0 1px, transparent 1px 6px);
  opacity:.25;
}
/* PC 端：固定 430x920 画框（与手机端同尺寸），由 JS 整体等比缩放适配窗口，
   保证文字与图案比例和手机端完全一致（手机端不受影响） */
@media (min-width:520px){
  .phone{width:430px;height:920px;max-height:none;}
}

.screen{position:absolute;inset:0;display:none;flex-direction:column;
  padding:34px 24px 28px;overflow-y:auto;}
.screen.active{display:flex;animation:fade .5s ease;}
@keyframes fade{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

/* 封面 */
#screen-cover{align-items:center;text-align:center;justify-content:flex-start;}
.brand{font-size:12px;letter-spacing:5px;color:var(--gold);margin-top:6px;text-shadow:0 0 18px rgba(201,164,74,.35);}
.tortoise-wrap{
  position:relative;margin:clamp(10px,2.6vh,30px) 0 6px;
  width:min(210px,26.9vh);height:min(242px,31vh);border-radius:22px;overflow:hidden;
  background:transparent url('../images/guijia-front.webp?v=v136') no-repeat center center;
  background-size:contain;
  filter:drop-shadow(0 0 30px rgba(201,164,74,.30)) drop-shadow(0 14px 34px rgba(0,0,0,.55));
  box-shadow:0 0 0 1px rgba(201,164,74,.15);
  flex-shrink:1;min-height:96px;
}
.tortoise-wrap img{display:none;}
.bagua-mini{display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;opacity:.92;}
.title{font-size:38px;font-weight:700;letter-spacing:7px;margin:4px 0 2px;
  background:linear-gradient(180deg,#f3e2b0 0%,#e8c97a 40%,#b88a2c 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 2px 10px rgba(201,164,74,.18);}
.subtitle{font-size:13px;letter-spacing:3px;color:var(--ink-soft);margin:0 0 16px;}

.cover-bar{display:flex;gap:10px;width:100%;margin-bottom:8px;}
.tier-badge{flex:1;padding:10px 8px;border-radius:14px;text-align:center;font-size:13px;letter-spacing:1px;
  background:linear-gradient(180deg,rgba(201,164,74,.18),rgba(201,164,74,.06));
  border:1.5px solid var(--gold-line);color:var(--gold-2);font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 4px 14px rgba(0,0,0,.25);}
.sign-btn{flex:1;padding:10px 8px;border-radius:14px;text-align:center;font-size:13px;letter-spacing:1px;cursor:pointer;
  background:var(--paper);border:1.5px solid rgba(201,164,74,.45);color:var(--gold-2);font-weight:700;}
.sign-btn:active{background:rgba(201,164,74,.12);}
.cover-quota{font-size:11px;color:var(--ink-soft);letter-spacing:2px;margin-bottom:14px;}

.btn-primary{
  width:100%;padding:16px;margin-top:8px;border:none;border-radius:16px;
  font-family:inherit;font-size:18px;letter-spacing:5px;font-weight:700;color:#16100a;
  background:linear-gradient(180deg,#f3e2b0 0%,#e8c97a 45%,#b88a2c 100%);
  box-shadow:0 8px 24px rgba(201,164,74,.35),inset 0 1px 0 rgba(255,255,255,.55);
  cursor:pointer;transition:transform .12s,box-shadow .12s;}
.btn-primary:hover{box-shadow:0 10px 28px rgba(201,164,74,.45);}
.btn-primary:active{transform:translateY(2px) scale(.99);}
.btn-gold{
  width:100%;padding:15px;margin-top:8px;border:none;border-radius:16px;
  font-family:inherit;font-size:16px;letter-spacing:3px;font-weight:700;color:#16100a;
  background:linear-gradient(180deg,#f3e2b0 0%,#e8c97a 50%,#b88a2c 100%);
  box-shadow:0 8px 22px rgba(201,164,74,.32),inset 0 1px 0 rgba(255,255,255,.55);cursor:pointer;}
.btn-gold:active{transform:translateY(2px);}
.btn-ghost{
  width:100%;padding:12px;margin-top:12px;border:1.5px solid var(--gold-line);
  border-radius:16px;background:rgba(255,255,255,.06);color:var(--gold-2);
  font-family:inherit;font-size:15px;letter-spacing:3px;cursor:pointer;}
.btn-ghost:hover{background:rgba(201,164,74,.10);}
.btn-ghost:active{background:rgba(201,164,74,.16);}
.btn-ghost.sm{padding:10px;font-size:13px;letter-spacing:1px;margin-top:8px;}
/* 首页「关于我们」等弹窗入口容器：screen-cover 为 align-items:center，
   需显式撑满宽度，否则内部 btn-ghost 按钮会收缩成文字宽度（比上方按钮窄） */
#popup-entries{width:100%;}
.actions{display:flex;flex-direction:column;}
.actions-row{display:flex;gap:8px;}
.actions-row .btn-ghost{flex:1;white-space:nowrap;padding-left:4px;padding-right:4px;}
/* 结果页按钮始终贴底可见，不被长内容顶出首屏 */
#screen-result .actions{position:sticky;bottom:0;margin-top:12px;padding-top:14px;z-index:3;
  background:linear-gradient(180deg, rgba(11,9,8,0) 0%, var(--bg-2) 28%);}

.foot-note{margin-top:auto;font-size:11px;color:rgba(217,199,154,.55);letter-spacing:1px;}
.brand-foot{font-size:12px;color:var(--gold);letter-spacing:4px;margin-top:6px;font-weight:700;text-shadow:0 0 14px rgba(201,164,74,.25);}
.icp-foot{font-size:10px;color:rgba(217,199,154,.42);letter-spacing:.4px;margin-top:5px;padding-bottom:4px;text-align:center;}
.icp-foot a{color:rgba(217,199,154,.5);text-decoration:none;}
.icp-foot a:active{color:var(--gold);}
.acct-icp{margin-top:18px;padding-bottom:10px;}

.topbar{position:relative;width:100%;min-height:44px;display:flex;align-items:center;gap:10px;font-size:15px;color:var(--ink-soft);
  letter-spacing:2px;margin-bottom:12px;padding-top:8px;}
.topbar-title{flex:1;text-align:center;font-size:15px;color:var(--ink-soft);letter-spacing:2px;padding:0 76px;}
.topbar-right{justify-content:flex-end;}
.topbar-right-block{text-align:right;margin-left:76px;}
/* 实物占卜页：标题较长，改为排在返回按钮下方、整行居中，避免与按钮挤成两行 */
#screen-cast .topbar{flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;}
#screen-cast .topbar .back{position:static;transform:none;align-self:flex-start;}
#screen-cast .topbar-title{flex:none;width:100%;padding:0;line-height:1.6;}
.res-date-line{font-size:15px;color:var(--ink-soft);letter-spacing:2px;white-space:nowrap;}
.res-date-tag{font-size:13px;color:var(--gold-2);letter-spacing:1px;margin-top:2px;}
.back{
  position:absolute;left:0;top:50%;transform:translateY(-50%);
  z-index:2;display:inline-flex;align-items:center;gap:6px;
  background:linear-gradient(145deg, rgba(28,22,16,.92), rgba(18,14,11,.92));
  border:1px solid rgba(201,164,74,.45);
  border-radius:999px;
  box-shadow:0 4px 14px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08);
  color:var(--gold-2);
  font-size:14px;
  letter-spacing:2px;
  padding:8px 16px 8px 12px;
  cursor:pointer;
  font-family:inherit;
  transition:all .2s ease;
  white-space:nowrap;flex-shrink:0;
}
.back:active{transform:translateY(-50%) scale(.96);}
.back-arrow{
  display:inline-block;width:9px;height:9px;
  border-left:2px solid var(--gold-2);border-bottom:2px solid var(--gold-2);
  transform:rotate(45deg);
  margin-right:2px;
}

/* 占卜 */
#screen-divine,#screen-combo{align-items:center;}
.tray{
  position:relative;width:100%;height:210px;display:flex;justify-content:center;align-items:flex-start;
  margin:8px 0 4px;padding-top:26px;
}
.tray::before{
  content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-42%);
  width:300px;height:140px;border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(201,164,74,.10) 0%, rgba(201,164,74,.02) 60%, transparent 70%);
  pointer-events:none;z-index:1;
}
.tray-shell{display:none;}
.coins{position:relative;display:flex;gap:18px;z-index:2;perspective:600px;align-items:center;}
.coin{width:96px;height:96px;position:relative;}
.coin-inner{
  width:100%;height:100%;position:relative;transform-style:preserve-3d;
  transition:transform .7s cubic-bezier(.35,1.4,.5,1);
  border-radius:50%;
  box-shadow:0 8px 20px rgba(0,0,0,.45), inset 0 2px 6px rgba(255,255,255,.15);
}
.coin-side{
  position:absolute;inset:0;border-radius:50%;backface-visibility:hidden;
  background-position:center;background-repeat:no-repeat;
  background-size:cover;border:2px solid rgba(201,164,74,.55);
}
.coin-front{background-image:url('../images/coin-front-0.webp');transform:rotateY(0);}
.coin-back{background-image:url('../images/coin-back.webp');transform:rotateY(180deg);}
.coin.cf-0 .coin-front{background-image:url('../images/coin-front-0.webp');}
.coin.cf-1 .coin-front{background-image:url('../images/coin-front-1.webp');}
.coin.cf-2 .coin-front{background-image:url('../images/coin-front-2.webp');}
.coin.cf-3 .coin-front{background-image:url('../images/coin-front-3.webp');}
.coin.cf-4 .coin-front{background-image:url('../images/coin-front-4.webp');}
.coin.spin .coin-inner{animation:coinSpin .7s ease;}
@keyframes coinSpin{
  0%{transform:rotateY(0) translateY(0);}
  50%{transform:rotateY(900deg) translateY(-34px);}
  100%{transform:rotateY(1800deg) translateY(0);}
}
.coin.face-yang .coin-inner{transform:rotateY(0deg);}
.coin.face-yin .coin-inner{transform:rotateY(180deg);}

.progress{width:100%;margin:6px 0 14px;text-align:center;}
#prog-text,#combo-prog-text{font-size:14px;color:var(--ink-soft);letter-spacing:2px;}
.yao-lines-mini{display:flex;justify-content:center;gap:6px;margin-top:12px;}
.yao-lines-mini .yl{width:34px;height:8px;border-radius:2px;background:rgba(255,255,255,.1);}
.yao-lines-mini .yl.yang{background:linear-gradient(90deg,var(--gold-2),var(--gold-deep));box-shadow:0 0 6px rgba(201,164,74,.35);}
.yao-lines-mini .yl.yin{background:linear-gradient(90deg,#5a6b7a,#3a4a5a);}
.hint{font-size:12px;color:var(--ink-soft);text-align:center;line-height:1.7;margin-top:14px;padding:0 8px;}
.hint b{color:var(--gold-2);}

/* 结果 */
#screen-result{align-items:center;}
.gua-head{text-align:center;margin-bottom:10px;width:100%;}
.gua-name{font-size:30px;font-weight:700;letter-spacing:4px;color:var(--gold-2);text-shadow:0 0 16px rgba(201,164,74,.22);}
.gua-sub{font-size:13px;color:var(--ink-soft);letter-spacing:1px;margin-top:2px;}
.gua-figure{display:flex;justify-content:center;align-items:center;gap:18px;margin:6px 0 14px;width:100%;}
.yao-column{display:flex;flex-direction:column-reverse;gap:7px;align-items:center;width:95px;}
.yao{width:78px;height:11px;margin:0 auto;position:relative;}
.yao.yang{background:linear-gradient(90deg,var(--gold-2),var(--gold-deep));border-radius:3px;box-shadow:0 0 8px rgba(201,164,74,.25);}
.yao.yang::after{content:"○";position:absolute;right:-17px;top:-5px;font-size:14px;color:var(--gold-2);}
.yao.yin{background:linear-gradient(90deg,#5a6b7a 0%,#3a4a5a 38%,transparent 38%,transparent 62%,#3a4a5a 62%,#5a6b7a 100%);border-radius:3px;}
.yao.yin::after{content:"×";position:absolute;right:-16px;top:-6px;font-size:15px;color:#7a9ab0;}
.yao.static::after{display:none;}
.arrow{font-size:30px;color:var(--gold);}

.card{
  background:var(--paper);border:1px solid rgba(201,164,74,.25);border-radius:16px;padding:16px 18px;margin-bottom:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.35); backdrop-filter:blur(4px);
}
.card-t{font-size:14px;line-height:1.8;color:var(--ink);margin-bottom:10px;}
.card-t:last-child{margin-bottom:0;}
.card-t.tappable{position:relative;padding-right:56px;cursor:pointer;border-radius:8px;transition:background .15s;}
.card-t.tappable:active{background:rgba(201,164,74,.12);}
.tap-hint{position:absolute;right:0;top:1px;font-size:11px;color:var(--gold-2);letter-spacing:1px;opacity:.85;}
.tap-hint-inline{font-size:11px;color:var(--gold-2);letter-spacing:1px;opacity:.85;margin-left:8px;font-weight:400;}
#dong-list .dong{position:relative;padding-right:50px;cursor:pointer;transition:background .15s;border-radius:6px;}
#dong-list .dong:active{background:rgba(201,164,74,.12);}
#dong-list .dong .tap-hint{top:0;}
.tag{display:inline-block;background:linear-gradient(180deg,var(--gold-2),var(--gold-deep));color:#16100a;
  font-size:11px;padding:2px 9px;border-radius:6px;margin-right:8px;letter-spacing:1px;font-weight:700;}
.card-bai{font-size:14px;line-height:1.85;color:var(--ink-soft);border-top:1px dashed rgba(201,164,74,.25);padding-top:12px;margin-top:6px;}
.yi-tag{margin-top:12px;font-size:14px;color:var(--red-soft);letter-spacing:2px;font-weight:700;}
.card-title{font-size:14px;letter-spacing:3px;color:var(--gold-2);margin-bottom:10px;font-weight:700;}
#dong-list .dong{font-size:13.5px;line-height:1.75;color:var(--ink);margin-bottom:10px;padding-left:12px;border-left:3px solid var(--gold);}
/* 结论模块：更醒目但保持美观 */
.advice{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;
  background:linear-gradient(180deg,rgba(201,164,74,.12),rgba(201,164,74,.04));
  border:1.5px solid rgba(201,164,74,.45);
  border-radius:16px;padding:14px 13px 13px;
  box-shadow:0 6px 22px rgba(201,164,74,.14),inset 0 1px 0 rgba(255,255,255,.05);
}
.advice.single{grid-template-columns:1fr;width:100%;}
.advice-head{
  grid-column:1 / -1;display:flex;align-items:center;gap:8px;
  font-size:15px;font-weight:700;letter-spacing:2px;color:var(--gold-2);margin-bottom:2px;
}
.advice-head::before{
  content:"";display:inline-block;width:5px;height:17px;border-radius:3px;
  background:linear-gradient(180deg,var(--gold-2),var(--gold-deep));
  box-shadow:0 0 8px rgba(201,164,74,.45);
}
.advice-sub{margin-left:auto;font-size:11px;font-weight:400;letter-spacing:1px;color:var(--ink-soft);}
/* 解卦结论右上角：查看黄历（趋吉避凶）——与下方「卦辞」「象曰」小标签同款（金色实底、深色字） */
.adv-hl{
  margin-left:auto;flex-shrink:0;cursor:pointer;font-family:inherit;
  font-size:11px;font-weight:700;letter-spacing:1px;line-height:1.45;
  color:#16100a;background:linear-gradient(180deg,var(--gold-2),var(--gold-deep));
  border:none;border-radius:6px;padding:3px 9px;
}
.adv-hl:active{opacity:.85;}
.adv-item{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(34,28,21,.9),rgba(18,14,11,.92));
  border:1px solid rgba(201,164,74,.24);border-left:3px solid var(--gold);
  border-radius:12px;padding:11px 12px 12px;
}
.adv-k{
  display:inline-flex;align-items:center;gap:4px;
  font-size:12px;color:#16100a;background:linear-gradient(180deg,var(--gold-2),var(--gold-deep));
  padding:3px 9px;border-radius:6px;margin:0 12px 8px 0;letter-spacing:1px;font-weight:700;
  box-shadow:0 2px 6px rgba(201,164,74,.28);
}
.adv-item span:last-child{font-size:14px;line-height:1.7;color:var(--ink);font-weight:500;}

/* 合卦 */
.combo-invite{text-align:center;margin:6px 0 4px;}
.combo-glyph{font-size:68px;color:var(--gold-2);text-shadow:0 0 18px rgba(201,164,74,.22);}
.combo-friend-name{font-size:16px;color:var(--ink-soft);letter-spacing:2px;margin-bottom:6px;}
.combo-tip{font-size:13px;color:var(--ink-soft);line-height:1.7;}
.combo-result-head{text-align:center;font-size:22px;font-weight:700;letter-spacing:3px;color:var(--gold-2);margin-bottom:14px;}
.combo-trio{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:16px;flex-wrap:wrap;}
.combo-person{display:flex;flex-direction:column;align-items:center;gap:4px;}
.cp-glyph{font-size:44px;color:var(--gold-2);}
.cp-name{font-size:11px;color:var(--ink-soft);}
.combo-person.combo-he .cp-glyph{font-size:52px;color:var(--red-soft);text-shadow:0 0 14px rgba(200,75,75,.25);}
.combo-plus,.combo-eq{font-size:26px;color:var(--gold-line);}
.combo-rel{margin-top:10px;font-size:14px;color:var(--red-soft);line-height:1.7;letter-spacing:1px;font-weight:700;}

/* 玩法 */
#screen-how{background:rgba(0,0,0,.15);}
.how .how-title{font-size:17px;color:var(--gold-2);font-weight:700;letter-spacing:3px;text-align:center;margin:2px 0 4px;}
.how h3{font-size:16px;color:var(--gold-2);margin:36px 0 6px;letter-spacing:2px;}
.how p{font-size:13.5px;line-height:1.85;color:var(--ink-soft);margin:6px 0;}
.how ul{margin:6px 0;padding-left:20px;}
.how li{font-size:13.5px;line-height:1.95;color:var(--ink-soft);}
.how b{color:var(--gold-2);}
/* 「七、《易传》智慧」末句：守住本心，以不变，应万变。——金色加粗，略放大 */
.how p.how-keep{margin-top:12px;font-size:14px;letter-spacing:1px;}

/* 弹窗 */
.modal{position:absolute;inset:0;background:rgba(5,4,3,.78);display:none;
  justify-content:center;align-items:center;z-index:20;backdrop-filter:blur(4px);padding:20px;}
.modal.active{display:flex;animation:fade .3s ease;}
/* 二维码弹窗会被天命签弹窗叠加调用，需盖在普通弹窗之上（低于 toast 的 40） */
#modal-share{z-index:30;}
.modal-box,.modal-card{position:relative;background:var(--paper);border:1px solid rgba(201,164,74,.22);border-radius:18px;padding:24px 22px;width:88%;max-width:330px;text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);max-height:88%;overflow-y:auto;}
.modal-box.wide{max-width:360px;}
.modal-close{position:absolute;top:8px;right:14px;border:none;background:none;font-size:26px;color:var(--gold);cursor:pointer;}
.modal-title{font-size:17px;letter-spacing:4px;color:var(--gold-2);margin-bottom:14px;font-weight:700;}
.modal-hint{font-size:11.5px;color:var(--ink-soft);line-height:1.65;margin:12px 0 8px;}
#qrcode,#combo-qrcode{display:flex;justify-content:center;}
#qrcode canvas,#combo-qrcode canvas{border-radius:8px;}

/* 二十四节气（宋氏美学） */
.jieqi-box{width:92%;max-width:360px;padding:0;text-align:left;border-radius:22px;overflow:hidden;max-height:90vh;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#161210,#0b0908);box-shadow:0 24px 60px rgba(0,0,0,.6), inset 0 0 0 1px rgba(201,164,74,.25);}
.jieqi-back{top:10px;left:10px;transform:none;}
.jieqi-scroll{overflow-y:auto;-webkit-overflow-scrolling:touch;}
.jieqi-art{position:relative;height:auto;overflow:visible;flex-shrink:0;background:#bcd6e3;}
.jieqi-art-img{position:relative;display:block;width:100%;height:auto;object-fit:contain;}
.art-title{position:absolute;top:14px;left:50%;transform:translateX(-50%);font-size:13px;letter-spacing:6px;color:#5a7a8a;font-weight:500;
  text-shadow:0 1px 2px rgba(255,255,255,.7);background:rgba(255,255,255,.35);padding:4px 12px;border-radius:20px;z-index:2;}
.art-card{background:rgba(0,0,0,.22);border:1px solid rgba(201,164,74,.18);border-radius:14px;padding:14px 14px 12px;margin-bottom:12px;}
.art-card-title{font-size:15px;color:var(--gold-2);letter-spacing:2px;margin-bottom:10px;display:flex;align-items:center;gap:8px;}
.art-card-title::before{content:"";display:inline-block;width:4px;height:16px;background:var(--gold);border-radius:2px;}
.art-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.85;margin:6px 0;}
.art-card p b{color:var(--ink);font-weight:500;letter-spacing:1px;}
.jieqi-body{padding:16px 18px 14px;position:relative;z-index:2;background:var(--paper);}
.jieqi-card{background:rgba(0,0,0,.22);border:1px solid rgba(201,164,74,.18);border-radius:14px;padding:14px 14px 12px;margin-bottom:12px;}
.jieqi-card-title{font-size:15px;color:var(--gold-2);letter-spacing:2px;margin-bottom:10px;display:flex;align-items:center;gap:8px;}
.jieqi-card-title::before{content:"";display:inline-block;width:4px;height:16px;background:var(--gold);border-radius:2px;}
.jieqi-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.85;margin:6px 0;}
.jieqi-card p b{color:var(--ink);font-weight:500;letter-spacing:1px;}
.jieqi-intro{font-size:13.5px;color:var(--ink-soft);line-height:1.9;padding:14px 16px;margin:0 2px 12px;text-align:justify;
  border:1px dashed rgba(201,164,74,.22);border-radius:12px;background:rgba(201,164,74,.05);}
.jieqi-guide{margin-top:4px;padding:12px 14px;border-radius:12px;background:linear-gradient(90deg, rgba(201,164,74,.12), rgba(201,164,74,.04));
  border-left:3px solid var(--gold-line);font-size:13px;color:var(--gold-2);line-height:1.8;letter-spacing:1px;}
.jieqi-float{position:absolute;left:12px;right:12px;bottom:12px;z-index:3;
  background:rgba(11,9,8,.42);border:1px solid rgba(201,164,74,.28);border-radius:14px;
  backdrop-filter:blur(5px);box-shadow:0 6px 18px rgba(0,0,0,.25);}
.jieqi-save-btn{width:100%;margin-top:14px;letter-spacing:2px;}
.jieqi-img{display:block;width:100%;max-width:320px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.45);margin-top:6px;}

/* 天命签卡片 */
.card-preview{margin:6px 0 14px;display:flex;justify-content:center;max-height:78vh;}
.card-preview canvas{max-width:100%;max-height:78vh;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.45);object-fit:contain;}

/* 复制文案 */
.copy-list{display:flex;flex-direction:column;gap:10px;text-align:left;}
.copy-item{background:var(--paper-2);border:1px solid rgba(201,164,74,.2);border-radius:10px;padding:12px 70px 12px 14px;cursor:pointer;
  font-size:13.5px;line-height:1.9;color:var(--ink);position:relative;}
.copy-item:active{background:rgba(201,164,74,.14);}
.copy-item .copy-tag{position:absolute;top:8px;right:10px;font-size:11px;color:var(--gold-2);}
.copy-item .copy-copied{color:var(--red-soft);}
.copy-item .copy-link{margin-top:6px;font-size:12px;color:var(--gold-2);line-height:1.6;word-break:break-all;}

/* 签到 */
.sign-circle{width:120px;height:120px;border-radius:50%;margin:6px auto 10px;
  background:radial-gradient(circle at 40% 35%,#f3e2b0,#e8c97a 55%,#b88a2c);
  display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:700;color:#16100a;
  box-shadow:0 8px 22px rgba(201,164,74,.35),inset 0 2px 6px rgba(255,255,255,.55);}
.sign-streak{font-size:18px;color:var(--gold-2);font-weight:700;letter-spacing:2px;}
.sign-tip{font-size:13px;color:var(--ink-soft);margin:8px 0 6px;line-height:1.65;}
.sign-status{font-size:12px;color:var(--ink-soft);margin:0 0 14px;line-height:1.5;min-height:18px;}
.sign-status.warn{color:#e8c97a;}
.sign-status.tappable{cursor:pointer;text-decoration:underline;text-underline-offset:3px;
  padding:2px 0;-webkit-tap-highlight-color:transparent;}
.sign-status.tappable:active{opacity:.65;}
.btn-gold:disabled{opacity:.55;cursor:not-allowed;}

/* 黄金时刻 */
.gold-box{background:linear-gradient(160deg,#18120c,#0c0906);color:#f3e2b0;border:1px solid rgba(201,164,74,.22);}
.gold-box .modal-title{color:var(--gold-2);}
.gold-spark{font-size:15px;letter-spacing:7px;color:var(--gold-2);margin-bottom:8px;}
.gold-yao{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;gap:7px;margin:6px auto 8px;}
.gold-yao .yao{width:70px;height:10px;}
.gold-yao .yao.yang{background:linear-gradient(90deg,var(--gold-2),var(--gold-deep));border-radius:3px;box-shadow:0 0 8px rgba(201,164,74,.25);}
.gold-yao .yao.yin{background:linear-gradient(90deg,#5a6b7a 0%,#3a4a5a 38%,transparent 38%,transparent 62%,#3a4a5a 62%,#5a6b7a 100%);border-radius:3px;}
.gold-yao .yao.yang::after{content:"○";position:absolute;right:-16px;top:-5px;font-size:13px;color:var(--gold-2);}
.gold-yao .yao.yin::after{content:"×";position:absolute;right:-15px;top:-6px;font-size:14px;color:#7a9ab0;}
.gold-yao .yao.static::after{display:none;}
.gold-name{font-size:26px;font-weight:700;letter-spacing:4px;color:#f3e2b0;margin:4px 0;}
.gold-xiang{font-size:14px;color:var(--ink-soft);line-height:1.7;max-width:260px;margin:0 auto;}
.gold-divider{font-size:13px;color:rgba(201,164,74,.65);letter-spacing:3px;margin:16px 0 10px;}
.gold-brand{font-size:15px;color:var(--gold-2);letter-spacing:1px;}
.gold-prod{font-size:13px;color:var(--ink-soft);line-height:1.9;margin:8px auto 16px;max-width:280px;}
.gold-prod b{color:#f3e2b0;}
.gold-box .btn-gold{color:#16100a;}
.gold-box .btn-ghost{color:var(--gold-2);border-color:rgba(201,164,74,.45);background:rgba(255,255,255,.05);}

/* 传家宝典 */
.bd-hero{text-align:center;margin-bottom:14px;}
.bd-hero img{width:160px;height:auto;border-radius:14px;filter:drop-shadow(0 8px 20px rgba(0,0,0,.45));}
.bd-title{font-size:22px;font-weight:700;letter-spacing:3px;color:var(--gold-2);margin-top:6px;}
.bd-sub{font-size:12px;color:var(--ink-soft);letter-spacing:1px;margin-top:4px;}
.bd-list{text-align:left;padding-left:18px;margin:8px 0;}
.bd-list li{font-size:13px;line-height:1.8;color:var(--ink-soft);margin-bottom:8px;}
.bd-list b{color:var(--gold-2);}
.bd-cta{font-size:13px;color:var(--gold);text-align:center;margin:6px 0 12px;letter-spacing:1px;}

/* Toast */
.toast{position:absolute;left:50%;bottom:80px;transform:translateX(-50%) translateY(20px);
  background:rgba(22,16,10,.95);color:#f3e2b0;padding:10px 18px;border-radius:24px;font-size:13px;
  letter-spacing:1px;opacity:0;pointer-events:none;transition:.3s;z-index:40;max-width:80%;text-align:center;border:1px solid rgba(201,164,74,.25);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* 滚动条美化 */
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-thumb{background:rgba(201,164,74,.25);border-radius:2px;}

/* 实物起卦 */
#screen-cast{align-items:stretch;}
.cast-wrap{padding:14px 14px 24px;overflow-y:auto;height:100%;box-sizing:border-box;}
.cast-tip{font-size:13px;color:var(--ink-soft);line-height:1.75;margin:6px 2px 10px;}
.cast-tip b{color:var(--gold-2);}
.cast-body{display:flex;gap:14px;align-items:flex-start;}
.cast-list{list-style:none;flex:1;display:flex;flex-direction:column;gap:8px;margin:0;padding:0;}
.cast-row{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.03);
  border:1px solid rgba(201,164,74,.12);border-radius:12px;padding:6px 10px;}
.cast-yao{width:20px;text-align:center;font-size:15px;color:var(--gold-2);font-weight:700;flex:none;}
.cast-coin{width:54px;height:54px;flex:none;cursor:pointer;}
.cast-coin .coin-front{background-image:url('../images/coin-front-0.webp');}
.cast-coin.flipped .coin-inner{transform:rotateY(180deg);}
.cast-state{font-size:12px;color:var(--ink-soft);line-height:1.4;}
.cast-preview{flex:none;text-align:center;position:sticky;top:10px;align-self:flex-start;
  background:rgba(255,255,255,.03);border:1px solid rgba(201,164,74,.15);border-radius:12px;padding:12px 10px 10px;
  display:flex;flex-direction:column;align-items:center;min-width:110px;}
.cast-preview-title{font-size:12px;color:var(--ink-soft);margin-bottom:10px;letter-spacing:2px;}
.cast-preview .yao{width:62px;height:9px;margin:0 auto;position:relative;}
.cast-preview .yao-column{gap:8px;width:100%;align-items:center;margin:0 auto;}
.cast-preview .yao.yang{background:linear-gradient(90deg,var(--gold-2),var(--gold-deep));border-radius:3px;box-shadow:0 0 8px rgba(201,164,74,.25);}
.cast-preview .yao.yang::after{content:"○";position:absolute;right:-17px;top:-5px;font-size:14px;color:var(--gold-2);}
.cast-preview .yao.yin{background:linear-gradient(90deg,#5a6b7a 0%,#3a4a5a 38%,transparent 38%,transparent 62%,#3a4a5a 62%,#5a6b7a 100%);border-radius:3px;}
.cast-preview .yao.yin::after{content:"×";position:absolute;right:-16px;top:-6px;font-size:15px;color:#7a9ab0;}
.cast-preview .yao.static::after{display:none;}
.cast-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
/* 起卦页顶部提示（原在底部居中，现移到说明文字下方、居左） */
.cast-note{font-size:12px;color:var(--ink-soft);line-height:1.7;text-align:left;margin:0 2px 10px;}
/* 起卦页底部「本解卦传承…」说明模块 */
.cast-origin{
  margin-top:18px;padding:12px 14px;border-radius:12px;
  background:rgba(201,164,74,.06);border:1px solid rgba(201,164,74,.20);
  font-size:12.5px;color:var(--ink-soft);line-height:1.95;letter-spacing:.4px;text-align:left;
}
.cast-origin p{margin:0 0 6px;}
.cast-origin p:last-child{margin-bottom:0;}
.cast-origin-key{color:var(--gold-2);font-weight:700;letter-spacing:1px;}
.cast-origin-quote{color:var(--gold-2);}

/* ---------- 账户入口 ---------- */
.acct-btn{flex:1;padding:10px 8px;border-radius:14px;text-align:center;font-size:13px;letter-spacing:1px;cursor:pointer;
  background:var(--paper);border:1.5px solid rgba(201,164,74,.45);color:var(--gold-2);font-weight:700;}
.acct-btn:active{background:rgba(201,164,74,.12);}
.acct-btn.on{border-color:var(--gold);box-shadow:inset 0 0 0 1px rgba(201,164,74,.18),0 0 14px rgba(201,164,74,.18);}

/* ---------- 登录 / 注册 / 找回 ---------- */
.auth-tabs{display:flex;gap:8px;margin-bottom:14px;}
.auth-tab{flex:1;padding:10px 4px;border-radius:12px;border:1.5px solid rgba(201,164,74,.3);
  background:rgba(255,255,255,.04);color:var(--ink-soft);font-family:inherit;font-size:14px;letter-spacing:2px;cursor:pointer;}
.auth-tab.active{background:linear-gradient(180deg,rgba(201,164,74,.22),rgba(201,164,74,.08));
  border-color:var(--gold-line);color:var(--gold-2);font-weight:700;}
.auth-pane{display:none;flex-direction:column;}
.auth-pane.active{display:flex;}
.auth-input{width:100%;padding:13px 14px;margin-bottom:10px;border-radius:12px;
  border:1.5px solid rgba(201,164,74,.3);background:rgba(255,255,255,.05);
  color:var(--ink);font-family:inherit;font-size:15px;letter-spacing:1px;outline:none;}
.auth-input:focus{border-color:var(--gold);background:rgba(201,164,74,.09);}
.auth-input::placeholder{color:rgba(217,199,154,.42);}
/* 原生下拉：系统默认白底，深色主题下选项文字几乎看不见 → 显式指定深色 */
select.auth-input{color-scheme:dark;cursor:pointer;}
select.auth-input option{background-color:#1b1710;color:#f0e4c0;}
/* ---------- 导出我的数据：日期区间 + 导出内容勾选 ---------- */
.exp-range{display:flex;gap:8px;margin-bottom:12px;}
.exp-range label{flex:1;min-width:0;font-size:12px;color:var(--ink-soft);letter-spacing:1px;}
.exp-range .auth-input{margin:6px 0 0;text-align:center;font-size:14px;
  color-scheme:dark;cursor:pointer;}
.exp-range .auth-input::-webkit-calendar-picker-indicator{
  filter:brightness(0) invert(1) sepia(45%) saturate(320%) hue-rotate(350deg);cursor:pointer;}
.exp-fields{display:flex;flex-direction:column;gap:6px;margin:0 0 14px;}
.exp-fields label{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--ink);
  letter-spacing:1px;padding:10px 12px;border:1px solid rgba(201,164,74,.22);border-radius:10px;
  background:rgba(255,255,255,.04);cursor:pointer;}
.exp-fields label:active{background:rgba(201,164,74,.14);}
.exp-fields input[type=checkbox]{width:17px;height:17px;min-width:17px;margin:0;flex:none;
  accent-color:#c9a44a;cursor:pointer;}
/* 「取消」按钮被挤到换行，撑成竖排两字 —— 限定在本弹窗内不换行 */
#modal-export #btn-export-cancel{white-space:nowrap;padding:0 18px;}
.auth-row{display:flex;gap:8px;}
.auth-row .auth-input{flex:1;margin-bottom:10px;min-width:0;}
.auth-code-btn{flex:none;height:47px;padding:0 14px;border-radius:12px;border:1.5px solid var(--gold-line);
  background:rgba(201,164,74,.14);color:var(--gold-2);font-family:inherit;font-size:13px;letter-spacing:1px;
  cursor:pointer;white-space:nowrap;}
.auth-code-btn:disabled{opacity:.45;cursor:default;}
.agree-row{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:var(--ink-soft);line-height:1.6;margin:2px 2px 8px;cursor:pointer;}
.agree-row input[type=checkbox]{width:16px;height:16px;margin-top:2px;flex:none;accent-color:#c9a44a;}
.agree-row a{color:var(--gold);text-decoration:none;}
.agree-row a:active{color:#f3e2b0;}
.auth-hint{font-size:12px;color:var(--ink-soft);line-height:1.75;margin:14px 2px 0;}
/* 短信通道未开通期间的注册提示（注册面板内） */
.sms-off-note{font-size:12px;color:var(--gold-2);line-height:1.7;margin:0 0 10px;padding:8px 10px;
  border:1px solid var(--gold-line);border-radius:10px;background:rgba(201,164,74,.10);}
/* 登录/注册按钮行（位于输入框下方）：默认「登录」高亮；找回密码单独一行 */
#auth-row-main .auth-tab.active{background:linear-gradient(180deg,#f3e2b0 0%,#e8c97a 45%,#b88a2c 100%);
  border-color:transparent;color:#16100a;font-weight:700;
  box-shadow:0 8px 24px rgba(201,164,74,.32),inset 0 1px 0 rgba(255,255,255,.55);}
.auth-tab.submit{background:linear-gradient(180deg,#f3e2b0 0%,#e8c97a 45%,#b88a2c 100%);
  border-color:transparent;color:#16100a;font-weight:700;letter-spacing:4px;
  box-shadow:0 8px 24px rgba(201,164,74,.32),inset 0 1px 0 rgba(255,255,255,.55);}
.auth-tab.submit:active{transform:translateY(2px) scale(.99);}
#auth-row-reset #btn-reset{flex:2;}
#auth-row-reset #btn-reset-back{flex:1;}

/* ---------- 我的账户 ---------- */
.acct-card{background:var(--paper);border:1px solid rgba(201,164,74,.22);border-radius:16px;
  padding:20px 18px;margin-bottom:14px;text-align:center;}
.acct-phone{font-size:21px;color:var(--gold-2);letter-spacing:3px;font-weight:700;margin-bottom:8px;}
.acct-bd{font-size:13px;color:var(--ink-soft);letter-spacing:1px;}
.acct-bd.on{color:var(--gold-2);font-weight:700;}
#acct-bind-box{margin-bottom:14px;}
#acct-bind-box .auth-input{margin-bottom:10px;}
#acct-pw-box{margin-bottom:14px;}
#acct-pw-box .auth-input{margin-bottom:10px;}
#pw-msg{margin:10px 0 0;min-height:18px;}
#pw-msg.ok{color:#9fd18a;}
#pw-msg.err{color:var(--red-soft);}
/* 我的：集卦 · 人生四卦 / 黄金文化小课堂 / 我的公益证书 / 修改密码 —— 两列网格 */
.acct-menu{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px;}
.acct-menu-btn{flex:1;min-width:0;padding:12px 4px;border-radius:12px;cursor:pointer;
  border:1px solid rgba(201,164,74,.28);background:rgba(201,164,74,.06);color:var(--ink);
  font-family:inherit;font-size:11px;letter-spacing:.5px;line-height:1.2;
  display:flex;align-items:center;justify-content:center;gap:2px;white-space:nowrap;}
.acct-menu-btn:active{background:rgba(201,164,74,.18);}
.acct-menu-btn.danger{color:#e07a6e;border-color:rgba(224,122,110,.5);}
.acct-menu-btn.danger:active{background:rgba(224,122,110,.16);}
.acct-menu-btn .badge{margin-left:3px;}
.bd-unlock{font-size:12.5px;color:var(--ink-soft);line-height:1.7;margin:10px 0 4px;}
.bd-unlock.on{color:var(--gold-2);}

/* 右上角账号按钮 */
.top-acct-btn{position:absolute;top:34px;right:24px;z-index:5;padding:7px 14px;border-radius:999px;
  border:1.5px solid rgba(201,164,74,.5);background:rgba(24,19,15,.85);color:var(--gold-2);
  font-family:inherit;font-size:13px;letter-spacing:2px;font-weight:700;cursor:pointer;
  box-shadow:0 4px 14px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08);}
.top-acct-btn:active{transform:scale(.96);}
.top-acct-btn.on{background:linear-gradient(180deg,rgba(201,164,74,.25),rgba(201,164,74,.08));border-color:var(--gold);}
button.tier-badge{cursor:pointer;border:1.5px solid var(--gold-line);font-family:inherit;font-weight:700;}
button.tier-badge:active{background:rgba(201,164,74,.22);}
.hl-btn{flex:1;padding:10px 6px;border-radius:14px;text-align:center;font-size:13px;letter-spacing:1px;cursor:pointer;
  background:var(--paper);border:1.5px solid rgba(201,164,74,.45);color:var(--gold-2);font-weight:700;}
.hl-btn:active{background:rgba(201,164,74,.12);}

/* 封面拆分的起卦按钮（遇事不决 / 周易卜卦 / 查看黄历 三枚一行） */
.split-cast{display:flex;gap:8px;margin-top:8px;width:100%;}
.btn-cast-split{flex:1;padding:14px 4px 12px;border:1.5px solid rgba(201,164,74,.4);border-radius:16px;
  background:linear-gradient(180deg,rgba(201,164,74,.18),rgba(201,164,74,.04));
  color:var(--gold-2);font-family:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 6px 16px rgba(0,0,0,.25);}
.btn-cast-split:active{transform:translateY(2px);}
.btn-cast-split.primary{background:linear-gradient(180deg,#f3e2b0 0%,#e8c97a 45%,#b88a2c 100%);
  color:#16100a;border-color:var(--gold);font-weight:700;
  box-shadow:0 8px 24px rgba(201,164,74,.35),inset 0 1px 0 rgba(255,255,255,.55);}
.split-icon{font-size:26px;line-height:1;}
.btn-cast-split.primary .split-icon{font-size:30px;color:#16100a;}
.split-name{font-size:16px;letter-spacing:2px;font-weight:700;white-space:nowrap;}
.split-sub{font-size:11px;letter-spacing:2px;color:var(--ink-soft);}
.btn-cast-split.primary .split-sub{color:rgba(22,16,10,.7);}

/* 周易卜卦 · 所问何事 */
.topic-tip{font-size:13px;color:var(--ink-soft);line-height:1.7;text-align:center;margin:8px 0 16px;}
.topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px;}
.topic-chip{padding:16px 8px;border:1.5px solid rgba(201,164,74,.35);border-radius:14px;
  background:linear-gradient(180deg,rgba(201,164,74,.12),rgba(201,164,74,.03));
  color:var(--ink);font-family:inherit;font-size:16px;letter-spacing:3px;font-weight:700;cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:transform .12s,background .18s,color .18s;}
.topic-chip:active{transform:translateY(2px);}
.topic-chip.sel{background:linear-gradient(180deg,#f3e2b0 0%,#e8c97a 45%,#b88a2c 100%);
  color:#16100a;border-color:var(--gold);box-shadow:0 6px 18px rgba(201,164,74,.35),inset 0 1px 0 rgba(255,255,255,.55);}
.topic-chip.all{grid-column:1 / -1;letter-spacing:6px;}
/* 起卦前 · 正心提示（v85） */
.topic-note{margin-top:16px;padding:14px 16px;border-radius:12px;
  background:rgba(201,164,74,.06);border:1px solid rgba(201,164,74,.20);
  font-size:12.5px;color:var(--ink-soft);line-height:1.95;letter-spacing:.4px;text-align:center;}
.topic-note-t{font-size:15px;font-weight:700;color:var(--gold);letter-spacing:2px;margin-bottom:9px;}
.topic-note p{margin:0 0 4px;}
.topic-note p:last-child{margin-bottom:0;}
.topic-note p.tn-break{margin-top:9px;}

/* 卜卦提示 · 三戒（v105） */
.cast-motto{
  width:100%;margin:12px 0 4px;padding:11px 12px;border-radius:12px;text-align:center;
  background:linear-gradient(180deg,rgba(201,164,74,.10),rgba(201,164,74,.03));
  border:1px solid rgba(201,164,74,.28);
  font-size:14.5px;font-weight:700;letter-spacing:3px;color:var(--gold);
  text-shadow:0 0 12px rgba(201,164,74,.20);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

/* 实物占卜 · 周易卦爻辞占 */
.cast-list3{list-style:none;flex:1;display:flex;flex-direction:column;gap:7px;margin:0;padding:0;}
.cast-row3{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.03);
  border:1px solid rgba(201,164,74,.15);border-radius:12px;padding:8px 10px;}
.cast-coins{display:flex;gap:6px;}
.coin-mini{width:40px;height:40px;border:none;border-radius:50%;
  background-color:rgba(201,164,74,.12);
  background-image:url('../images/coin-front-0.webp?v=v136');
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  color:transparent;font-size:0;cursor:pointer;padding:0;flex:none;
  -webkit-tap-highlight-color:transparent;transition:transform .12s;}
.coin-mini.flipped{background-image:url('../images/coin-back.webp?v=v136');}
.coin-mini:active{transform:scale(.92);}
.cast-state{display:none;}
.cast-preview-info{margin-top:8px;font-size:12px;display:flex;flex-direction:column;align-items:center;gap:3px;line-height:1.5;text-align:center;}
.cast-gua-name{font-size:13.5px;color:var(--gold-2);font-weight:700;letter-spacing:2px;margin:2px 0;width:100%;text-align:center;line-height:1.6;}
.cast-legend{font-size:10.5px;color:var(--ink-soft);display:block;white-space:normal;max-width:100%;}
.dynamic-tag{color:var(--gold-2);font-weight:700;letter-spacing:1px;}
.static-tag{color:var(--ink-soft);}

/* 遇事不决 */
.decide-wrap{padding:18px 20px 30px;text-align:center;}
.decide-tip{font-size:13.5px;color:var(--ink-soft);line-height:1.85;margin:4px 2px 10px;}
.decide-tip p{margin:2px 0;}
.decide-tip b{color:var(--gold-2);}
.decide-rule-yang{margin-top:8px !important;}
.decide-coin{width:150px;height:150px;margin:16px auto 12px;perspective:800px;cursor:pointer;}
.decide-coin-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform 1.4s cubic-bezier(.4,.2,.2,1);}
.decide-coin.flipped .decide-coin-inner{transform:rotateY(180deg);}
@keyframes coin-spin{0%{transform:rotateY(0deg);}100%{transform:rotateY(var(--rot,1080deg));}}
.decide-coin.spinning .decide-coin-inner{animation:coin-spin 1.1s cubic-bezier(.4,.2,.2,1) forwards;}
.decide-coin-inner.no-trans{transition:none !important;}
.decide-side{position:absolute;inset:0;border-radius:14px;background-repeat:no-repeat;background-position:center;background-size:contain;
  box-shadow:0 14px 34px rgba(0,0,0,.55),0 0 0 1px rgba(201,164,74,.25);backface-visibility:hidden;}
.decide-front{background-image:url('../images/coin-front-0.webp?v=v136');}
.decide-back{background-image:url('../images/coin-back.webp?v=v136');transform:rotateY(180deg);}
.decide-state{font-size:20px;color:var(--gold-2);letter-spacing:2px;margin:14px 0 18px;min-height:28px;font-weight:700;line-height:1.45;display:flex;flex-direction:column;align-items:center;gap:1px;}
.de-head{font-size:22px;color:var(--gold-2);margin-bottom:3px;}
.de-body{font-size:18px;color:var(--ink);font-weight:400;}
.de-foot{font-size:19px;color:var(--gold-2);margin-top:3px;}
.decide-hint{display:flex;flex-direction:column;gap:3px;font-size:13px;line-height:1.8;margin-top:12px;}
.decide-hint span{display:block;}

/* 黄历 · 黑金卡片 */
.hl-wrap{padding:16px 16px 28px;}
.hl-card{background:linear-gradient(180deg,rgba(28,22,12,.92),rgba(16,12,7,.92));
  border:1px solid rgba(201,164,74,.30);border-radius:18px;
  padding:16px 18px;margin-bottom:12px;
  box-shadow:0 6px 20px rgba(0,0,0,.35), inset 0 0 0 1px rgba(212,175,55,.06);}
.hl-card .hl-k{font-size:12.5px;color:rgba(212,175,55,.85);letter-spacing:2px;flex:none;}
.hl-card .hl-v{font-size:14px;color:#f0e6cf;text-align:right;line-height:1.6;max-width:68%;}
.hl-sec-t{font-size:13px;color:var(--gold-2);letter-spacing:3px;margin-bottom:10px;
  border-left:3px solid var(--gold-2);padding-left:8px;}

/* 主卡：日期 + 宜忌双列 */
.hl-main{background:linear-gradient(180deg,rgba(212,175,55,.16),rgba(16,12,7,.92));
  text-align:center;padding:22px 18px 18px;}
.hl-day{font-size:40px;font-weight:700;color:#f3d77e;letter-spacing:2px;
  text-shadow:0 2px 12px rgba(212,175,55,.35);}
.hl-sub{font-size:13px;color:rgba(240,230,207,.75);letter-spacing:2px;margin-top:6px;}
.hl-yiji{display:flex;gap:12px;margin-top:16px;}
.hl-col{flex:1;border-radius:12px;padding:12px 8px;background:rgba(0,0,0,.25);}
.hl-col-t{font-size:22px;font-weight:700;letter-spacing:4px;margin-bottom:6px;}
.hl-col.yi .hl-col-t{color:#7fb069;}
.hl-col.ji .hl-col-t{color:#e08a8a;}
.hl-col-c{font-size:12.5px;color:#f0e6cf;line-height:1.7;}

/* grid2 / grid3 */
.hl-grid2{display:flex;}
.hl-grid2 .hl-cell{flex:1;padding:4px 12px;}
.hl-grid2 .hl-cell:first-child{border-right:1px solid rgba(201,164,74,.18);}
.hl-grid3{display:flex;}
.hl-grid3 .hl-cell{flex:1;padding:4px 10px;text-align:center;}
.hl-grid3 .hl-cell+.hl-cell{border-left:1px solid rgba(201,164,74,.18);}
.hl-cell .hl-k{display:block;text-align:center;margin-bottom:4px;}
.hl-cell .hl-v{display:block;max-width:100%;text-align:center;font-size:14px;}
.hl-cell{cursor:pointer;transition:background .15s;}
.hl-cell:active{background:rgba(201,164,74,.1);}
.hl-cell.clickable .hl-v{color:var(--gold-2);}
.hl-cell.clickable::after{content:"›";display:block;font-size:10px;color:rgba(201,164,74,.5);margin-top:2px;}

.hl-term-body{font-size:14px;color:var(--ink);line-height:1.85;text-align:left;padding:4px 2px;}
.hl-term-body .term-guide{font-size:13px;color:var(--gold-2);margin-top:10px;padding-top:10px;border-top:1px dashed rgba(201,164,74,.2);}
.gua-detail-body{font-size:14px;color:var(--ink);line-height:1.85;text-align:left;padding:4px 2px;max-height:56vh;overflow-y:auto;}
.gua-detail-body .gd-section{margin-bottom:14px;}
.gua-detail-body .gd-label{font-size:12px;color:var(--gold-2);letter-spacing:1px;margin-bottom:4px;}
.gua-detail-body .gd-text{font-size:14px;color:var(--ink);line-height:1.8;}
.gua-detail-body .gd-guide{font-size:13px;color:var(--ink-soft);line-height:1.8;margin-top:10px;padding-top:10px;border-top:1px dashed rgba(201,164,74,.2);}
/* 「今日指引」四类建议各占一排 */
.gua-detail-body .gd-guide .gd-line{display:block;margin-top:2px;}
/* 结果页「正统周易卜卦」说明（放在生成天命签按钮上方） */
.origin-note{
  margin-top:14px;padding:12px 14px;border-radius:12px;
  background:rgba(201,164,74,.06);border:1px solid rgba(201,164,74,.20);
  font-size:12.5px;color:var(--ink-soft);line-height:1.95;letter-spacing:.4px;text-align:left;
}
.origin-note p{margin:0;}
.origin-note .origin-dots{color:var(--gold-2);font-weight:700;letter-spacing:1px;margin:2px 0;}
.origin-note .origin-keep{color:var(--gold-2);font-weight:700;letter-spacing:1px;margin:4px 0 0;}
/* 标题区 */
.origin-note .origin-head{text-align:center;padding-bottom:10px;margin-bottom:10px;
  border-bottom:1px solid rgba(201,164,74,.18);}
.origin-note .origin-title{font-size:16px;font-weight:700;color:var(--gold);letter-spacing:3px;}
.origin-note .origin-sub{font-size:11.5px;color:rgba(217,199,154,.7);letter-spacing:1px;margin-top:4px;}
/* 分节 */
.origin-note .origin-sec{margin-bottom:12px;}
.origin-note .origin-sec:last-child{margin-bottom:0;}
.origin-note .origin-sec-t{display:flex;align-items:center;font-size:12.5px;font-weight:700;
  color:var(--gold-deep);letter-spacing:1px;margin-bottom:6px;}
.origin-note .origin-sec-t::before{content:"";width:3px;height:13px;border-radius:2px;
  background:var(--gold);margin-right:7px;flex:0 0 auto;}
.origin-note .origin-sec p{margin:0 0 4px;}
.origin-note .origin-sec p:last-child{margin-bottom:0;}
/* 三易 / 三力 列表 */
.origin-note .origin-list{list-style:none;margin:2px 0 4px;padding:0;}
.origin-note .origin-list li{position:relative;padding-left:11px;margin-bottom:3px;}
.origin-note .origin-list li::before{content:"▪";position:absolute;left:0;top:0;
  color:rgba(201,164,74,.75);font-size:11px;}
.origin-note .origin-list li b{color:var(--gold-2);font-weight:700;}
.hl-term-value{background:rgba(0,0,0,.18);border:1px solid rgba(201,164,74,.22);border-radius:12px;padding:12px;margin:12px 0;}
.hl-term-value .hl-term-label{font-size:15px;color:var(--gold-2);font-weight:700;margin-bottom:8px;letter-spacing:1px;}
.hl-term-value p{font-size:13.5px;color:var(--ink-soft);line-height:1.75;margin:6px 0;}
.hl-row.clickable{cursor:pointer;transition:background .15s;}
.hl-row.clickable:active{background:rgba(201,164,74,.1);}
.hl-row.clickable .hl-v{color:var(--gold-2);}
.hl-row.clickable::after{content:"›";font-size:10px;color:rgba(201,164,74,.5);margin-left:4px;}

.hl-row{display:flex;justify-content:space-between;align-items:flex-start;padding:8px 0;
  border-bottom:1px dashed rgba(201,164,74,.14);}
.hl-row:last-child{border-bottom:none;}

/* 时辰吉凶 */
.hl-sc{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.hl-sc-item{border-radius:10px;padding:8px 4px;text-align:center;
  background:rgba(0,0,0,.28);border:1px solid rgba(201,164,74,.15);}
.hl-sc-item .t{font-size:12px;color:rgba(240,230,207,.8);}
.hl-sc-item .q{font-size:12px;font-weight:700;margin-top:3px;letter-spacing:2px;}
.hl-sc-item.ji .q{color:#7fb069;}
.hl-sc-item.xiong .q{color:#e08a8a;}
.hl-sc-item.ping .q{color:rgba(212,175,55,.85);}
.hl-sc-tip{font-size:11.5px;color:rgba(217,199,154,.72);line-height:1.6;margin-bottom:10px;}
.hl-sc-item .tm{font-size:10px;color:rgba(240,230,207,.5);margin-top:2px;letter-spacing:1px;}
.hl-sc-item .god{display:inline-block;font-size:12px;font-weight:700;padding:2px 8px;border-radius:10px;margin-top:5px;letter-spacing:1px;}
.hl-sc-item .god.huang{color:#7fb069;background:rgba(127,176,105,.14);border:1px solid rgba(127,176,105,.4);}
.hl-sc-item .god.hei{color:#e08a8a;background:rgba(224,138,138,.12);border:1px solid rgba(224,138,138,.38);}
.hl-sc-item.ji{background:rgba(127,176,105,.07);border-color:rgba(127,176,105,.28);}
.hl-sc-item.xiong{background:rgba(224,138,138,.06);border-color:rgba(224,138,138,.26);}
.hl-sc-item.po{border-color:rgba(212,175,55,.6);box-shadow:0 0 0 1px rgba(212,175,55,.35);}
.hl-sc-item.po .q{color:#f3d77e;}
.hl-sc-legend{display:flex;gap:14px;margin-top:10px;font-size:11px;flex-wrap:wrap;}
.hl-sc-legend .lg{display:flex;align-items:center;gap:5px;color:rgba(240,230,207,.72);}
.hl-sc-legend .lg::before{content:"";width:9px;height:9px;border-radius:50%;}
.hl-sc-legend .huang::before{background:#7fb069;}
.hl-sc-legend .hei::before{background:#e08a8a;}
.hl-sc-legend .po::before{background:#f3d77e;}

/* 开运 */
.hl-kaiyun .hl-kr{display:flex;justify-content:space-between;padding:7px 0;
  border-bottom:1px dashed rgba(201,164,74,.14);}
.hl-kaiyun .hl-kr:last-child{border-bottom:none;}

.hl-note{font-size:11px;color:rgba(217,199,154,.55);text-align:center;margin-top:12px;letter-spacing:1px;}

/* 会员等级 */
.tier-current{background:linear-gradient(180deg,rgba(201,164,74,.22),rgba(201,164,74,.04));
  border:1.5px solid var(--gold);border-radius:18px;padding:22px 20px;margin-bottom:14px;text-align:center;
  box-shadow:0 8px 24px rgba(201,164,74,.18);}
.tier-current-name{font-size:28px;color:var(--gold-2);letter-spacing:6px;font-weight:700;
  text-shadow:0 0 18px rgba(201,164,74,.3);}
.tier-current-desc{font-size:12px;color:var(--ink-soft);letter-spacing:2px;margin-top:8px;line-height:1.7;}
.tier-list{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;}
.tier-card{background:var(--paper);border:1px solid rgba(201,164,74,.18);border-radius:14px;
  padding:14px 16px;display:flex;flex-direction:column;gap:6px;}
.tier-card.current{border-color:var(--gold);background:linear-gradient(180deg,rgba(201,164,74,.18),rgba(201,164,74,.04));
  box-shadow:inset 0 0 0 1px rgba(201,164,74,.15);}
.tier-card-name{font-size:16px;color:var(--gold-2);letter-spacing:3px;font-weight:700;}
.tier-card-req{font-size:12px;color:var(--ink-soft);letter-spacing:1px;line-height:1.6;}
.tier-card-ok{font-size:11px;color:#7fb069;letter-spacing:1px;margin-top:2px;}
/* ---- 升级盲盒 ---- */
.tier-card-box{font-size:11.5px;color:var(--ink-soft);letter-spacing:1px;line-height:1.6;margin-top:7px;}
.tier-card-box.done{color:var(--gold-2);}
.tier-box-btn{display:block;width:100%;margin-top:10px;padding:9px 0;font-size:13.5px;letter-spacing:2px;}
.tier-sec-title{font-size:12.5px;color:var(--gold-2);letter-spacing:3px;text-align:center;margin:16px 0 8px;}
.tier-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px;}
.bb-mini{background:var(--paper);border:1px solid rgba(201,164,74,.28);border-radius:12px;padding:10px 5px;text-align:center;}
.bb-mini-art{font-size:24px;line-height:1.25;}
.bb-mini-name{font-size:10.5px;color:var(--gold-2);line-height:1.45;margin-top:5px;}
.bb-mini-tier{font-size:9.5px;color:var(--ink-soft);margin-top:3px;}
.bb-stage{display:flex;align-items:center;justify-content:center;height:148px;}
.bb-box{position:relative;width:100px;height:100px;border-radius:16px;
  background:linear-gradient(180deg,#e8cd82,#b98f2e);box-shadow:0 10px 24px rgba(0,0,0,.38);
  display:flex;align-items:center;justify-content:center;}
.bb-box .bb-face{font-size:42px;line-height:1;}
.bb-box .bb-lid{position:absolute;left:-7px;right:-7px;top:-13px;height:26px;border-radius:9px;
  background:linear-gradient(180deg,#f6e2a6,#cfa844);box-shadow:0 3px 9px rgba(0,0,0,.3);
  transition:transform .5s ease,opacity .5s ease;}
.bb-box.shake{animation:bbShake .55s ease infinite;}
.bb-box.open{animation:bbPop .55s ease;}
.bb-box.open .bb-lid{transform:translateY(-46px) rotate(-20deg);opacity:0;}
@keyframes bbShake{0%,100%{transform:rotate(-3.5deg)}50%{transform:rotate(3.5deg)}}
@keyframes bbPop{0%{transform:scale(1)}45%{transform:scale(1.16)}100%{transform:scale(1)}}
.bb-card{border-radius:14px;padding:16px 12px;border:1px solid rgba(201,164,74,.45);
  background:linear-gradient(180deg,rgba(201,164,74,.18),rgba(201,164,74,.04));animation:bbPop .5s ease;}
.bb-card-art{font-size:46px;line-height:1.2;}
.bb-card-name{font-size:14px;color:var(--gold-2);letter-spacing:2px;font-weight:700;margin-top:8px;}
.bb-tip{font-size:11.5px;color:var(--ink-soft);line-height:1.65;margin-top:8px;}

/* 账户页中的等级卡 */
.acct-tier-box{background:linear-gradient(180deg,rgba(201,164,74,.16),rgba(201,164,74,.03));
  border:1px solid rgba(201,164,74,.22);border-radius:14px;padding:14px 16px;margin-bottom:12px;}
.acct-tier-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;}
.acct-tier-k{font-size:12px;color:var(--ink-soft);letter-spacing:2px;}
.acct-tier-name{font-size:16px;color:var(--gold-2);font-weight:700;letter-spacing:2px;}
.acct-tier-v{font-size:12px;color:var(--ink);letter-spacing:1px;}
#btn-tier-go{margin-top:10px;width:100%;}


/* ===== 一卦千金 · 产品横幅 / 集卦 / 目标 / 导流 / 小课堂 ===== */
.prod-banner{margin:10px 0 0;width:100%;}
/* width:100% 必须保留：#screen-result 是 flex 列且 align-items:center，直接子元素会「按内容宽度收缩」。
   产品横幅文案短，会缩到 286px，而 .card（动爻之辞 / 目标打卡）因正文很长被撑到满宽 342px，
   两者左右边框对不齐（旁边留白、中间显挤）。width:100% 把它钉成与 .card 同宽。 */
.prod-banner-inner{padding:12px 14px;border-radius:14px;border:1.5px solid rgba(201,164,74,.55);
  background:linear-gradient(180deg,rgba(201,164,74,.20),rgba(201,164,74,.06));
  box-shadow:0 6px 18px rgba(0,0,0,.25);display:flex;flex-direction:column;gap:3px;}
.prod-banner-inner .prod-tag{font-size:11px;letter-spacing:1px;color:var(--gold-2);}
.prod-banner-inner .prod-name{font-size:16px;font-weight:800;letter-spacing:1px;color:var(--ink);}
.prod-banner-inner .prod-slogan{font-size:12px;color:var(--ink-soft);}
.prod-banner-inner .prod-baihua{font-size:12.5px;color:var(--ink);line-height:1.75;margin-top:5px;
  background:rgba(255,255,255,.06);border-radius:10px;padding:7px 9px;}
.prod-banner-inner .prod-actions{display:flex;gap:8px;margin-top:9px;}
/* 两个按钮（复制分享文案 / 看我的集卦）规格一致：同字号、同字距、同内边距、不折行。
   注意 .btn-gold.sm 这个类在本项目里没有单独定义，会落到 .btn-gold 的 16px/3px 字距，
   在半个按钮的宽度里必然折行；这里统一按 .btn-ghost.sm 的规格压平。 */
.prod-banner-inner .prod-actions button{flex:1;min-width:0;white-space:nowrap;
  padding:11px 8px;font-size:13px;letter-spacing:1px;text-align:center;}

.collage-bar{margin:10px 14px 0;text-align:center;}
.collage-bar .collage-row{display:flex;gap:6px;justify-content:center;}
.collage-bar .cb{font-size:11px;padding:5px 10px;border-radius:20px;border:1px solid rgba(201,164,74,.4);
  color:var(--ink-soft);background:rgba(255,255,255,.05);letter-spacing:1px;display:inline-flex;
  align-items:center;gap:3px;cursor:pointer;}
.collage-bar .cb.on{background:linear-gradient(180deg,var(--gold-2),var(--gold-deep));color:#16100a;
  border-color:transparent;font-weight:700;}
.collage-bar .collage-tip{font-size:11.5px;color:var(--ink-soft);margin-top:6px;letter-spacing:.5px;}

.real-cta{margin:10px 14px 0;padding:9px 12px;border-radius:12px;font-size:12.5px;
  background:rgba(201,164,74,.08);border:1px dashed rgba(201,164,74,.5);color:var(--ink-soft);text-align:center;}
.real-cta a{color:var(--gold-2);font-weight:700;text-decoration:none;cursor:pointer;}

#card-goal .card-title{display:flex;justify-content:space-between;align-items:center;}
#goal-add{color:var(--gold-2);font-weight:700;cursor:pointer;}
.goal-item{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:9px 0;
  border-top:1px solid rgba(201,164,74,.14);}
.goal-item:first-child{border-top:none;}
.goal-item .goal-title{font-size:13.5px;color:var(--ink);font-weight:600;}
.goal-item.done .goal-title{text-decoration:line-through;color:var(--ink-soft);}
.goal-item .goal-target{font-size:11.5px;color:var(--ink-soft);margin-top:2px;}
.goal-item .goal-remind{font-size:11px;color:var(--gold-2);margin-top:2px;}
.goal-item .goal-ops{display:flex;gap:6px;flex:0 0 auto;}
.goal-item .goal-ops button{font-size:11px;padding:3px 9px;border-radius:8px;
  border:1px solid rgba(201,164,74,.4);background:rgba(201,164,74,.12);color:var(--gold-2);
  cursor:pointer;font-family:inherit;}
.goal-item .goal-done-tag{font-size:11px;color:#7fb069;}

.cover-extra{display:flex;gap:8px;justify-content:center;margin-top:10px;flex-wrap:wrap;}
.cover-extra .btn-ghost.sm{font-size:12px;padding:7px 12px;}
.badge{display:inline-block;min-width:18px;padding:0 5px;margin-left:4px;border-radius:10px;
  background:rgba(201,164,74,.25);color:var(--gold-2);font-size:10px;font-weight:700;text-align:center;}

.mile-list{display:flex;flex-direction:column;gap:8px;margin-top:10px;}
.mile-item{background:rgba(201,164,74,.07);border:1px solid rgba(201,164,74,.2);border-radius:12px;
  padding:10px 12px;cursor:pointer;transition:border-color .15s,background .15s;}
.mile-item:active{border-color:var(--gold);background:rgba(201,164,74,.14);}
.mile-item .mile-tap{font-size:10.5px;color:rgba(201,164,74,.55);margin-top:5px;letter-spacing:1px;}
.mile-item .mile-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline;}
.mile-item .mile-title{font-size:14px;color:var(--ink);font-weight:700;}
.mile-item .mile-date{font-size:11.5px;color:var(--ink-soft);white-space:nowrap;}
.mile-item .mile-gua{font-size:12px;color:var(--gold-2);margin-top:4px;}
.mile-item .mile-note{font-size:12px;color:var(--ink-soft);margin-top:3px;line-height:1.7;}

.culture-wrap{display:flex;flex-direction:column;gap:12px;padding:14px;}
.culture-card{background:rgba(255,255,255,.05);border:1px solid rgba(201,164,74,.22);border-radius:14px;
  overflow:hidden;}
/* 标题行（折叠态唯一可见）：颜色和字号保持原样，仅改成可点击 */
.culture-card .culture-title{display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;box-sizing:border-box;padding:14px 16px;margin:0;background:none;border:0;
  text-align:left;font-family:inherit;cursor:pointer;
  font-size:15px;color:var(--gold-2);font-weight:700;letter-spacing:1px;line-height:1.55;}
.culture-card .culture-title .ct-text{flex:1;min-width:0;}
.culture-card .culture-title .ct-arrow{flex:0 0 auto;width:8px;height:8px;margin-top:-4px;
  border-right:1.5px solid rgba(201,164,74,.8);border-bottom:1.5px solid rgba(201,164,74,.8);
  transform:rotate(45deg);transition:transform .22s ease;}
.culture-card.open .culture-title .ct-arrow{transform:rotate(-135deg);margin-top:4px;}
.culture-card .culture-title:active{background:rgba(201,164,74,.09);}
.culture-card .culture-body{display:none;padding:2px 16px 14px;font-size:13px;color:var(--ink-soft);line-height:1.85;}
.culture-card.open .culture-body{display:block;}
/* 富文本正文：后台可排版（字号/颜色/加粗/图片/列表），这里保证手机端显示不溢出 */
.culture-card .culture-body p{margin:0 0 8px;}
.culture-card .culture-body p:last-child{margin-bottom:0;}
.culture-card .culture-body img{max-width:100%;height:auto;border-radius:10px;display:block;margin:10px auto;
  border:1px solid rgba(201,164,74,.2);}
.culture-card .culture-body ul,.culture-card .culture-body ol{margin:8px 0;padding-left:22px;}
.culture-card .culture-body li{margin:3px 0;}
.culture-card .culture-body h1,.culture-card .culture-body h2,.culture-card .culture-body h3,
.culture-card .culture-body h4{color:var(--gold-2);font-size:15px;margin:12px 0 6px;letter-spacing:1px;}
.culture-card .culture-body blockquote{margin:8px 0;padding:6px 12px;border-left:8px;border-left:3px solid rgba(201,164,74,.45);
  background:rgba(201,164,74,.07);border-radius:0 8px 8px 0;}
.culture-card .culture-body a{color:var(--gold-2);}
.culture-card .culture-body hr{border:none;border-top:1px solid rgba(201,164,74,.25);margin:12px 0;}

.collection-body{display:flex;flex-direction:column;gap:10px;padding:6px 2px;max-height:64vh;overflow:auto;}
.coll-grid{display:flex;flex-direction:column;gap:8px;}
.coll-row{display:flex;align-items:center;gap:10px;background:rgba(201,164,74,.05);
  border:1px solid rgba(201,164,74,.18);border-radius:12px;padding:10px 12px;opacity:.55;}
.coll-row.on{opacity:1;border-color:rgba(201,164,74,.6);background:rgba(201,164,74,.16);}
.coll-row .coll-emoji{font-size:20px;}
.coll-row .coll-name{flex:1;font-size:14px;color:var(--ink);font-weight:600;}
.coll-row .coll-state{font-size:12px;color:var(--ink-soft);}
.coll-row.on .coll-state{color:var(--gold-2);font-weight:700;}
.coll-unlock{margin-top:4px;font-size:13px;line-height:1.9;color:var(--gold-2);text-align:center;
  background:rgba(201,164,74,.12);border-radius:12px;padding:12px;}
.coll-lock{margin-top:4px;font-size:12.5px;color:var(--ink-soft);text-align:center;line-height:1.8;}
#modal-milestone textarea.auth-input{resize:vertical;font-family:inherit;}
/* 纪念时刻：原生 date 选择器（点击弹日历），深色主题 + 日历图标调亮 */
#ms-date{color-scheme:dark;cursor:pointer;text-align:center;}
#ms-date::-webkit-calendar-picker-indicator{filter:brightness(0) invert(1) sepia(45%) saturate(320%) hue-rotate(350deg);cursor:pointer;}
#ms-date:focus{border-color:var(--gold);background-color:rgba(201,164,74,.09);}
/* 纪念卦详情弹窗（点击纪念列表条目查看） */
#modal-mile-view .modal-card{text-align:left;max-height:82vh;overflow-y:auto;}
.mv-meta{font-size:11.5px;color:var(--ink-soft);letter-spacing:1px;margin-bottom:12px;}
.mv-gua-name{font-size:19px;font-weight:700;color:var(--gold-2);letter-spacing:2px;text-align:center;}
.mv-gua-sub{font-size:11.5px;color:var(--ink-soft);text-align:center;margin:4px 0 14px;letter-spacing:1px;}
.mv-sec{margin-bottom:12px;}
.mv-sec .mv-label{display:inline-block;font-size:11px;color:var(--gold-2);letter-spacing:2px;
  border-left:3px solid var(--gold);padding-left:7px;margin-bottom:5px;}
.mv-sec p{margin:0;font-size:13px;color:var(--ink);line-height:1.85;text-align:justify;}

/* ===== 公益证书 / 公益透明 ===== */
.acct-nick{display:flex;gap:8px;margin-top:0;align-items:center;}
/* 我的：昵称（捐赠署名）/ 手机号（注册时填写） 资料行 */
.acct-field{text-align:left;margin-top:14px;}
.acct-label{font-size:12.5px;color:var(--ink-soft);letter-spacing:1px;margin-bottom:6px;}
.acct-note{color:rgba(217,199,154,.62);font-size:11.5px;}
.acct-tip{font-size:11.5px;color:var(--ink-soft);line-height:1.75;margin:14px 0 0;text-align:left;}
.acct-nick .auth-input.sm{flex:1 1 auto;width:auto;min-width:0;margin:0;padding:10px 12px;font-size:13px;}
.acct-nick .btn-ghost.sm{flex:0 0 auto;width:auto;margin-top:0;padding:10px 16px;white-space:nowrap;}
/* 我的：昵称/手机号 一行（当前值 + 修改按钮） */
.acct-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;}
.acct-val{font-size:15px;color:var(--ink);font-weight:600;letter-spacing:.5px;flex:1 1 auto;min-width:0;word-break:break-all;}
.btn-edit{flex:0 0 auto;background:transparent;border:1px solid var(--gold-2);color:var(--gold-2);border-radius:10px;padding:6px 16px;font-size:13px;font-weight:600;cursor:pointer;letter-spacing:2px;}
.btn-edit:active{background:rgba(201,164,74,.16);}
#modal-edit-field .modal-box{text-align:left;}
.modal-btns{display:flex;gap:10px;margin-top:16px;}
.modal-btns .btn-primary,.modal-btns .btn-ghost{flex:1 1 0;margin-top:0;}
.charity-stat{display:flex;gap:10px;margin:6px 0 14px;}
.charity-stat span{flex:1;text-align:center;background:rgba(201,164,74,.12);border-radius:12px;padding:10px;font-size:12.5px;color:var(--ink-soft);}
.charity-stat span b{color:var(--gold-2);font-size:16px;}
.charity-sec-t{font-size:13px;color:var(--gold-2);font-weight:700;margin:14px 0 8px;letter-spacing:1px;}
.charity-my,.charity-recent{display:flex;flex-direction:column;gap:10px;}
.cert-mini{background:var(--paper-2);border:1px solid rgba(201,164,74,.35);border-radius:12px;padding:12px;cursor:pointer;}
.cert-mini:active{transform:scale(.99);}
.cm-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.cm-proj{font-size:12px;padding:2px 10px;border-radius:20px;background:rgba(201,164,74,.16);color:var(--gold-2);}
.cm-proj.b{background:rgba(200,75,75,.2);color:var(--red-soft);}
.cm-date{font-size:11px;color:var(--ink-soft);opacity:.8;}
.cm-no{font-size:11.5px;color:var(--ink-soft);opacity:.75;font-family:monospace;word-break:break-all;}
.cm-nick{font-size:12.5px;color:var(--ink);margin-top:3px;}
.cr-item{display:flex;justify-content:space-between;align-items:center;background:var(--paper-2);border:1px solid rgba(201,164,74,.18);border-radius:10px;padding:8px 12px;}
.cr-name{font-size:12.5px;color:var(--ink);}
.cr-tag{font-size:11px;padding:1px 8px;border-radius:20px;background:rgba(201,164,74,.16);color:var(--gold-2);}
.cr-tag.b{background:rgba(200,75,75,.2);color:var(--red-soft);}
/* 证书本体（对齐活动原型：印章 / 标题 / 条目表 / 二维码） */
.cert-card{position:relative;border:2px solid var(--gold-2);border-radius:16px;padding:22px 16px 16px;text-align:left;background:var(--paper);box-shadow:0 0 18px rgba(201,164,74,.14);}
.cert-card.red{border-color:var(--red-soft);box-shadow:0 0 18px rgba(200,75,75,.16);}
.cc-seal{position:absolute;right:12px;top:11px;width:48px;height:48px;border-radius:50%;
  border:2px solid var(--gold-2);color:var(--gold-2);display:flex;align-items:center;justify-content:center;
  font-size:9.5px;line-height:1.2;text-align:center;transform:rotate(-12deg);opacity:.82;}
.cert-card.red .cc-seal{border-color:var(--red-soft);color:var(--red-soft);}
.cc-h2{text-align:center;font-size:18px;letter-spacing:2px;color:var(--gold-2);font-weight:700;margin:4px 0 0;}
.cert-card.red .cc-h2{color:var(--red-soft);}
.cc-sub{text-align:center;font-size:12px;color:var(--ink-soft);opacity:.9;margin:6px 0 14px;letter-spacing:1px;}
.cc-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:10px 0;border-bottom:1px dashed rgba(201,164,74,.3);font-size:13px;}
.cc-row .k{color:var(--ink-soft);opacity:.85;flex:0 0 auto;}
.cc-row .v{color:var(--ink);text-align:right;max-width:64%;word-break:break-all;}
.cc-row .v.amt{color:var(--gold-2);font-size:15px;font-weight:700;}
.cert-card.red .cc-row .v.amt{color:var(--red-soft);}
.cc-row .v.no{font-family:monospace;font-size:11.5px;color:var(--ink-soft);}
.cc-tip{text-align:center;font-size:11px;color:var(--ink-soft);opacity:.85;margin-top:8px;}
.cc-foot{font-size:11px;color:var(--ink-soft);opacity:.8;line-height:1.7;margin-top:10px;border-top:1px dashed rgba(201,164,74,.3);padding-top:9px;text-align:center;}
.cert-qr{display:flex;justify-content:center;margin:14px 0 4px;}
.cert-qr img,.cert-qr canvas{border-radius:8px;background:#fffaf0;padding:6px;}
/* 证书弹窗：关闭按钮挪到左上，右上让给印章 */
#modal-cert-detail .modal-close{left:12px;right:auto;top:6px;}

/* ===== 站内信（我的消息）===== */
/* 菜单项为奇数（此处 5 个）时，最后一项占满整行，避免出现半格空位 */
.acct-menu-btn:last-child:nth-child(odd){grid-column:1 / -1;}
.msg-badge{display:none;margin-left:5px;min-width:16px;height:16px;line-height:16px;padding:0 5px;
  border-radius:9px;background:var(--red-soft);color:#fff;font-size:10.5px;font-weight:700;
  letter-spacing:0;vertical-align:middle;text-align:center;}
.msg-badge.show{display:inline-block;}
.msg-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 0 10px;}
.msg-head-t{font-size:12.5px;color:var(--ink-soft);}
.msg-head .btn-ghost.sm{width:auto;flex:0 0 auto;margin-top:0;padding:7px 14px;font-size:11.5px;white-space:nowrap;}
.msg-list{display:flex;flex-direction:column;gap:10px;max-height:52vh;overflow-y:auto;}
.msg-item{background:var(--paper-2);border:1px solid rgba(201,164,74,.16);border-left:3px solid rgba(201,164,74,.22);
  border-radius:10px;padding:10px 12px;cursor:pointer;}
.msg-item.unread{background:rgba(201,164,74,.12);border-left-color:var(--gold-2);}
.msg-item:active{transform:scale(.995);}
.msg-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:5px;}
.msg-title{font-size:13px;font-weight:700;color:var(--ink-soft);}
.msg-item.unread .msg-title{color:var(--gold-2);}
.msg-date{font-size:11px;color:var(--ink-soft);opacity:.7;white-space:nowrap;}
.msg-body{font-size:12.5px;color:var(--ink);line-height:1.75;}
/* 「我的公益证书」「我的消息」两个弹窗：内容区文字统一左对齐（标题仍居中，保持弹窗风格一致） */
#modal-charity .modal-box,#modal-messages .modal-box{text-align:left;}
#modal-charity .modal-title,#modal-messages .modal-title{text-align:center;}
#modal-charity .auth-hint,#modal-messages .auth-hint{margin-left:0;margin-right:0;}

/* ===== 公益：购买订单号认证 ===== */
.claim-box{margin-top:2px;}
#modal-charity .claim-box .auth-hint{margin:0 0 9px;text-align:left;line-height:1.7;}
.claim-box .auth-input{margin-bottom:8px;font-size:13px;padding:11px 12px;}
.claim-box .btn-gold{width:100%;margin-top:2px;padding:12px;font-size:13.5px;}
#claim-status{margin-top:10px;display:flex;flex-direction:column;gap:8px;}
.claim-item{border-radius:10px;padding:9px 11px;border:1px solid rgba(201,164,74,.2);
  background:rgba(201,164,74,.06);}
.claim-item.wait{border-left:3px solid var(--gold-2);}
.claim-item.ok{border-left:3px solid #7fb069;background:rgba(127,176,105,.08);}
.claim-item.no{border-left:3px solid var(--red-soft);background:rgba(200,75,75,.08);}
.cl-top{display:flex;justify-content:space-between;align-items:center;gap:8px;}
.cl-no{font-family:monospace;font-size:12px;color:var(--ink);word-break:break-all;}
.cl-st{font-size:11px;padding:1px 8px;border-radius:20px;white-space:nowrap;
  background:rgba(201,164,74,.18);color:var(--gold-2);}
.claim-item.ok .cl-st{background:rgba(127,176,105,.18);color:#7fb069;}
.claim-item.no .cl-st{background:rgba(200,75,75,.18);color:var(--red-soft);}
.cl-time{font-size:11px;color:var(--ink-soft);opacity:.8;margin-top:4px;line-height:1.6;}

/* ===== 玩法说明 · 图文版（v132 / 2026-11-10）=====
   来源：玩法说明-图文版预览.html（用户已确认）。
   全部类名加 hg- 前缀，避免与线上 .card / .coins 等同名组件冲突；
   #screen-how 左右留白由 24px 收到 18px，与设计稿一致。 */
#screen-how{padding-left:18px;padding-right:18px;}
#screen-how .hg-wrap{
  --ink-dim:#a89a7c;
  --card:rgba(255,255,255,.035);
  --card-line:rgba(201,164,74,.20);
  padding:6px 0 24px;
}
/* ---------- 通用图文组件 ---------- */
.hg-hero{text-align:center;padding:6px 0 16px}
.hg-hero .hg-eyebrow{font-size:11px;letter-spacing:5px;color:var(--gold);margin-bottom:10px}
.hg-hero h2{font-size:19px;color:var(--gold-2);letter-spacing:2px;margin:0 0 10px;font-weight:700}
.hg-hero .hg-lead{font-size:13px;color:var(--ink-soft);line-height:1.85;margin:0}
.hg-hero .hg-lead b{color:var(--gold-2);font-weight:700}

.hg-sec{margin-top:26px}
.hg-sec-h{display:flex;align-items:center;gap:9px;margin:0 0 12px}
.hg-sec-n{width:24px;height:24px;flex:0 0 24px;border-radius:50%;border:1px solid var(--gold-line);
  background:rgba(201,164,74,.10);color:var(--gold-2);font-size:12px;font-weight:700;
  display:flex;align-items:center;justify-content:center;letter-spacing:0}
.hg-sec-h h3{font-size:15px;color:var(--gold-2);letter-spacing:2px;margin:0;font-weight:700}
.hg-sec-h .hg-sub{font-size:11px;color:var(--ink-dim);letter-spacing:1px;margin-left:auto}

.hg-card{background:var(--card);border:1px solid var(--card-line);border-radius:14px;padding:13px 14px;margin-bottom:10px}
.hg-card p{font-size:12.5px;line-height:1.85;color:var(--ink-soft);margin:0}
.hg-card p b,.hg-card b{color:var(--gold-2);font-weight:700}
.hg-hl{background:linear-gradient(90deg,rgba(201,164,74,.16),rgba(201,164,74,.04));
  border-left:3px solid var(--gold);border-radius:0 12px 12px 0;padding:12px 14px;margin-bottom:12px}
.hg-hl p{margin:0;font-size:13px;line-height:1.85;color:var(--ink);letter-spacing:.3px}
.hg-hl b{color:var(--gold-2);font-weight:700;font-size:13.5px}
.hg-card p.hg-lines3{font-size:13px;line-height:2.2;letter-spacing:.5px}
.hg-hl p.hg-hl-lead{font-size:15px;line-height:1.7;letter-spacing:.5px;margin:0 0 7px}
.hg-hl p.hg-hl-lead b{font-size:15px;color:var(--gold-2);font-weight:700}
.hg-hl p.hg-hl-note{font-size:12.5px;color:var(--ink-soft);line-height:1.75;margin:0 0 10px}
.hg-hl p.hg-hl-note b{font-size:12.5px}

/* 两种玩法 · 操作卡 */
.hg-way{background:var(--card);border:1px solid var(--card-line);border-radius:14px;padding:13px 14px;margin-bottom:10px}
.hg-way-h{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.hg-way-tag{font-size:12px;font-weight:700;letter-spacing:1px;padding:4px 11px;border-radius:20px;white-space:nowrap;flex:0 0 auto}
.hg-way-tag.hg-online{background:rgba(201,164,74,.16);border:1px solid rgba(201,164,74,.36);color:#ffe6a8}
.hg-way-tag.hg-real{background:rgba(90,122,114,.18);border:1px solid rgba(120,160,150,.42);color:#bfe0d6}
.hg-way-sub{font-size:11px;color:var(--ink-dim)}
.hg-way-steps{display:flex;flex-direction:column;gap:8px}
.hg-ws{display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--ink-soft);line-height:1.7}
.hg-ws i{width:17px;height:17px;flex:0 0 17px;border-radius:50%;background:rgba(201,164,74,.14);
  border:1px solid rgba(201,164,74,.30);color:var(--gold-2);font-size:10px;font-style:normal;
  display:flex;align-items:center;justify-content:center;margin-top:2px}
.hg-ws b{color:var(--gold-2);font-weight:700}
.hg-ws .hg-ws-body{flex:1;min-width:0;font-size:12px;color:var(--ink-soft);line-height:1.7}
/* 步骤 2 内的实物图示（原节顶部两张图卡整合） */
.hg-way-fig{margin-top:9px;background:rgba(255,255,255,.025);border:1px solid rgba(201,164,74,.16);border-radius:10px;padding:10px}
.hg-way-fig .hg-fa{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.hg-way-fig .hg-fa img{width:52px;height:62px;object-fit:contain;flex:0 0 52px;filter:drop-shadow(0 3px 9px rgba(0,0,0,.45))}
.hg-way-fig .hg-fa .hg-ft{font-size:11px;color:var(--ink-soft);line-height:1.7}
.hg-way-fig .hg-fa .hg-ft b{display:block;font-size:11.5px;color:var(--gold-2);margin-bottom:3px;letter-spacing:.5px}
.hg-way-fig .hg-fb{display:flex;gap:8px;justify-content:space-around;border-top:1px solid rgba(201,164,74,.14);padding-top:9px}
.hg-way-fig .hg-fb .hg-cu{text-align:center;flex:1;min-width:0}
.hg-way-fig .hg-fb .hg-cu img{width:46px;height:46px;object-fit:contain;display:block;margin:0 auto 4px;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.45))}
.hg-way-fig .hg-fb .hg-cu span{display:block;font-size:10px;color:var(--ink-dim);letter-spacing:.3px;line-height:1.5}
.hg-way-fig .hg-fb .hg-cu b{color:var(--gold-2)}

/* 4 步流程 */
.hg-steps{display:flex;flex-direction:column;gap:8px;counter-reset:s}
.hg-step{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--card-line);
  border-radius:12px;padding:11px 13px;position:relative}
.hg-step .hg-ico{width:38px;height:38px;flex:0 0 38px;border-radius:10px;background:rgba(201,164,74,.10);
  border:1px solid rgba(201,164,74,.22);display:flex;align-items:center;justify-content:center}
.hg-step .hg-ico svg{width:22px;height:22px}
.hg-step .hg-tx{min-width:0}
.hg-step .hg-tx .hg-t{font-size:13px;color:var(--ink);font-weight:700;letter-spacing:.5px;margin-bottom:3px}
.hg-step .hg-tx .hg-d{font-size:11.5px;color:var(--ink-dim);line-height:1.6}
.hg-step .hg-num{margin-left:auto;flex:0 0 auto;font-size:11px;color:var(--gold);letter-spacing:1px}
.hg-step:not(:last-child)::after{content:"";position:absolute;left:31px;bottom:-9px;width:1px;height:9px;
  background:rgba(201,164,74,.35)}

/* 三易小卡 */
.hg-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.hg-trio .hg-tc{background:var(--card);border:1px solid var(--card-line);border-radius:12px;padding:12px 8px;text-align:center}
.hg-trio .hg-tc .hg-g{font-size:16px;color:var(--gold-2);font-weight:700;letter-spacing:2px;margin-bottom:6px}
.hg-trio .hg-tc .hg-d{font-size:11px;color:var(--ink-dim);line-height:1.65}

/* 实物图 */
.hg-artifact{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--card-line);
  border-radius:14px;padding:12px;margin-bottom:10px}
.hg-artifact .hg-shot{width:78px;height:92px;flex:0 0 78px;display:flex;align-items:center;justify-content:center}
.hg-artifact .hg-shot img{max-width:100%;max-height:100%;object-fit:contain;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.45))}
.hg-artifact .hg-tx .hg-t{font-size:13px;color:var(--gold-2);font-weight:700;margin-bottom:6px;letter-spacing:1px}
.hg-artifact .hg-tx p{font-size:11.5px;line-height:1.75;color:var(--ink-soft);margin:0}
.hg-coins{display:flex;gap:10px;justify-content:center;background:var(--card);border:1px solid var(--card-line);
  border-radius:14px;padding:12px;margin-bottom:12px}
.hg-coin-u{text-align:center;width:96px}
.hg-coin-u img{width:64px;height:64px;object-fit:contain;display:block;margin:0 auto 6px;
  filter:drop-shadow(0 3px 10px rgba(0,0,0,.45))}
.hg-coin-u .hg-lb{font-size:11px;color:var(--ink-soft);letter-spacing:1px}
.hg-coin-u .hg-lb b{color:var(--gold-2)}

/* 四种组合对照 */
.hg-combo{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--card-line);
  border-radius:12px;padding:10px 12px;margin-bottom:8px}
.hg-combo .hg-three{display:flex;gap:4px;flex:0 0 auto}
.hg-mini{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:700;font-family:inherit;letter-spacing:0}
.hg-mini.hg-f{background:linear-gradient(145deg,#f0d488,#c9a44a);color:#5b4310;border:1px solid #e0bd66}
.hg-mini.hg-b{background:linear-gradient(145deg,#b99340,#8a6c25);color:#f3e2b4;border:1px solid #a8842f}
.hg-combo .hg-eq{color:var(--gold-line);font-size:13px;flex:0 0 auto}
.hg-combo .hg-yao{width:52px;flex:0 0 52px;display:flex;align-items:center;justify-content:center}
.hg-combo .hg-nm{flex:1;min-width:0}
.hg-combo .hg-nm .hg-n{font-size:12.5px;color:var(--ink);font-weight:700;letter-spacing:.5px}
.hg-combo .hg-nm .hg-d{font-size:10.5px;color:var(--ink-dim);margin-top:2px}
.hg-badge{font-size:10px;padding:3px 8px;border-radius:20px;letter-spacing:.5px;white-space:nowrap;flex:0 0 auto}
.hg-badge.hg-dong{background:rgba(200,75,75,.16);border:1px solid rgba(224,138,138,.42);color:#e8a0a0}
.hg-badge.hg-jing{background:rgba(201,164,74,.10);border:1px solid rgba(201,164,74,.26);color:var(--gold-2)}

/* 六爻图 */
.hg-liu{display:flex;align-items:flex-end;gap:14px;background:var(--card);border:1px solid var(--card-line);
  border-radius:14px;padding:14px 16px;margin-bottom:10px}
.hg-liu .hg-bars{display:flex;flex-direction:column-reverse;gap:7px;flex:0 0 92px}
.hg-liu .hg-lab{font-size:11.5px;color:var(--ink-dim);line-height:1.8}
.hg-liu .hg-lab b{color:var(--gold-2)}

/* 两条路径 */
.hg-paths{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.hg-paths .hg-pc{background:var(--card);border:1px solid var(--card-line);border-radius:12px;padding:12px 10px;text-align:center}
.hg-paths .hg-pc .hg-k{font-size:11px;color:var(--gold);letter-spacing:1px;margin-bottom:7px}
.hg-paths .hg-pc .hg-v{font-size:12.5px;color:var(--ink);font-weight:700;line-height:1.6}
.hg-paths .hg-pc .hg-s{font-size:10.5px;color:var(--ink-dim);margin-top:6px;line-height:1.5}

/* 四层递进 */
.hg-layers{display:flex;align-items:stretch;gap:0;margin-bottom:10px}
.hg-layer{flex:1;text-align:center;position:relative;background:var(--card);border:1px solid var(--card-line);
  border-right:0;padding:10px 3px}
.hg-layer:first-child{border-radius:12px 0 0 12px}
.hg-layer:last-child{border-right:1px solid var(--card-line);border-radius:0 12px 12px 0}
.hg-layer .hg-l{font-size:12px;color:var(--gold-2);font-weight:700;letter-spacing:1px}
.hg-layer .hg-s{font-size:9.5px;color:var(--ink-dim);margin-top:4px;line-height:1.4}
.hg-layer.hg-last{background:rgba(201,164,74,.13);border-color:var(--gold-line)}
.hg-layer.hg-last .hg-l{color:#ffe6a8}

/* 依据标签 */
.hg-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
.hg-chip{font-size:11px;padding:5px 10px;border-radius:20px;letter-spacing:.5px}
.hg-chip.hg-yes{background:rgba(201,164,74,.14);border:1px solid rgba(201,164,74,.34);color:var(--gold-2)}
.hg-chip.hg-no{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);color:#8e8674;text-decoration:line-through}

/* 三句智慧 */
.hg-wisdom{background:var(--card);border:1px solid var(--card-line);border-radius:12px;
  padding:12px 13px;margin-bottom:8px;display:flex;align-items:center;gap:11px}
.hg-wisdom .hg-q{flex:1;font-size:12px;color:var(--ink-soft);line-height:1.7}
.hg-wisdom .hg-q b{color:var(--gold-2)}
.hg-wisdom .hg-tag{font-size:10px;color:var(--gold);border:1px solid rgba(201,164,74,.30);
  border-radius:20px;padding:3px 8px;white-space:nowrap;flex:0 0 auto}

/* 段位进度 */
.hg-rank{display:flex;align-items:center;justify-content:space-between;gap:0;margin:12px 2px 6px;position:relative}
.hg-rank::before{content:"";position:absolute;left:8%;right:8%;top:11px;height:2px;background:rgba(201,164,74,.22)}
.hg-rk{position:relative;text-align:center;flex:1;z-index:1}
.hg-rk .hg-dot{width:22px;height:22px;margin:0 auto 7px;border-radius:50%;background:#1a150f;
  border:1px solid var(--gold-line);display:flex;align-items:center;justify-content:center;
  font-size:9px;color:var(--gold-2)}
.hg-rk .hg-n{font-size:11px;color:var(--ink-soft);letter-spacing:.5px}
.hg-rk .hg-c{font-size:9.5px;color:var(--ink-dim);margin-top:2px}
.hg-perks{display:flex;flex-direction:column;gap:7px;margin-top:12px}
.hg-perk{display:flex;align-items:flex-start;gap:9px;font-size:11.5px;color:var(--ink-soft);line-height:1.7}
.hg-perk .hg-d{width:5px;height:5px;border-radius:50%;background:var(--gold);flex:0 0 5px;margin-top:7px}
.hg-perk b{color:var(--gold-2)}

/* 结语 */
.hg-end{text-align:center;margin-top:28px;padding:18px 12px;border:1px solid rgba(201,164,74,.24);
  border-radius:16px;background:linear-gradient(180deg,rgba(201,164,74,.10),rgba(201,164,74,.02))}
.hg-end .hg-big{font-size:16px;color:var(--gold-2);font-weight:700;letter-spacing:2px;margin-bottom:10px}
.hg-end .hg-sm{font-size:11.5px;color:var(--ink-dim);line-height:1.8}

/* ===== 实物占卜页 · 图文版（v134 / 2026-11-10）=====
   来源：实物占卜页-图文版预览.html（用户已确认）。
   组件类名统一 hr- 前缀，与线上玩法说明图文版 hg-* 完全隔离；
   变量定义在 #screen-cast .hr-wrap 内，自包含，不污染其它页面。 */
#screen-cast .hr-wrap{
  --gold:#c9a44a; --gold-2:#e8c97a; --gold-deep:#a07c2c; --gold-line:#8f7331;
  --ink:#f5eacf; --ink-soft:#d9c79a; --ink-dim:#a89a7c;
  --paper:rgba(18,14,11,.88); --red:#c84b4b;
  --card:rgba(255,255,255,.035); --card-line:rgba(201,164,74,.20);
}
/* ===== 图文组件（与线上「玩法说明 · 图文版」完全一致，hr- 前缀隔离） ===== */
.hr-wrap{
  --ink-dim:#a89a7c;
  --card:rgba(255,255,255,.035);
  --card-line:rgba(201,164,74,.20);
  padding:6px 0 24px;
}
.hr-hero{text-align:center;padding:6px 0 16px}
.hr-hero .hr-eyebrow{font-size:11px;letter-spacing:5px;color:var(--gold);margin-bottom:10px}
.hr-hero h2{font-size:19px;color:var(--gold-2);letter-spacing:2px;margin:0 0 10px;font-weight:700}
.hr-hero .hr-lead{font-size:13px;color:var(--ink-soft);line-height:1.85;margin:0}
.hr-hero .hr-lead b{color:var(--gold-2);font-weight:700}

.hr-sec{margin-top:26px}
.hr-sec-h{display:flex;align-items:center;gap:9px;margin:0 0 12px}
.hr-sec-n{width:24px;height:24px;flex:0 0 24px;border-radius:50%;border:1px solid var(--gold-line);
  background:rgba(201,164,74,.10);color:var(--gold-2);font-size:12px;font-weight:700;
  display:flex;align-items:center;justify-content:center;letter-spacing:0}
.hr-sec-h h3{font-size:15px;color:var(--gold-2);letter-spacing:2px;margin:0;font-weight:700}
.hr-sec-h .hr-sub{font-size:11px;color:var(--ink-dim);letter-spacing:1px;margin-left:auto}

.hr-card{background:var(--card);border:1px solid var(--card-line);border-radius:14px;padding:13px 14px;margin-bottom:10px}
.hr-card p{font-size:12.5px;line-height:1.85;color:var(--ink-soft);margin:0}
.hr-card p b,.hr-card b{color:var(--gold-2);font-weight:700}
.hr-hl{background:linear-gradient(90deg,rgba(201,164,74,.16),rgba(201,164,74,.04));
  border-left:3px solid var(--gold);border-radius:0 12px 12px 0;padding:12px 14px;margin-bottom:12px}
.hr-hl p{margin:0;font-size:13px;line-height:1.85;color:var(--ink);letter-spacing:.3px}
.hr-hl b{color:var(--gold-2);font-weight:700;font-size:13.5px}
.hr-card p.hr-lines3{font-size:13px;line-height:2.2;letter-spacing:.5px}
.hr-hl p.hr-hl-lead{font-size:15px;line-height:1.7;letter-spacing:.5px;margin:0 0 7px}
.hr-hl p.hr-hl-lead b{font-size:15px;color:var(--gold-2);font-weight:700}
.hr-hl p.hr-hl-note{font-size:12.5px;color:var(--ink-soft);line-height:1.75;margin:0 0 10px}
.hr-hl p.hr-hl-note b{font-size:12.5px}

/* 两种玩法 · 操作卡 */
.hr-way{background:var(--card);border:1px solid var(--card-line);border-radius:14px;padding:13px 14px;margin-bottom:10px}
.hr-way-h{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.hr-way-tag{font-size:12px;font-weight:700;letter-spacing:1px;padding:4px 11px;border-radius:20px;white-space:nowrap;flex:0 0 auto}
.hr-way-tag.hr-online{background:rgba(201,164,74,.16);border:1px solid rgba(201,164,74,.36);color:#ffe6a8}
.hr-way-tag.hr-real{background:rgba(90,122,114,.18);border:1px solid rgba(120,160,150,.42);color:#bfe0d6}
.hr-way-sub{font-size:11px;color:var(--ink-dim)}
.hr-way-steps{display:flex;flex-direction:column;gap:8px}
.hr-ws{display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--ink-soft);line-height:1.7}
.hr-ws i{width:17px;height:17px;flex:0 0 17px;border-radius:50%;background:rgba(201,164,74,.14);
  border:1px solid rgba(201,164,74,.30);color:var(--gold-2);font-size:10px;font-style:normal;
  display:flex;align-items:center;justify-content:center;margin-top:2px}
.hr-ws b{color:var(--gold-2);font-weight:700}
.hr-ws .hr-ws-body{flex:1;min-width:0;font-size:12px;color:var(--ink-soft);line-height:1.7}
/* 步骤内的实物图示 */
.hr-way-fig{margin-top:9px;background:rgba(255,255,255,.025);border:1px solid rgba(201,164,74,.16);border-radius:10px;padding:10px}
.hr-way-fig .hr-fa{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.hr-way-fig .hr-fa img{width:52px;height:62px;object-fit:contain;flex:0 0 52px;filter:drop-shadow(0 3px 9px rgba(0,0,0,.45))}
.hr-way-fig .hr-fa .hr-ft{font-size:11px;color:var(--ink-soft);line-height:1.7}
.hr-way-fig .hr-fa .hr-ft b{display:block;font-size:11.5px;color:var(--gold-2);margin-bottom:3px;letter-spacing:.5px}
.hr-way-fig .hr-fb{display:flex;gap:8px;justify-content:space-around;border-top:1px solid rgba(201,164,74,.14);padding-top:9px}
.hr-way-fig .hr-fb .hr-cu{text-align:center;flex:1;min-width:0}
.hr-way-fig .hr-fb .hr-cu img{width:46px;height:46px;object-fit:contain;display:block;margin:0 auto 4px;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.45))}
.hr-way-fig .hr-fb .hr-cu span{display:block;font-size:10px;color:var(--ink-dim);letter-spacing:.3px;line-height:1.5}
.hr-way-fig .hr-fb .hr-cu b{color:var(--gold-2)}

/* 流程步骤 */
.hr-steps{display:flex;flex-direction:column;gap:8px}
.hr-step{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--card-line);
  border-radius:12px;padding:11px 13px;position:relative}
.hr-step .hr-ico{width:38px;height:38px;flex:0 0 38px;border-radius:10px;background:rgba(201,164,74,.10);
  border:1px solid rgba(201,164,74,.22);display:flex;align-items:center;justify-content:center}
.hr-step .hr-ico svg{width:22px;height:22px}
.hr-step .hr-tx{min-width:0}
.hr-step .hr-tx .hr-t{font-size:13px;color:var(--ink);font-weight:700;letter-spacing:.5px;margin-bottom:3px}
.hr-step .hr-tx .hr-d{font-size:11.5px;color:var(--ink-dim);line-height:1.6}
.hr-step .hr-num{margin-left:auto;flex:0 0 auto;font-size:11px;color:var(--gold);letter-spacing:1px}
.hr-step:not(:last-child)::after{content:"";position:absolute;left:31px;bottom:-9px;width:1px;height:9px;
  background:rgba(201,164,74,.35)}

/* 三易小卡 */
.hr-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.hr-trio .hr-tc{background:var(--card);border:1px solid var(--card-line);border-radius:12px;padding:12px 8px;text-align:center}
.hr-trio .hr-tc .hr-g{font-size:16px;color:var(--gold-2);font-weight:700;letter-spacing:2px;margin-bottom:6px}
.hr-trio .hr-tc .hr-d{font-size:11px;color:var(--ink-dim);line-height:1.65}

/* 四种组合对照 */
.hr-combo{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--card-line);
  border-radius:12px;padding:10px 12px;margin-bottom:8px}
.hr-combo.hr-s{padding:8px 10px;margin-bottom:6px;gap:8px}
.hr-combo .hr-three{display:flex;gap:4px;flex:0 0 auto}
.hr-mini{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:700;font-family:inherit;letter-spacing:0}
.hr-mini.hr-f{background:linear-gradient(145deg,#f0d488,#c9a44a);color:#5b4310;border:1px solid #e0bd66}
.hr-mini.hr-b{background:linear-gradient(145deg,#b99340,#8a6c25);color:#f3e2b4;border:1px solid #a8842f}
.hr-combo .hr-eq{color:var(--gold-line);font-size:13px;flex:0 0 auto}
.hr-combo .hr-yao{width:52px;flex:0 0 52px;display:flex;align-items:center;justify-content:center}
.hr-combo .hr-nm{flex:1;min-width:0}
.hr-combo .hr-nm .hr-n{font-size:12.5px;color:var(--ink);font-weight:700;letter-spacing:.5px}
.hr-combo .hr-nm .hr-d{font-size:10.5px;color:var(--ink-dim);margin-top:2px}
.hr-badge{font-size:10px;padding:3px 8px;border-radius:20px;letter-spacing:.5px;white-space:nowrap;flex:0 0 auto}
.hr-badge.hr-dong{background:rgba(200,75,75,.16);border:1px solid rgba(224,138,138,.42);color:#e8a0a0}
.hr-badge.hr-jing{background:rgba(201,164,74,.10);border:1px solid rgba(201,164,74,.26);color:var(--gold-2)}

/* 四层递进 */
.hr-layers{display:flex;align-items:stretch;gap:0;margin-bottom:10px}
.hr-layer{flex:1;text-align:center;position:relative;background:var(--card);border:1px solid var(--card-line);
  border-right:0;padding:10px 3px}
.hr-layer:first-child{border-radius:12px 0 0 12px}
.hr-layer:last-child{border-right:1px solid var(--card-line);border-radius:0 12px 12px 0}
.hr-layer .hr-l{font-size:12px;color:var(--gold-2);font-weight:700;letter-spacing:1px}
.hr-layer .hr-s{font-size:9.5px;color:var(--ink-dim);margin-top:4px;line-height:1.4}
.hr-layer.hr-last{background:rgba(201,164,74,.13);border-color:var(--gold-line)}
.hr-layer.hr-last .hr-l{color:#ffe6a8}

/* 依据标签 */
.hr-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
.hr-chip{font-size:11px;padding:5px 10px;border-radius:20px;letter-spacing:.5px}
.hr-chip.hr-yes{background:rgba(201,164,74,.14);border:1px solid rgba(201,164,74,.34);color:var(--gold-2)}
.hr-chip.hr-no{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);color:#8e8674;text-decoration:line-through}

/* 三句智慧 */
.hr-wisdom{background:var(--card);border:1px solid var(--card-line);border-radius:12px;
  padding:12px 13px;margin-bottom:8px;display:flex;align-items:center;gap:11px}
.hr-wisdom .hr-q{flex:1;font-size:12px;color:var(--ink-soft);line-height:1.7}
.hr-wisdom .hr-q b{color:var(--gold-2)}
.hr-wisdom .hr-tag{font-size:10px;color:var(--gold);border:1px solid rgba(201,164,74,.30);
  border-radius:20px;padding:3px 8px;white-space:nowrap;flex:0 0 auto}

/* 结语 */
.hr-end{text-align:center;margin-top:28px;padding:18px 12px;border:1px solid rgba(201,164,74,.24);
  border-radius:16px;background:linear-gradient(180deg,rgba(201,164,74,.10),rgba(201,164,74,.02))}
.hr-end .hr-big{font-size:16px;color:var(--gold-2);font-weight:700;letter-spacing:2px;margin-bottom:10px}
.hr-end .hr-sm{font-size:11.5px;color:var(--ink-dim);line-height:1.8}

/* ===== 本次预览新增组件（仍为 hr- 前缀） ===== */
.hr-ah{display:flex;align-items:center;gap:8px;margin:2px 0 12px;font-size:14px;
  color:var(--gold-2);letter-spacing:2px;font-weight:700}
.hr-ah::before{content:"";width:3px;height:15px;background:var(--gold);border-radius:2px}
.hr-ah span{margin-left:auto;font-size:11px;color:var(--ink-dim);font-weight:400;letter-spacing:1px}
.hr-cap{font-size:12px;color:var(--gold-2);font-weight:700;letter-spacing:1px;margin-bottom:9px}
.hr-foot{font-size:11px;color:var(--ink-dim);line-height:1.7;margin:8px 2px 0}
.hr-foot b{color:var(--gold-2)}

/* 步骤卡内嵌实物图示（原独立图卡整合进 STEP 1 / STEP 2） */
.hr-step.hr-with-fig{align-items:flex-start}
.hr-step.hr-with-fig .hr-ico{margin-top:1px}
.hr-step.hr-with-fig .hr-num{margin-top:4px}
.hr-step-main{flex:1;min-width:0}
.hr-step-fig{margin-top:10px;background:rgba(255,255,255,.025);
  border:1px solid rgba(201,164,74,.16);border-radius:10px;padding:9px}
.hr-step-fig .hr-fa{display:flex;align-items:center;gap:10px}
.hr-step-fig .hr-fa img{width:44px;height:54px;object-fit:contain;flex:0 0 44px;
  filter:drop-shadow(0 3px 9px rgba(0,0,0,.45))}
.hr-step-fig .hr-fa .hr-ft{font-size:10.5px;color:var(--ink-soft);line-height:1.65}
.hr-step-fig .hr-fa .hr-ft b{display:block;font-size:11px;color:var(--gold-2);
  margin-bottom:3px;letter-spacing:.5px}
.hr-step-fig .hr-cu-row{display:flex;gap:8px;justify-content:space-around}
.hr-step-fig .hr-cu{text-align:center;flex:1;min-width:0}
.hr-step-fig .hr-cu img{width:42px;height:42px;object-fit:contain;display:block;margin:0 auto 4px;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.45))}
.hr-step-fig .hr-cu span{display:block;font-size:10px;color:var(--ink-dim);
  letter-spacing:.3px;line-height:1.5}
.hr-step-fig .hr-cu b{color:var(--gold-2)}

/* STEP 3 内嵌六爻顺序（紧凑版） */
.hr-step-fig.hr-order-fig{padding:9px 10px}
.hr-order-fig .hr-order{gap:10px}
.hr-order-fig .hr-obar{flex:0 0 78px;gap:4px}
.hr-order-fig .hr-orow span{font-size:9.5px;width:11px;flex:0 0 11px}
.hr-order-fig .hr-yl{width:26px;height:6px}
.hr-order-fig .hr-yb i{width:11px;height:6px}
.hr-order-fig .hr-otx{font-size:11px;line-height:1.75}

/* 爻线图形 */
.hr-yl{width:34px;height:7px;border-radius:2px;background:linear-gradient(90deg,#e8c97a,#c9a44a)}
.hr-yb{display:flex;gap:5px}
.hr-yb i{width:14px;height:7px;border-radius:2px;background:linear-gradient(90deg,#e8c97a,#c9a44a)}
.hr-yao-box{display:flex;align-items:center;gap:4px}
.hr-yao-box em{font-size:12px;font-style:normal;color:#e8a0a0;font-weight:700}

/* 六爻顺序图 */
.hr-order{display:flex;align-items:center;gap:14px}
.hr-order .hr-obar{display:flex;flex-direction:column;gap:5px;flex:0 0 92px}
.hr-orow{display:flex;align-items:center;gap:8px}
.hr-orow span{font-size:10px;color:var(--ink-dim);width:12px;flex:0 0 12px;text-align:center}
.hr-order .hr-otx{flex:1;font-size:12px;color:var(--ink-soft);line-height:1.9}
.hr-order .hr-otx b{color:var(--gold-2)}

/* 2×2 四宫格 */
.hr-quad{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hr-qd{background:rgba(201,164,74,.055);border:1px solid rgba(201,164,74,.20);
  border-radius:10px;padding:10px 8px;text-align:center}
.hr-qd .hr-qt{font-size:13px;color:var(--gold-2);font-weight:700;letter-spacing:1px;margin-bottom:4px}
.hr-qd .hr-qs{font-size:10.5px;color:var(--ink-dim);line-height:1.5}
