*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#0f1117;--card:#1a1d2e;--accent:#6c63ff;--accent2:#ff6584;--text:#e0e0e0;--muted:#8892b0;--border:#2a2d3e;--success:#00c853;--warn:#ffc107}
body{font-family:'Segoe UI',system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;line-height:1.6}
.header{background:linear-gradient(135deg,#1a1d2e 0%,#0f1117 100%);padding:40px 20px;text-align:center;border-bottom:1px solid var(--border)}
.header h1{font-size:2.2em;background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:8px}
.header p{color:var(--muted);font-size:1.1em;max-width:600px;margin:0 auto}
.container{max-width:900px;margin:0 auto;padding:30px 20px}
.step{display:none;animation:fadeIn .4s ease}
.step.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:28px;margin-bottom:20px}
.card h2{font-size:1.3em;margin-bottom:18px;color:var(--accent)}
.options{display:grid;gap:12px}
.option{background:var(--bg);border:2px solid var(--border);border-radius:10px;padding:16px 20px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:14px}
.option:hover{border-color:var(--accent);background:rgba(108,99,255,0.08)}
.option.selected{border-color:var(--accent);background:rgba(108,99,255,0.15)}
.option input{display:none}
.option .radio{width:22px;height:22px;border-radius:50%;border:2px solid var(--muted);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}
.option.selected .radio{border-color:var(--accent);background:var(--accent)}
.option.selected .radio::after{content:'✓';color:#fff;font-size:13px;font-weight:700}
.option .label{font-size:1.05em}
.option .sublabel{font-size:.85em;color:var(--muted);margin-top:2px}
.slider-wrap{margin:10px 0}
.slider-label{display:flex;justify-content:space-between;margin-bottom:8px;font-size:.95em}
.slider-label .budget-display{color:var(--accent);font-weight:700}
.slider-wrap input[type=range]{width:100%;-webkit-appearance:none;height:8px;border-radius:4px;background:var(--border);outline:none}
.slider-wrap input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--accent);cursor:pointer}
.budget-labels{display:flex;justify-content:space-between;font-size:.8em;color:var(--muted);margin-top:4px}
.btn{display:inline-block;padding:14px 32px;border:none;border-radius:10px;font-size:1.05em;cursor:pointer;transition:all .2s;font-weight:600}
.btn-primary{background:linear-gradient(135deg,var(--accent),#8b83ff);color:#fff}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(108,99,255,0.4)}
.btn-secondary{background:var(--bg);color:var(--text);border:1px solid var(--border)}
.btn-secondary:hover{border-color:var(--muted)}
.nav-btns{display:flex;gap:12px;justify-content:space-between;margin-top:24px}
.progress-bar{display:flex;gap:8px;justify-content:center;margin-bottom:28px}
.progress-dot{width:36px;height:8px;border-radius:4px;background:var(--border);transition:all .3s}
.progress-dot.active{background:var(--accent)}
.progress-dot.done{background:var(--success)}
.result-card{background:linear-gradient(135deg,rgba(108,99,255,0.1),rgba(255,101,132,0.08));border:2px solid var(--accent);border-radius:14px;padding:32px;text-align:center}
.result-card h2{font-size:1.6em;margin-bottom:8px;background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.result-card .winner{font-size:2em;font-weight:800;margin:16px 0;color:var(--text)}
.result-card .reason{color:var(--muted);margin-bottom:20px;line-height:1.7}
.result-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin:24px 0;text-align:left}
.detail-item{background:var(--bg);border-radius:10px;padding:16px;border:1px solid var(--border)}
.detail-item .label{font-size:.8em;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.detail-item .value{font-size:1.15em;font-weight:700;margin-top:4px}
.alternatives{margin-top:20px;text-align:left}
.alternatives h3{font-size:1.1em;margin-bottom:10px;color:var(--accent2)}
.alt-item{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--bg);border-radius:8px;margin-bottom:8px;border:1px solid var(--border)}
.alt-name{font-weight:600}
.alt-score{color:var(--muted);font-size:.9em}
.footer{text-align:center;padding:30px;color:var(--muted);font-size:.9em;border-top:1px solid var(--border);margin-top:40px}

var answers={};
function select(el,key,val){answers[key]=val;var p=el.closest('.options');p.querySelectorAll('.option').forEach(function(o){o.classList.remove('selected')});el.classList.add('selected')}
var budgetLabels={0:'$0 (Free only)',1:'$50/mo',2:'$200/mo',3:'$500/mo',4:'$2000+/mo'};
function updateBudget(v){document.getElementById('budgetVal').textContent=budgetLabels[v];answers.budget=parseInt(v)}

function updateProgress(step){for(var i=0;i<5;i++){var d=document.getElementById('dot'+i);d.className='progress-dot';if(i=0)s+=3;else s-=5;

return s;

function showResult(){
var scored=db.map(function(m){return {n:m.name,t:m.task,la:m.latency,ac:m.accuracy,d:m.deploy,bm:m.budgetMin,sp:m.speed,q:m.quality,c:m.cost,tg:m.tags,s:scoreModel(m)};}).sort(function(a,b){return b.s-a.s});
var winner=scored[0];
var stepEls=document.querySelectorAll('.step');

var alts=scored.slice(1,4);

return '
'+a.n+'Score: '+a.s+' · '+a.tg[0]+'
';

function getReason(w){
var reasons=[];

return 'Recommended for '+answers.task+' workloads. Offers '+reasons.slice(0,3).join(', ')+'.';

function resetTool(){
answers={task:null,latency:null,accuracy:null,deploy:null,budget:1};
document.querySelectorAll('.option').forEach(function(o){o.classList.remove('selected')});
document.querySelectorAll('.step').forEach(function(s){s.classList.remove('active')});

answers.budget=1;

if(m.latency.indexOf(answers.latency)>=0)s+=2;
if(m.accuracy.indexOf(answers.accuracy)>=0)s+=3;else s-=3;
if(m.deploy.indexOf(answers.deploy)>=0)s+=2;else s-=10;
if(m.budgetMin<=answers.budget)s+=2;else s-=8;
if(answers.latency==='critical')s+=m.speed-5;
if(answers.accuracy==='critical')s+=m.quality-5;
if(answers.budget<=1)s+=m.cost-5;

}

stepEls[5].classList.remove('active');
document.getElementById('step5').classList.add('active');updateProgress(5);
document.getElementById('resultName').textContent=winner.n;
document.getElementById('resultReason').textContent=getReason(winner);
document.getElementById('resultDetails').innerHTML=
'

‚+
‚

‚+
‚

‚+
‚

‚;

document.getElementById(‚altList‘).innerHTML=alts.map(function(a){

}).join(“);
}

if(w.q>=9)reasons.push(‚top-tier accuracy‘);
if(w.c>=9)reasons.push(‚excellent cost efficiency‘);
if(w.sp>=9)reasons.push(‚blazing fast responses‘);
if(w.tg.indexOf(‚Open source‘)>=0)reasons.push(‚open-source flexibility‘);
if(w.tg.indexOf(‚Self-hosted‘)>=0)reasons.push(’self-hosting capability‘);

}

document.getElementById(’step0′).classList.add(‚active‘);
updateProgress(0);
document.getElementById(‚budgetSlider‘).value=1;document.getElementById(‚budgetVal‘).textContent=’$50/mo‘;
}