${p.name}
${p.desc}
0 / 8
${p.questions.map((q,qi)=>`
`).join('')}
`;
container.appendChild(el);
});const pbRows=document.getElementById('pb-rows');
PILLARS.forEach(p=>{
const row=document.createElement('div');
row.className='pb-row';
row.innerHTML=`${q}
${p.name}
0/8
`;
pbRows.appendChild(row);
});buildRoadmap(null);
}function setScore(pid,qi,val,btn){
const key=`${pid}_${qi}`;
scores[key]=val;
const allBtns=btn.parentElement.querySelectorAll('.q-btn');
allBtns.forEach((b,i)=>{
b.classList.remove('active-0','active-1','active-2');
if(i===val) b.classList.add(`active-${val}`);
});
updateAll();
}function pillarScore(pid){
let s=0,answered=0;
PILLARS.find(p=>p.id===pid).questions.forEach((_,qi)=>{
const v=scores[`${pid}_${qi}`];
if(v!==null){s+=v;answered++;}
});
return{score:s,answered,max:8};
}function totalScore(){
let s=0;
PILLARS.forEach(p=>{s+=pillarScore(p.id).score});
return s;
}function answeredCount(){
return Object.values(scores).filter(v=>v!==null).length;
}function updateAll(){
const total=totalScore();
const answered=answeredCount();
const pct=Math.round((total/40)*100);document.getElementById('main-bar').style.width=pct+'%';
document.getElementById('main-score-display').textContent=total+' / 40';PILLARS.forEach(p=>{
const{score,answered:pa}=pillarScore(p.id);
const badge=document.getElementById(`badge-${p.id}`);
badge.textContent=score+' / 8';
badge.classList.toggle('scored',pa===4);
const barPct=Math.round((score/8)*100);
document.getElementById(`pb-bar-${p.id}`).style.width=barPct+'%';
document.getElementById(`pb-val-${p.id}`).textContent=score+'/8';
});const panel=document.getElementById('results-panel');
if(answered>=10){
panel.classList.remove('results-hidden');
const tier=TIERS.find(t=>total>=t.min)||TIERS[TIERS.length-1];
document.getElementById('result-tier').textContent=tier.label;
document.getElementById('result-tier').style.color=tier.color;
document.getElementById('result-headline').textContent=tier.headline;
document.getElementById('result-subline').textContent=tier.subline;
document.getElementById('score-big').textContent=total;
const circumference=169.6;
const offset=circumference-(pct/100)*circumference;
const ring=document.getElementById('ring-fill');
ring.style.strokeDashoffset=offset;
ring.style.stroke=tier.ringColor;
buildRoadmap(total);
}
}function buildRoadmap(total){
const steps=document.getElementById('roadmap-steps');
const sub=document.getElementById('roadmap-sub');
const tag=document.getElementById('roadmap-tag');
steps.innerHTML='';if(total===null){
sub.textContent='Complete the scoring above to personalise this roadmap';
tag.textContent='Pending';
tag.style.background='rgba(255,255,255,0.06)';
tag.style.color='rgba(255,255,255,0.4)';
const placeholder=document.createElement('div');
placeholder.style.cssText='padding:24px 22px;font-size:13px;color:var(--gray-400);line-height:1.6';
placeholder.innerHTML='Score yourself across all five pillars and the roadmap below will prioritise your highest-impact actions — based on where you actually scored lowest.';
steps.appendChild(placeholder);
return;
}const pillarScores=PILLARS.map(p=>({...p,s:pillarScore(p.id).score}));
pillarScores.sort((a,b)=>a.s-b.s);const tier=TIERS.find(t=>total>=t.min)||TIERS[TIERS.length-1];
sub.textContent='Prioritised by your lowest-scoring pillars';
tag.textContent=tier.tag;
tag.style.background='rgba(29,158,117,0.15)';
tag.style.color='#1D9E75';const orderedSteps=[...ROADMAP_STEPS];
orderedSteps.sort((a,b)=>{
const rankA=pillarScores.findIndex(p=>p.id===a.pillarId);
const rankB=pillarScores.findIndex(p=>p.id===b.pillarId);
return rankA-rankB;
});orderedSteps.forEach((step,i)=>{
const pScore=pillarScores.find(p=>p.id===step.pillarId);
const priority=i<2?'high':i<4?'med':'base';
const priorityLabels={'high':'Fix first','med':'Next priority','base':'Build on these'};
const div=document.createElement('div');
div.className=`rm-step p-${priority}`;
div.innerHTML=`${i+1}
${priorityLabels[priority]}
${step.name}
${step.desc}
${step.actions.map(a=>`${a}`).join('')}