/* ═════ 08 报告页 —— 1:1 移植 H5 #s-report ═════
   对照来源（逐条核对，后者覆盖前者）：
     index.html #s-report L174-291
     css/style.css       L347-503  （基础）
     css/ui-20261009.css L45-87    （第二轮 PSD）
     css/ui-20261012.css L71-172   （第三轮 PSD，最终生效值）
   换算：H5 的 calc(N * var(--u))（375 设计宽基准）→ 2N rpx；
         H5 里固定的 px 字号、1px 描边、百分比、transform 原样保留；
         注释用「基础 → ui-20261009 → ui-20261012」标出覆盖关系。
   限制：只能用 class/id 选择器；acss 无 @font-face，字体沿用 app.acss 的系统栈，
         故 H5 的 "MiSans Demibold"(700) 退化为系统字体 + font-weight:700。 */

/* ─── 页面容器（H5 #s-report / .report-body） ───
   #s-report 还有一条 background:#efefef url(bg-report-h5.webp) center top/100% auto。
   该 webp 实测为 1080×7512 的纯 #EFEFEF 单色图（全图只有一种颜色 239,239,239），
   与 app.acss 里 page 的底色等价，所以这里不再引这张空图
   （<image> 会额外解码约 32MB，并把页面滚动高度撑到 2608px）。
   .report-body { padding: calc(28u) calc(17u) calc(42u) } */
.report { position: relative; }
/* 原生不透明页眉已预留系统顶部区域，正文恢复 H5 原有的 28u 上间距。 */
.report-body { position: relative; z-index: 1; padding: 56rpx 34rpx 84rpx; }

/* .report-title { font-size:23px; font-weight:600(覆盖 700); letter-spacing:calc(.5u);
   text-align:center; margin-bottom:calc(23u) }；行高固定 30px = H5 实测行盒 */
.report-title {
  font-size: 23px;
  font-weight: 600;
  color: #282828;
  text-align: center;
  letter-spacing: 1rpx;
  line-height: 30px;
  margin-bottom: 46rpx;
}

/* .card { background:#fff; border-radius:calc(7u)(覆盖 8u); margin-bottom:calc(12u) } */
.card { margin-bottom: 24rpx; }

/* ─── 总分卡：H5 是 display:grid 两列 1fr + row-gap calc(15u)，padding calc(16u) calc(14u)
       acss 用 flex-wrap 等价实现：两个 50% 列 + 整行 .card-dims ─── */
.card-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 32rpx 28rpx;
  box-sizing: border-box;
}

/* .sum-score { flex:none; border-right:1px solid #EFEFEF; flex-direction:column;
                align-items:center; justify-content:center } */
.sum-score {
  flex: 0 0 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  border-right: 1px solid #EFEFEF;
  box-sizing: border-box;
}

/* .score-dial { position:relative; width:calc(108u); height:calc(108u) } */
.score-dial { position: relative; width: 216rpx; height: 216rpx; }

/* H5 用 <svg viewBox="0 0 120 120"> 画环形：r=52、stroke-width=9
   → 在 108px 画盘上外径 50.85、内径 42.75。
   acss 无 svg，改成等价的三层几何：轨道圆环 + conic-gradient 进度弧 + 圆头补点。 */
.ring-track {
  position: absolute;
  left: 50%; top: 50%;
  width: 203.4rpx; height: 203.4rpx;
  margin: -101.7rpx 0 0 -101.7rpx;
  border-radius: 50%;
  background: #EFEFEF;
}
/* 进度弧：report.js 按总分写入 conic-gradient(#F5F078 0 deg, 透明 deg)。
   conic-gradient 的 0deg 在正上方、顺时针递增，与 H5 SVG rotate(-90deg) 的进度方向一致。
   圆的直径必须与 .ring-track 一致（203.4rpx）：若铺满 216rpx 画盘，
   环会变成 11.25rpx 厚、外径 54（H5 是 8.1rpx 厚、外径 50.85）。 */
.ring-arc {
  position: absolute;
  left: 50%; top: 50%;
  width: 203.4rpx; height: 203.4rpx;
  margin: -101.7rpx 0 0 -101.7rpx;
  border-radius: 50%;
}
/* 圆形内孔（卡片底色为白）：半径 42.75 → 直径 171rpx */
.ring-hole {
  position: absolute;
  left: 50%; top: 50%;
  width: 171rpx; height: 171rpx;
  margin: -85.5rpx 0 0 -85.5rpx;
  border-radius: 50%;
  background: #FFFFFF;
}
/* stroke-linecap:round 的等价物：半径 8.1rpx 的圆点落在弧的两端 */
.ring-cap {
  position: absolute;
  width: 16.2rpx; height: 16.2rpx;
  margin: -8.1rpx 0 0 -8.1rpx;
  border-radius: 50%;
  background: #F5F078;
}
/* .ring-center { position:absolute; inset:0; flex-direction:column; align-items:center;
                  justify-content:center; gap:0 } */
