我的页改版（蜜桃珊瑚头部 + 兜豆兑换商城主卡 + 服务宫格）；首页新增兜豆兑换商城入口

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

index.html

@@ -7,7 +7,7 @@
 <meta name="mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-capable" content="yes">
 <title>兜爸心选 · 孕育陪伴</title>
-<!-- V:26100135 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
+<!-- V:26100136 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
 <link rel="stylesheet" href="mama-box.css">
 <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
 <!-- 共享助手：授权/跳商城/位置上报（分享卡片同步，见 docs/h5-auth-standard.md 第四节） -->
@@ -355,6 +355,13 @@
             <button class="nyp-btn" id="nyBtn" type="button">进去布置 <svg viewBox="0 0 24 24" width="11" height="11" aria-hidden="true"><path d="M8 5l8 7-8 7z" fill="currentColor"/></svg></button>
           </div>
         </section>
+        <!-- 首页 · 兜豆兑换商城入口（2026-10-01）：紧跟婴儿房（那张卡写着「攒兜豆把它布置好」），
+             顺着「兜豆」这条线往下接。点击同「我的」页 #meExchCard → openExchange()。 -->
+        <button class="exch-strip ripple" id="homeExch">
+          <span class="es-coin" aria-hidden="true"><svg viewBox="0 0 40 40" width="34" height="34"><circle cx="20" cy="20" r="15" fill="#FFC94D" stroke="#E89B1E" stroke-width="2.2"/><circle cx="20" cy="20" r="10" fill="none" stroke="#FFF1C2" stroke-width="1.4"/><path d="M15.5 16c0-1.4 1.1-2.4 2.6-2.4h2c2.9 0 4.9 2 4.9 4.6v3.6c0 2.6-2 4.6-4.9 4.6h-2c-1.5 0-2.6-1-2.6-2.4z" fill="#fff"/></svg></span>
+          <span class="es-main"><b>兜豆兑换商城</b><span>攒下的兜豆，在这里换成好物</span></span>
+          <span class="es-go">去兑换<i>›</i></span>
+        </button>
 
         <!-- 模块二 · 今天的动线。
              上一版这里是两个各自独立的模块：「AI今日小结」一张渐变卡，
@@ -848,7 +855,12 @@
     </section>
 
 <section class="screen" id="screen-me" data-screen="me">
-      <div class="me-top">
+      <div class="me-top me-v2">
+        <!-- 2026-10-01「我的」页改版：头部从实心橘渐变 + 白卡，改成蜜桃 → 珊瑚的柔光渐变，
+             用户信息直接压在渐变上（白字），下面一张金色「兜豆兑换商城」卡半压在头部边缘。
+             装饰：两团柔光 + 几颗小星星，纯 CSS/SVG，不加图片请求。 -->
+        <i class="mt-glow g1" aria-hidden="true"></i><i class="mt-glow g2" aria-hidden="true"></i>
+        <svg class="mt-stars" viewBox="0 0 120 60" aria-hidden="true"><path d="M20 14l1.6 4.2 4.4 1.6-4.4 1.6L20 25.6l-1.6-4.2-4.4-1.6 4.4-1.6z" fill="#fff" opacity=".75"/><path d="M92 8l1 2.6 2.6 1-2.6 1L92 15.2l-1-2.6-2.6-1 2.6-1z" fill="#fff" opacity=".6"/><circle cx="64" cy="22" r="1.6" fill="#fff" opacity=".55"/><circle cx="108" cy="40" r="1.2" fill="#fff" opacity=".5"/></svg>
         <div class="hero-top">
           <!-- （商城图标已移除：进商城统一走下方「兜爸心选」模块 meMallCard）
           <button class="icon-btn plain" id="btnMall" aria-label="进商城">
@@ -898,6 +910,7 @@
                  ⚠️ syncPregnancy() 里那行 $('.me-info p') 早就删掉了（它取的是
                     **第一个** <p>）。现在第一个 <p> 是下面的「已连续记录」，
                     谁要是把那行加回来，会把连续记录天数冲掉，而且是静默的。 -->
+            <span class="me-tag hide" id="meTag"></span>
             <p id="meRecordLine">已连续记录 <b>42</b> 天</p>
           </div>
           <i class="me-chev" aria-hidden="true">›</i>
@@ -905,8 +918,32 @@
       </div>
 
       <div class="page-body no-top">
