/* 接线盒数量计算器 —— 砖粉 · 点位网格 */
.c60{
  --a:#be123c;
  --a2:#fb7185;
  --a-soft:rgba(190,18,60,.09);
  --a-line:rgba(190,18,60,.24);
}

/* hero：墙面点阵 + 暖白底 */
.c60-hero{
  background:
    radial-gradient(circle at 84% 20%, rgba(251,113,133,.28), transparent 46%),
    radial-gradient(circle at 10% 90%, rgba(190,18,60,.10), transparent 52%),
    radial-gradient(rgba(190,18,60,.10) 1.4px, transparent 1.4px) 0 0/18px 18px,
    linear-gradient(135deg,#fff1f3 0%,#ffe4e8 52%,#fff7f8 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(circle at 84% 20%, rgba(251,113,133,.16), transparent 46%),
    radial-gradient(circle at 10% 90%, rgba(190,18,60,.14), transparent 52%),
    radial-gradient(rgba(251,113,133,.16) 1.4px, transparent 1.4px) 0 0/18px 18px,
    linear-gradient(135deg,#1a0a11 0%,#230c16 52%,#150810 100%);
}

/* hero 插画：九个底盒排布，中间一个是已装面板 */
.c60-hero-art .jb-grid{
  position:absolute;
  inset:16px 34px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:repeat(3,1fr);
  gap:10px;
  transform:rotate(-4deg);
}
.c60-hero-art .jb-grid span{
  position:relative;
  border-radius:8px;
  border:1.5px solid rgba(190,18,60,.42);
  background:linear-gradient(160deg,rgba(255,255,255,.86),rgba(255,228,232,.6));
  box-shadow:0 6px 14px rgba(190,18,60,.10), inset 0 0 0 4px rgba(255,255,255,.5);
}
.c60-hero-art .jb-grid span::before{
  content:"";
  position:absolute;
  inset:9px;
  border-radius:3px;
  border:1px dashed rgba(190,18,60,.30);
}
.c60-hero-art .jb-grid span.on{
  border-color:#be123c;
  background:linear-gradient(150deg,#fb7185,#be123c);
  box-shadow:0 10px 22px rgba(190,18,60,.30);
}
.c60-hero-art .jb-grid span.on::before{
  border-color:rgba(255,255,255,.65);
  border-style:solid;
  inset:12px;
}
.c60-hero-art .jb-grid span.dash{
  border-style:dashed;
  opacity:.55;
  background:transparent;
  box-shadow:none;
}
.c60-hero-art .jb-grid span.dash::before{display:none;}
:root[data-theme="dark"] .c60-hero-art .jb-grid span{
  border-color:rgba(251,113,133,.45);
  background:linear-gradient(160deg,rgba(35,12,22,.92),rgba(26,10,17,.7));
  box-shadow:0 6px 14px rgba(0,0,0,.35), inset 0 0 0 4px rgba(251,113,133,.05);
}
:root[data-theme="dark"] .c60-hero-art .jb-grid span.on{
  background:linear-gradient(150deg,#9f1239,#fb7185);
}
.c60-hero-art .chip{background:rgba(255,255,255,.92);}
:root[data-theme="dark"] .c60-hero-art .chip{background:rgba(26,10,17,.9);}
.c60-hero-art .chip b{color:#be123c;}
:root[data-theme="dark"] .c60-hero-art .chip b{color:#fb7185;}

/* 主结果：接线盒的深玫红 */
.c60-metric.is-hero{
  background:linear-gradient(125deg,#881337,#be123c 52%,#e11d48 100%);
  box-shadow:0 16px 34px rgba(190,18,60,.30);
}
.c60-metric.is-hero .v{font-size:clamp(30px,3.6vw,44px);}

/* 小标题：像面板边框 */
.jb-sub{
  display:flex;
  align-items:center;
  gap:8px;
  margin:22px 0 2px;
  font-size:13.5px;
  font-weight:900;
  color:var(--ink);
}
.jb-sub::before{
  content:"";
  width:9px;height:9px;
  border-radius:2px;
  background:#be123c;
  box-shadow:0 0 0 3px rgba(190,18,60,.14);
}
:root[data-theme="dark"] .jb-sub::before{background:#fb7185;box-shadow:0 0 0 3px rgba(251,113,133,.18);}

/* 分段/滑杆配色 */
.c60-segbtn.on{color:#be123c;}
:root[data-theme="dark"] .c60-segbtn.on{color:#fb7185;}
#jbReserveOut{color:#be123c;font-weight:900;}
:root[data-theme="dark"] #jbReserveOut{color:#fb7185;}
#jbReserve{
  background:linear-gradient(to right,#be123c 0%,#be123c var(--fill,10%),var(--soft) var(--fill,10%),var(--soft) 100%);
}

/* 分项条形图：玫红到浅粉 */
.c60-bar-row .bf{background:linear-gradient(90deg,#be123c,#fb7185);}
#jbBars .c60-bar-row .bk{font-weight:800;color:var(--ink2);}
#jbBars .c60-bar-row .bv{color:#be123c;}
:root[data-theme="dark"] #jbBars .c60-bar-row .bv{color:#fb7185;}

/* 分项表：类别列带色点 */
#jbDetailTable td{font-variant-numeric:tabular-nums;}
#jbDetailTable td:first-child{
  font-weight:900;
  color:var(--ink);
  white-space:nowrap;
}
#jbDetailTable td:nth-child(2),
#jbDetailTable td:nth-child(4),
#jbDetailTable td:nth-child(5){text-align:right;}
#jbDetailTable th:nth-child(2),
#jbDetailTable th:nth-child(4),
#jbDetailTable th:nth-child(5){text-align:right;}
#jbDetailTable tr.is-spare td{
  background:color-mix(in srgb,var(--a) 4%,var(--card));
  color:var(--muted);
}
#jbDetailTable tr.is-total td{
  background:color-mix(in srgb,var(--a) 8%,var(--card));
  font-weight:900;
  color:var(--ink);
}

/* 批量表 */
#jbBatchTable td:first-child{font-weight:800;color:var(--ink);}
#jbBatchTable td:nth-child(n+2){text-align:right;font-variant-numeric:tabular-nums;}
#jbBatchTable th:nth-child(n+2){text-align:right;}
#jbBatchTable tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--a) 3%,transparent);}
#jbBatchTable tr.is-total td{background:color-mix(in srgb,var(--a) 7%,var(--card));font-weight:900;color:var(--ink);}

/* 点位统计输入：方格底纹 */
.c60-field:has(#jbSwitch) .c60-control,
.c60-field:has(#jbSocket) .c60-control,
.c60-field:has(#jbLight) .c60-control{
  background:
    linear-gradient(90deg,rgba(190,18,60,.045) 1px,transparent 1px) 0 0/10px 10px,
    var(--card);
}

/* 提示卡：面板说明改成玫红左边线 */
.c60-note{border-left-color:#be123c;}
.c60-note b{color:#9f1239;}
:root[data-theme="dark"] .c60-note b{color:#fb7185;}

@media print{
  .jb-sub::before{box-shadow:none;}
  #jbBars .c60-bar-row .bf{background:#be123c !important;}
  .c60-note{break-inside:avoid;}
}

@media (max-width:960px){
  .c60-hero-art .jb-grid{inset:14px 22px;}
  #jbDetailTable{min-width:480px;}
}

@media (max-width:640px){
  .c60-hero-art .jb-grid{display:none;}
  .jb-sub{margin-top:18px;}
  .c60-grid3{grid-template-columns:1fr 1fr;}
  .c60-grid3 .c60-field:last-child{grid-column:1/-1;}
  #jbDetailTable{min-width:440px;}
  #jbDetailTable td:nth-child(3){font-size:11.5px;}
  #jbBars .c60-bar-row{grid-template-columns:80px minmax(0,1fr) 56px;}
}