From 9063e52e10869cc97fe46667c6b5f7f4d9b4867f Mon Sep 17 00:00:00 2001
From: deploy <deploy@local>
Date: Sat, 7 Nov 2026 08:18:03 +0000
Subject: [PATCH] =?UTF-8?q?v26110643=20=E6=B5=8B=E4=B8=80=E6=B5=8B?=
 =?UTF-8?q?=E7=AD=94=E9=A2=98/=E7=BB=93=E6=9E=9C=E9=A1=B5=E5=8A=A0?=
 =?UTF-8?q?=E5=BA=95=E8=89=B2=E5=92=8C=E5=8D=A1=E7=89=87=E8=AE=BE=E8=AE=A1?=
 =?UTF-8?q?=EF=BC=88=E4=B8=8D=E5=86=8D=E7=BA=AF=E7=99=BD=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增 topic/_shared/quiz-skin.css：主色浅底渐变 + 柔光 + 小圆点底纹，题目卡白卡+顶部色条，选项白卡带阴影
- guangchang/ceshi（30 个测试）和 topic/ceshi、duiyou、yali、yinshi、zhunbei 共 6 页引入

Co-Authored-By: AI 助手 <noreply@local>
---
 guangchang/ceshi/index.html |  1 +
 index.html                  |  2 +-
 js/app.js                   |  2 +-
 topic/_shared/quiz-skin.css | 38 +++++++++++++++++++++++++++++++++++++
 topic/ceshi/index.html      |  1 +
 topic/duiyou/index.html     |  1 +
 topic/yali/index.html       |  1 +
 topic/yinshi/index.html     |  1 +
 topic/zhunbei/index.html    |  1 +
 9 files changed, 46 insertions(+), 2 deletions(-)
 create mode 100644 topic/_shared/quiz-skin.css

diff --git a/guangchang/ceshi/index.html b/guangchang/ceshi/index.html
index 8c67979..4df993b 100644
--- a/guangchang/ceshi/index.html
+++ b/guangchang/ceshi/index.html
@@ -231,6 +231,7 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd
 .fade.in{opacity:1;transform:none}
 @media (prefers-reduced-motion:reduce){.fade,.stage,.view.on,.mask.on{opacity:1;transform:none;transition:none;animation:none}}
 </style>
+<link rel="stylesheet" href="../../topic/_shared/quiz-skin.css?v=26110643"><!-- 11-07 答题页底色 / 卡片 -->
 </head>
 <body>
 <svg class="hide" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
diff --git a/index.html b/index.html
index 888c9ef..58b4a0e 100644
--- a/index.html
+++ b/index.html
@@ -9,7 +9,7 @@
 <title>兜爸心选 · 孕育陪伴</title>
 <!-- 11-04 UGC 总开关（孕妈广场 + 测一测，后台 /box_bm/plaza 顶部切换），见 js/ugc.js -->
 <script src="js/ugc.js?v=26110702"></script>
-<!-- V:26110642 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
+<!-- V:26110643 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
 <link rel="stylesheet" href="mama-box.css">
 <link rel="stylesheet" href="night.css?v=26110608">
 <link rel="stylesheet" href="js/wh-cm.css?v=26110642">