+        <!-- 兜豆兑换商城主卡（2026-10-01）：半压在头部渐变边缘，是「我的」页最跳的一张。
+             点击走 openExchange()（app.js）—— 链接优先取应用后台，取不到再用写死的兜底地址。
+             #meBeans 行在拿到兜豆余额前隐藏（余额接口待兑换商城侧提供）。 -->
+        <button class="bean-card ripple" id="meExchCard">
+          <span class="bc-pattern" aria-hidden="true"></span>
+          <span class="bc-coin" aria-hidden="true">
+            <svg viewBox="0 0 64 64" width="64" height="64">
+              <ellipse cx="34" cy="50" rx="20" ry="6" fill="#B8641A" opacity=".18"/>
+              <circle cx="28" cy="30" r="17" fill="#FFC94D"/><circle cx="28" cy="30" r="17" fill="none" stroke="#E89B1E" stroke-width="2.4"/>
+              <circle cx="28" cy="30" r="11.5" fill="none" stroke="#FFF1C2" stroke-width="1.6" opacity=".9"/>
+              <path d="M23 25.5c0-1.6 1.3-2.8 3-2.8h2.4c3.3 0 5.6 2.3 5.6 5.3v4c0 3-2.3 5.3-5.6 5.3H26c-1.7 0-3-1.2-3-2.8z" fill="#fff" opacity=".95"/>
+              <circle cx="46" cy="42" r="10" fill="#FFD966"/><circle cx="46" cy="42" r="10" fill="none" stroke="#E89B1E" stroke-width="2"/>
+              <path d="M46 37.5v9M41.5 42h9" stroke="#fff" stroke-width="2.4" stroke-linecap="round"/>
+            </svg>
+          </span>
+          <span class="bc-main">
+            <span class="bc-kick">兜豆兑换商城</span>
+            <span class="bc-title">攒兜豆，换好物</span>
+            <span class="bc-sub">做任务、开盲盒都能攒</span>
+            <span class="bc-beans hide" id="meBeansRow">我的兜豆 <b id="meBeans">0</b></span>
+          </span>
+          <span class="bc-cta">去兑换<i>›</i></span>
+        </button>
+
         <!-- 授权完善资料：H5 → navigateTo → 小程序授权页(头像/昵称/手机号) → box_app /auth/profile 落库 -->
-        <div class="list-card" style="margin-top:12px" id="meAuthBox">
+        <div class="list-card" style="margin-top:14px" id="meAuthBox">
           <button class="li ripple" id="meAuthCard">
             <span class="li-ico o"><svg viewBox="0 0 24 24" width="19" height="19" aria-hidden="true"><rect x="5" y="10.5" width="14" height="9.5" rx="2.5" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M8.5 10.5V8a3.5 3.5 0 0 1 7 0v2.5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/><path d="M12 15v2" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg></span>
             <span class="li-t">授权完善资料</span>
@@ -957,11 +994,11 @@
                     rgba 各家浏览器支持不一，stroke-opacity 是 SVG 1.1 的正经属性。 -->
             <div class="pc-ico">
               <svg viewBox="0 0 32 32" width="27" height="27" aria-hidden="true">
-                <circle cx="16" cy="16" r="11.6" fill="none" stroke="#FFFFFF" stroke-opacity=".3" stroke-width="3.2"/>
-                <circle id="pcRing" cx="16" cy="16" r="11.6" fill="none" stroke="#FFFFFF" stroke-width="3.2"
+                <circle cx="16" cy="16" r="11.6" fill="none" stroke="#F0704F" stroke-opacity=".3" stroke-width="3.2"/>
+                <circle id="pcRing" cx="16" cy="16" r="11.6" fill="none" stroke="#F0704F" stroke-width="3.2"
                         stroke-linecap="round" stroke-dasharray="45 73" transform="rotate(-90 16 16)"/>
-                <circle cx="17" cy="12.9" r="3.2" fill="#FFFFFF"/>
-                <path d="M13.8 17.2c.3 3.6 3 5.1 6 4.1" fill="none" stroke="#FFFFFF" stroke-width="3.4" stroke-linecap="round"/>
+                <circle cx="17" cy="12.9" r="3.2" fill="#F0704F"/>
+                <path d="M13.8 17.2c.3 3.6 3 5.1 6 4.1" fill="none" stroke="#F0704F" stroke-width="3.4" stroke-linecap="round"/>
               </svg>
             </div>
             <div class="pc-main"><div class="pc-title" id="pcTitle">孕 24 周 +3 天</div><div class="pc-sub" id="pcSub">预产期 2024年12月22日 · 还有 110 天</div></div>
@@ -1122,54 +1159,28 @@
         </button>
         </div>
 
