.health{max-width:900px;margin:auto}.health-card{background:#fff;border:1px solid #dce5ea;border-radius:18px;padding:22px;margin:18px 0}.health-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.q{border:1px solid #dce5ea;border-radius:14px;padding:16px}.q label{font-weight:700;display:block;margin-bottom:8px}.q select{width:100%}.score-hero{text-align:center;padding:24px}.score-number{font-size:4.5rem;line-height:1;font-weight:900}.score-number small{font-size:1.2rem}.pillar{margin:14px 0}.pillar-head{display:flex;justify-content:space-between;gap:10px;font-weight:700}.bar{height:12px;background:#e4eaed;border-radius:999px;overflow:hidden;margin-top:7px}.bar span{height:100%;display:block;background:#078a4a}.actions-list{display:grid;gap:10px}.action{padding:16px;border:1px solid #dce5ea;border-radius:14px}.health-note{background:#f3f8f5;padding:16px;border-radius:14px}.method{font-size:.95rem}.score-buttons{display:flex;gap:10px;flex-wrap:wrap}@media(max-width:650px){.health-grid{grid-template-columns:1fr}.score-number{font-size:3.7rem}}
/* Dynamic widths use discrete CSS classes instead of CSP-blocked style attributes. */
.health-fill-0{width:0%}
.health-fill-5{width:5%}
.health-fill-10{width:10%}
.health-fill-15{width:15%}
.health-fill-20{width:20%}
.health-fill-25{width:25%}
.health-fill-30{width:30%}
.health-fill-35{width:35%}
.health-fill-40{width:40%}
.health-fill-45{width:45%}
.health-fill-50{width:50%}
.health-fill-55{width:55%}
.health-fill-60{width:60%}
.health-fill-65{width:65%}
.health-fill-70{width:70%}
.health-fill-75{width:75%}
.health-fill-80{width:80%}
.health-fill-85{width:85%}
.health-fill-90{width:90%}
.health-fill-95{width:95%}
.health-fill-100{width:100%}