/* 读写姿势计算器 —— 护眼绿 · 桌椅标尺 */
.c60{
  --a:#15803d;
  --a2:#86efac;
  --a-soft:rgba(21,128,61,.10);
  --a-line:rgba(21,128,61,.26);
}

/* 首屏：淡绿护眼纸 + 细刻度网纹 */
.c60-hero{
  background:
    radial-gradient(720px 320px at 6% 0%, rgba(255,255,255,.88), transparent 62%),
    repeating-linear-gradient(90deg, rgba(21,128,61,.05) 0 1px, transparent 1px 27px),
    linear-gradient(128deg, #f0fdf4 0%, #dcfce7 48%, #ecfdf5 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(720px 320px at 6% 0%, rgba(134,239,172,.12), transparent 62%),
    repeating-linear-gradient(90deg, rgba(134,239,172,.05) 0 1px, transparent 1px 27px),
    linear-gradient(128deg,#08170e 0%,#0c2015 50%,#0e1626 100%);
}

/* 自绘：侧坐读书的小人与桌椅 */
.c60-hero-art .ps-stage{
  position:absolute;
  inset:0 2px;
  min-height:186px;
}
.c60-hero-art .ps-ruler{
  position:absolute;
  left:0;
  top:24px;
  width:22px;
  height:132px;
  border-radius:5px;
  background:
    repeating-linear-gradient(180deg, rgba(21,128,61,.55) 0 1px, transparent 1px 9px),
    linear-gradient(180deg,#ffffff,#dcfce7);
  border:1px solid rgba(21,128,61,.3);
}
.c60-hero-art .ps-ruler::after{
  content:"cm";
  position:absolute;
  left:24px;
  bottom:-16px;
  font-size:10px;
  font-weight:800;
  color:#15803d;
}
.c60-hero-art .ps-desk{
  position:absolute;
  left:56px;
  right:8px;
  top:112px;
  height:7px;
  border-radius:3px;
  background:linear-gradient(90deg,#166534,#15803d 60%,#4d7c0f);
  box-shadow:0 6px 14px rgba(21,128,61,.22);
}
.c60-hero-art .ps-desk .ps-leg{
  position:absolute;
  top:7px;
  width:5px;
  height:52px;
  background:rgba(21,128,61,.55);
  border-radius:0 0 3px 3px;
}
.c60-hero-art .ps-desk .ps-leg.l{left:14px;}
.c60-hero-art .ps-desk .ps-leg.r{right:12px;}
.c60-hero-art .ps-book{
  position:absolute;
  left:86px;
  top:104px;
  width:52px;
  height:8px;
  border-radius:3px;
  background:linear-gradient(180deg,#fefce8,#fde68a);
  border:1px solid rgba(21,128,61,.35);
  transform:rotate(-11deg);
  transform-origin:left center;
}
.c60-hero-art .ps-chair{
  position:absolute;
  left:70px;
  top:138px;
  width:58px;
  height:6px;
  border-radius:3px;
  background:#15803d;
}
.c60-hero-art .ps-chair .ps-back{
  position:absolute;
  left:0;
  top:-38px;
  width:5px;
  height:44px;
  border-radius:3px;
  background:rgba(21,128,61,.6);
  transform:rotate(-6deg);
  transform-origin:bottom left;
}
.c60-hero-art .ps-kid{
  position:absolute;
  left:104px;
  top:44px;
  width:46px;
  height:96px;
}
.c60-hero-art .ps-kid .ps-head{
  position:absolute;
  left:4px;
  top:0;
  width:26px;
  height:26px;
  border-radius:50%;
  background:linear-gradient(150deg,#fde68a,#fbbf24);
  box-shadow:inset -4px -4px 0 rgba(21,128,61,.12);
}
.c60-hero-art .ps-kid .ps-body{
  position:absolute;
  left:14px;
  top:24px;
  width:17px;
  height:66px;
  border-radius:12px 12px 10px 14px;
  background:linear-gradient(180deg,#86efac,#15803d);
  transform:rotate(9deg);
  transform-origin:top center;
  box-shadow:0 8px 16px rgba(21,128,61,.18);
}
.c60-hero-art .ps-eye-line{
  position:absolute;
  left:126px;
  top:60px;
  width:76px;
  height:2px;
  background:repeating-linear-gradient(90deg, rgba(21,128,61,.7) 0 6px, transparent 6px 12px);
  transform:rotate(18deg);
}
.c60-hero-art .ps-eye-line::after{
  content:"33cm";
  position:absolute;
  right:-10px;
  top:-17px;
  font-size:10px;
  font-weight:800;
  color:#15803d;
  transform:rotate(-6deg);
}
.c60-hero-art .ps-gap-mark{
  position:absolute;
  right:18px;
  top:80px;
  bottom:16px;
  width:2px;
  background:repeating-linear-gradient(180deg, rgba(21,128,61,.45) 0 5px, transparent 5px 11px);
}
.c60-hero-art .ps-gap-mark::after{
  content:"高差";
  position:absolute;
  right:6px;
  top:14px;
  font-size:10px;
  font-weight:800;
  color:#15803d;
  writing-mode:vertical-rl;
}
:root[data-theme="dark"] .c60-hero-art .ps-ruler{
  background:
    repeating-linear-gradient(180deg, rgba(134,239,172,.5) 0 1px, transparent 1px 9px),
    linear-gradient(180deg,#12241a,#0b1a12);
  border-color:rgba(134,239,172,.28);
}
:root[data-theme="dark"] .c60-hero-art .ps-ruler::after,
:root[data-theme="dark"] .c60-hero-art .ps-eye-line::after,
:root[data-theme="dark"] .c60-hero-art .ps-gap-mark::after{color:#86efac;}
:root[data-theme="dark"] .c60-hero-art .ps-desk{background:linear-gradient(90deg,#166534,#15803d 60%,#3f6212);box-shadow:none;}
:root[data-theme="dark"] .c60-hero-art .ps-kid .ps-body{background:linear-gradient(180deg,#4ade80,#15803d);}
: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:#86efac;}

/* 主结果：深绿 */
.c60-metric.is-hero{
  background:linear-gradient(135deg,#14532d,#15803d 46%,#3f6212 100%);
  box-shadow:0 16px 34px rgba(21,128,61,.3);
}
.c60-metric.is-hero .v{font-size:clamp(30px,3.6vw,44px);}

/* 分值着色 */
#psMain.is-pass{color:#fff;}
#psPass.is-pass{color:#fff;}

.c60-segbtn.on{color:#15803d;}
:root[data-theme="dark"] .c60-segbtn.on{color:#86efac;}

/* 坐姿角度滑杆刻度说明 */
.ps-angle-scale{
  display:flex;
  justify-content:space-between;
  margin:-2px 0 4px;
  font-size:10.5px;
  font-weight:700;
  color:var(--muted);
  letter-spacing:.2px;
}
#psAngle{background:linear-gradient(to right,var(--soft) 0%,#15803d 22%,#86efac 46%,#15803d 78%,var(--soft) 100%);}
#psAngleOut{color:#15803d;font-weight:900;}
:root[data-theme="dark"] #psAngleOut{color:#86efac;}

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

/* 达标分布环图 */
.ps-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(240,253,244,.92),var(--card));
}
:root[data-theme="dark"] .ps-donut-wrap{background:linear-gradient(160deg,#0b1a12,var(--card));}
.ps-donut-wrap .c60-donut{display:grid;place-items:center;color:var(--ink);}
.ps-legend{display:flex;flex-direction:column;gap:8px;}
.ps-legend .row{
  display:grid;
  grid-template-columns:10px minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  font-size:12.5px;
  color:var(--ink2);
}
.ps-legend .dot{width:10px;height:10px;border-radius:50%;}
.ps-legend .nm{font-weight:800;color:var(--ink);}
.ps-legend .vl{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:800;}

/* 条形图：身高段桌高 */
#psBars .c60-bar-row{grid-template-columns:80px minmax(0,1fr) 64px;}
#psBars .c60-bar-row .bf{background:linear-gradient(90deg,#15803d,#86efac);}

/* 检查明细表 */
#psCheckTable td:nth-child(n+2):nth-child(-n+4){font-variant-numeric:tabular-nums;}
#psCheckTable td:first-child{font-weight:900;color:var(--ink);white-space:nowrap;}
#psCheckTable td:nth-child(5){font-weight:900;white-space:nowrap;}
#psCheckTable tr.is-pass td:nth-child(5){color:#15803d;}
#psCheckTable tr.is-fail td:nth-child(5){color:#b45309;}
#psCheckTable tr.is-fail td{background:rgba(245,158,11,.06);}
:root[data-theme="dark"] #psCheckTable tr.is-pass td:nth-child(5){color:#86efac;}
:root[data-theme="dark"] #psCheckTable tr.is-fail td:nth-child(5){color:#fbbf24;}
:root[data-theme="dark"] #psCheckTable tr.is-fail td{background:rgba(245,158,11,.1);}
#psCheckTable td:last-child{font-size:12px;color:var(--muted);}

/* 身高段表 */
#psBandTable td:nth-child(n+2):nth-child(-n+4){font-variant-numeric:tabular-nums;font-weight:800;}
#psBandTable tbody tr:nth-child(even) td{background:rgba(21,128,61,.04);}
:root[data-theme="dark"] #psBandTable tbody tr:nth-child(even) td{background:rgba(134,239,172,.05);}

/* 调整清单 */
#psFixBox ul li b{color:#7c2d12;}
#psFixBox ul li.is-ok{border-left:0;}

/* 批量表 */
#psBatchTable td:first-child{font-weight:800;color:var(--ink);}
#psBatchTable td:nth-child(n+2){font-variant-numeric:tabular-nums;}
#psBatchTable td.is-bad{color:#b45309;font-weight:900;}

@media (max-width:960px){
  .c60-hero-art{display:none;}
  .ps-donut-wrap{grid-template-columns:auto minmax(0,1fr);}
}
@media (max-width:640px){
  .ps-donut-wrap{grid-template-columns:1fr;justify-items:center;}
  .ps-legend{width:100%;}
  #psBars .c60-bar-row{grid-template-columns:66px minmax(0,1fr) 54px;}
  #psCheckTable{min-width:560px;}
  #psBandTable{min-width:460px;}
  .ps-angle-scale{font-size:9.5px;}
}
@media print{
  .ps-donut-wrap{break-inside:avoid;}
  .c60-actions,.c60-batch,.c60-hist,#psBars{display:none!important;}
  .c60-metric.is-hero{box-shadow:none;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}
