/* —— 手板实测记录：实拍对照图 —— */
.ins-gal { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: clamp(10px, 1.2vw, 16px); margin-top: clamp(14px, 2vh, 24px); }
.ins-gal figure { margin: 0; display: flex; flex-direction: column; gap: 7px; }
.ins-gal img { width: 100%; height: clamp(140px, 17vh, 200px); object-fit: cover; border-radius: 4px; background: #f2f2f0; cursor: zoom-in; }
.ins-gal figcaption { font-size: 11px; line-height: 1.6; color: var(--ink-3); }
.ins-gal figcaption b { display: block; font-weight: 600; color: var(--ink-1); margin-bottom: 2px; }

/* ==========================================================================
   手板实测 · 对照台账
   结构：分组标题（测试项）+ 每组若干条「条件 →（多条）加热程序 → 结果」；
        每行右侧以细线接上该行实拍图，形成「记录 ⇄ 实拍」一一对照。
   色调沿用站内状态色：ok 绿 / part 琥珀 / open 红 / wait 灰。
   ========================================================================== */
.ins-lab { margin-top: clamp(16px, 2.2vh, 26px); }

/* —— 表头：左右两栏标签 —— */
.ins-lab-key {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px;
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(10, 10, 10, 0.16);
  font-size: 10.5px;
}
.ins-lab-key span:first-child { color: var(--ink-2); }
.ins-lab-key span:last-child { color: var(--ink-3); }

.ins-lab-list { list-style: none; margin: 0; padding: 0; }

/* —— 分组：测试项标题 —— */
.ins-lab-grp { padding-top: clamp(16px, 2.2vh, 26px); }
.ins-lab-grp + .ins-lab-grp {
  border-top: 1px solid rgba(10, 10, 10, 0.16);
  margin-top: clamp(10px, 1.6vh, 18px);
}
.ins-lab-grp-h {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding-bottom: clamp(6px, 1vh, 10px);
}
.ins-lab-gno { flex: none; font-size: 10.5px; letter-spacing: 0.14em; color: var(--ink-3); }
.ins-lab-dish {
  font-size: clamp(15px, 1.35vw, 19px);
  font-weight: 500;
  letter-spacing: -0.005em;
  color: var(--ink);
}
.ins-lab-dish em {
  font-style: normal;
  margin-left: 9px;
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--ink-3);
}
.ins-lab-meta { margin-left: auto; flex: none; font-size: 10.5px; color: var(--ink-3); }

/* —— 单条记录：左「信息」/ 中「连接线」/ 右「实拍」 —— */
.ins-lab-runs { list-style: none; margin: 0; padding: 0; }
.ins-lab-run {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1.05fr);
  align-items: center;
  padding: clamp(11px, 1.5vh, 16px) 0;
  border-bottom: 1px solid var(--line-2);
}
.ins-lab-runs > .ins-lab-run:last-child { border-bottom: 0; }

.ins-lab-info { min-width: 0; }
.ins-lab-spec {
  font-size: clamp(12.5px, 1.05vw, 14px);
  line-height: 1.6;
  font-weight: 500;
  color: var(--ink);
}
.ins-lab-try {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 3px 12px;
  margin-top: 5px;
}
.ins-lab-prog {
  font-size: clamp(11.5px, 0.95vw, 12.5px);
  line-height: 1.5;
  color: var(--ink-2);
  white-space: nowrap;
}
.ins-lab-prog i {
  font-style: normal;
  margin-left: 8px;
  padding: 1px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 10px;
  color: var(--ink-3);
}
.ins-lab-res {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-size: clamp(11.5px, 0.95vw, 12.5px);
  line-height: 1.5;
  color: var(--ink-2);
}
.ins-lab-res::before {
  content: '';
  flex: none;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: currentColor;
  transform: translateY(-1px);
}
.ins-lab-res.ok { color: #2f8f63; }
.ins-lab-res.part { color: #b8801d; }
.ins-lab-res.open { color: #d94f3d; }
.ins-lab-res.wait { color: var(--ink-3); }

/* —— 连接线：细线 + 起点节点 + 终点箭头 —— */
.ins-lab-link { position: relative; height: 1px; background: rgba(10, 10, 10, 0.16); }
.ins-lab-link::before {
  content: '';
  position: absolute; left: 0; top: 50%;
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--ink-3);
  transform: translate(-1px, -50%);
}
.ins-lab-link::after {
  content: '';
  position: absolute; right: 0; top: 50%;
  width: 5px; height: 5px;
  border-top: 1px solid var(--ink-3);
  border-right: 1px solid var(--ink-3);
  transform: translate(1px, -50%) rotate(45deg);
}

/* —— 实拍缩略图 —— */
.ins-lab-shots { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; min-width: 0; }
.ins-lab-shot { position: relative; margin: 0; width: clamp(80px, 6.8vw, 104px); }
.ins-lab-shot img {
  display: block; width: 100%;
  height: clamp(62px, 5.8vw, 82px);
  object-fit: cover;
  border-radius: 3px;
  background: var(--paper);
}
.ins-lab-shot figcaption {
  position: absolute; left: 5px; top: 5px;
  font-size: 9.5px; line-height: 1;
  color: #fff;
  background: rgba(10, 10, 10, 0.55);
  border-radius: 999px;
  padding: 2px 6px;
}
.ins-lab-empty { font-size: 10.5px; letter-spacing: 0.12em; color: var(--ink-3); }

/* —— 窄屏：左右并排改为上下堆叠，中缝连接线隐藏 —— */
@media (max-width: 820px) {
  .ins-lab-grp-h { flex-wrap: wrap; }
  .ins-lab-meta { margin-left: 0; width: 100%; }
  .ins-lab-run { grid-template-columns: 1fr; row-gap: 10px; }
  .ins-lab-link { display: none; }
  .ins-lab-shot { width: clamp(66px, 21vw, 96px); }
}