/* 铁摄入计算器 —— 血液红 · 铁剂与绿叶 */
.c60{
  --a:#991b1b;
  --a2:#f87171;
  --a-soft:rgba(153,27,27,.10);
  --a-line:rgba(153,27,27,.26);
}

/* hero：红细胞点阵 + 左下血色光晕 */
.c60-hero{
  background:
    radial-gradient(430px 300px at 86% 10%, rgba(248,113,113,.34), transparent 68%),
    radial-gradient(520px 280px at 6% 92%, rgba(21,128,61,.16), transparent 70%),
    radial-gradient(rgba(153,27,27,.10) 1.6px, transparent 1.8px),
    linear-gradient(125deg, #fef2f2 0%, #fff1f2 45%, #f0fdf4 100%);
  background-size:auto, auto, 26px 26px, auto;
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(430px 300px at 86% 10%, rgba(248,113,113,.18), transparent 68%),
    radial-gradient(520px 280px at 6% 92%, rgba(21,128,61,.14), transparent 70%),
    radial-gradient(rgba(248,113,113,.09) 1.6px, transparent 1.8px),
    linear-gradient(125deg, #1c0a0a 0%, #220d10 45%, #0a1a10 100%);
  background-size:auto, auto, 26px 26px, auto;
}

/* 自绘插画：血滴 + 两粒铁剂 + 一片叶子 */
.c60-hero-art .ii-drop{
  position:absolute;
  top:16px;
  left:64px;
  width:76px;
  height:76px;
  border-radius:50% 50% 50% 50% / 62% 62% 38% 38%;
  background:radial-gradient(circle at 34% 28%, #fecaca, #dc2626 44%, #7f1d1d 100%);
  box-shadow:0 14px 26px rgba(127,29,29,.32);
  transform:rotate(-45deg);
  display:flex;
  align-items:center;
  justify-content:center;
}
.c60-hero-art .ii-drop::after{
  content:"";
  position:absolute;
  top:8px;
  left:12px;
  width:18px;
  height:10px;
  border-radius:50%;
  background:rgba(255,255,255,.45);
  transform:rotate(45deg);
}
.c60-hero-art .ii-drop .ii-fe{
  transform:rotate(45deg);
  font-size:16px;
  font-weight:900;
  color:#fff;
  letter-spacing:.5px;
  text-shadow:0 1px 3px rgba(0,0,0,.35);
}
.c60-hero-art .ii-pill{
  position:absolute;
  width:62px;
  height:25px;
  border-radius:999px;
  overflow:hidden;
  box-shadow:0 8px 16px rgba(127,29,29,.22);
}
.c60-hero-art .ii-pill::before{
  content:"";
  position:absolute;
  inset:0 50% 0 0;
  background:#fca5a5;
}
.c60-hero-art .ii-pill::after{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  width:2px;
  background:rgba(255,255,255,.55);
}
.c60-hero-art .ii-pill.p1{right:34px;bottom:66px;transform:rotate(-18deg);}
.c60-hero-art .ii-pill.p2{right:8px;bottom:100px;transform:rotate(22deg);opacity:.86;}
:root[data-theme="dark"] .c60-hero-art .ii-pill{box-shadow:0 8px 16px rgba(0,0,0,.45);}
.c60-hero-art .ii-leaf{
  position:absolute;
  left:18px;
  bottom:16px;
  width:64px;
  height:40px;
  border-radius:60% 0 60% 0;
  background:linear-gradient(140deg,#4ade80,#15803d);
  transform:rotate(-14deg);
  box-shadow:0 8px 16px rgba(21,128,61,.22);
}
.c60-hero-art .ii-leaf::after{
  content:"";
  position:absolute;
  left:10px;
  bottom:8px;
  width:44px;
  height:1.5px;
  background:rgba(255,255,255,.5);
  transform:rotate(-22deg);
  transform-origin:left center;
}
.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:#991b1b;}
:root[data-theme="dark"] .c60-hero-art .chip b{color:#f87171;}

/* hero 主结果：深血色渐变 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#7f1d1d,#991b1b 52%,#be123c 100%);
  box-shadow:0 16px 34px rgba(127,29,29,.34);
}
.c60-metric.is-hero .v{font-size:clamp(28px,3.4vw,42px);}

.c60-segbtn.on{color:#991b1b;}
:root[data-theme="dark"] .c60-segbtn.on{color:#f87171;}
.c60-chip.on{background:rgba(153,27,27,.12);border-color:#991b1b;color:#991b1b;}
:root[data-theme="dark"] .c60-chip.on{color:#f87171;border-color:#f87171;}

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

/* 铁来源条形图：血红素深红、非血红素浅红、补充剂橙 */
#iiBars .c60-bar-row:nth-child(1) .bf{background:linear-gradient(90deg,#7f1d1d,#991b1b);}
#iiBars .c60-bar-row:nth-child(2) .bf{background:linear-gradient(90deg,#f87171,#fca5a5);}
#iiBars .c60-bar-row:nth-child(3) .bf{background:linear-gradient(90deg,#b45309,#fbbf24);}
#iiBars .c60-bar-row:nth-child(4) .bf{background:linear-gradient(90deg,#15803d,#4ade80);}

/* 食物换算表 */
#iiFoodTable td:first-child{font-weight:900;color:var(--ink);white-space:nowrap;}
#iiFoodTable td:nth-child(n+3){font-variant-numeric:tabular-nums;}
#iiFoodTable tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--a) 3%,transparent);}

/* 补充方案表 */
#iiPlanTable td:first-child{font-weight:900;color:var(--ink);white-space:nowrap;}
#iiPlanTable td:nth-child(n+3){font-variant-numeric:tabular-nums;}
#iiPlanTable tbody tr:first-child td{background:color-mix(in srgb,var(--a) 5%,var(--card));}

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

/* 达标状态徽标 */
#iiStatusOut[data-state="ok"]{color:#15803d;}
#iiStatusOut[data-state="low"]{color:#b91c1c;}
:root[data-theme="dark"] #iiStatusOut[data-state="ok"]{color:#4ade80;}
:root[data-theme="dark"] #iiStatusOut[data-state="low"]{color:#f87171;}
#iiGap[data-gap="0"]{color:#15803d;}
:root[data-theme="dark"] #iiGap[data-gap="0"]{color:#4ade80;}

@media (max-width:960px){
  .c60-hero-art .ii-drop{left:38px;top:8px;width:66px;height:66px;}
  #iiFoodTable,#iiPlanTable{min-width:560px;}
}
@media (max-width:640px){
  .c60-metric.is-hero .v{font-size:30px;}
  .ii-sub{font-size:13px;}
  #iiBars .c60-bar-row{grid-template-columns:66px minmax(0,1fr) 82px;}
  .c60-hero-art .ii-pill{transform:scale(.9) rotate(-18deg);}
}
@media print{
  .c60-metric.is-hero{background:#991b1b!important;}
  .c60-warn{break-inside:avoid;}
  #iiFoodTable,#iiPlanTable{min-width:0;}
}