<!-- Calorie Burn Calculator Widget by BodyCalc Tool -->
<div id="cal-calc" style="max-width:400px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#27272a;color:#f4f4f5;border-radius:12px;padding:24px;border:1px solid #3f3f46">
  <h2 style="font-size:1.15rem;color:#f97316;text-align:center;margin:0 0 16px">Calorie Burn Calculator</h2>
  <label style="display:block;margin-bottom:10px;font-size:.85rem;color:#a1a1aa">Activity
    <select id="cal-act" onchange="calCalc()" style="width:100%;padding:9px 10px;margin-top:4px;border-radius:8px;border:1px solid #52525b;background:#18181b;color:#f4f4f5;font-size:.9rem">
      <option value="3.5">Walking (3.5 mph)</option><option value="5">Jogging (5 mph)</option><option value="7">Running (7 mph)</option><option value="9">Running (9 mph)</option><option value="4">Cycling (moderate)</option><option value="7">Cycling (vigorous)</option><option value="5">Swimming</option><option value="3">Weight Training</option><option value="4">HIIT Workout</option><option value="2.5">Yoga</option>
    </select>
  </label>
  <label style="display:block;margin-bottom:10px;font-size:.85rem;color:#a1a1aa">Weight (kg)
    <input type="number" id="cal-weight" value="70" step="0.1" oninput="calCalc()" style="width:100%;padding:9px 10px;margin-top:4px;border-radius:8px;border:1px solid #52525b;background:#18181b;color:#f4f4f5;font-size:.9rem">
  </label>
  <label style="display:block;margin-bottom:10px;font-size:.85rem;color:#a1a1aa">Duration (minutes)
    <input type="number" id="cal-dur" value="30" step="5" oninput="calCalc()" style="width:100%;padding:9px 10px;margin-top:4px;border-radius:8px;border:1px solid #52525b;background:#18181b;color:#f4f4f5;font-size:.9rem">
  </label>
  <button onclick="calCalc()" style="display:block;width:100%;margin-top:14px;padding:10px;font-size:.9rem;background:#f97316;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600">Calculate</button>
  <div style="margin-top:16px;background:#18181b;border-radius:10px;padding:16px">
    <div style="display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #3f3f46;font-size:.85rem;color:#a1a1aa"><span>Calories Burned</span><strong id="cal-burned" style="font-size:1.2rem;color:#fafafa">—</strong></div>
    <div style="display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:.85rem;color:#a1a1aa"><span>Per Hour</span><strong id="cal-hour" style="font-size:1.2rem;color:#fafafa">—</strong></div>
  </div>
  <div style="text-align:center;margin-top:12px;font-size:.75rem;color:#71717a">Powered by <a href="https://bodycalctool.com/" target="_blank" rel="noopener" style="color:#f97316;text-decoration:none">BodyCalc Tool</a></div>
</div>
<script>
function calCalc(){
  var met=+document.getElementById('cal-act').value,w=+document.getElementById('cal-weight').value,min=+document.getElementById('cal-dur').value;
  if(!w||!min)return;
  var pm=met*3.5*w/200;
  var f=function(n){return Math.round(n).toLocaleString()+' kcal'};
  document.getElementById('cal-burned').textContent=f(pm*min);
  document.getElementById('cal-hour').textContent=f(pm*60)+'/hr';
}
calCalc();
<\/script>