/* 喷绘报价计算器 —— 青蓝 · 卷材母题 */
.c60{
  --a:#0891b2;
  --a2:#22d3ee;
  --a-soft:rgba(8,145,178,.10);
  --a-line:rgba(8,145,178,.26);
}

.c60-hero{
  background:
    radial-gradient(640px 280px at 10% 0%, rgba(255,255,255,.8), transparent 62%),
    repeating-linear-gradient(180deg,rgba(8,145,178,.05) 0 1px,transparent 1px 12px),
    linear-gradient(135deg,#ecfeff 0%,#cffafe 48%,#e0f2fe 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(640px 280px at 10% 0%, rgba(34,211,238,.15), transparent 62%),
    repeating-linear-gradient(180deg,rgba(34,211,238,.05) 0 1px,transparent 1px 12px),
    linear-gradient(135deg,#06222b 0%,#082f3a 48%,#0e1626 100%);
}

/* hero：三层卷材 */
.iq-art{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:190px;
}
.iq-roll{
  width:168px;
  height:34px;
  border-radius:999px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,0) 42%),
    linear-gradient(90deg,#22d3ee,#0891b2);
  box-shadow:0 10px 24px rgba(8,145,178,.24), inset 0 -6px 12px rgba(8,64,86,.18);
}
.iq-roll.r1{transform:translateX(-14px) rotate(-4deg);}
.iq-roll.r2{transform:translateX(12px) rotate(2deg);opacity:.85;}
.iq-roll.r3{width:140px;transform:translateX(-6px) rotate(-1deg);opacity:.7;}
.iq-roll-label{
  font-size:11.5px;font-weight:900;letter-spacing:2.4px;
  color:#0e7490;
  background:rgba(255,255,255,.75);
  border:1px solid rgba(8,145,178,.22);
  border-radius:999px;
  padding:4px 12px;
}
:root[data-theme="dark"] .iq-roll-label{background:rgba(14,22,38,.8);color:#67e8f9;border-color:#1f2b3e;}

.c60-metric.is-hero{
  background:linear-gradient(135deg,#0891b2,#155e75 72%);
  box-shadow:0 16px 34px rgba(8,145,178,.28);
}
.c60-segbtn.on{color:#0e7490;}
.c60-chip.on{background:rgba(8,145,178,.12);border-color:#0891b2;color:#0e7490;}
.c60-bar-row .bf{background:linear-gradient(90deg,#22d3ee,#0891b2);}

/* 卷材拼接示意 */
.iq-roll-view{
  margin-top:18px;
  padding:14px;
  border-radius:14px;
  background:linear-gradient(180deg,rgba(8,145,178,.055),rgba(8,145,178,.015));
  border:1px dashed rgba(8,145,178,.26);
  overflow-x:auto;
}
.iq-roll-view svg{display:block;width:100%;min-width:280px;height:auto;}
.iq-roll-empty{
  text-align:center;
  color:var(--muted);
  font-size:12.5px;
  font-weight:700;
  padding:20px 0;
}
:root[data-theme="dark"] .iq-roll-view{background:rgba(8,145,178,.07);border-color:rgba(34,211,238,.22);}

#iqMatBody tr.is-current td{background:rgba(8,145,178,.10);font-weight:800;color:var(--ink);}

@media (max-width:640px){
  .iq-roll{width:138px;}
  .iq-roll-view{padding:10px;}
}