/* 02 脊柱侧弯自测 · 靛蓝 + 米纸；左右镜像对照板、肩线仪、六项观察对称卡片 */
.sc { --a:#3c5a9a; --a2:#263f76; --asoft:#e7ecf8; }
.sc-hero-grid { display:grid; grid-template-columns:.94fr 1.06fr; }
.sc-intro { background:linear-gradient(165deg,var(--card),var(--card2)); }
.sc-art { width:100%; max-width:290px; margin:20px auto 0; display:block; border-radius:14px; border:1px solid var(--line); }
.sc-board { padding:30px 32px 26px; background:var(--card2); border-left:1px solid var(--line); }
.sc-board-hd { display:flex; align-items:baseline; justify-content:space-between; border-bottom:2px solid var(--a2); padding-bottom:10px; margin-bottom:18px; }
.sc-board-hd b { font-family:var(--fd); font-size:19px; }
.sc-board-hd span { font-family:var(--fm); font-size:10.5px; letter-spacing:.1em; color:var(--muted); }
.sc-level { display:grid; grid-template-columns:28px 1fr 28px; gap:10px; align-items:center; margin-bottom:8px; }
.sc-level-l,.sc-level-r { font-family:var(--fd); font-size:17px; font-weight:800; color:var(--a); text-align:center; }
.sc-ruler { position:relative; height:56px; background:repeating-linear-gradient(90deg,var(--card3) 0 1px,transparent 1px 10%), var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.sc-ruler i { position:absolute; left:50%; top:50%; width:82%; height:4px; background:var(--a); border-radius:2px; transform-origin:center; transition:transform .2s; }
.sc-ruler em { position:absolute; right:10px; bottom:5px; font-family:var(--fm); font-style:normal; font-size:11px; font-weight:700; color:var(--a2); }
.sc-range-label { margin:10px 0 16px; font-size:12px; color:var(--ink2); }
.sc-range-label input { margin-top:8px; }
.sc-observe { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sc-col { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 15px; }
.sc-col:nth-child(2) { border-top:3px solid var(--a); }
.sc-col:first-child { border-top:3px solid #b98a4b; }
.sc-col > b { display:block; font-family:var(--fd); font-size:14px; margin-bottom:10px; }
.sc-col .h17-check { display:flex; margin:0 0 7px; font-size:12.5px; }
.sc-cobb { margin-top:16px; font-size:12px; color:var(--ink2); }
.sc-cobb input { margin-top:6px; max-width:180px; }
.sc-board .h17-note b { color:var(--a2); }

.sc-bars { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.sc-bar { display:flex; align-items:center; gap:12px; background:var(--card); border:1px solid var(--line); border-radius:10px; padding:11px 15px; }
.sc-bar i { flex:0 0 9px; width:9px; height:9px; border-radius:50%; background:var(--line2); }
.sc-bar.is-on i { background:var(--warn); }
.sc-bar.is-red i { background:var(--bad); }
.sc-bar b { font-size:13px; min-width:120px; }
.sc-bar span { font-size:12px; color:var(--muted); line-height:1.6; }
.sc-summary-card { margin-top:14px; }
.sc-summary-card h3 { font-size:18px; margin-bottom:10px; }
.sc-summary { background:var(--card2); border-left:3px solid var(--a); border-radius:0 10px 10px 0; padding:12px 16px; font-size:14px; line-height:2; color:var(--ink2); }
.sc .h17-bench-in { background:linear-gradient(180deg,var(--asoft),var(--card) 46%); }
:root[data-theme="dark"] .sc .h17-bench-in { background:linear-gradient(180deg,#1b2740,var(--card) 46%); }
@media (max-width:900px){
    .sc-hero-grid,.sc-observe,.sc-bars { grid-template-columns:1fr; }
    .sc-board { border-left:0; border-top:1px solid var(--line); padding:24px 20px; }
}