记一下宫格：没到孕周的工具自动排到最后，解锁后回原位 v26101023

Co-Authored-By: AI 助手

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:26101022 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
+<!-- V:26101023 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
 <link rel="stylesheet" href="mama-box.css">
 <link rel="stylesheet" href="night.css">
 <!-- 夜晚模式：首屏绘制前就按上次的选择加 class，避免先白后黑闪一下（开关在首页右上角 #nightBtn，逻辑见 app.js） -->

js/app.js

@@ -3,7 +3,7 @@
 (function () {
   'use strict';
   /* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */
-  var VER = '26101022';
+  var VER = '26101023';
   const $ = (s, c) => (c || document).querySelector(s);
   const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
 
@@ -378,12 +378,20 @@
   }
   /* 记一下宫格上的小标签「孕16周开放」（图标右上角）：没到门槛的灰一点，到了自动去掉；首页工具卡改成直接换替补（swapHomeCards） */
   function markStageLocks() {
-    $$('#appsGrid .app').forEach(b => {
+    const tiles = $$('#appsGrid .app');
+    tiles.forEach(b => {
       const g = stageGateOf(decodeURIComponent(b.dataset.url || ''), decodeURIComponent(b.dataset.id || ''));
       const on = stageLocked(g);
       b.classList.toggle('is-locked', on);
       if (on) b.dataset.lock = '孕' + g.wk + '周开放'; else delete b.dataset.lock;
     });
+    /* 2026-10-11 用户：没开放的排到后面，不放最前面。能用的保持后台排序（data-ord），没开放的整体挪到末尾；
+       孕周到了解锁，就按 data-ord 回到原位。只挪 DOM 顺序，点击走事件委托不受影响。 */
+    const grid = $('#appsGrid');
+    if (grid && tiles.length) {
+      tiles.slice().sort((a, b) => (a.classList.contains('is-locked') - b.classList.contains('is-locked')) || (+a.dataset.ord - +b.dataset.ord))
+        .forEach(t => grid.appendChild(t));
+    }
     swapHomeCards();
   }
   /* 首页工具卡按孕周自动换（2026-10-11 用户：「孕育工具卡片替换成其他几个能让用户用的，否则首页体验特别差，
@@ -455,14 +463,14 @@
   function renderAppGrid(apps) {
     const grid = $('#appsGrid');
     if (!grid) return;
-    grid.innerHTML = apps.map(a => {
+    grid.innerHTML = apps.map((a, i) => {
       const ico = a.logo || a.icon || '';
       const name = a.name || a.identifier || '应用';
       /* 有 logo：白底圆角让图盖满；无 logo：colorTheme/调色板 + 首字彩色块。
          ⚠️ colorTheme 目前全是 'blue' 颜色名 —— 有图时别拿它当底色，否则清一色蓝。 */
       const bg = ico ? 'background:#fff' : 'background:' + (a.colorTheme || appTileColor(name));
       const img = ico ? '<img class="a-ico" src="' + ico + '" alt="" loading="lazy">' : '<span class="a-ico a-ico-letter" style="background:' + bg + '">' + name.slice(0, 1) + '</span>';
-      return '<button class="app ripple" data-url="' + encodeURIComponent(a.url) + '" data-id="' + encodeURIComponent(a.identifier || '') + '">' + img + '<span class="a-n">' + name + '</span></button>';
+      return '<button class="app ripple" data-ord="' + i + '" data-url="' + encodeURIComponent(a.url) + '" data-id="' + encodeURIComponent(a.identifier || '') + '">' + img + '<span class="a-n">' + name + '</span></button>';
     }).join('');
     /* 磁贴点击（事件委托，innerHTML 重建后不用重绑） */
     grid.onclick = function (e) {