/* ===== 儿童视力发育档案（玻璃拟态，通用组件见 glass.css） ===== */
.vr-row { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid rgba(31, 45, 90, .1); }
html[data-theme="dark"] .vr-row { border-bottom-color: rgba(255, 255, 255, .12); }
.vr-row:last-child { border-bottom: none; }
.vr-date { width: 92px; flex-shrink: 0; font-size: 13px; color: var(--c-text); font-weight: 600; }
.vr-bars { flex: 1; display: flex; flex-direction: column; gap: 6px; }
.vr-bar-line { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--c-text-muted); }
.vr-bar { height: 9px; border-radius: 999px; background: rgba(31, 45, 90, .12); position: relative; flex: 1; overflow: hidden; }
html[data-theme="dark"] .vr-bar { background: rgba(255, 255, 255, .12); }
.vr-bar > span { position: absolute; left: 0; top: 0; height: 100%; border-radius: 999px; }
.vr-bar.good > span { background: linear-gradient(90deg, #22c55e, #16a34a); }
.vr-bar.ok > span { background: linear-gradient(90deg, #f59e0b, #d97706); }
.vr-bar.bad > span { background: linear-gradient(90deg, #ef4444, #dc2626); }
.vr-bar.normal > span { background: rgba(31, 45, 90, .35); }
html[data-theme="dark"] .vr-bar.normal > span { background: rgba(255, 255, 255, .4); }
.vr-hint { font-size: 12px; color: var(--c-text-muted); margin-top: 8px; }