-        <h2 class="sec-title dark">甄选好物</h2>
-        <button class="wx-card ripple" id="meMallCard">
-          <!-- 「甄选好物」角标已按需求去掉（.wx-top 角标行整行移除；孕育顾问那条"限量福利"不受影响） -->
-          <span class="wx-body">
-            <!-- 逛商城入口：购物袋图标（同 .wx-fig 76×拉伸高） -->
-            <span class="wx-fig" aria-hidden="true">
-              <svg viewBox="0 0 64 64" width="100%" height="100%">
-                <rect x="2" y="2" width="60" height="60" rx="14" fill="#FFF1E6"/>
-                <path d="M19 25h26l-2.1 23.2a3.4 3.4 0 0 1-3.4 3H25.5a3.4 3.4 0 0 1-3.4-3L19 25z" fill="#fff" stroke="#E8A98C" stroke-width="1.7" stroke-linejoin="round"/>
-                <path d="M26 25a6 6 0 0 1 12 0" fill="none" stroke="#D85F38" stroke-width="1.9" stroke-linecap="round"/>
-                <path d="M27.5 35h9M27.5 41h9" stroke="#F2C7B3" stroke-width="1.8" stroke-linecap="round"/>
-              </svg>
-            </span>
-            <span class="wx-main">
-              <span class="wx-head">
-                <span class="wx-title">兜爸心选商城</span>
-                <span class="wx-lim">母婴 · 好物</span>
-              </span>
-              <span class="wx-sub">为宝宝甄选的母婴好物，值得认真挑一挑</span>
-            </span>
+        <!-- 心选商城：改成一条横幅（原来是带大按钮的电商卡，和上面的兑换卡抢主角）。id/点击逻辑不变（goMall）。 -->
+        <button class="mall-strip ripple" id="meMallCard">
+          <span class="ms-ico" aria-hidden="true">
+            <svg viewBox="0 0 24 24" width="22" height="22"><path d="M5 8h14l-1.2 11a2 2 0 0 1-2 1.8H8.2a2 2 0 0 1-2-1.8z" fill="#fff" stroke="currentColor" stroke-width="1.7" stroke-linejoin="round"/><path d="M8.6 10V6.8a3.4 3.4 0 0 1 6.8 0V10" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/></svg>
           </span>
-          <span class="wx-cta">进入商城</span>
+          <span class="ms-main"><b>兜爸心选商城</b><span>为宝宝甄选的母婴好物</span></span>
+          <span class="ms-go">逛一逛<i>›</i></span>
         </button>
 
