.demographic-grid{display:grid;grid-template-columns:1.5fr .7fr;gap:16px;margin:16px 0}.demographic-card,.completeness-card,.gender-comparison{padding:22px}.data-coverage{padding:6px 10px;border-radius:20px;background:#eaf7f4;color:#167264;font-weight:800;font-size:12px}.gender-bars{display:grid;gap:14px;margin:18px 0}.gender-bars span{display:flex;justify-content:space-between;margin-bottom:6px;color:#496578}.gender-bars i{display:block;height:10px;background:#e9f0f4;border-radius:20px;overflow:hidden}.gender-bars em{display:block;height:100%;background:#8a65b5;border-radius:20px}.gender-bars em.male{background:#178da7}.age-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.age-summary>div{padding:13px;background:#f5f8fa;border-radius:11px}.age-summary small,.metric-list small{display:block;color:var(--muted)}.age-summary strong{display:block;font-size:21px;margin-top:4px}.completeness-card{text-align:center}.completeness-card h2{margin:5px 0}.completeness-card p{color:var(--muted);line-height:1.5}.coverage-ring{--coverage:0;width:96px;height:96px;margin:16px auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#0aa39f calc(var(--coverage)*1%),#e5edf1 0);position:relative}.coverage-ring:after{content:"";position:absolute;inset:10px;border-radius:50%;background:#fff}.coverage-ring strong{position:relative;z-index:1;font-size:21px}.complete-ok{display:inline-block;color:#13806f;font-weight:800}.gender-comparison{margin-bottom:16px}.gender-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}.gender-stat-card{border:1px solid #dce7ed;border-radius:14px;overflow:hidden}.gender-stat-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:#f4f8fa}.gender-stat-head h3{margin:0}.gender-stat-head span{font-size:12px;color:var(--muted)}.metric-list>div{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:14px;padding:11px 16px;border-top:1px solid #e5edf1}.metric-list>div>span{font-weight:700}.metric-list b.positive{color:#13806f}.metric-list b.negative{color:#b84747}@media(max-width:900px){.demographic-grid,.gender-stat-grid{grid-template-columns:1fr}}@media(max-width:620px){.age-summary{grid-template-columns:1fr}.metric-list>div{grid-template-columns:1fr auto}.metric-list>div>small{grid-column:1/-1}}
