/* 浴霸功率计算器 —— 暖橙灯阵 · 热浪 */
.c60{
  --a:#d97706;
  --a2:#fcd34d;
  --a-soft:rgba(217,119,6,.10);
  --a-line:rgba(217,119,6,.26);
}

/* 浴室暖光：顶部光晕 + 细密水汽 */
.c60-hero{
  background:
    radial-gradient(680px 340px at 16% 0%, rgba(255,255,255,.86), transparent 62%),
    radial-gradient(460px 280px at 84% 18%, rgba(252,211,77,.34), transparent 70%),
    linear-gradient(135deg, #fffbeb 0%, #fef3c7 48%, #fff7ed 100%);
}
.c60-hero::before{
  background-image:
    linear-gradient(to right, rgba(217,119,6,.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(217,119,6,.05) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(80% 80% at 72% 22%, #000 0%, transparent 80%);
  -webkit-mask-image:radial-gradient(80% 80% at 72% 22%, #000 0%, transparent 80%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(680px 340px at 16% 0%, rgba(252,211,77,.12), transparent 62%),
    radial-gradient(460px 280px at 84% 18%, rgba(217,119,6,.18), transparent 70%),
    linear-gradient(135deg,#1a1104 0%,#231503 48%,#1a1206 100%);
}
:root[data-theme="dark"] .c60-hero::before{
  background-image:
    linear-gradient(to right, rgba(148,163,184,.09) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148,163,184,.09) 1px, transparent 1px);
}

/* 自绘插画：四灯浴霸与热浪 */
.c60-hero-art .bh-lamps{
  position:relative;
  width:194px;
  height:158px;
  border-radius:20px;
  border:1.5px solid rgba(217,119,6,.36);
  background:linear-gradient(160deg,#ffffff,#fffbeb 68%,#fef3c7);
  box-shadow:0 18px 38px rgba(217,119,6,.18), inset 0 0 0 8px rgba(217,119,6,.05);
}
.c60-hero-art .bh-glow{
  position:absolute;
  width:92px;height:92px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(252,211,77,.55), transparent 68%);
  filter:blur(3px);
  animation:bh-pulse 3.6s ease-in-out infinite;
}
.c60-hero-art .bh-glow.g1{left:18px;top:12px;}
.c60-hero-art .bh-glow.g2{right:14px;bottom:8px;animation-delay:1.2s;}
.c60-hero-art .bh-lamp{
  position:absolute;
  width:46px;height:46px;
  border-radius:50%;
  background:
    radial-gradient(circle at 36% 32%, #fffbeb, #fde68a 42%, #f59e0b 78%, #b45309);
  border:2px solid rgba(255,255,255,.75);
  box-shadow:0 0 18px rgba(245,158,11,.55), inset 0 0 8px rgba(180,83,9,.32);
  animation:bh-heat 4s ease-in-out infinite;
}
.c60-hero-art .bh-lamp.l1{left:26px;top:20px;}
.c60-hero-art .bh-lamp.l2{right:30px;top:20px;animation-delay:.6s;}
.c60-hero-art .bh-lamp.l3{left:26px;bottom:22px;animation-delay:1.2s;}
.c60-hero-art .bh-lamp.l4{right:30px;bottom:22px;animation-delay:1.8s;}
.c60-hero-art .bh-wave{
  position:absolute;
  left:50%;
  width:88px;height:34px;
  margin-left:-44px;
  border-radius:50%;
  border-top:2px solid rgba(217,119,6,.34);
  animation:bh-wave 4.5s ease-in-out infinite;
}
.c60-hero-art .bh-wave.w1{top:52%;}
.c60-hero-art .bh-wave.w2{top:58%;width:110px;margin-left:-55px;animation-delay:1.5s;opacity:.6;}
@keyframes bh-pulse{0%,100%{opacity:.5;transform:scale(.94)}50%{opacity:.95;transform:scale(1.04)}}
@keyframes bh-heat{0%,100%{filter:brightness(1)}50%{filter:brightness(1.14)}}
@keyframes bh-wave{0%{transform:translateY(8px) scaleX(.9);opacity:0}45%{opacity:.7}100%{transform:translateY(-12px) scaleX(1.06);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .c60-hero-art .bh-glow,.c60-hero-art .bh-lamp,.c60-hero-art .bh-wave{animation:none;}
}
:root[data-theme="dark"] .c60-hero-art .bh-lamps{
  background:linear-gradient(160deg,#2a1a06,#231503 68%,#1a1104);
  border-color:rgba(252,211,77,.28);
  box-shadow:0 18px 38px rgba(0,0,0,.36), inset 0 0 0 8px rgba(252,211,77,.04);
}
:root[data-theme="dark"] .c60-hero-art .bh-lamp{
  background:radial-gradient(circle at 36% 32%, #fef3c7, #fbbf24 40%, #d97706 76%, #7c2d12);
  border-color:rgba(255,255,255,.35);
  box-shadow:0 0 22px rgba(252,211,77,.42), inset 0 0 8px rgba(120,53,15,.4);
}
:root[data-theme="dark"] .c60-hero-art .bh-wave{border-top-color:rgba(252,211,77,.30);}
.c60-hero-art .chip{background:rgba(255,255,255,.92);}
:root[data-theme="dark"] .c60-hero-art .chip{background:rgba(14,22,38,.88);}
.c60-hero-art .chip b{color:#d97706;}
:root[data-theme="dark"] .c60-hero-art .chip b{color:#fcd34d;}

/* 主结果：焦糖橙 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#92400e,#d97706 50%,#fbbf24 100%);
  box-shadow:0 16px 34px rgba(217,119,6,.30);
}
.c60-metric.is-hero .v{font-size:clamp(26px,3.2vw,40px);}

.c60-segbtn.on{color:#b45309;}
:root[data-theme="dark"] .c60-segbtn.on{color:#fcd34d;}

/* 柱状对比 */
.bh-sub{
  position:relative;
  margin:20px 0 2px;
  padding-left:12px;
  font-size:13.5px;
  font-weight:900;
  color:var(--ink);
}
.bh-sub::before{
  content:"";
  position:absolute;
  left:0;top:5px;bottom:5px;
  width:4px;
  border-radius:4px;
  background:linear-gradient(180deg,#d97706,#fcd34d);
}
.c60-bars{margin-top:10px;}
.c60-bar-row .bf{background:linear-gradient(90deg,#d97706,#fcd34d);}

/* 方式对比表 */
#bhTable td:first-child{font-weight:900;color:var(--ink);}
#bhTable td:nth-child(2){font-variant-numeric:tabular-nums;}
#bhTable tbody tr.is-rec td{background:color-mix(in srgb,var(--a) 8%,var(--card));font-weight:800;color:var(--ink);}
#bhTable tbody tr.is-rec td:first-child{color:var(--a);}

/* 费用卡 */
.bh-cost{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:14px;
}
.bh-cost-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 13px;
  border-radius:11px;
  border:1px solid var(--line);
  background:linear-gradient(160deg,color-mix(in srgb,var(--a) 5%,var(--card)),var(--card));
  font-size:12.5px;
}
.bh-cost-row span{color:var(--muted);font-weight:700;}
.bh-cost-row b{color:var(--ink);font-weight:900;font-variant-numeric:tabular-nums;}
.bh-cost-row:nth-child(2) b{color:var(--a);}

/* 批量表 */
#bhBatchTable td:first-child{font-weight:800;color:var(--ink);}
#bhBatchTable tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--a) 3%,transparent);}
#bhBatchTable td:nth-child(n+2){font-variant-numeric:tabular-nums;}
#bhBatchTable tbody tr.is-err td{color:var(--err);background:var(--err-soft);}

:root[data-theme="dark"] .c60-warn{color:#fcd34d;}

@media (max-width:960px){
  .c60-hero-art .bh-lamps{width:166px;height:138px;}
  .c60-hero-art .bh-lamp{width:40px;height:40px;}
  .c60-hero-art .bh-lamp.l1{left:22px;top:18px;}
  .c60-hero-art .bh-lamp.l2{right:24px;top:18px;}
  .c60-hero-art .bh-lamp.l3{left:22px;bottom:18px;}
  .c60-hero-art .bh-lamp.l4{right:24px;bottom:18px;}
}
@media (max-width:640px){
  .bh-cost{grid-template-columns:1fr;}
  .c60-metrics{grid-template-columns:1fr 1fr;}
  .bh-sub{font-size:13px;}
}
@media print{
  .c60-actions,.c60-batch,.c60-hist,.c60-seg,.c60-msg,.c60-hero-art{display:none!important;}
  .c60-card{box-shadow:none;border-color:#ccc;}
  #bhTable{min-width:0;}
  .bh-cost{grid-template-columns:1fr 1fr;}
}