diff --git a/js/app.js b/js/app.js
index 8401f2e..c9c93ee 100644
--- a/js/app.js
+++ b/js/app.js
@@ -3,7 +3,7 @@
 (function () {
   'use strict';
   /* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */
-  var VER = '26110642';
+  var VER = '26110643';
   const $ = (s, c) => (c || document).querySelector(s);
   const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
 
diff --git a/topic/_shared/quiz-skin.css b/topic/_shared/quiz-skin.css
new file mode 100644
index 0000000..505dec8
--- /dev/null
+++ b/topic/_shared/quiz-skin.css
@@ -0,0 +1,38 @@
+/* 测一测 · 答题 / 结果页底色与卡片（2026-11-07 用户：「答题页面加一些设计感，加一些背景色，不要纯白色，所有答题页面都设计一下」）
+   共用页：guangchang/ceshi（30 个测试）+ topic/ceshi、duiyou、yali、yinshi、zhunbei，放在各页 <style> 之后覆盖。
+   · 底：主色浅底渐变 + 两团柔光 + 极淡小圆点，固定在 #scroll 背后（伪元素 position:fixed，iOS 上不跟着抖）；颜色全取各页的 --c / --cbg / --c2，换测试自动换色。
+   · 卡：题目卡白底 + 顶部主色渐变条 + 大引号水印；选项白卡带轻阴影（原来白底灰边，铺在白页上看不出层次）。
+   · 开始页原有自己的渐变，只把它的「渐到纯白」改成透明，露出这层底。 */
+html,body{background:var(--cbg)}
+#scroll{isolation:isolate}
+#scroll:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
+  background:
+    radial-gradient(circle at 1px 1px,var(--c10) 1.2px,transparent 1.6px) 0 0/22px 22px,
+    radial-gradient(60% 38% at 100% 4%,var(--c2,color-mix(in srgb,var(--c) 28%,#fff)) 0%,transparent 70%),
+    radial-gradient(56% 34% at 0% 62%,color-mix(in srgb,var(--c2,color-mix(in srgb,var(--c) 28%,#fff)) 70%,#fff) 0%,transparent 72%),
+    radial-gradient(50% 30% at 96% 100%,rgba(255,255,255,.75) 0%,transparent 70%),
+    linear-gradient(180deg,var(--cbg) 0%,color-mix(in srgb,var(--cbg) 55%,#fff) 55%,var(--cbg) 100%)}
+.bar.sh{background:color-mix(in srgb,var(--cbg) 82%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom-color:var(--c10)}
+#vStart.on{background:radial-gradient(120% 60% at 50% 0%,rgba(255,255,255,.7) 0%,rgba(255,255,255,0) 70%)}
+
+/* ② 答题 */
+.qtop .no b{font-size:20px}
+.qcard{background:#fff;border-radius:26px;padding-top:24px;box-shadow:0 14px 34px -14px var(--c20),0 2px 6px var(--c06)}
+.qcard:before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--c),var(--c2,color-mix(in srgb,var(--c) 28%,#fff)))}
+.qcard:after{width:150px;height:150px;right:-48px;top:-56px;background:radial-gradient(circle,var(--c10),transparent 70%)}
+.qcard h2:before{content:"\201C";position:absolute;right:-6px;bottom:-34px;font:900 96px/1 Georgia,serif;color:var(--c06);pointer-events:none}
+.opt{background:rgba(255,255,255,.92);border-color:transparent;box-shadow:0 4px 14px -6px var(--c20)}
+.opt .l{background:var(--cbg);color:var(--c)}
+.opt.sel{background:#fff;box-shadow:0 8px 20px -8px var(--c)}
+.opt.ok{box-shadow:0 8px 20px -10px #2DB37D}.opt.no{box-shadow:none}
+.exp{background:rgba(255,255,255,.88);box-shadow:0 4px 14px -8px var(--c20)}
+.qtip{color:color-mix(in srgb,var(--c) 55%,#86909C)}
+
+/* ③ 结果 */
+.rcard{box-shadow:0 16px 36px -16px var(--c20)}
+.read,.rv{background:rgba(255,255,255,.82);box-shadow:0 4px 14px -8px var(--c20)}
+.rv .it{background:var(--cbg)}
+.tp,.rec{background:rgba(255,255,255,.9);border-color:transparent;box-shadow:0 4px 14px -8px var(--c20)}
+.oth{background:linear-gradient(110deg,#fff,rgba(255,255,255,.6) 80%)}
+.btn.sec{background:rgba(255,255,255,.9)}
+.foot{color:color-mix(in srgb,var(--c) 40%,#86909C)}
diff --git a/topic/ceshi/index.html b/topic/ceshi/index.html
index 237f09e..e53370b 100644
--- a/topic/ceshi/index.html
+++ b/topic/ceshi/index.html
@@ -176,6 +176,7 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd
 .fade.in{opacity:1;transform:none}
 @media (prefers-reduced-motion:reduce){.fade,.stage,.view.on,.mask.on{opacity:1;transform:none;transition:none;animation:none}}
 </style>
+<link rel="stylesheet" href="../_shared/quiz-skin.css?v=26110643"><!-- 11-07 答题页底色 / 卡片 -->
 </head>
 <body>
 <!-- 单色线性图标（每题一个场景图标 q-*） -->
diff --git a/topic/duiyou/index.html b/topic/duiyou/index.html
index 4cab458..c08accd 100644
--- a/topic/duiyou/index.html
+++ b/topic/duiyou/index.html
@@ -177,6 +177,7 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd
 .fade.in{opacity:1;transform:none}
 @media (prefers-reduced-motion:reduce){.fade,.stage,.view.on,.mask.on{opacity:1;transform:none;transition:none;animation:none}}
 </style>
+<link rel="stylesheet" href="../_shared/quiz-skin.css?v=26110643"><!-- 11-07 答题页底色 / 卡片 -->
 </head>
 <body>
 <!-- 单色线性图标（每题一个场景图标 q-*） -->
diff --git a/topic/yali/index.html b/topic/yali/index.html
index 0550e36..53e63dc 100644
--- a/topic/yali/index.html
+++ b/topic/yali/index.html
@@ -195,6 +195,7 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd
 .care p{font-size:14.5px;line-height:1.8;color:var(--ink)}
 .care p+p{margin-top:8px}
 </style>
+<link rel="stylesheet" href="../_shared/quiz-skin.css?v=26110643"><!-- 11-07 答题页底色 / 卡片 -->
 </head>
 <body>
 <!-- 单色线性图标（每题一个场景图标 q-*） -->
diff --git a/topic/yinshi/index.html b/topic/yinshi/index.html
index 7dcb17a..ec60552 100644
--- a/topic/yinshi/index.html
+++ b/topic/yinshi/index.html
@@ -194,6 +194,7 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd
 .src{margin-top:10px;font-size:12px;color:var(--sub);line-height:1.6}
 .warn{margin-top:20px;padding:10px 14px;border-radius:14px;background:var(--cbg);color:#4F7F2A;font-size:13px;line-height:1.6;text-align:center}
 </style>
+<link rel="stylesheet" href="../_shared/quiz-skin.css?v=26110643"><!-- 11-07 答题页底色 / 卡片 -->
 </head>
 <body>
 <!-- 单色线性图标（每题一个场景图标 q-*） -->
diff --git a/topic/zhunbei/index.html b/topic/zhunbei/index.html
index e140e5a..379862c 100644
--- a/topic/zhunbei/index.html
+++ b/topic/zhunbei/index.html
@@ -195,6 +195,7 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd
 .fade.in{opacity:1;transform:none}
 @media (prefers-reduced-motion:reduce){.fade,.stage,.view.on,.mask.on{opacity:1;transform:none;transition:none;animation:none}}
 </style>
+<link rel="stylesheet" href="../_shared/quiz-skin.css?v=26110643"><!-- 11-07 答题页底色 / 卡片 -->
 </head>
 <body>
 <!-- 单色线性图标（每题一个场景图标 q-*） -->