function loadDashboard(){
  const el=document.getElementById('page-dashboard');
  el.innerHTML='<div class="page-header"><div><h2>Dashboard</h2><p>Overview of your apps</p></div></div><div class="stats-grid" id="stats-grid"></div><div style="display:grid;grid-template-columns:1fr 1fr;gap:20px" id="dash-panels"></div>';
  api('get_stats',{},'GET').then(r=>{
    if(r.status!=='success')return;
    const d=r.data;
    document.getElementById('stats-grid').innerHTML=`
      <div class="stat-card"><div class="stat-icon">📱</div><div class="stat-value">${d.total_apps}</div><div class="stat-label">Total Apps</div></div>
      <div class="stat-card"><div class="stat-icon">✅</div><div class="stat-value">${d.active_apps}</div><div class="stat-label">Active Apps</div></div>
      <div class="stat-card"><div class="stat-icon">📡</div><div class="stat-value">${d.total_api_calls}</div><div class="stat-label">API Calls</div></div>
      <div class="stat-card"><div class="stat-icon">🚫</div><div class="stat-value">${d.blocked_devices}</div><div class="stat-label">Blocked</div></div>
      <div class="stat-card"><div class="stat-icon">🔑</div><div class="stat-value">${d.active_api_keys}</div><div class="stat-label">API Keys</div></div>
      <div class="stat-card"><div class="stat-icon">📈</div><div class="stat-value">${d.api_calls_24h}</div><div class="stat-label">Calls (24h)</div></div>`;
    let recentHtml='<div class="card"><div class="card-title">📋 Recent Activity</div><div class="table-wrapper"><table><tr><th>Action</th><th>Details</th><th>Time</th></tr>';
    (d.recent_logs||[]).forEach(l=>{recentHtml+=`<tr><td><span class="badge badge-active">${l.action}</span></td><td style="max-width:200px;overflow:hidden;text-overflow:ellipsis">${l.details||''}</td><td style="white-space:nowrap">${l.created_at}</td></tr>`;});
    recentHtml+='</table></div></div>';
    let topHtml='<div class="card"><div class="card-title">🏆 Top Apps</div><div class="table-wrapper"><table><tr><th>App</th><th>Calls</th></tr>';
    (d.top_apps||[]).forEach(a=>{topHtml+=`<tr><td>${a.app_name}</td><td>${a.api_calls}</td></tr>`;});
    topHtml+='</table></div></div>';
    document.getElementById('dash-panels').innerHTML=recentHtml+topHtml;
  });
}
