/* 水管管径与水压估算 —— 管道蓝 · 剖面水波 */
.c60{
  --a:#1d4ed8;
  --a2:#60a5fa;
  --a-soft:rgba(29,78,216,.10);
  --a-line:rgba(29,78,216,.26);
}

/* 管道质感：斜向管纹 + 水波冷光 */
.c60-hero{
  background:
    radial-gradient(760px 320px at 12% 0%, rgba(255,255,255,.76), transparent 62%),
    repeating-linear-gradient(115deg, rgba(29,78,216,.05) 0 8px, transparent 8px 34px),
    linear-gradient(135deg,#eff6ff 0%,#dbeafe 52%,#e0f2fe 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(760px 320px at 12% 0%, rgba(96,165,250,.12), transparent 62%),
    repeating-linear-gradient(115deg, rgba(96,165,250,.05) 0 8px, transparent 8px 34px),
    linear-gradient(135deg,#070f22 0%,#0b1a35 52%,#0e1626 100%);
}
.c60-hero-art .wp-pipe{
  position:relative;
  width:220px;
  height:64px;
  border-radius:999px;
  border:6px solid rgba(29,78,216,.28);
  background:linear-gradient(180deg,#ffffff,#bfdbfe 55%,#93c5fd);
  box-shadow:0 16px 32px rgba(29,78,216,.22), inset 0 6px 12px rgba(255,255,255,.7);
  overflow:hidden;
  transform:rotate(-8deg);
  display:flex;
  align-items:center;
  justify-content:space-around;
}
:root[data-theme="dark"] .c60-hero-art .wp-pipe{
  border-color:rgba(96,165,250,.32);
  background:linear-gradient(180deg,#1e3a8a,#1e40af 55%,#2563eb);
  box-shadow:0 16px 32px rgba(0,0,0,.3);
}
.c60-hero-art .wp-pipe .water{
  position:absolute;
  left:0;right:0;bottom:0;
  height:56%;
  background:linear-gradient(180deg,rgba(96,165,250,.35),rgba(29,78,216,.55));
}
.c60-hero-art .wp-pipe .arrow{
  position:relative;
  font-size:20px;
  font-weight:900;
  color:#1e40af;
  opacity:.85;
  animation:wpFlow 2.2s linear infinite;
}
:root[data-theme="dark"] .c60-hero-art .wp-pipe .arrow{color:#bfdbfe;}
.c60-hero-art .wp-pipe .arrow.a2{animation-delay:.35s;}
.c60-hero-art .wp-pipe .arrow.a3{animation-delay:.7s;}
@keyframes wpFlow{
  0%{transform:translateX(-10px);opacity:.25;}
  50%{opacity:.95;}
  100%{transform:translateX(10px);opacity:.25;}
}
@media (prefers-reduced-motion:reduce){
  .c60-hero-art .wp-pipe .arrow{animation:none;}
}
.c60-hero-art .chip{background:rgba(255,255,255,.9);}
:root[data-theme="dark"] .c60-hero-art .chip{background:rgba(14,22,38,.86);}
.c60-hero-art .chip b{color:#1d4ed8;}
:root[data-theme="dark"] .c60-hero-art .chip b{color:#93c5fd;}

/* 主结果：管道深蓝 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#1e3a8a,#1d4ed8 48%,#0369a1 100%);
  box-shadow:0 16px 34px rgba(29,78,216,.32);
}
.c60-metric.is-hero .v{font-size:clamp(28px,3.4vw,42px);}

.c60-segbtn.on{color:#1d4ed8;}
:root[data-theme="dark"] .c60-segbtn.on{color:#93c5fd;}
.c60-chip.on{background:rgba(29,78,216,.12);border-color:#1d4ed8;color:#1e3a8a;}
:root[data-theme="dark"] .c60-chip.on{color:#93c5fd;border-color:#93c5fd;}

/* 推荐条：像仪表盘上的指示 */
.wp-reco{
  margin-top:14px;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid color-mix(in srgb,var(--a) 26%,var(--line));
  background:linear-gradient(100deg,color-mix(in srgb,var(--a) 8%,var(--card)),var(--card));
  font-size:13px;
  font-weight:800;
  color:var(--ink);
  line-height:1.65;
  border-left:4px solid var(--a);
}
.wp-reco.is-warn{
  border-left-color:#d97706;
  background:linear-gradient(100deg,color-mix(in srgb,#d97706 9%,var(--card)),var(--card));
}
:root[data-theme="dark"] .wp-reco.is-warn{border-left-color:#fbbf24;}

/* 小标题 */
.wp-sub{
  position:relative;
  margin:20px 0 2px;
  padding-left:12px;
  font-size:13.5px;
  font-weight:900;
  color:var(--ink);
}
.wp-sub::before{
  content:"";
  position:absolute;
  left:0;top:5px;bottom:5px;
  width:4px;
  border-radius:4px;
  background:linear-gradient(180deg,#1d4ed8,#60a5fa);
}

/* 管道剖面 */
.wp-art{
  margin-top:10px;
  padding:12px;
  border-radius:14px;
  border:1px solid var(--line);
  background:
    repeating-linear-gradient(115deg, color-mix(in srgb,var(--a) 4%,transparent) 0 6px, transparent 6px 22px),
    linear-gradient(160deg,color-mix(in srgb,var(--a) 4%,var(--card)),var(--card));
  overflow-x:auto;
}
.wp-art svg{display:block;margin:0 auto;max-width:100%;}

/* 条形图 */
.c60-bar-row .bf{background:linear-gradient(90deg,#1d4ed8,#60a5fa);}

/* 对比表：推荐高亮、当前描边 */
#wpDnTable td:first-child{font-weight:900;color:var(--ink);}
#wpDnTable td:nth-child(n+2){font-variant-numeric:tabular-nums;}
#wpDnTable tbody tr.is-rec td{background:color-mix(in srgb,var(--a) 8%,var(--card));font-weight:800;color:var(--ink);}
#wpDnTable tbody tr.is-cur td{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--a) 45%,transparent);}
#wpDnTable tbody tr.is-rec td .tag,
#wpDnTable tbody tr.is-rec td:last-child{
  color:#1d4ed8;
}
:root[data-theme="dark"] #wpDnTable tbody tr.is-rec td:last-child{color:#93c5fd;}

/* 当量输入高亮 */
#wpFixtureField .c60-control,
#wpFlowWrap .c60-control{
  border-color:rgba(29,78,216,.34);
  background:linear-gradient(0deg,rgba(29,78,216,.03),rgba(29,78,216,.03)) var(--card);
}
:root[data-theme="dark"] #wpFixtureField .c60-control{background:rgba(96,165,250,.05);}

@media (max-width:640px){
  .c60-hero-art{display:none;}
  .wp-art svg{width:100%;}
}