-        <h2 class="sec-title dark">设置与服务</h2>
-        <div class="list-card">
-          <!-- 「提醒设置」整项已按需求删除 -->
-          <!-- 孕期盲盒卡册的常驻入口（2026-10-01 用户反馈：开完盲盒后想回看，只认首页横幅不够）。
-               点击与首页横幅同一路径（app.js openBoxEntry）；#meBoxV 显示「已收集 N/37」，未拿到数据时隐藏整行。 -->
-          <button class="li ripple hide" id="meBoxCard">
-            <span class="li-ico o"><svg viewBox="0 0 24 24" width="19" height="19" aria-hidden="true"><rect x="4.5" y="10.5" width="15" height="9.5" rx="2" fill="none" stroke="currentColor" stroke-width="1.8"/><rect x="3.3" y="7.2" width="17.4" height="3.6" rx="1.3" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M12 7.2V20M12 7.2C10.4 3.8 7 4.3 8 6.4c.6 1 2.4.9 4 .8zM12 7.2c1.6-3.4 5-2.9 4-.8-.6 1-2.4.9-4 .8z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"/></svg></span>
-            <span class="li-t">我的孕期卡册</span><span class="li-v" id="meBoxV"></span><i class="chev">›</i></button>
-          <button class="li ripple" data-open="detailSetting" data-set="privacy">
-            <span class="li-ico p"><svg viewBox="0 0 24 24" width="19" height="19" aria-hidden="true"><rect x="4.5" y="10" width="15" height="10.5" rx="3" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M8.2 10V7.6a3.8 3.8 0 0 1 7.6 0V10" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/><circle cx="12" cy="15.2" r="1.5" fill="currentColor"/></svg></span>
-            <span class="li-t">隐私与权限</span><i class="chev">›</i></button>
-          <button class="li ripple" data-open="detailSetting" data-set="help">
-            <span class="li-ico o"><svg viewBox="0 0 24 24" width="19" height="19" aria-hidden="true"><path d="M12 4.2c4.5 0 7.8 2.8 7.8 6.4s-3.3 6.4-7.8 6.4c-.7 0-1.3-.06-1.9-.18l-3.6 2.3a.4.4 0 0 1-.6-.45l.8-2.9c-1.5-1.16-2.3-2.7-2.3-4.4 0-3.6 3.1-6.4 7.6-6.4z" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M9.9 9.4a2.2 2.2 0 0 1 4.2.8c0 1.5-2.1 1.6-2.1 3" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/></svg></span>
-            <span class="li-t">帮助与反馈</span><i class="chev">›</i></button>
-          <button class="li ripple" data-open="detailSetting" data-set="about">
-            <span class="li-ico b"><svg viewBox="0 0 24 24" width="19" height="19" aria-hidden="true"><circle cx="12" cy="12" r="8.2" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M12 11v5.4" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round"/><circle cx="12" cy="7.9" r="1.15" fill="currentColor"/></svg></span>
-            <span class="li-t">关于兜爸心选</span><span class="li-v">v3.2.1</span><i class="chev">›</i></button>
-          <!-- 退出授权登录：仅已授权时显示（applyRemoteProfile 控制）。
-               调 box_app /auth/logout —— 只翻授权状态，不清昵称/头像/手机号等资料 -->
-          <button class="li ripple" id="meLogoutCard" style="display:none">
-            <span class="li-ico r"><svg viewBox="0 0 24 24" width="19" height="19" aria-hidden="true"><path d="M14 5h5a1.5 1.5 0 0 1 1.5 1.5v11A1.5 1.5 0 0 1 19 19h-5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/><path d="M10 12H3m0 0 3.5-3.5M3 12l3.5 3.5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/></svg></span>
-            <span class="li-t" style="color:#C33A2E">退出授权登录</span>
-            <i class="chev">›</i></button>
+        <h2 class="sec-title dark">常用服务</h2>
+        <!-- 设置与服务：列表改成四宫格。按钮的 id / data-open / data-set 全部沿用，JS 不用动。
+             #meBoxCard 仍由盲盒数据控制 .hide；#meBoxV 显示成右上角小角标。 -->
+        <div class="svc-grid">
+          <button class="svc ripple hide" id="meBoxCard"><span class="sv-ico o"><svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true"><rect x="4.5" y="10.5" width="15" height="9.5" rx="2" fill="none" stroke="currentColor" stroke-width="1.8"/><rect x="3.3" y="7.2" width="17.4" height="3.6" rx="1.3" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M12 7.2V20M12 7.2C10.4 3.8 7 4.3 8 6.4c.6 1 2.4.9 4 .8zM12 7.2c1.6-3.4 5-2.9 4-.8-.6 1-2.4.9-4 .8z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"/></svg></span><span class="sv-t">孕期卡册</span><span class="sv-badge" id="meBoxV"></span></button>
+          <button class="svc ripple" data-open="detailSetting" data-set="privacy"><span class="sv-ico p"><svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true"><rect x="4.5" y="10" width="15" height="10.5" rx="3" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M8.2 10V7.6a3.8 3.8 0 0 1 7.6 0V10" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/><circle cx="12" cy="15.2" r="1.5" fill="currentColor"/></svg></span><span class="sv-t">隐私权限</span></button>
+          <button class="svc ripple" data-open="detailSetting" data-set="help"><span class="sv-ico o"><svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true"><path d="M12 4.2c4.5 0 7.8 2.8 7.8 6.4s-3.3 6.4-7.8 6.4c-.7 0-1.3-.06-1.9-.18l-3.6 2.3a.4.4 0 0 1-.6-.45l.8-2.9c-1.5-1.16-2.3-2.7-2.3-4.4 0-3.6 3.1-6.4 7.6-6.4z" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M9.9 9.4a2.2 2.2 0 0 1 4.2.8c0 1.5-2.1 1.6-2.1 3" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/></svg></span><span class="sv-t">帮助反馈</span></button>
+          <button class="svc ripple" data-open="detailSetting" data-set="about"><span class="sv-ico b"><svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true"><circle cx="12" cy="12" r="8.2" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M12 11v5.4" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round"/><circle cx="12" cy="7.9" r="1.15" fill="currentColor"/></svg></span><span class="sv-t">关于我们</span></button>
         </div>
+        <!-- 退出授权登录：仅已授权时显示（applyRemoteProfile 控制 style.display）。
+             调 box_app /auth/logout —— 只翻授权状态，不清昵称/头像/手机号等资料 -->
+        <button class="me-logout ripple" id="meLogoutCard" style="display:none">退出授权登录</button>
+        <p class="me-ver">兜爸心选 · v3.2.1</p>
       </div>
     </section>
   </main>