/* 隔墙面积计算器 —— 石墨蓝灰 + 银灰 · 墙体分层 */
.c60{
  --a:#334155;
  --a2:#94a3b8;
  --a-soft:rgba(51,65,85,.10);
  --a-line:rgba(51,65,85,.26);
}

/* 石墙肌理 + 冷光 */
.c60-hero{
  background:
    radial-gradient(640px 300px at 92% 6%, rgba(148,163,184,.30), transparent 62%),
    repeating-linear-gradient(0deg, rgba(51,65,85,.045) 0 1px, transparent 1px 18px),
    linear-gradient(135deg,#f8fafc 0%,#eef2f7 46%,#e2e8f0 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(640px 300px at 92% 6%, rgba(148,163,184,.16), transparent 62%),
    repeating-linear-gradient(0deg, rgba(148,163,184,.05) 0 1px, transparent 1px 18px),
    linear-gradient(135deg,#0b1220 0%,#111a29 46%,#0a1522 100%);
}
.c60-hero h1 em{background:linear-gradient(120deg,#334155,#64748b);-webkit-background-clip:text;background-clip:text;}
.c60-hero-badge{color:#334155;border-color:rgba(51,65,85,.22);}

/* hero：墙体分层 */
.c60-hero-art{min-height:200px;}
.c60-hero-art .pw-wall{
  position:relative;
  width:190px;height:152px;
  display:flex;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(51,65,85,.20);
  transform:rotate(-2deg);
  border:1px solid #cbd5e1;
}
.c60-hero-art .pw-layer{
  height:100%;
  background:linear-gradient(180deg,#f8fafc,#dbe3ec);
  border-right:1px solid #b6c2d1;
}
.c60-hero-art .pw-layer.l1{width:16px;background:linear-gradient(180deg,#f1f5f9,#cfd8e3);}
.c60-hero-art .pw-layer.l2{width:64px;background:linear-gradient(180deg,#e2e8f0,#c3ced9);}
.c60-hero-art .pw-layer.l3{width:16px;background:linear-gradient(180deg,#f1f5f9,#cfd8e3);border-right:0;}
.c60-hero-art .pw-studs{
  flex:1;
  background:
    repeating-linear-gradient(90deg, rgba(51,65,85,.28) 0 2px, transparent 2px 14px),
    repeating-linear-gradient(0deg, rgba(51,65,85,.20) 0 2px, transparent 2px 44px),
    linear-gradient(180deg,#dbe3ec,#c7d2de);
}
.c60-hero-art .chip b{color:#334155;}
:root[data-theme="dark"] .c60-hero-art .pw-wall{border-color:#243449;box-shadow:0 18px 40px rgba(0,0,0,.42);}
:root[data-theme="dark"] .c60-hero-art .pw-layer{background:linear-gradient(180deg,#1a2638,#121c2b);border-color:#2b3a4d;}
:root[data-theme="dark"] .c60-hero-art .pw-studs{
  background:
    repeating-linear-gradient(90deg, rgba(148,163,184,.34) 0 2px, transparent 2px 14px),
    repeating-linear-gradient(0deg, rgba(148,163,184,.22) 0 2px, transparent 2px 44px),
    linear-gradient(180deg,#1a2638,#111a29);
}

/* 主结果 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#334155,#475569 60%,#64748b);
  box-shadow:0 16px 34px rgba(51,65,85,.32);
}

/* 分层剖面 */
.pw-sec{
  margin-top:16px;
  padding:14px 14px 6px;
  border-radius:14px;
  background:linear-gradient(180deg,#f8fafc,#eef2f7);
  border:1px solid #dbe3ec;
}
:root[data-theme="dark"] .pw-sec{
  background:linear-gradient(180deg,#0f1928,#0b1420);
  border-color:#233043;
}
.pw-sec-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;}
.pw-sec-h h3{margin:0;font-size:13px;font-weight:900;color:var(--ink2);}
.pw-sec-h span{font-size:11.5px;font-weight:800;color:#334155;}
:root[data-theme="dark"] .pw-sec-h span{color:#cbd5e1;}
.pw-sec svg{display:block;width:100%;height:auto;max-height:260px;}

/* 材料表 */
#pwMatTable td:first-child{font-weight:800;color:var(--ink);}
#pwMatTable td:nth-child(4){font-weight:800;font-variant-numeric:tabular-nums;color:#334155;}
:root[data-theme="dark"] #pwMatTable td:nth-child(4){color:#e2e8f0;}
#pwMatTable tbody tr:nth-child(even) td{background:rgba(148,163,184,.09);}
#pwMatTable tr.is-total td{background:rgba(148,163,184,.18);font-weight:800;}

.c60-chip.on{background:rgba(148,163,184,.22);border-color:#64748b;color:#334155;}
:root[data-theme="dark"] .c60-chip.on{color:#e2e8f0;}
.c60-bar-row .bf{background:linear-gradient(90deg,#64748b,#334155);}

#pwLen,#pwWid,#pwH{color:#334155;}
:root[data-theme="dark"] #pwLen,
:root[data-theme="dark"] #pwWid,
:root[data-theme="dark"] #pwH{color:#e2e8f0;}

@media (max-width:640px){
  .c60-hero-art .pw-wall{width:160px;height:128px;}
  .pw-sec{padding:10px 10px 4px;}
}
