/* 浴室柜尺寸计算器 —— 湖水青 · 柜体与镜柜立面 */
.c60{
  --a:#0e7490;
  --a2:#67e8f9;
  --a-soft:rgba(14,116,144,.10);
  --a-line:rgba(14,116,144,.26);
}

/* 卫浴瓷砖：斜纹 + 冷光 */
.c60-hero{
  background:
    radial-gradient(720px 320px at 12% 0%, rgba(255,255,255,.82), transparent 62%),
    repeating-linear-gradient(45deg, rgba(14,116,144,.045) 0 1px, transparent 1px 14px),
    linear-gradient(135deg, #ecfeff 0%, #cffafe 50%, #f8fafc 100%);
}
.c60-hero::before{
  background-image:
    linear-gradient(to right, rgba(14,116,144,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14,116,144,.06) 1px, transparent 1px);
  background-size:28px 28px;
  mask-image:radial-gradient(78% 80% at 72% 20%, #000 0%, transparent 82%);
  -webkit-mask-image:radial-gradient(78% 80% at 72% 20%, #000 0%, transparent 82%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(720px 320px at 12% 0%, rgba(103,232,249,.12), transparent 62%),
    repeating-linear-gradient(45deg, rgba(103,232,249,.035) 0 1px, transparent 1px 14px),
    linear-gradient(135deg,#041b24 0%,#062733 50%,#04161e 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 .bv-vanity{
  position:relative;
  width:188px;
  height:156px;
}
.c60-hero-art .bv-mirror{
  position:absolute;
  left:36px;top:0;
  width:116px;height:56px;
  border-radius:8px;
  background:linear-gradient(150deg,#ffffff,#e0f7fa 50%,#a5f3fc);
  border:2px solid rgba(14,116,144,.26);
  box-shadow:0 10px 18px rgba(14,116,144,.12), inset 0 0 0 4px rgba(255,255,255,.4);
}
.c60-hero-art .bv-mirror-line{
  position:absolute;
  left:52px;top:38px;
  width:84px;height:2px;
  background:repeating-linear-gradient(90deg,rgba(14,116,144,.35) 0 5px,transparent 5px 9px);
}
.c60-hero-art .bv-counter{
  position:absolute;
  left:16px;right:16px;
  top:62px;height:9px;
  border-radius:5px;
  background:linear-gradient(180deg,#ffffff,#bae6fd);
  border:1px solid rgba(14,116,144,.24);
  box-shadow:0 4px 8px rgba(14,116,144,.10);
}
.c60-hero-art .bv-cabinet{
  position:absolute;
  left:24px;right:24px;
  top:72px;bottom:12px;
  border-radius:4px 4px 8px 8px;
  background:linear-gradient(160deg,#e0f2fe,#7dd3fc 65%,#38bdf8);
  border:1px solid rgba(14,116,144,.28);
  box-shadow:0 16px 24px rgba(14,116,144,.16);
}
.c60-hero-art .bv-door{
  position:absolute;
  top:78px;bottom:18px;
  width:58px;
  border-radius:4px;
  border:1px solid rgba(14,116,144,.22);
  background:linear-gradient(170deg,rgba(255,255,255,.5),rgba(255,255,255,.12));
}
.c60-hero-art .bv-door.d1{left:32px;}
.c60-hero-art .bv-door.d2{right:32px;}
.c60-hero-art .bv-door::after{
  content:"";
  position:absolute;
  top:50%;width:5px;height:5px;
  border-radius:50%;
  background:rgba(14,116,144,.55);
  transform:translateY(-50%);
}
.c60-hero-art .bv-door.d1::after{right:5px;}
.c60-hero-art .bv-door.d2::after{left:5px;}
.c60-hero-art .bv-basin{
  position:absolute;
  left:50%;top:56px;
  width:54px;height:16px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse at 50% 40%,#ffffff,#cffafe 62%,#67e8f9);
  border:1px solid rgba(14,116,144,.3);
}
.c60-hero-art .bv-faucet{
  position:absolute;
  left:50%;top:28px;
  width:4px;height:30px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,#94a3b8,#cbd5e1);
  border-radius:2px;
}
:root[data-theme="dark"] .c60-hero-art .bv-mirror{
  background:linear-gradient(150deg,#0b3b4a,#072a36 50%,#0e4e60);
  border-color:rgba(103,232,249,.26);
  box-shadow:0 10px 18px rgba(0,0,0,.3), inset 0 0 0 4px rgba(103,232,249,.06);
}
:root[data-theme="dark"] .c60-hero-art .bv-counter{background:linear-gradient(180deg,#0e4e60,#083344);border-color:rgba(103,232,249,.22);}
:root[data-theme="dark"] .c60-hero-art .bv-cabinet{
  background:linear-gradient(160deg,#0b3b4a,#0e4e60 65%,#155e75);
  border-color:rgba(103,232,249,.24);
  box-shadow:0 16px 24px rgba(0,0,0,.36);
}
:root[data-theme="dark"] .c60-hero-art .bv-door{border-color:rgba(103,232,249,.2);}
:root[data-theme="dark"] .c60-hero-art .bv-basin{background:radial-gradient(ellipse at 50% 40%,#0b3b4a,#072a36 62%,#0e4e60);border-color:rgba(103,232,249,.24);}
.c60-hero-art .chip{background:rgba(255,255,255,.94);}
:root[data-theme="dark"] .c60-hero-art .chip{background:rgba(4,22,30,.9);}
.c60-hero-art .chip b{color:#0e7490;}
:root[data-theme="dark"] .c60-hero-art .chip b{color:#67e8f9;}

/* 主结果：深湖蓝 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#155e75,#0e7490 48%,#06b6d4 100%);
  box-shadow:0 16px 34px rgba(14,116,144,.30);
}
.c60-metric.is-hero .v{font-size:clamp(24px,3vw,36px);letter-spacing:-.4px;}

.c60-segbtn.on{color:#0e7490;}
:root[data-theme="dark"] .c60-segbtn.on{color:#67e8f9;}
.c60-chip.on{background:rgba(14,116,144,.12);border-color:#0e7490;color:#0e7490;}
:root[data-theme="dark"] .c60-chip.on{color:#67e8f9;border-color:#67e8f9;}

/* 小标题：镜柜边框 */
.bv-sub{
  position:relative;
  margin:20px 0 2px;
  padding-left:14px;
  font-size:13.5px;
  font-weight:900;
  color:var(--ink);
  letter-spacing:.2px;
}
.bv-sub::before{
  content:"";
  position:absolute;
  left:0;top:4px;bottom:4px;
  width:5px;
  border-radius:3px;
  background:linear-gradient(180deg,#0e7490,#67e8f9);
  box-shadow:inset 0 0 0 1px rgba(14,116,144,.2);
}

/* 条形图：台盆深度 */
.c60-bar-row .bf{background:linear-gradient(90deg,#0e7490,#67e8f9);}

/* 台盆对比表 */
#bvTable td:first-child{font-weight:900;color:var(--ink);white-space:nowrap;}
#bvTable td:nth-child(n+2){font-variant-numeric:tabular-nums;}
#bvTable tbody tr.is-rec td{background:color-mix(in srgb,var(--a) 8%,var(--card));font-weight:800;color:var(--ink);}
#bvTable tbody tr.is-rec td:first-child{color:var(--a);}
:root[data-theme="dark"] #bvTable tbody tr.is-rec td:first-child{color:#67e8f9;}

/* 长文本指标 */
#bvMain,#bvMirror{font-size:clamp(18px,2.2vw,26px);letter-spacing:-.3px;}
#bvType,#bvVerdict{font-size:clamp(16px,1.9vw,21px);letter-spacing:-.2px;}
#bvMirrorNote,#bvVolNote,#bvTypeNote,#bvVerdictNote{line-height:1.5;}
#bvFitNote{font-weight:900;color:#0e7490;}
:root[data-theme="dark"] #bvFitNote{color:#67e8f9;}

/* 深度输入像柜体侧板 */
#bvDepthField .c60-control{border-color:rgba(14,116,144,.32);}
#bvRoomWField .c60-control{border-color:rgba(14,116,144,.32);}

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

/* 提醒框 */
.c60-warn h3{color:#7c2d12;}
:root[data-theme="dark"] .c60-warn{color:#fcd34d;}

@media (max-width:960px){
  .c60-hero-art .bv-vanity{width:162px;height:138px;}
  .c60-hero-art .bv-mirror{left:30px;width:100px;}
  .bv-sub{margin-top:18px;}
}
@media (max-width:640px){
  .c60-hero-art{display:none;}
  .c60-metrics{grid-template-columns:1fr 1fr;}
  .c60-metric.is-hero{grid-column:1/-1;}
  .bv-sub{font-size:13px;}
  #bvMain,#bvMirror{font-size:17px;}
  #bvType,#bvVerdict{font-size:16px;}
  #bvTable{min-width:500px;}
  .c60-actions .c60-btn{flex:1 1 auto;}
}
@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;}
  #bvTable{min-width:0;}
  #bvTable tbody tr.is-rec td{background:#cffafe!important;}
}