Altar’d Fitness Assessment
https://cdn.tailwindcss.com

body { font-family: 'Inter', sans-serif; color: #0f172a; }<br />
h1, h2, h3, .brand-font { font-family: 'Anton', sans-serif; letter-spacing: 0.05em; }<br />
.serif { font-family: 'Merriweather', serif; }<br />
.btn-option { transition: all 0.2s; }<br />
.btn-option:hover { transform: translateY(-2px); }<br />
.fade-in { animation: fadeIn 0.4s ease-out; }<br />
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }</p>

/* Custom Red for Branding */<br />
.bg-brand { background-color: #dc2626; }<br />
.text-brand { color: #dc2626; }<br />

// — DATA —
const dimensions = [
{ id: ‘spiritual’, title: ‘Spiritual’, icon: ”, qs: [“My private prayer life is consistent and honest.”, “I read scripture daily and apply it.”, “I have peace trusting God, not anxiety.”] },
{ id: ‘physical’, title: ‘Physical’, icon: ”, qs: [“I treat my body as a temple (no harmful substances).”, “I have the energy to meet my daily demands.”, “I get 7+ hours of sleep and observe a Sabbath.”] },
{ id: ‘intellectual’, title: ‘Intellectual’, icon: ”, qs: [“I feed my mind with truth, not just entertainment.”, “I can articulate a biblical worldview.”, “I am free from smartphone addiction.”] },
{ id: ’emotional’, title: ‘Emotional’, icon: ”, qs: [“I take responsibility for my own emotions.”, “I process grief and pain honestly.”, “I am characterized by gratitude, not grumbling.”] },
{ id: ‘relational’, title: ‘Relational’, icon: ”, qs: [“I have forgiven those who hurt me.”, “My friends sharpen me; they don’t drag me down.”, “My family feels cherished and led by me.”] },
{ id: ‘financial’, title: ‘Financial’, icon: ”, qs: [“I follow a written spending plan (budget).”, “I am transparent with my spouse/partner about money.”, “I view money as God’s resources to steward.”] },
{ id: ‘vocational’, title: ‘Vocational’, icon: ”, qs: [“I work with excellence, even when unseen.”, “I see my work as a contribution to the Kingdom.”, “I am known as a problem solver, not a complainer.”] }
];

// --- STATE ---<br />
let currentStep = 0;<br />
let scores = {}; // Format: "0-0": 5 (step-questionIndex: score)

// --- FUNCTIONS ---<br />
function renderStep() {<br />
    const dim = dimensions[currentStep];

    // Update Header<br />
    document.getElementById('header-title').innerHTML = `<br />
        ${dim.icon}<br />
        ${dim.title} Fitness<br />
    `;<br />
    document.getElementById('header-subtitle').innerText = `Dimension ${currentStep + 1} of ${dimensions.length}`;<br />
    document.getElementById('step-counter').innerText = `0${currentStep + 1}`;

    // Render Questions<br />
    const contentDiv = document.getElementById('content-area');<br />
    contentDiv.innerHTML = ''; // Clear previous

    dim.qs.forEach((q, idx) =&gt; {<br />
        const qDiv = document.createElement('div');<br />
        qDiv.className = "mb-8 animate-in";

        const label = document.createElement('p');<br />
        label.className = "font-bold text-lg mb-3 text-slate-800";<br />
        label.innerText = q;<br />
        qDiv.appendChild(label);

        const btnGroup = document.createElement('div');<br />
        btnGroup.className = "flex gap-1 md:gap-2";

        for (let i = 1; i  handleScore(idx, i);<br />
            btnGroup.appendChild(btn);<br />
        }<br />
        qDiv.appendChild(btnGroup);

        const labels = document.createElement('div');<br />
        labels.className = "flex justify-between text-xs text-slate-400 mt-2 px-1 uppercase tracking-wider font-bold";<br />
        labels.innerHTML = "<span>Strongly Disagree</span><span>Strongly Agree</span>";<br />
        qDiv.appendChild(labels);

        contentDiv.appendChild(qDiv);<br />
    });

    // Update Buttons<br />
    document.getElementById('btn-back').style.opacity = currentStep === 0 ? '0' : '1';<br />
    document.getElementById('btn-back').disabled = currentStep === 0;

    const isComplete = checkStepComplete();<br />
    const nextBtn = document.getElementById('btn-next');<br />
    nextBtn.disabled = !isComplete;<br />
    nextBtn.innerText = currentStep === dimensions.length - 1 ? "Get Protocol" : "Next Dimension";<br />
}

function handleScore(qIdx, val) {<br />
    scores[`${currentStep}-${qIdx}`] = val;<br />
    renderStep(); // Re-render to show active state<br />
}

function checkStepComplete() {<br />
    return [0, 1, 2].every(i =&gt; scores[`${currentStep}-${i}`] !== undefined);<br />
}

function nextStep() {<br />
    if (currentStep  0) {<br />
        currentStep--;<br />
        renderStep();<br />
    }<br />
}

function showResults() {<br />
    // Calculate Logic<br />
    const getDimScore = (stepIdx) =&gt; {<br />
        const sum = [0,1,2].reduce((acc, qIdx) =&gt; acc + (scores[`${stepIdx}-${qIdx}`] || 0), 0);<br />
        return (sum / 3).toFixed(1);<br />
    };

    const spiritual = getDimScore(0);<br />
    const physical = getDimScore(1);<br />
    const emotional = getDimScore(3);<br />
    const intellectual = getDimScore(2);

    let plan = {};<br />
    if (spiritual &lt; 5 || physical &lt; 5) {
        plan = {
            title: &quot;PHASE 1: THE ANCHOR&quot;,
            subtitle: &quot;Foundation Failure Detected&quot;,
            color: &quot;text-red-600&quot;,
            bg: &quot;bg-red-50&quot;,
            border: &quot;border-red-600&quot;,
            msg: &quot;Your foundation is cracked. You cannot build a marriage or career on this. We must stop everything to stabilize the vessel (Spirit &amp; Body).&quot;,
            tasks: [&quot;Day 1: The Purge (No Alcohol/Sugar)&quot;, &quot;Day 3: The Silence (No Radio)&quot;, &quot;Daily: 05:30 Wake Up&quot;]
        };
    } else if (emotional &lt; 5 || intellectual &lt; 5) {
        plan = {
            title: &quot;PHASE 2: THE HELM&quot;,
            subtitle: &quot;Guidance System Failure&quot;,
            color: &quot;text-orange-600&quot;,
            bg: &quot;bg-orange-50&quot;,
            border: &quot;border-orange-600&quot;,
            msg: &quot;Your body is moving, but your mind is drifting. You cannot lead your family until you retrain your thoughts.&quot;,
            tasks: [&quot;Day 8: Media Audit&quot;, &quot;Day 10: Happy Heart Check&quot;, &quot;Daily: Phone away at 7PM&quot;]
        };
    } else {
        plan = {
            title: &quot;PHASE 3: THE MISSION&quot;,
            subtitle: &quot;Deployment Ready&quot;,
            color: &quot;text-blue-600&quot;,
            bg: &quot;bg-blue-50&quot;,
            border: &quot;border-blue-600&quot;,
            msg: &quot;Your foundation is holding. It is time to secure the perimeter (Family/Finance) and launch the attack (Vocation).&quot;,
            tasks: [&quot;Day 15: Financial Autopsy&quot;, &quot;Day 23: 10-Year Vision&quot;, &quot;Daily: The &#039;Who to Help&#039; Ask&quot;]
        };
    }

    // Render Results
    const container = document.getElementById(&#039;app-container&#039;);
    container.innerHTML = `

`;
}

// Initialize
renderStep();