/* ==========================================================================
   白栈 · 详情图说明/费用行排版 v256
   ─────────────────────────────────────────────────────────────────────
   实测精确根因（坐标证据）：
     .df-check > span  说明文字  x=1186..1498  y=865..884  （宽 312，占满整行）
     .df-cost > b      费用数字  x=1227..1236  y=860..879  （「1」）
                       x=1290..1307  y=860..879  （「15」）
   → 说明文字的盒子横跨了费用数字所在的横向区间，两行在纵向只差 5px
     （y 860 vs 865），于是判定为重叠、视觉上也确实压在一起。

   修法（只调这两块的盒子，不动其它）：
   1. .df-check 变成块级、说明文字独立成行、与上方费用行拉开间距
   2. .df-cost 自身成块，数字用 tabular-nums 且不与说明文字共享行
   3. 两者之间加明确间距，确保纵向不重叠
   ========================================================================== */

/* 1) 费用行：独立成块，与下方说明分开 */
#detailfigPanel .df-cost,
#view-work .df-cost{
  display:block;
  width:100%;
  max-width:100%;
  margin:0 0 10px;
  line-height:1.6;
  overflow-wrap:anywhere;
  word-break:break-word;
}
#detailfigPanel .df-cost b,
#view-work .df-cost b{
  display:inline;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  position:relative;
  z-index:1;
}

/* 2) 说明行：块级独占一行，与费用行之间留出间距 */
#detailfigPanel .df-check,
#view-work .df-check{
  display:flex;
  flex-wrap:nowrap;
  align-items:flex-start;
  gap:8px;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  padding:0;
  clear:both;
}
#detailfigPanel .df-check > span,
#view-work .df-check > span{
  display:block;
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  line-height:1.55;
}
#detailfigPanel .df-check > input,
#view-work .df-check > input{
  flex:0 0 auto;
  margin-top:2px;
}

/* 3) 详情图生成区：所有块纵向堆叠，互不共享行 */
#detailfigPanel .gen-pin,
#view-work .gen-pin{
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
  min-width:0;
}
#detailfigPanel .gen-pin > *,
#view-work .gen-pin > *{
  width:100%;
  max-width:100%;
  min-width:0;
}

/* 4) 详情图参数区：每行元素独占，杜绝横向挤压 */
#detailfigPanel .dcol .field,
#detailfigPanel .dcol .df-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
  max-width:100%;
}
#detailfigPanel .dcol .field > *,
#detailfigPanel .dcol .df-field > *{
  min-width:0;
  max-width:100%;
}

/* 5) 兜底：详情面板内任何说明/提示文字都不许横向越界 */
#detailfigPanel .hint,
#detailfigPanel .df-spec,
#detailfigPanel .df-warn,
#detailfigPanel [hidden]{
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}
