/* Shared presentation over historical calculations: two metrics above a full-width BMI card; score and gauge 25/75. */
#vb-results .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
#vb-results .metrics .bmi-wide{grid-column:1/-1}
#vb-results .bmi-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:26px}
#vb-results .bmi-data,#vb-results .bmi-gauge,#vb-results .wellbeing-summary,#vb-results .wellbeing-gauge{min-width:0}
#vb-results .result-gauge{display:block;width:100%;max-width:620px;height:auto;margin:0 auto;color:var(--ink);overflow:visible}
#vb-results .bmi-gauge .result-gauge{color:var(--deep-ink);max-width:480px}
#vb-results .gauge-caption{text-align:center;font-size:15px;line-height:1.45;margin:3px 0 8px}
#vb-results .gauge-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 12px;font-size:10px;color:var(--deep-sub)}
#vb-results .wellbeing-heading{grid-template-columns:minmax(0,1fr) minmax(0,3fr);align-items:center;gap:22px}
#vb-results .wellbeing-summary .wellbeing-score{padding:18px 12px;margin-bottom:14px}
#vb-results .wellbeing-summary p{font-size:13px}
#vb-results .wellbeing-summary [data-wellbeing-coverage]{font-weight:700}
#vb-results .wellbeing-gauge>.tiny{text-align:center}
@media(max-width:700px){#vb-results .metrics{grid-template-columns:minmax(0,1fr)}#vb-results .metric{display:block}#vb-results .bmi-layout,#vb-results .wellbeing-heading{grid-template-columns:minmax(0,1fr)}#vb-results .wellbeing-summary .wellbeing-score{max-width:230px}#vb-results .result-gauge{max-width:440px}#vb-results .bmi-layout{gap:20px}}


/* BMI result and short explanation: typography only. */
#vb-results .bmi-gauge .gauge-caption{font-size:28px;line-height:1.25;margin:14px 0 18px;font-weight:750;overflow-wrap:anywhere}
#vb-results .bmi-gauge .gauge-caption strong{display:inline;font:inherit;font-weight:750;margin:0}
#vb-results .bmi-data .bmi-explanation{font-size:15px;line-height:1.6;color:var(--deep-sub);margin:18px 0 0}
@media(max-width:600px){#vb-results .bmi-gauge .gauge-caption{font-size:25px}#vb-results .bmi-data .bmi-explanation{font-size:14px}}

/* Same descriptive score bands on questionnaire, saved assessments and PDF. */
#vb-results .wellbeing-bands{margin-top:18px;padding-top:14px;border-top:1px solid var(--edge);font-size:12px;line-height:1.45}
#vb-results .wellbeing-bands h4{font-size:13px;font-weight:700;margin:0 0 10px;color:var(--ink)}
#vb-results .wellbeing-band-list{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;list-style:none;margin:0;padding:0;color:var(--sub)}
#vb-results .wellbeing-band-list li{display:grid;grid-template-columns:11px minmax(0,1fr);align-items:start;gap:8px;margin:0;overflow-wrap:anywhere}
#vb-results .wellbeing-band-dot{display:block;width:11px;height:11px;border-radius:50%;margin-top:4px;border:1px solid #00000018;print-color-adjust:exact;-webkit-print-color-adjust:exact}
#vb-results .wellbeing-band-list strong{color:var(--ink);font-weight:750}
#vb-results .wellbeing-band-name{color:var(--sub);font-size:11px}
@media(max-width:900px){#vb-results .wellbeing-heading{grid-template-columns:minmax(0,1fr)}#vb-results .wellbeing-band-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:360px){#vb-results .wellbeing-band-list{grid-template-columns:minmax(0,1fr)}}

/* Enlarged result typography, also applied to historical views without recalculation. */
#vb-results .bmi-data>strong{font-size:32px;line-height:1.2;font-weight:750}
#vb-results .bmi-data>strong>span{font-size:14px;font-weight:400}
#vb-results .wellbeing-gauge .gauge-caption>strong{display:block;font-size:28px;line-height:1.25;font-weight:750;margin:12px 0 8px;overflow-wrap:anywhere}
@media(max-width:600px){#vb-results .wellbeing-gauge .gauge-caption>strong{font-size:24px}}

/* Spending and habit summaries: display-only, also for historical records with saved costs. */
#vb-results .spending-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}
#vb-results .spending-item{display:flex;flex-direction:column;gap:9px;min-width:0;padding:18px;background:var(--soft,#edf3ec);border:1px solid var(--line,#d8e2d8);border-radius:12px}
#vb-results .spending-item h3{font-size:17px;margin:0}
#vb-results .spending-item strong{font-size:25px;line-height:1.25;overflow-wrap:anywhere}
#vb-results .spending-total{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px;border-radius:12px;background:#193e30;color:#fff;margin:18px 0}
#vb-results .spending-total strong{font-size:30px;line-height:1.25}
#vb-results .habit-signals{margin-top:20px;padding:18px;border:1px solid var(--line,#d8e2d8);border-left:4px solid #c7a65b;border-radius:10px}
#vb-results .habit-signals h3{margin-top:0;font-weight:750}
@media(max-width:900px){#vb-results .spending-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){#vb-results .spending-item{padding:12px}#vb-results .spending-item strong{font-size:21px}#vb-results .spending-total{align-items:flex-start;flex-direction:column}#vb-results .spending-total strong{font-size:26px}}

/* Explicit labels under comparison bars; typography copied from each numeric scale. */
#vb-results .bar-annotations{position:absolute;left:0;top:0;width:100%;min-width:0;margin:0;color:var(--sub);font-weight:400;text-align:left}
#vb-results .metric .bar-annotations{color:var(--deep-sub)}
#vb-results .bar-annotations>strong,#vb-results .bar-annotations>span{position:absolute;display:block;max-width:100%;white-space:nowrap;line-height:inherit;font-size:inherit;font-family:inherit;letter-spacing:normal;margin:0;padding:0;transform:none}
#vb-results .bar-annotations .bar-person-label{font-weight:700}
#vb-results .bar-annotations .bar-reference-label{font-weight:400}

#vb-results .comparison-ticks{position:relative}
#vb-results .bmi-plot .comparison-ticks>span:last-of-type{right:0}
#vb-results .comparison-ticks>.comparison-tick-obscured{visibility:hidden}