.ring-center {
  position: absolute;
  left: 0; top: 0; right: 0; bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* .stat-value { color:var(--ink); line-height:1; white-space:nowrap; display:flex; align-items:baseline } */
.stat-value {
  display: flex;
  align-items: baseline;
  color: #282828;
  line-height: 1;
  white-space: nowrap;
}
/* .ring-center .stat-value b { font-size:40px } + #stat-score b { letter-spacing:0; display:block } */
.stat-b { font-size: 40px; font-weight: 700; line-height: 1; letter-spacing: 0; }
/* #stat-score i { margin-left:2px } + .ring-center .stat-value i { font-size:14px } */
.stat-i { font-size: 14px; font-weight: 700; line-height: 1; margin-left: 2px; }
/* .ring-center .stat-label / .sum-age > .stat-label { margin:0; font-size:12px; line-height:1.5; color:var(--ink) } */
.stat-label { font-size: 12px; line-height: 1.5; color: #282828; margin: 0; }

/* .sum-age { flex:1; align-self:stretch; flex-direction:column; align-items:center;
              justify-content:center; gap:0; padding-left:calc(16u)(覆盖 26u) } */
.sum-age {
  flex: 0 0 50%;
  align-self: stretch;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-left: 32rpx;
  box-sizing: border-box;
}
/* .age-dial { width:calc(108u); height:auto; display:flex; align-items:center; justify-content:center } */
.age-dial {
  position: relative;
  width: 216rpx;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* .age-dial .stat-age { margin-top:0; display:flex; align-items:baseline } */
.stat-age { margin-top: 0; display: flex; align-items: baseline; }
/* .age-dial .stat-age b { font-size:54px(覆盖 58px); display:block; line-height:1 }
   letter-spacing 继承 .stat-value b 的 calc(.5u) → 1rpx */
.stat-age .stat-b { font-size: 54px; line-height: 1; letter-spacing: 1rpx; }
/* .stat-age i { font-size:19px; margin-left:2px } */
.stat-age .stat-i { font-size: 19px; margin-left: 2px; }
/* H5 ui-20261009.css: .age-pill, .dims-note { display:none !important }
   ui-20261012 只恢复了 #dims-note，肌龄对比胶囊仍是隐藏态。
   ageNote 仍由 report-model 产出（接口不变），这里与 H5 一致：保留数据不展示。 */
.age-pill { display: none; }

/* ─── 三维度（.card-dims 并进总分卡：H5 grid-column:1/-1；acss 用 width:100% + row-gap）
   .card-dims { padding:0(覆盖 calc(18u) calc(7u) calc(7u)) }
   .dim { flex:1; align-items:flex-start; padding:0 0 calc(4u) calc(14u) }
   .dim + .dim { border-left:1px solid #EFEFEF } */
.card-dims { width: 100%; margin-top: 30rpx; }
.dims-row { display: flex; }
.dim {
  flex: 1;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 0 8rpx 28rpx;
  box-sizing: border-box;
}
.dim + .dim { border-left: 1px solid #EFEFEF; }
/* .dim-name { font-size:11px(覆盖 12px); color:var(--ink) }
   行高固定成 H5 实测行盒 14px：acss 是系统字体（H5 是 MiSans），
   若放任 normal 行高，三维度卡会整体高 1px 并向下累积。 */
.dim-name { font-size: 11px; line-height: 14px; color: #282828; }
/* .dim-score { margin-top:calc(4u); font-size:27px(覆盖 30px); line-height:1.1; font-weight:700 }
   .dim-score b { font-size:36px(覆盖 42px); font-weight:700 } */
.dim-score {
  display: flex;
  align-items: baseline;
  margin-top: 8rpx;
  font-size: 27px;
  font-weight: 700;
  color: #282828;
  line-height: 1.1;
}
.dim-int { font-size: 36px; font-weight: 700; line-height: 1.1; }
.dim-dec { font-size: 27px; font-weight: 700; line-height: 1.1; }
/* .dim-score.dim-bad { color:var(--bad) } */
.dim-bad { color: #D30C0C; }
/* .dim-bar { margin-top:calc(6u); width:calc(69u); height:calc(6u);
              border-radius:calc(3u); background:#EFEFEF; overflow:hidden } */
.dim-bar {
  display: block;
  margin-top: 12rpx;
  width: 138rpx;
  height: 12rpx;
  border-radius: 6rpx;
  background: #EFEFEF;
  overflow: hidden;
}
/* .dim-bar i { height:100%; background:var(--yellow); border-radius:inherit } */
.dim-fill { height: 100%; border-radius: 6rpx; background: #F5F078; }
.dim.best .dim-fill { background: #D7EE6A; }
.dim.worst .dim-fill { background: #F4B04F; }
/* .dim-flag { visibility:hidden; margin-top:calc(6u); font-size:8px(覆盖 9px); color:var(--ink);
               background:#F8F4A6; border-radius:calc(8u); padding:calc(1u) calc(8u) }
   → 非最低分维度用 visibility 保留占位，三列高度与 H5 一致 */
.dim-flag {
  visibility: hidden;
  margin-top: 12rpx;
  font-size: 8px;
  line-height: 10px;
  color: #282828;
  background: #F8F4A6;
  border-radius: 16rpx;
  padding: 2rpx 16rpx;
}
.dim.worst .dim-flag { visibility: visible; }

/* #dims-note { display:block !important; margin-top:12px; padding:10px 12px 10px 24px;
                background:#F2F2F2; border-radius:calc(6u); position:relative }
   #dims-note::before { left:12px; top:10px; bottom:10px; width:calc(3u); background:var(--yellow) } */
.dims-note {
  position: relative;
  margin-top: 24rpx;
  background: #F2F2F2;
  border-radius: 12rpx;
  padding: 20rpx 24rpx 20rpx 48rpx;
  text-align: left;
}
.dims-note::before {
  content: '';
  position: absolute;
  left: 24rpx;
  top: 20rpx;
  bottom: 20rpx;
  width: 6rpx;
  border-radius: 4rpx;
  background: #F5F078;
}
/* #dims-note .dims-note-l1 { font-size:12px; line-height:1.5; color:var(--para) }
   .dims-note-l1 b { font-weight:500; color:var(--ink); text-decoration:underline } */
.dims-note-l1 { font-size: 12px; line-height: 1.5; color: #4A4A4A; }
.dims-focus {
  font-weight: 500;
  color: #282828;
  text-decoration: underline;
}
/* #dims-note .dims-note-l2 { font-size:11px; line-height:1.5; margin-top:3px; color:var(--grey) } */
.dims-note-l2 { margin-top: 6rpx; font-size: 11px; line-height: 1.5; color: #868686; }

/* ─── 维度标题（H5 h2.dimension-title，落在灰底上的卡外标题）
   .dimension-title { font-size:23px; font-weight:600; text-align:center;
                      margin:calc(18u) 0(覆盖 24u/12u) }，行高固定 30px = H5 实测行盒
   .dimension-stability-title { font-size:22.106597px; line-height:28.738542px } */
.dimension-title {
  font-size: 23px;
  font-weight: 600;
  color: #282828;
  line-height: 30px;
  text-align: center;
  margin: 36rpx 0;
}
.dimension-stability-title { font-size: 22.106597px; line-height: 28.738542px; }

/* ─── 维度详情卡（.card.card-detail）
   .card-detail { margin-top:0; padding:calc(4u) calc(39u) calc(19u); border-radius:calc(7u) } */
.card-detail { margin-top: 0; padding: 8rpx 78rpx 38rpx; box-sizing: border-box; }

/* .detail-tabs { display:flex; border:none(覆盖 1px 底线) }
   H5 高度由 .dtab 的 padding-top 13px + .dtab-tx 26px 撑成 40px → acss 固定 80rpx 更稳 */
.detail-tabs { display: flex; height: 80rpx; }
/* .dtab { flex:1; padding:calc(13u) 0 0; text-align:center; font-weight:500; color:var(--ink) }
   容器 80rpx 内：上留白 28rpx（= H5 的 13px + 行盒基线偏移 1px），余下 52rpx 归 .dtab-tx；
   用 flex 起点对齐消掉 inline-block 的基线偏移，让黄色下划线与 H5 一样停在
   距标签卡顶 34px、底 41px 的位置。 */
.dtab {
  flex: 1;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 28rpx;
  text-align: center;
  font-weight: 500;
  color: #282828;
}
.dtab.active { font-weight: 700; }
/* .dtab-tx { position:relative; display:inline-block; font-size:12px;
             padding:0 calc(5u) calc(10u) } */
.dtab-tx {
  position: relative;
  display: inline-block;
  font-size: 12px;
  line-height: 16px;
  padding: 0 10rpx 20rpx;
}
/* .dtab.active .dtab-tx::after { left:50%; transform:translateX(-50%); bottom:-1px;
                                  width:calc(76u); height:calc(7u);
                                  border-radius:calc(3.5u); background:var(--yellow) } */
.dtab.active .dtab-tx::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -1px;
  width: 152rpx;
  height: 14rpx;
  border-radius: 7rpx;
  background: #F5F078;
}

/* H5: follow the finger horizontally, leave vertical gestures to the report. */
.detail-viewport { overflow: hidden; touch-action: pan-y; transition: height .32s ease; }
.detail-viewport.dragging { transition: none; }
.detail-panels { display: flex; align-items: flex-start; transition: transform .32s cubic-bezier(.22,.61,.36,1); }
.detail-panels.dragging { transition: none; }
/* .detail-panels .dpanel { display:block; flex:0 0 100%; padding-top:calc(10u) } */
.dpanel { display: block; flex: 0 0 100%; min-width: 0; padding-top: 20rpx; box-sizing: border-box; pointer-events: none; }
.dpanel.active { pointer-events: auto; }
/* .ditem { display:block(覆盖 flex) } */
.ditem { display: block; }
.report-zoom { position: fixed; inset: 0; z-index: 80; background: rgba(0,0,0,.92); display: flex; align-items: center; justify-content: center; }
.report-zoom-enter { animation: report-zoom-in .22s ease both; }
.report-zoom-frame { position: relative; overflow: hidden; background: #F6F6F6; transform-origin: center; }
.report-zoom-side { position: absolute; }
.report-zoom-bitmap { left:0; top:0; width:100%; height:100%; }
.report-zoom-canvas { position:fixed; left:-10000px; top:0; width:835px; height:738px; pointer-events:none; }
@keyframes report-zoom-in { from { opacity: 0; transform: scale(.88); } to { opacity: 1; transform: none; } }

/* ─── 检测图框（.viz-frame ＋ .contour-front-frame 的 90% 高裁切）
   .viz-frame { position:relative; width:calc(215u); height:calc(278u); margin:0 auto calc(12u);
                background:#f6f6f6; border-radius:calc(5u); overflow:hidden }
   .contour-front-frame { height:calc(250.2u); margin-bottom:calc(7.56u) }
   .contour-front-frame .ditem-img { height:calc(278u) } */
.viz-frame {
  position: relative;
  width: 430rpx;
  height: 556rpx;
  margin: 0 auto 24rpx;
  background: #F6F6F6;
  border-radius: 10rpx;
  overflow: hidden;
}
.contour-front-frame { height: 500.4rpx; margin-bottom: 15.12rpx; }
/* 画框内部固定 430×556rpx 的「照片坐标系」：照片与每个 face_maps 图层共用同一套
   left/top/width/height（report.js 按 H5 vizFaceCrop 算出），保证叠加层与人脸严格对齐 */
.viz-stage {
  position: absolute;
  left: 0; top: 0;
  width: 430rpx; height: 556rpx;
  overflow: hidden;
}
.viz-photo { position: absolute; display: block; }
.viz-layer { position: absolute; display: block; }
/* H5 vizCompose: ctx.globalCompositeOperation='multiply'（白底色沉/缺水/红区图层） */
.viz-blend { mix-blend-mode: multiply; }
/* H5 vizCompose({dim:.55})：照片先压暗再叠增强线（仅皱纹） */
.viz-dim {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: #000000;
  opacity: .55;
}
/* H5 坐标标注 canvas：lineWidth = max(3, 画布宽/200)，缩到 430rpx 画框后约 3rpx；
   rectangle 用 strokeRect，所以只描边、不填充。 */
.viz-mark {
  position: absolute;
  box-sizing: border-box;
  border-style: solid;
  border-width: 3rpx;
}
/* .viz-missing { position:absolute; inset:0; display:flex; align-items:center;
                  justify-content:center; color:#888; font-size:12px } */
.viz-missing {
  position: absolute;
  left: 0; top: 0; right: 0; bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #888888;
  font-size: 12px;
}

/* .ditem-text { border-top:1px solid #eee; padding-top:calc(10u) }
   .ditem-para { font-size:12px(覆盖 10.1px); line-height:1.55; color:var(--para);
                 font-weight:400; white-space:pre-line } */
.ditem-text { border-top: 1px solid #EEEEEE; padding-top: 20rpx; }
.ditem-para {
  font-size: 12px;
  font-weight: 400;
  color: #4A4A4A;
  line-height: 1.55;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
/* .viz-caption { color:#707070; font-size:11px; line-height:1.6; margin-top:10px } */
.viz-caption {
  color: #707070;
  font-size: 11px;
  line-height: 1.6;
  margin-top: 20rpx;
}
/* 稳韧力卡的标签/正文再小一号（.stability-card .dtab-tx / .ditem-para） */
.stability-card .dtab-tx { font-size: 11.055903px; }
.stability-card .ditem-para { font-size: 11.574074px; line-height: 14.467593px; }

/* ─── 侧脸照片（.contour-sides / .contour-side-photo / .wrinkle-side-photo）
   .contour-sides { width:calc(215u); margin:0 auto calc(12u);
                    display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:calc(6.3u) }
   .contour-side-photo { width:100%; height:calc(92.25u); border-radius:calc(5u);
                         background:#f6f6f6; overflow:hidden; position:relative }
   .contour-side-photo img { position:absolute; inset:0; width:100%; height:100%;
                             object-fit:cover; transform:translateY(-25%) scale(2.8) } */
.contour-sides {
  width: 430rpx;
  margin: 0 auto 24rpx;
  display: flex;
  justify-content: space-between;
}
.contour-side {
  position: relative;
  flex: none;
  width: 208.7rpx;
  height: 184.5rpx;
  border-radius: 10rpx;
  overflow: hidden;
  background: #F6F6F6;
}
/* H5 grid: figure[data-view="right"] { grid-column:2 } → 只剩右脸时仍占第二列 */
.contour-side.right { margin-left: auto; }
/* 轮廓和皱纹统一交换两张侧脸的位置，照片、标注及点击预览仍绑定原侧。 */
.contour-sides-reversed { flex-direction: row-reverse; }
.contour-sides-reversed .contour-side.right { margin-left: 0; margin-right: auto; }
.side-img {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  transform: translateY(-25%) scale(2.52);
  transform-origin: center;
}
.side-dim {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: #000000;
  opacity: .55;
}
/* .wrinkle-loading { inset:0; background:rgba(0,0,0,.4); color:#fff; text-align:center;
                     font-size:calc(10u); line-height:1.6 } */
.side-loading {
  position: absolute;
  left: 0; top: 0; right: 0; bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .4);
  color: #FFFFFF;
  text-align: center;
  font-size: 20rpx;
  line-height: 1.6;
}
/* .wrinkle-layer-note { width:calc(215u); margin:0 auto calc(12u); color:#888;
                        font-size:10px; line-height:1.4 } */
.wrinkle-layer-note {
  width: 430rpx;
  margin: 0 auto 24rpx;
  color: #888888;
  font-size: 10px;
  line-height: 1.4;
}

/* ─── 产品区大标题（.prod-title，落在灰底）
   ui-20261012 最终值：width:calc(206.597222u); margin:calc(18u) auto;
   transform:translateX(calc(.347222u)); font-size:22.106597px; line-height:28.738542px;
   font-weight:700; white-space:nowrap; letter-spacing:0 */
.prod-title {
  width: 413.194444rpx;
  max-width: 100%;
  margin: 36rpx auto;
  padding: 0;
  text-align: center;
  transform: translateX(0.694444rpx);
  font-size: 22.106597px;
  line-height: 28.738542px;
  font-weight: 700;
  color: #282828;
  letter-spacing: 0;
  white-space: nowrap;
}

/* ─── 日常护理 + 推荐产品（同一张白卡 .card.card-care.report-care-products）
   .report-care-products { width:calc(340.625u); margin-left:auto; margin-right:auto;
                           padding:calc(21.180556u) calc(24.652778u) calc(7.986111u) } */
.report-care-products {
  width: 681.25rpx;
  margin-left: auto;
  margin-right: auto;
  padding: 42.361112rpx 49.305556rpx 15.972222rpx;
  box-sizing: border-box;
}
/* .report-care-products .card-heading { font-size:13.888889px; line-height:19.444444px;
                                         font-weight:700; text-align:left;
                                         margin-bottom:calc(5.208333u) } */
.card-heading {
  font-size: 13.888889px;
  line-height: 19.444444px;
  font-weight: 700;
  text-align: left;
  color: #000000;
  margin-bottom: 10.416666rpx;
}
/* .report-care-products .care-item { font-size:11.574074px; line-height:14.467593px;
                                      color:var(--para); margin-bottom:calc(14.467593u) }
   .care-item:last-child { margin-bottom:0 } → acss 避开伪类，由 report.js 打 '.last' 标记 */
.care-item {
  font-size: 11.574074px;
  line-height: 14.467593px;
  color: #4A4A4A;
  margin-bottom: 28.935186rpx;
  overflow-wrap: anywhere;
}
.care-item.last { margin-bottom: 0; }
/* .product-section-heading { position:relative; margin:calc(24.0625u) 0 calc(5.555556u);
                              font-size:13.888889px; line-height:19.444444px;
                              font-weight:700; text-align:left }
   ::before { left:0; right:0; top:calc(-12.03125u); border-top:1px solid #DDD } */
.product-section-heading {
  position: relative;
  margin: 48.125rpx 0 11.111112rpx;
  font-size: 13.888889px;
  line-height: 19.444444px;
  font-weight: 700;
  text-align: left;
  color: #282828;
}
.product-section-heading::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -24.0625rpx;
  border-top: 1px solid #DDDDDD;
}
/* H5 #product-unavailable 也是 .care-item（文案见 report.axml，与 H5 index.html L274 一致） */
.product-unavailable { margin-bottom: 0; }

/* .report-care-products .card-product { width:auto; margin:0 calc(-18.402778u);
                                        border-radius:calc(3.472222u);
                                        background:#F6F6F6; overflow:hidden } */
.card-product {
  width: auto;
  margin: 0 -36.805556rpx;
  border-radius: 6.944444rpx;
  background: #F6F6F6;
  overflow: hidden;
}
/* .report-care-products .prod-card { height:auto; aspect-ratio:945/511 }
   → 卡片内容宽 582.64rpx + 左右各 36.8rpx = 656.25rpx，
     高 = 656.25 × 511 ÷ 945 = 354.84rpx（定值，不依赖 aspect-ratio 支持度） */
.prod-card {
  position: relative;
  height: 354.84rpx;
  display: flex;
  align-items: stretch;
}
/* .report-care-products .prod-info { flex-basis:49.100529%; padding:0 } */
.prod-info {
  flex: 0 0 49.100529%;
  min-width: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
/* .report-care-products #product-title { position:absolute; left:8.571429%; top:29.158513%;
                                          font-size:14.467593px; line-height:18.06279px;
                                          font-weight:700; white-space:nowrap } */
.prod-card-title {
  position: absolute;
  left: 8.571429%;
  top: 29.158513%;
  margin: 0;
  font-size: 14.467593px;
  line-height: 18.06279px;
  font-weight: 700;
  color: #282828;
  white-space: nowrap;
}
/* .report-care-products .prod-name { left:8.677249%; top:41.09589%; font-size:12.013166px;
                                      line-height:15.070408px; font-weight:700; color:#989898;
                                      white-space:nowrap } */
.prod-name {
  position: absolute;
  left: 8.677249%;
  top: 41.09589%;
  margin: 0;
  font-size: 12.013166px;
  line-height: 15.070408px;
  font-weight: 700;
  color: #989898;
  white-space: nowrap;
}
/* .report-care-products .prod-badge { left:8.783069%; top:56.751468%; width:10.687831%; margin:0 } */
.prod-badge {
  position: absolute;
  left: 8.783069%;
  top: 56.751468%;
  width: 10.687831%;
  height: auto;
  margin: 0;
}
/* .report-care-products .prod-scroll { flex-basis:50.899471% }
   .prod-scroll img { width:100%; height:100%; aspect-ratio:auto; object-fit:fill } */
.prod-scroll {
  flex: 0 0 50.899471%;
  display: flex;
  overflow: hidden;
}
.prod-img { display: block; width: 100%; height: 100%; }

/* ─── 免责声明（.report-care-products + .report-disclaimer）
   margin:calc(12.152778u) calc(5.208333u) calc(20u);
   font-size:7.233681px; line-height:10.127431px */
.report-disclaimer {
  margin: 24.305556rpx 10.416666rpx 40rpx;
  font-size: 7.233681px;
  line-height: 10.127431px;
  color: #4A4A4A;
}
.report-disclaimer-line { display: block; }

.session-guard { padding: 120rpx 40rpx; text-align: center; font-size: 13px; line-height: 1.8; color: #707070; }
.session-guard .btn-primary { margin: 32rpx auto 0; }