{Array.from({length: total}).map((_,i)=>(

))}

); } function StepHead({ kicker, title }) { return (

{kicker}

{title}

); } function Chip({ label, on, onClick, icon }) { return ( ); } function PersonaStep({ sel, set }) { return (

{F.onboarding.personas.map(([name,flav,ic])=>{ const on = sel===name; return ( ); })}

); } function MultiStep({ options, sel, toggle, icons }) { return (

{options.map(o => toggle(o)} />)}

); } function ProofStep({ sel, toggle }) { return (

{F.onboarding.proofModes.map(([name,ic])=>{ const on = sel.includes(name); return ( ); })}

); } function WearableStep() { const [conn, setConn] = useState({}); return (

{F.onboarding.wearables.map(([name,status])=>{ const c = conn[name]; const blocked = status==='PROVIDER PENDING'; return (

{name}

{c?'CONNECTED':status}

); })}

); } function SafetyStep({ ack, setAck, exposure, setExposure }) { return (

{F.safety.points.map(([t,d],i)=>(

{t}

{d}

))}

↳ CONSTRAINTS + RED FLAGS SHAPE MISSION ASSIGNMENT

); } function CrewStep({ sel, set }) { const opts = [['JOIN HTD 30','1.2M athletes locked in','trophy'],['CREATE A CREW','Bring your people','crew'],['ENTER INVITE CODE','Join a private crew','lock']]; return (

{opts.map(([t,s,ic])=>{ const on = sel===t; return ( ); })}

); } function FirstMission() { const nav = useNav(); const t = F.today; return (

ASSIGNMENT GENERATED

YOUR FIRST MISSION

{t.label}

{t.title}

{t.subtitle}

{t.tags.map(x=>{x})}

DURATION

{t.duration}

DIFFICULTY

{t.difficulty.toFixed(1)}/10

PROOF

GPS + HR

YOUR 30-DAY ARC

{F.arc.weeks.map(([w, name, desc], i)=>(

{w}

{name}

{desc}

{i===0 && STARTS NOW}

))}

{F.arc.line.toUpperCase()}

); } function Onboarding() { const nav = useNav(); const [step, setStep] = useState(0); const [persona, setPersona] = useState('HYBRID ATHLETE'); const [goals, setGoals] = useState(['DAILY CONSISTENCY','MENTAL TOUGHNESS']); const [age, setAge] = useState('INTERMEDIATE'); const [diff, setDiff] = useState(7); const [equip, setEquip] = useState(['RUNNING','DUMBBELLS','GYM ACCESS']); const [constraints, setConstraints] = useState([]); const [proof, setProof] = useState(['GPS MAP','WEARABLE SNAPSHOT']); const [crewSel, setCrewSel] = useState('JOIN HTD 30'); const [safetyAck, setSafetyAck] = useState(false); const [exposure, setExposure] = useState(true); const [done, setDone] = useState(false); const tog = (arr,set)=>(v)=> set(arr.includes(v)?arr.filter(x=>x!==v):[...arr,v]); if (done) return ; const STEPS = [ { k:'OPERATING MODE · 01', t:'CHOOSE YOUR MODE', body: }, { k:'STANDARDS · 02', t:'SET YOUR STANDARDS', body:(

PRIMARY GOALS

TRAINING AGE

{F.onboarding.trainingAge.map(a=>setAge(a)} />)}

WEEKLY DIFFICULTY TARGET · {diff}/10

setDiff(+e.target.value)} className="htd-range" style={{ width:'100%' }} />

) }, { k:'EQUIPMENT · 03', t:'EQUIPMENT & LIMITS', body:(

AVAILABLE EQUIPMENT

CONSTRAINTS · PREVENT BAD ASSIGNMENTS

) }, { k:'SAFETY · 04', t:'SAFETY SCREENING', body:, gate:!safetyAck }, { k:'PROOF · 05', t:'PROOF PREFERENCES', body: }, { k:'READINESS · 06', t:'CONNECT WEARABLES', body: }, { k:'NETWORK · 07', t:'SEED THE PRESSURE', body: }, ]; const cur = STEPS[step]; const last = step === STEPS.length-1; return (

ONBOARDING

{!last && step>=4 && }

{cur.body}

); } window.HTDOnboarding = { Onboarding }; })();