diff --git a/firmware/esp32/overland-controller/overland-controller.ino b/firmware/esp32/overland-controller/overland-controller.ino
index 4c843d8..a7e721a 100644
--- a/firmware/esp32/overland-controller/overland-controller.ino
+++ b/firmware/esp32/overland-controller/overland-controller.ino
@@ -19,144 +19,208 @@ const char INDEX_HTML[] PROGMEM = R"rawliteral(
 <!doctype html>
 <html>
 <head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width,initial-scale=1">
-  <title>Overland Controller</title>
-  <style>
-    :root{--bg:#0b0f14;--card:#141b24;--muted:#7f8da3;--text:#eef4ff;--good:#48d17a;--warn:#ffd166;--bad:#ff5c7a;--line:#223044;--btn:#233249}
-    *{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif}
-    .wrap{max-width:980px;margin:0 auto;padding:18px}
-    .top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}
-    h1{font-size:22px;margin:0}.sub{color:var(--muted);font-size:13px;margin-top:4px}.pill{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:var(--muted);font-size:12px}
-    .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 10px 28px rgba(0,0,0,.22)}
-    .span6{grid-column:span 6}.span4{grid-column:span 4}.span12{grid-column:span 12}
-    .label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.big{font-size:42px;font-weight:750;margin:8px 0}.row{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
-    .v{font-weight:650}.good{color:var(--good)}.warn{color:var(--warn)}.bad{color:var(--bad)}.muted{color:var(--muted)}
-    .bar{height:10px;background:#0e141c;border-radius:999px;overflow:hidden;border:1px solid var(--line)}.fill{height:100%;background:linear-gradient(90deg,var(--good),#9be15d);width:0%}
-    button{width:100%;border:0;border-radius:12px;padding:12px;background:var(--btn);color:var(--text);font-weight:700;font-size:15px}
-    input{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px;background:#0f151d;color:var(--text);font-size:15px}
-    button.on{background:#17462a;color:#dfffea}button.off{background:#46202a;color:#ffe2e8}.relayBtns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
-    .tempList,.alarmList{display:grid;gap:8px;margin-top:12px}.item{display:flex;justify-content:space-between;gap:8px;background:#0f151d;border:1px solid var(--line);border-radius:12px;padding:10px}
-    @media(max-width:760px){.span6,.span4{grid-column:span 12}.big{font-size:36px}.wrap{padding:12px}}
-  </style>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Overland Controller</title>
+<style>
+:root{--bg:#0b0f14;--card:#141b24;--muted:#7f8da3;--text:#eef4ff;--good:#48d17a;--warn:#ffd166;--bad:#ff5c7a;--line:#223044;--btn:#233249}
+*{box-sizing:border-box}
+body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif}
+.wrap{max-width:980px;margin:0 auto;padding:14px 14px 90px}
+.top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}
+h1{font-size:21px;margin:0}.sub{color:var(--muted);font-size:13px;margin-top:4px}
+.pill{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:var(--muted);font-size:12px;white-space:nowrap}
+.tabs{position:fixed;left:0;right:0;bottom:0;background:#080c11;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);z-index:10}
+.tabbtn{border:0;border-radius:0;background:#080c11;color:var(--muted);padding:13px 8px;font-weight:800}
+.tabbtn.active{color:var(--text);background:#111923}
+.page{display:none}.page.active{display:block}
+.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
+.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 10px 28px rgba(0,0,0,.22)}
+.span4{grid-column:span 4}.span6{grid-column:span 6}.span12{grid-column:span 12}
+.label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
+.big{font-size:42px;font-weight:800;margin:8px 0}
+.medium{font-size:25px;font-weight:800;margin:6px 0}
+.row{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
+.v{font-weight:700}.good{color:var(--good)}.warn{color:var(--warn)}.bad{color:var(--bad)}.muted{color:var(--muted)}
+.bar{height:10px;background:#0e141c;border-radius:999px;overflow:hidden;border:1px solid var(--line)}
+.fill{height:100%;background:linear-gradient(90deg,var(--good),#9be15d);width:0%}
+button{width:100%;border:0;border-radius:12px;padding:12px;background:var(--btn);color:var(--text);font-weight:800;font-size:15px}
+button.on{background:#17462a;color:#dfffea}button.off{background:#46202a;color:#ffe2e8}
+input{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px;background:#0f151d;color:var(--text);font-size:15px}
+.list{display:grid;gap:8px;margin-top:12px}
+.item{display:flex;justify-content:space-between;gap:8px;background:#0f151d;border:1px solid var(--line);border-radius:12px;padding:10px}
+.btnrow{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
+.kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
+.kpi div{background:#0f151d;border:1px solid var(--line);border-radius:12px;padding:10px}
+.kpi .num{font-size:20px;font-weight:800;margin-top:4px}
+@media(max-width:760px){.span4,.span6{grid-column:span 12}.big{font-size:36px}.wrap{padding:12px 12px 82px}.kpi{grid-template-columns:1fr}}
+</style>
 </head>
 <body>
-  <div class="wrap">
-    <div class="top">
-      <div>
-        <h1 id="device">Overland Controller</h1>
-        <div class="sub">Local camp dashboard</div>
-      </div>
-      <div class="pill" id="conn">Connecting...</div>
+<div class="wrap">
+  <div class="top">
+    <div>
+      <h1 id="device">Overland Controller</h1>
+      <div class="sub" id="subtitle">Local camp dashboard</div>
     </div>
+    <div class="pill" id="conn">Connecting...</div>
+  </div>
 
+  <div id="overviewPage" class="page active">
     <div class="grid">
       <section class="card span6">
         <div class="label">Battery</div>
         <div class="big"><span id="soc">--</span>%</div>
         <div class="bar"><div class="fill" id="socbar"></div></div>
-        <div class="row"><span class="muted">Voltage</span><span class="v" id="voltage">--</span></div>
-        <div class="row"><span class="muted">Current</span><span class="v" id="current">--</span></div>
-        <div class="row"><span class="muted">Remaining</span><span class="v" id="ah">--</span></div>
-      </section>
-
-      <section class="card span6">
-        <div class="label">BMS</div>
-        <div class="big" id="bmsState">--</div>
-        <div class="row"><span class="muted">Battery temp</span><span class="v" id="battTemp">--</span></div>
-        <div class="row"><span class="muted">Cell delta</span><span class="v" id="delta">--</span></div>
-        <div class="row"><span class="muted">Cycles</span><span class="v" id="cycles">--</span></div>
-        <div class="row"><span class="muted">BMS Polling</span><span class="v" id="bmsEnabledText">--</span></div>
-        <div class="relayBtns">
-          <button onclick="setBmsEnabled(true)">Enable BMS</button>
-          <button class="off" onclick="setBmsEnabled(false)">Disable BMS</button>
+        <div class="kpi">
+          <div><div class="muted">Voltage</div><div class="num" id="voltage">--</div></div>
+          <div><div class="muted">Current</div><div class="num" id="current">--</div></div>
+          <div><div class="muted">Runtime</div><div class="num" id="runtime">--</div></div>
         </div>
       </section>
 
-      <section class="card span6">
-        <div class="label">Temperatures</div>
-        <div class="tempList" id="temps"></div>
-      </section>
-
       <section class="card span6">
         <div class="label">Relays</div>
-        <div class="tempList" id="relays"></div>
+        <div class="list" id="relays"></div>
       </section>
 
-      <section class="card span12">
-        <div class="label">WiFi</div>
-        <div class="sub">AP stays available at 192.168.4.1. STA networks are tried in order.</div>
-        <div class="tempList" style="margin-top:12px">
-          <input id="w1s" placeholder="Network 1 SSID">
-          <input id="w1p" placeholder="Network 1 password" type="password">
-          <input id="w1r" placeholder="Network 1 priority, lower = first" inputmode="numeric">
-          <input id="w2s" placeholder="Network 2 SSID">
-          <input id="w2p" placeholder="Network 2 password" type="password">
-          <input id="w2r" placeholder="Network 2 priority, lower = first" inputmode="numeric">
-          <input id="w3s" placeholder="Network 3 SSID">
-          <input id="w3p" placeholder="Network 3 password" type="password">
-          <input id="w3r" placeholder="Network 3 priority, lower = first" inputmode="numeric">
-          <button onclick="saveWifi()">Save WiFi</button>
-          <button onclick="connectWifi()">Connect Now</button>
-        </div>
+      <section class="card span6">
+        <div class="label">Temperatures</div>
+        <div class="list" id="temps"></div>
+      </section>
+
+      <section class="card span6">
+        <div class="label">Network / Alarms</div>
         <div class="row"><span class="muted">STA</span><span class="v" id="wifiSta">--</span></div>
         <div class="row"><span class="muted">STA IP</span><span class="v" id="wifiIp">--</span></div>
-      </section>
-
-      <section class="card span12">
-        <div class="label">Alarms / System</div>
-        <div class="alarmList" id="alarms"></div>
-        <div class="row"><span class="muted">Firmware</span><span class="v" id="fw">--</span></div>
-        <div class="row"><span class="muted">Uptime</span><span class="v" id="uptime">--</span></div>
+        <div class="list" id="alarmSummary"></div>
       </section>
     </div>
   </div>
 
+  <div id="batteryPage" class="page">
+    <div class="grid">
+      <section class="card span6">
+        <div class="label">Battery Detail</div>
+        <div class="medium" id="bmsState">--</div>
+        <div class="row"><span class="muted">Source</span><span class="v" id="battSource">--</span></div>
+        <div class="row"><span class="muted">Remaining</span><span class="v" id="ah">--</span></div>
+        <div class="row"><span class="muted">Capacity</span><span class="v" id="capacity">--</span></div>
+        <div class="row"><span class="muted">Battery temp</span><span class="v" id="battTemp">--</span></div>
+        <div class="row"><span class="muted">Cycles</span><span class="v" id="cycles">--</span></div>
+      </section>
+
+      <section class="card span6">
+        <div class="label">Cells</div>
+        <div class="row"><span class="muted">Cell count</span><span class="v" id="cellCount">--</span></div>
+        <div class="row"><span class="muted">Cell delta</span><span class="v" id="delta">--</span></div>
+        <div class="list" id="cells"></div>
+      </section>
+
+      <section class="card span12">
+        <div class="label">BMS Control</div>
+        <div class="row"><span class="muted">BMS Polling</span><span class="v" id="bmsEnabledText">--</span></div>
+        <div class="btnrow">
+          <button onclick="setBmsEnabled(true)">Enable BMS</button>
+          <button class="off" onclick="setBmsEnabled(false)">Disable BMS</button>
+        </div>
+      </section>
+    </div>
+  </div>
+
+  <div id="configPage" class="page">
+    <div class="grid">
+      <section class="card span12">
+        <div class="label">WiFi Config</div>
+        <div class="sub">AP remains available at 192.168.4.1. Lower priority number is tried first.</div>
+        <div class="list">
+          <input id="w1s" placeholder="Network 1 SSID">
+          <input id="w1p" placeholder="Network 1 password" type="password">
+          <input id="w1r" placeholder="Network 1 priority" inputmode="numeric">
+          <input id="w2s" placeholder="Network 2 SSID">
+          <input id="w2p" placeholder="Network 2 password" type="password">
+          <input id="w2r" placeholder="Network 2 priority" inputmode="numeric">
+          <input id="w3s" placeholder="Network 3 SSID">
+          <input id="w3p" placeholder="Network 3 password" type="password">
+          <input id="w3r" placeholder="Network 3 priority" inputmode="numeric">
+          <button onclick="saveWifi()">Save WiFi</button>
+          <button onclick="connectWifi()">Connect Now</button>
+        </div>
+      </section>
+
+      <section class="card span12">
+        <div class="label">System</div>
+        <div class="row"><span class="muted">Firmware</span><span class="v" id="fw">--</span></div>
+        <div class="row"><span class="muted">Uptime</span><span class="v" id="uptime">--</span></div>
+        <div class="row"><span class="muted">AP IP</span><span class="v" id="apIp">--</span></div>
+      </section>
+    </div>
+  </div>
+</div>
+
+<div class="tabs">
+  <button class="tabbtn active" onclick="showTab('overview')">Overview</button>
+  <button class="tabbtn" onclick="showTab('battery')">Battery</button>
+  <button class="tabbtn" onclick="showTab('config')">Config</button>
+</div>
+
 <script>
 const $=id=>document.getElementById(id);
 function fmt(n,d=1){return typeof n==="number"?n.toFixed(d):"--"}
 function temp(v){return typeof v==="number"?fmt(v,1)+"°F":"Offline"}
-function clsAlarm(v){return v?"bad":"good"}
+function runtimeText(b){
+  if(!b.connected) return "--";
+  if(typeof b.runtime_hours==="number" && b.runtime_hours>0) return fmt(b.runtime_hours,1)+"h";
+  if(typeof b.current==="number" && b.current<-.1 && typeof b.remaining_ah==="number"){
+    return fmt(b.remaining_ah/Math.abs(b.current),1)+"h";
+  }
+  return "Idle";
+}
+function showTab(name){
+  ["overview","battery","config"].forEach(t=>{
+    $(t+"Page").classList.toggle("active",t===name);
+  });
+  document.querySelectorAll(".tabbtn").forEach((b,i)=>{
+    b.classList.toggle("active",["overview","battery","config"][i]===name);
+  });
+}
 async function setBmsEnabled(enabled){
-  try{
-    await fetch("/config/bms",{
-      method:"POST",
-      headers:{"Content-Type":"application/json"},
-      body:JSON.stringify({enabled:enabled})
-    });
-    await fetch("/config/save",{method:"POST"});
-    await load();
-  }catch(e){}
+  await fetch("/config/bms",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({enabled})});
+  await fetch("/config/save",{method:"POST"});
+  await load();
 }
-
 async function relay(id,on){
-  try{
-    await fetch("/relay/set",{
-      method:"POST",
-      headers:{"Content-Type":"application/json"},
-      body:JSON.stringify({id:id,state:on})
-    });
-    await load();
-  }catch(e){}
+  await fetch("/relay/set",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({id,state:on})});
+  await load();
 }
 function render(data){
   $("conn").textContent="Live";
   $("conn").className="pill good";
   $("device").textContent=data.config?.device_name||"Overland Controller";
+
   const b=data.battery||{};
   $("soc").textContent=fmt(b.soc,0);
   $("socbar").style.width=Math.max(0,Math.min(100,b.soc||0))+"%";
   $("voltage").textContent=fmt(b.voltage,2)+" V";
   $("current").textContent=fmt(b.current,2)+" A";
+  $("runtime").textContent=runtimeText(b);
+  $("bmsState").textContent=b.connected?"BMS Online":"BMS Offline";
+  $("bmsState").className=b.connected?"medium good":"medium bad";
+  $("battSource").textContent=b.source||"--";
   $("ah").textContent=fmt(b.remaining_ah,1)+" Ah";
-  $("bmsState").textContent=b.connected?"Online":"Offline";
-  $("bmsState").className=b.connected?"big good":"big bad";
+  $("capacity").textContent=fmt(b.capacity_ah,1)+" Ah";
   $("battTemp").textContent=temp(b.temperature_f);
-  $("delta").textContent=(typeof b.cell_delta_mv==="number"?b.cell_delta_mv:"--")+" mV";
   $("cycles").textContent=b.cycle_count??"--";
+  $("cellCount").textContent=b.cell_count??"--";
+  $("delta").textContent=(typeof b.cell_delta_mv==="number"?b.cell_delta_mv:"--")+" mV";
+
   const bmsCfg=data.config?.bms||{};
   $("bmsEnabledText").textContent=bmsCfg.enabled ? "Enabled" : "Disabled";
 
+  $("cells").innerHTML=(b.cell_voltages||[]).map((v,i)=>`
+    <div class="item"><span>Cell ${i+1}</span><strong>${fmt(v,3)} V</strong></div>`).join("") ||
+    `<div class="item"><span>No cell data</span><strong class="muted">--</strong></div>`;
+
   $("temps").innerHTML=(data.temps||[]).map(t=>`
     <div class="item">
       <span>${t.name||t.id}</span>
@@ -165,21 +229,27 @@ function render(data){
 
   $("relays").innerHTML=(data.relays||[]).map(r=>`
     <div class="item" style="display:block">
-      <div style="display:flex;justify-content:space-between"><span>${r.name||r.id}</span><strong class="${r.state?"good":"muted"}">${r.state?"ON":"OFF"}</strong></div>
-      <div class="relayBtns">
+      <div style="display:flex;justify-content:space-between">
+        <span>${r.name||r.id}</span>
+        <strong class="${r.state?"good":"muted"}">${r.state?"ON":"OFF"}</strong>
+      </div>
+      <div class="btnrow">
         <button class="on" onclick="relay('${r.id}',true)">ON</button>
         <button class="off" onclick="relay('${r.id}',false)">OFF</button>
       </div>
     </div>`).join("");
 
   const alarms=data.alarms||{};
-  $("alarms").innerHTML=Object.keys(alarms).map(k=>`
-    <div class="item"><span>${k.replaceAll("_"," ")}</span><strong class="${clsAlarm(alarms[k])}">${alarms[k]?"ALARM":"OK"}</strong></div>`).join("");
+  const active=Object.keys(alarms).filter(k=>alarms[k]);
+  $("alarmSummary").innerHTML=active.length
+    ? active.map(k=>`<div class="item"><span>${k.replaceAll("_"," ")}</span><strong class="bad">ALARM</strong></div>`).join("")
+    : `<div class="item"><span>Alarms</span><strong class="good">OK</strong></div>`;
 
   const s=data.system||{};
   const n=data.network||{};
   $("wifiSta").textContent=n.sta_connected ? (n.sta_ssid||"connected") : "Not connected";
   $("wifiIp").textContent=n.sta_ip||"--";
+  $("apIp").textContent=n.ap_ip||"--";
   $("fw").textContent=(s.firmware_name||"--")+" "+(s.firmware_version||"");
   $("uptime").textContent=(s.uptime_seconds||0)+" sec";
 }
@@ -190,10 +260,8 @@ async function loadWifiConfig(){
     const nets=d.wifi?.networks||[];
     for(let i=0;i<3;i++){
       const n=nets[i]||{};
-      const s=$("w"+(i+1)+"s");
-      if(s) s.value=n.ssid||"";
-      const pr=$("w"+(i+1)+"r");
-      if(pr) pr.value=n.priority||i+1;
+      $("w"+(i+1)+"s").value=n.ssid||"";
+      $("w"+(i+1)+"r").value=n.priority||i+1;
     }
   }catch(e){}
 }
@@ -205,11 +273,7 @@ async function saveWifi(){
     const priority=parseInt($("w"+i+"r").value||i,10);
     if(ssid) networks.push({ssid,password,priority});
   }
-  await fetch("/config/wifi",{
-    method:"POST",
-    headers:{"Content-Type":"application/json"},
-    body:JSON.stringify({networks})
-  });
+  await fetch("/config/wifi",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({networks})});
   await loadWifiConfig();
   await load();
 }
