From 72a190fe71b7c66928b85a0c43dcec01a0444271 Mon Sep 17 00:00:00 2001
From: Karlcarlo <karlcarlo@163.com>
Date: Sun, 4 Oct 2026 04:20:21 +0000
Subject: [PATCH] =?UTF-8?q?style(=E9=A6=96=E9=A1=B5):=20=E5=A4=B4=E5=9B=BE?=
 =?UTF-8?q?=E4=B8=8E=E7=AC=AC=E4=B8=80=E5=9D=97=E5=8D=A1=E7=89=87=E8=A1=94?=
 =?UTF-8?q?=E6=8E=A5=E2=80=94=E2=80=94=E6=97=A0=E6=9D=A5=E4=BF=A1=E6=97=B6?=
 =?UTF-8?q?=E5=B7=A5=E5=85=B7=E5=8D=A1=E5=8E=8B=E8=BF=9B=E5=A4=B4=E5=9B=BE?=
 =?UTF-8?q?=20(v26100414)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 无来信：头图 250→262、平底，背景图高度钉在 250，多出部分用底边色补；工具卡 margin-top -26 压上去，两个圆角落在橙色里
- 有来信：头图保持原 250 + 弧底（app.js 同步给 .home-hero 切 .no-letter）
- #homeBody z-index:1 防头图子元素盖卡；彩色光斑下错 26px 不洗白头图
- 工具卡顶部向上淡投影、顶部更实的白、光晕减半；水印下移 10px

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 index.html   |  4 ++--
 js/app.js    |  5 ++++-
 mama-box.css | 32 ++++++++++++++++++++++++++++++++
 3 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index 02fcf09..021e7f8 100644
--- a/index.html
+++ b/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:26100413 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
+<!-- V:26100414 缓存版本标记：改 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 第四节） -->
@@ -59,7 +59,7 @@
   <main class="screens" id="screens">
 
 <section class="screen is-active" id="screen-home" data-screen="home">
-      <div class="home-hero">
+      <div class="home-hero no-letter">
         <!-- 2026-10-04 头图改版（用户：宝宝按孕周换形态、孕囊跟着宝宝大小变、去掉飘落的花瓣、加阳光和水波纹）：
              背景换成「去掉羊水囊的空背景」，羊水囊 + 宝宝整体都在 .hero-baby 里，按孕周 9 个阶段换图（js/hero-fx.js）。
              每阶段一张会动的 GIF（本地程序化形变：呼吸、轻浮、小手、蹬脚；脸不动，所以永远闭眼闭嘴）+ 一张同帧静图打底，
diff --git a/js/app.js b/js/app.js
index 5869067..99d8d72 100644
--- a/js/app.js
+++ b/js/app.js
@@ -3,7 +3,7 @@
 (function () {
   'use strict';
   /* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */
-  var VER = '26100413';
+  var VER = '26100414';
   const $ = (s, c) => (c || document).querySelector(s);
   const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
 
@@ -738,6 +738,8 @@
     const card = $('#homeLetter'), body = $('#homeBody');
     if (card) { card.classList.add('hide'); card.classList.remove('has-new'); }
     if (body) body.classList.add('no-letter');
+    // 头图跟着切：无来信 → 平底让工具卡压上来；有来信 → 回到弧底（见 mama-box.css「头图 ↔ 第一块卡片的衔接」）
+    const hero = $('.home-hero'); if (hero) hero.classList.add('no-letter');
   }
 
   /* 来信提示（首页卡 + 底 tab 红点）的**唯一渲染入口**。
@@ -780,6 +782,7 @@
     card.classList.add('has-new');
     card.classList.remove('hide');
     if (body) body.classList.remove('no-letter');
+    const hero = $('.home-hero'); if (hero) hero.classList.remove('no-letter');
     if (badge) badge.classList.add('show');
   }
   /* 2026-10-02 底部导航：「宝宝来信」tab 的信封在有红点时轻轻晃（CSS .has-new）。
diff --git a/mama-box.css b/mama-box.css
index 08928b5..65b0346 100644
--- a/mama-box.css
+++ b/mama-box.css
@@ -4439,3 +4439,35 @@ a.skip:focus{left:16px;top:16px}
 @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
   #screen-me .preg-card,#screen-me .mall-strip,#screen-me .svc-grid,#screen-me .me-logout,#screen-me .list-card{background:rgba(255,255,255,.82)}
 }
+
+/* ============ 2026-10-04 头图 ↔ 第一块卡片的衔接 ============
+   问题：衔接原本全靠「宝宝来信」卡的 margin-top:-16 压进头图；来信卡一收起来（大多数用户），
+   工具卡就改成往下空 30px，头图大弧底和平顶卡片之间露出一条米色缝，两块各管各的。
+   改法：不管谁是第一块，都压进头图。
+     · 头图 250 → 262，底边改平（弧线整个藏在卡片下面，不再有两套形状对拼）。
+       背景图高度钉死在 250，宝宝/孕囊/文字的竖向账一律不动；多出的 12px 用图底边的颜色补。
+     · 无来信时第一块 margin-top:-26（= 卡片圆角），卡顶 236：
+         天数卡底 218 → 留 18；孕囊下缘 229.5 → 留 6.5；卡片两个圆角 236～262 全落在橙色里。
+     · 有来信时头图回到原来的 250 + 弧底（app.js 给 .home-hero 同步切 .no-letter），来信卡仍 -16，跟以前一模一样。
+     · #homeBody 建层叠上下文（z-index:1），否则头图里 z-index:2/3 的子元素会盖到卡片上面。
+     · #homeBody 的彩色光斑往下错 26px 不平铺，免得盖到头图底上把橙色洗白。
+     · 第一块卡片：顶部向上一层淡投影（浮在头图上）、顶部改成更实的白（压在橙上也是干净的白）、
+       左上角主题色光晕减半；水印往下挪 10px，不再被右上圆角切掉。 */
+.home-hero.no-letter{
+  height:calc(262px + env(safe-area-inset-top));
+  border-radius:0;
+  background:
+    linear-gradient(90deg,rgba(150,55,35,.20) 0%,rgba(150,55,35,.07) 38%,rgba(150,55,35,0) 58%),
+    url(assets/img/6a268e7269b7.jpg) right top/auto calc(250px + env(safe-area-inset-top)) no-repeat,
+    linear-gradient(90deg,#CE8069 0%,#D8886F 30%,#DB9073 100%);
+}
+#homeBody{z-index:1;background-position:0 26px;background-repeat:no-repeat}
+.home-body.no-letter>:first-child,
+.home-body.no-letter>.bb-banner.hide+.tool-dock{margin-top:-26px}
+#homeBody.no-letter>section.tool-dock{
+  background:
+    linear-gradient(90deg,rgba(var(--gt),.28),rgba(var(--gt),0) 60%) top/100% 2px no-repeat,
+    radial-gradient(240px 110px at 0 0,rgba(var(--gt),.10),rgba(var(--gt),0) 72%),
+    linear-gradient(180deg,rgba(255,255,255,.95) 0,rgba(255,255,255,.7) 70px,rgba(255,255,255,.5) 160px)!important;
+  box-shadow:0 -6px 18px rgba(150,60,40,.10),0 12px 30px rgba(190,110,80,.10),0 2px 6px rgba(190,110,80,.04),inset 0 1px 0 #fff!important}
+.tool-dock .wm{top:10px}