/* 儿童鞋码计算器 —— 纸尺橙 · 脚型量测 */
.c60{
  --a:#ea580c;
  --a2:#fdba74;
  --a-soft:rgba(234,88,12,.10);
  --a-line:rgba(234,88,12,.26);
}

/* 首屏：米白纸尺 + 暖橙渐层 */
.c60-hero{
  background:
    radial-gradient(680px 300px at 8% 0%, rgba(255,255,255,.86), transparent 64%),
    repeating-linear-gradient(0deg, rgba(234,88,12,.045) 0 1px, transparent 1px 31px),
    linear-gradient(132deg, #fff7ed 0%, #ffedd5 46%, #fef3c7 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(680px 300px at 8% 0%, rgba(253,186,116,.12), transparent 64%),
    repeating-linear-gradient(0deg, rgba(253,186,116,.05) 0 1px, transparent 1px 31px),
    linear-gradient(132deg,#1a0f05 0%,#241206 48%,#0e1626 100%);
}

/* 自绘：量脚纸尺 + 脚印轮廓 */
.c60-hero-art .cs-board{
  position:absolute;
  inset:0 4px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:14px;
  transform:rotate(-4deg);
}
.c60-hero-art .cs-ruler{
  position:relative;
  height:38px;
  border-radius:9px;
  background:
    repeating-linear-gradient(90deg, rgba(234,88,12,.55) 0 1px, transparent 1px 11px),
    repeating-linear-gradient(90deg, rgba(120,53,15,.28) 0 2px, transparent 2px 55px),
    linear-gradient(180deg,#fffbeb,#ffedd5);
  border:1px solid rgba(234,88,12,.34);
  box-shadow:0 8px 18px rgba(234,88,12,.14);
  display:flex;
  align-items:center;
}
.c60-hero-art .cs-ruler i{
  flex:1;
  height:100%;
}
.c60-hero-art .cs-ruler::after{
  content:"190 mm";
  position:absolute;
  right:9px;
  bottom:-19px;
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.5px;
  color:#b45309;
  font-variant-numeric:tabular-nums;
}
.c60-hero-art .cs-sole{
  position:relative;
  align-self:center;
  width:86px;
  height:118px;
  border-radius:54% 46% 40% 44% / 64% 62% 36% 34%;
  background:linear-gradient(160deg,#fdba74,#ea580c 72%,#c2410c);
  box-shadow:0 14px 28px rgba(234,88,12,.26), inset 0 0 0 2px rgba(255,255,255,.55);
}
.c60-hero-art .cs-sole span{
  position:absolute;
  left:16px;
  top:38px;
  width:52px;
  height:24px;
  border-radius:50%;
  background:radial-gradient(ellipse at 50% 50%, rgba(255,255,255,.62), rgba(255,255,255,.12) 72%);
}
.c60-hero-art .cs-sole::before{
  content:"";
  position:absolute;
  left:30px;
  top:8px;
  width:26px;
  height:22px;
  border-radius:50% 50% 42% 42%;
  background:rgba(255,255,255,.42);
}
.c60-hero-art .cs-scan{
  position:absolute;
  right:26px;
  top:24px;
  bottom:26px;
  width:2px;
  background:repeating-linear-gradient(180deg, rgba(234,88,12,.55) 0 6px, transparent 6px 12px);
}
:root[data-theme="dark"] .c60-hero-art .cs-ruler{
  background:
    repeating-linear-gradient(90deg, rgba(253,186,116,.5) 0 1px, transparent 1px 11px),
    repeating-linear-gradient(90deg, rgba(253,186,116,.22) 0 2px, transparent 2px 55px),
    linear-gradient(180deg,#2a1708,#1c1006);
  border-color:rgba(253,186,116,.32);
  box-shadow:none;
}
:root[data-theme="dark"] .c60-hero-art .cs-ruler::after{color:#fdba74;}
:root[data-theme="dark"] .c60-hero-art .cs-sole{
  background:linear-gradient(160deg,#fdba74,#c2410c 74%,#7c2d12);
  box-shadow:0 12px 26px rgba(0,0,0,.4), inset 0 0 0 2px rgba(255,255,255,.32);
}
:root[data-theme="dark"] .c60-hero-art .chip{background:rgba(14,22,38,.88);border-color:var(--line);}
:root[data-theme="dark"] .c60-hero-art .chip b{color:#fdba74;}

/* 主结果卡：暖橙渐层 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#c2410c,#ea580c 46%,#f59e0b 100%);
  box-shadow:0 16px 34px rgba(234,88,12,.3);
}
.c60-metric.is-hero .v{font-size:clamp(30px,3.6vw,46px);}

/* 分段按钮选中态用暖橙 */
.c60-segbtn.on{color:#c2410c;}
:root[data-theme="dark"] .c60-segbtn.on{color:#fdba74;}
.c60-segbtn.on{box-shadow:0 4px 12px rgba(234,88,12,.16);}

/* 小标题：橙色刻度线 */
.cs-sub{
  position:relative;
  margin:20px 0 2px;
  padding-left:22px;
  font-size:13.5px;
  font-weight:900;
  color:var(--ink);
  letter-spacing:.2px;
}
.cs-sub::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:14px;
  height:2px;
  background:#ea580c;
  box-shadow:0 0 0 1px rgba(234,88,12,.2), 6px 0 0 rgba(234,88,12,.45);
}

/* 余量构成环图 */
.cs-donut-wrap{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:16px;
  align-items:center;
  margin-top:10px;
  padding:15px 16px;
  border-radius:14px;
  border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(255,247,237,.9),var(--card));
}
:root[data-theme="dark"] .cs-donut-wrap{
  background:linear-gradient(160deg,#1a1209,var(--card));
}
.cs-donut-wrap .c60-donut{display:grid;place-items:center;color:var(--ink);}
.cs-legend{display:flex;flex-direction:column;gap:7px;}
.cs-legend .row{
  display:grid;
  grid-template-columns:10px minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  font-size:12.5px;
  color:var(--ink2);
}
.cs-legend .dot{width:10px;height:10px;border-radius:4px;transform:rotate(45deg);}
.cs-legend .nm{font-weight:800;color:var(--ink);}
.cs-legend .vl{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:800;white-space:nowrap;}

/* 条形图：品牌内长对比 */
#csBars .c60-bar-row{grid-template-columns:76px minmax(0,1fr) 82px;}
#csBars .c60-bar-row .bf{background:linear-gradient(90deg,#ea580c,#fdba74);}

/* 品牌对照表 */
#csBrandTable td:first-child{font-weight:900;color:var(--ink);white-space:nowrap;}
#csBrandTable td:nth-child(3),
#csBrandTable td:nth-child(4),
#csBrandTable td:nth-child(5){font-variant-numeric:tabular-nums;font-weight:800;}
#csBrandTable tbody tr:nth-child(odd) td{background:rgba(234,88,12,.035);}
:root[data-theme="dark"] #csBrandTable tbody tr:nth-child(odd) td{background:rgba(253,186,116,.045);}
#csBrandTable td:last-child{font-size:12px;color:var(--muted);}

/* 成长节奏表 */
#csGrowTable td:nth-child(2),
#csGrowTable td:nth-child(3){font-variant-numeric:tabular-nums;}
#csGrowTable tbody tr:nth-child(2) td{background:rgba(234,88,12,.06);font-weight:800;color:var(--ink);}

/* 脚宽适配指标：状态色 */
#csWidthFit.is-wide{color:#b45309;}
#csWidthFit.is-narrow{color:#0f766e;}
#csAllow{letter-spacing:-.5px;}

/* 批量表 */
#csBatchTable td:first-child{font-weight:800;color:var(--ink);}
#csBatchTable td:nth-child(n+2){font-variant-numeric:tabular-nums;}
#csBatchTable tbody tr:last-child td{background:rgba(234,88,12,.06);font-weight:900;color:var(--ink);}

/* 输入框脚长：纸尺底纹提示 */
#csFootLen{background-image:repeating-linear-gradient(90deg,rgba(234,88,12,.12) 0 1px,transparent 1px 9px);}
:root[data-theme="dark"] #csFootLen{background-image:repeating-linear-gradient(90deg,rgba(253,186,116,.16) 0 1px,transparent 1px 9px);}

@media (max-width:960px){
  .c60-hero-art{display:none;}
  .cs-donut-wrap{grid-template-columns:auto minmax(0,1fr);}
  #csBars .c60-bar-row{grid-template-columns:70px minmax(0,1fr) 74px;}
}
@media (max-width:640px){
  .cs-donut-wrap{grid-template-columns:1fr;justify-items:center;}
  .cs-legend{width:100%;}
  #csBars .c60-bar-row{grid-template-columns:64px minmax(0,1fr) 66px;}
  .cs-sub{font-size:13px;}
  #csBrandTable{min-width:520px;}
}
@media print{
  .cs-donut-wrap{break-inside:avoid;}
  .c60-actions,.c60-batch,.c60-hist,#csBars{display:none!important;}
  .c60-metric.is-hero{box-shadow:none;background:#ea580c!important;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}