/* 同型半胱氨酸计算器 —— 分子紫 · 双螺旋 */
.c60{
  --a:#4c1d95;
  --a2:#a78bfa;
  --a-soft:rgba(76,29,149,.10);
  --a-line:rgba(76,29,149,.26);
}

/* hero：紫色光束 + 斜向分子纹理 */
.c60-hero{
  background:
    radial-gradient(520px 300px at 88% 4%, rgba(167,139,250,.36), transparent 66%),
    radial-gradient(440px 260px at 10% 100%, rgba(139,92,246,.16), transparent 70%),
    repeating-linear-gradient(48deg, rgba(76,29,149,.05) 0 1px, transparent 1px 26px),
    linear-gradient(125deg, #f5f3ff 0%, #ede9fe 48%, #faf5ff 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(520px 300px at 88% 4%, rgba(167,139,250,.18), transparent 66%),
    radial-gradient(440px 260px at 10% 100%, rgba(139,92,246,.20), transparent 70%),
    repeating-linear-gradient(48deg, rgba(167,139,250,.06) 0 1px, transparent 1px 26px),
    linear-gradient(125deg, #100a22 0%, #150d2c 48%, #0d0a1e 100%);
}

/* 自绘插画：DNA 双螺旋（碱基对交替左右倾斜） */
.c60-hero-art .hc-helix{
  position:absolute;
  inset:6px 30px 4px 22px;
  display:flex;
  flex-direction:column;
  justify-content:space-around;
  align-items:center;
  transform:rotate(-8deg);
}
.c60-hero-art .hc-helix .rung{
  position:relative;
  width:132px;
  height:9px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(167,139,250,0),#7c3aed 18%,#c4b5fd 50%,#7c3aed 82%,rgba(167,139,250,0));
}
.c60-hero-art .hc-helix .rung.u{transform:rotate(14deg);}
.c60-hero-art .hc-helix .rung.d{transform:rotate(-14deg);}
.c60-hero-art .hc-helix .rung::before,
.c60-hero-art .hc-helix .rung::after{
  content:"";
  position:absolute;
  top:50%;
  width:10px;
  height:10px;
  margin-top:-5px;
  border-radius:50%;
  background:#4c1d95;
  box-shadow:0 0 0 2px rgba(255,255,255,.55);
}
.c60-hero-art .hc-helix .rung::before{left:-3px;}
.c60-hero-art .hc-helix .rung::after{right:-3px;background:#a78bfa;}
.c60-hero-art .hc-helix::before,
.c60-hero-art .hc-helix::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:2px;
  background:linear-gradient(180deg,transparent,rgba(76,29,149,.5) 16%,rgba(76,29,149,.5) 84%,transparent);
}
.c60-hero-art .hc-helix::before{left:14px;}
.c60-hero-art .hc-helix::after{right:14px;}
:root[data-theme="dark"] .c60-hero-art .hc-helix .rung{
  background:linear-gradient(90deg,rgba(167,139,250,0),#a78bfa 18%,#ddd6fe 50%,#a78bfa 82%,rgba(167,139,250,0));
}
:root[data-theme="dark"] .c60-hero-art .hc-helix .rung::before{background:#4c1d95;box-shadow:0 0 0 2px rgba(148,163,184,.3);}
:root[data-theme="dark"] .c60-hero-art .hc-helix .rung::after{background:#c4b5fd;box-shadow:0 0 0 2px rgba(148,163,184,.3);}
:root[data-theme="dark"] .c60-hero-art .hc-helix::before,
:root[data-theme="dark"] .c60-hero-art .hc-helix::after{
  background:linear-gradient(180deg,transparent,rgba(167,139,250,.45) 16%,rgba(167,139,250,.45) 84%,transparent);
}
.c60-hero-art .chip{background:rgba(255,255,255,.94);}
:root[data-theme="dark"] .c60-hero-art .chip{background:rgba(14,22,38,.9);}
.c60-hero-art .chip b{color:#4c1d95;}
:root[data-theme="dark"] .c60-hero-art .chip b{color:#a78bfa;}

/* hero 主结果：深紫渐层 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#2e1065,#4c1d95 52%,#6d28d9 100%);
  box-shadow:0 16px 34px rgba(46,16,101,.34);
}
.c60-metric.is-hero .v{font-size:clamp(28px,3.4vw,42px);}

.c60-segbtn.on{color:#4c1d95;}
:root[data-theme="dark"] .c60-segbtn.on{color:#a78bfa;}

/* 结果小标题 */
.hc-sub{
  position:relative;
  margin:20px 0 4px;
  padding-left:12px;
  font-size:13.5px;
  font-weight:900;
  color:var(--ink);
  letter-spacing:.2px;
}
.hc-sub::before{
  content:"";
  position:absolute;
  left:0;top:4px;bottom:4px;
  width:4px;
  border-radius:4px;
  background:linear-gradient(180deg,#4c1d95,#a78bfa);
}

/* 阈值图：当前值高亮，阈值用淡紫 */
#hcBars .c60-bar-row:first-child .bf{background:linear-gradient(90deg,#4c1d95,#7c3aed);}
#hcBars .c60-bar-row:nth-child(n+2) .bf{opacity:.62;}
#hcBars .c60-bar-row .bv{font-variant-numeric:tabular-nums;}

/* 分级表：当前分级高亮 */
#hcGradeTable td:first-child{font-weight:900;color:var(--ink);white-space:nowrap;}
#hcGradeTable td:nth-child(2){font-variant-numeric:tabular-nums;white-space:nowrap;}
#hcGradeTable tbody tr.is-cur td{
  background:color-mix(in srgb,var(--a) 8%,var(--card));
  color:var(--ink);
  font-weight:800;
}
#hcGradeTable tbody tr.is-cur td:first-child::before{
  content:"●";
  margin-right:6px;
  color:#4c1d95;
}
:root[data-theme="dark"] #hcGradeTable tbody tr.is-cur td:first-child::before{color:#a78bfa;}

/* 明细表 */
#hcDetailTable td:first-child{font-weight:900;color:var(--ink);white-space:nowrap;}
#hcDetailTable td:nth-child(n+2){font-variant-numeric:tabular-nums;}
#hcDetailTable td.is-bad{color:#b91c1c;font-weight:900;}
:root[data-theme="dark"] #hcDetailTable td.is-bad{color:#a78bfa;}

/* 建议 */
.hc-advice{
  display:grid;
  gap:7px;
  margin-top:8px;
}
.hc-advice .item{
  display:flex;
  gap:8px;
  align-items:flex-start;
  padding:9px 11px;
  border-left:3px solid #4c1d95;
  border-radius:0 9px 9px 0;
  background:var(--soft);
  font-size:12.5px;
  line-height:1.75;
  color:var(--ink2);
}
:root[data-theme="dark"] .hc-advice .item{border-left-color:#a78bfa;}
.hc-advice .item b{color:var(--ink);}

/* 批量表 */
.hc-batch-table td:first-child{font-weight:900;color:var(--ink);}
.hc-batch-table td:nth-child(n+2){font-variant-numeric:tabular-nums;}
.hc-batch-table tbody tr.is-bad td{background:var(--err-soft);color:var(--err);}
.hc-batch-table tbody tr.is-sum td{background:color-mix(in srgb,var(--a) 6%,var(--card));font-weight:900;color:var(--ink);}
.hc-batch-table td.is-high{color:#b91c1c;font-weight:900;}
:root[data-theme="dark"] .hc-batch-table td.is-high{color:#a78bfa;}

/* 分级徽标 */
#hcGrade[data-g="normal"]{color:#15803d;}
#hcGrade[data-g="mild"]{color:#b45309;}
#hcGrade[data-g="moderate"]{color:#b91c1c;}
#hcGrade[data-g="severe"]{color:#7f1d1d;}
:root[data-theme="dark"] #hcGrade[data-g="normal"]{color:#4ade80;}
:root[data-theme="dark"] #hcGrade[data-g="mild"]{color:#fbbf24;}
:root[data-theme="dark"] #hcGrade[data-g="moderate"]{color:#fb7185;}
:root[data-theme="dark"] #hcGrade[data-g="severe"]{color:#f87171;}

@media (max-width:960px){
  .c60-hero-art .hc-helix{inset:0 12px 0 8px;}
  .c60-hero-art .hc-helix .rung{width:108px;}
  #hcGradeTable,#hcDetailTable{min-width:520px;}
}
@media (max-width:640px){
  .c60-metric.is-hero .v{font-size:30px;}
  .hc-sub{font-size:13px;}
  .c60-hero-art .hc-helix{transform:rotate(-8deg) scale(.86);}
  .c60-hero-art .hc-helix .rung{width:96px;}
  #hcBars .c60-bar-row{grid-template-columns:66px minmax(0,1fr) 78px;}
}
@media print{
  .c60-metric.is-hero{background:#4c1d95!important;}
  .hc-advice{break-inside:avoid;}
  #hcGradeTable,#hcDetailTable{min-width:0;}
}