:root{
  --pri:#E54D42; --num:#C8923A; --num-d:#8a6d3b;
  --ys:#5CB85C; --ys-d:#3f8f45;
  --text:#333; --sub:#999;
  --bg-start:#FFD1C7; --bg-end:#FFC8B5;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
/* legacy body → scoped */
.app-page{font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--text);background:linear-gradient(160deg,var(--bg-start),var(--bg-end));
  min-height:100vh;padding-bottom:80px;}
.wrap{max-width:430px;margin:0 auto;padding:0 14px;}
.top{text-align:center;padding:22px 0 10px;}
.top .t{font-size:24px;font-weight:800;letter-spacing:3px;color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.15);}
.top .s{font-size:12px;color:#fff;opacity:.9;margin-top:4px;}
.card{background:#fff;border-radius:18px;padding:20px;margin:14px 0;
  box-shadow:0 8px 30px rgba(0,0,0,.08);}
.tag{display:inline-block;font-size:11px;padding:3px 10px;border-radius:20px;
  color:#fff;font-weight:600;margin-bottom:10px;}
.tag-num{background:var(--num);}
.tag-ys{background:var(--ys);}

/* Part1 数字 */
.hex{width:76px;height:76px;margin:6px auto 8px;display:flex;align-items:center;
  justify-content:center;font-size:34px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,var(--num),var(--num-d));
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);}
.p-title{text-align:center;font-size:19px;font-weight:700;color:var(--num-d);}
.p-oneline{text-align:center;font-size:13px;color:var(--sub);margin-top:4px;}
.pyr{text-align:center;margin:16px 0;}

/* Part2 体质 */
.ys-type{text-align:center;font-size:20px;font-weight:700;color:var(--ys-d);margin:4px 0;}
.ys-dir{text-align:center;font-size:13px;color:var(--sub);}
.bars{margin:16px 0 6px;}
.bar-row{display:flex;align-items:center;gap:8px;margin:7px 0;font-size:13px;}
.bar-row .lab{width:20px;text-align:center;font-weight:700;}
.bar-track{flex:1;height:14px;background:#f0f0f0;border-radius:8px;overflow:hidden;}
.bar-fill{height:100%;border-radius:8px;transition:width .6s;}
.bar-row .val{width:34px;text-align:right;color:var(--sub);}

/* 付费墙 */
.lock{position:relative;margin-top:14px;border-radius:14px;overflow:hidden;
  border:1px solid #f2e6d0;}
.lock .blur{filter:blur(10px);opacity:0.35;pointer-events:none;user-select:none;
  padding:16px;font-size:13px;line-height:1.9;color:#666;}
.lock .cover{position:absolute;inset:0;background:linear-gradient(180deg,
  rgba(255,255,255,.4),rgba(255,255,255,.92));display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding:16px;}
.lock .cover .lk-t{font-size:15px;font-weight:700;color:var(--num-d);}
.lock .cover .lk-d{font-size:12px;color:var(--sub);margin:6px 0 12px;}
.unlock-btn{background:var(--pri);color:#fff;border:none;padding:11px 30px;
  border-radius:24px;font-size:15px;font-weight:700;cursor:pointer;
  box-shadow:0 4px 14px rgba(229,77,66,.35);}
.unlocked .cover{display:none;}
.unlocked .blur{filter:none;pointer-events:auto;user-select:auto;}

/* Part3 今日锦囊 */
.jn h4{font-size:14px;color:var(--ys-d);margin-bottom:8px;}
.jn .row{font-size:13px;line-height:2;color:#555;}
.jn .row b{color:var(--ys-d);}
.jn .st{font-size:12px;color:var(--sub);margin-bottom:6px;}

/* 契合度 / 分享 */
.mini-form{display:flex;gap:6px;align-items:center;justify-content:center;
  flex-wrap:wrap;margin-top:10px;}
.mini-form input{width:56px;padding:9px 4px;border:1.5px solid #eee;
  border-radius:9px;text-align:center;font-size:14px;}
.mini-form button,.share-btn{background:var(--pri);color:#fff;border:none;
  padding:10px 20px;border-radius:22px;font-size:14px;font-weight:600;cursor:pointer;}
.share-btn{display:block;width:100%;margin-top:6px;}
.match-score{text-align:center;font-size:32px;font-weight:800;color:var(--pri);margin:8px 0 2px;}

/* 深度入口 */
.deep{display:flex;gap:10px;margin:16px 0;}
.deep a{flex:1;text-align:center;padding:13px 6px;border-radius:14px;
  color:#fff;text-decoration:none;font-size:13px;font-weight:600;}
.deep .d-num{background:linear-gradient(135deg,var(--num),var(--num-d));}
.deep .d-ys{background:linear-gradient(135deg,var(--ys),var(--ys-d));}

.disc{font-size:11px;color:#fff;opacity:.8;text-align:center;line-height:1.7;
  padding:14px 8px;}
.err{text-align:center;color:#fff;padding:40px 20px;font-size:15px;}

/* 分享卡片 canvas 弹层 */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;
  align-items:center;justify-content:center;z-index:99;padding:20px;}
.modal.on{display:flex;}
.modal .m-box{background:#fff;border-radius:16px;padding:16px;max-width:340px;text-align:center;}
.modal canvas{width:100%;border-radius:10px;}
.modal .m-tip{font-size:12px;color:var(--sub);margin:10px 0;}
.modal .m-close{color:var(--pri);font-size:14px;cursor:pointer;}

/* 支付弹窗 */
.pay-modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;
  align-items:center;justify-content:center;z-index:100;padding:20px;}
.pay-modal.on{display:flex;}
.pay-modal .pm-box{background:#fff;border-radius:20px;padding:28px 24px 22px;
  max-width:300px;width:100%;text-align:center;box-shadow:0 16px 48px rgba(0,0,0,.15);}
.pay-modal .pm-icon{font-size:36px;margin-bottom:10px;}
.pay-modal .pm-title{font-size:18px;font-weight:700;color:#333;margin-bottom:4px;}
.pay-modal .pm-desc{font-size:13px;color:var(--sub);margin-bottom:6px;line-height:1.6;}
.pay-modal .pm-price{font-size:28px;font-weight:800;color:var(--pri);margin:8px 0;}
.pay-modal .pm-price small{font-size:14px;font-weight:400;color:var(--sub);}
.pay-modal .pm-features{font-size:12px;color:#888;margin:10px 0 14px;line-height:1.9;}
.pay-modal .pm-btn{display:block;width:100%;background:var(--pri);color:#fff;border:none;
  padding:12px;border-radius:24px;font-size:15px;font-weight:700;cursor:pointer;
  box-shadow:0 4px 14px rgba(229,77,66,.35);margin-bottom:8px;}
.pay-modal .pm-cancel{font-size:12px;color:#aaa;cursor:pointer;background:none;border:none;}