Spaces:

SZLHOLDINGS
/

a11oy

Running

File size: 28,052 Bytes

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>a11oy — Proven Energy Engine · SZL Holdings</title>
<meta name="description" content="Live, honest view of the agentic-GPU engine: sovereign GPU posture (NVIDIA RTX 5000 @ betterwithage), the Bekenstein-gated energy+information budget ledger (F19/TH6, proven inequality), and the off-peak power window. Energy figures are SAMPLE/ESTIMATE — no real power meter is wired. No free-energy claims."/>
<!-- 0 runtime CDN (doctrine v11): system fonts only — no Google Fonts, no external assets. -->
<script type="importmap">
{
  "imports": {
    "three": "/static/3d/vendor/three/three.module.min.js",
    "three/webgpu": "/static/3d/vendor/three/three.webgpu.min.js",
    "three/addons/": "/static/3d/vendor/three/addons/"
  }
}
</script>
<style>
:root{
  --ground:#0a0a0a; --panel:#0e0e0e; --panel2:#080808; --rail:#0b0b0b;
  --gold:#c9b787; --gold-bright:#d6c69a;
  --teal:#5fb3a3; --teal-soft:rgba(95,179,163,0.10);
  --cream:#f5f5f5; --paragraph:#9a9a9a; --muted:#888; --dim:#555;
  --gold-line:rgba(201,183,135,0.15); --gold-soft:rgba(201,183,135,0.04);
  --teal-line:rgba(95,179,163,0.22);
  --live:#5a8a6e; --err:#b06a5a; --warn:#c9a05f;
  --green:#39d98a; --yellow:#f5c451; --red:#ff6a5a; --blue:#5bc8ff;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --display:ui-sans-serif,system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--ground);color:var(--cream);font-family:var(--display);-webkit-font-smoothing:antialiased;}
.mono{font-family:var(--mono);}
a{color:inherit;text-decoration:none;}
.topbar{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:.5rem 1.1rem;background:rgba(10,10,10,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--gold-line);font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);}
.topbar .sep{color:var(--dim);}
.topbar .live{display:inline-flex;align-items:center;gap:.4rem;color:var(--cream);}
.live-dot{width:6px;height:6px;border-radius:50%;background:var(--live);box-shadow:0 0 6px var(--live);animation:pulse 2.2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.35;}}
.switcher{margin-left:auto;display:flex;align-items:center;gap:.3rem;}
.flag{padding:.22rem .55rem;border-radius:6px;border:1px solid transparent;color:var(--muted);transition:.15s;}
.flag:hover{color:var(--cream);border-color:var(--gold-line);background:var(--gold-soft);}
.flag.active{color:var(--ground);background:var(--gold);border-color:var(--gold);font-weight:600;}
.wrap{max-width:1320px;margin:0 auto;padding:1.6rem 1.4rem 4rem;}
h1{font-size:1.7rem;font-weight:600;margin:.2rem 0 .3rem;letter-spacing:-.01em;}
.badge{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);border:1px solid var(--teal-line);background:var(--teal-soft);padding:.25rem .6rem;border-radius:5px;margin-left:.4rem;vertical-align:middle;}
.lede{color:var(--paragraph);font-size:.95rem;line-height:1.65;max-width:1180px;margin:.6rem 0 1rem;}
.lede b{color:var(--cream);font-weight:600;}
.econ{border:1px solid var(--gold-line);background:var(--gold-soft);border-radius:8px;padding:.7rem 1rem;margin:.4rem 0 1.2rem;font-family:var(--mono);font-size:12px;color:var(--paragraph);line-height:1.7;}
.econ .k{color:var(--gold);text-transform:uppercase;letter-spacing:.08em;font-size:10px;}
.econ .hi{color:var(--teal);}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:0 0 1.2rem;}
.card{border:1px solid var(--gold-line);background:var(--panel);border-radius:8px;padding:.85rem 1rem;}
.card .lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);}
.card .big{font-size:1.5rem;font-weight:600;margin:.35rem 0 .15rem;color:var(--teal);}
.card .sub{font-family:var(--mono);font-size:10.5px;color:var(--muted);}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.panel{border:1px solid var(--gold-line);background:var(--panel);border-radius:10px;padding:1rem 1.1rem;margin-bottom:1rem;}
.panel h2{font-size:1.05rem;font-weight:600;margin:0 0 .2rem;display:flex;align-items:center;justify-content:space-between;}
.panel h2 .meta{font-family:var(--mono);font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;}
.kv{font-family:var(--mono);font-size:12px;color:var(--paragraph);line-height:1.9;margin-top:.5rem;}
.kv .k{color:var(--dim);display:inline-block;min-width:128px;}
.kv .v{color:var(--cream);}
.pill{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:.18rem .5rem;border-radius:5px;border:1px solid var(--gold-line);}
.pill.green{color:var(--green);border-color:rgba(57,217,138,.4);background:rgba(57,217,138,.08);}
.pill.yellow{color:var(--yellow);border-color:rgba(245,196,81,.4);background:rgba(245,196,81,.08);}
.pill.red{color:var(--red);border-color:rgba(255,106,90,.4);background:rgba(255,106,90,.08);}
.pill.dim{color:var(--muted);}
.sample{font-family:var(--mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--warn);border:1px solid var(--warn);border-radius:4px;padding:.05rem .3rem;margin-left:.35rem;white-space:nowrap;}
.simnote{border:1px solid var(--warn);background:rgba(201,160,95,.06);border-radius:8px;padding:.7rem .9rem;margin-top:.8rem;font-family:var(--mono);font-size:11px;color:#d8c39a;line-height:1.65;}
.simnote b{color:var(--warn);}
.bek{margin-top:.7rem;}
.bek-bar{position:relative;height:30px;border:1px solid var(--gold-line);border-radius:6px;background:#0c0c0c;overflow:hidden;}
.bek-fill{position:absolute;top:0;left:0;bottom:0;background:linear-gradient(90deg,rgba(95,179,163,.55),rgba(95,179,163,.9));transition:width .4s;}
.bek-fill.over{background:linear-gradient(90deg,rgba(255,106,90,.55),rgba(255,106,90,.95));}
.bek-ceiling{position:absolute;top:-3px;bottom:-3px;right:0;width:2px;background:var(--gold);box-shadow:0 0 6px var(--gold);}
.bek-lbl{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10.5px;color:var(--muted);margin-top:.4rem;}
.win{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.6rem;}
.win .cell{border:1px solid var(--gold-line);border-radius:7px;padding:.6rem .7rem;text-align:center;font-family:var(--mono);}
.win .cell .t{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);}
.win .cell .v{font-size:1.05rem;font-weight:600;margin-top:.25rem;color:var(--muted);}
.win .cell.on{border-color:var(--teal-line);background:var(--teal-soft);}
.win .cell.on .v{color:var(--teal);}
table{width:100%;border-collapse:collapse;margin-top:.6rem;font-family:var(--mono);font-size:11px;}
th,td{text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--gold-line);white-space:nowrap;}
th{color:var(--dim);font-weight:500;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;}
td{color:var(--paragraph);}
td.ok{color:var(--green);}
td.bad{color:var(--red);}
.scrollx{overflow-x:auto;}
.empty{font-family:var(--mono);font-size:11.5px;color:var(--muted);border:1px dashed var(--gold-line);border-radius:8px;padding:.9rem 1rem;margin-top:.6rem;line-height:1.6;}
.footnote{margin-top:1.6rem;font-family:var(--mono);font-size:10.5px;color:var(--muted);line-height:1.7;border-top:1px solid var(--gold-line);padding-top:.9rem;}
.footnote b{color:var(--cream);}
@media(max-width:980px){.cards{grid-template-columns:repeat(2,1fr);}.grid2{grid-template-columns:1fr;}}
</style>
</head>
<body>
<div class="topbar">
  <span>SZL HOLDINGS</span><span class="sep">/</span><span>a11oy</span><span class="sep">/</span><span>PROVEN ENERGY ENGINE</span>
  <span class="sep">/</span><span class="live"><span class="live-dot"></span><span id="livelbl">LIVE · RT</span></span>
  <span class="switcher">
    <a class="flag active" href="/energy">Energy</a>
    <a class="flag" href="/fleet-c2">Fleet C2</a>
    <a class="flag" href="/living-anatomy">Living Anatomy</a>
    <a class="flag" href="/code">Code</a>
  </span>
</div>
<div class="wrap">
  <h1>Proven Energy Engine<span class="badge">honest GPU posture · Bekenstein-gated budget (F19/TH6) · SAMPLE energy</span></h1>
  <p class="lede">The agentic-GPU engine, live. <b>sovereign:true</b> only when the local GPU actually serves (NVIDIA RTX 5000 @ betterwithage, Ollama/vLLM) — read from <b>/code/healthz</b>, else router fallback. Every receipt clears the <b>Bekenstein gate</b> (<code>shannon_bits ≤ output_bytes·8</code>, F19/TH6 — a <b>proven inequality</b>) and the ledger sums it. <b>Energy figures are SAMPLE/ESTIMATE</b> — no real power meter is wired, so joules are labeled, never presented as measured. <b>No free-energy / perpetual-motion claims.</b></p>
  <div class="econ"><span class="k">Why it matters:</span> sovereignty and energy efficiency are <span class="hi">measured-or-labeled, never assumed</span> — the half-state (claiming more energy or sovereignty than is real) is the only unacceptable outcome, so this surface refuses to over-claim.</div>
    <div class="subnav" style="display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin:.1rem 0 1.2rem;">
    <span style="font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:.2rem;">Explore live:</span>
    <a class="flag" href="/energy-ops" style="border-color:var(--gold-line);background:var(--gold-soft);">&#9656; Live Energy Dashboard</a>
    <a class="flag" href="/energy-3d" style="border-color:var(--gold-line);background:var(--gold-soft);">&#9670; 3D Holographic View</a>
    <a class="flag" href="/energy-harvest" style="border-color:var(--gold-line);background:var(--gold-soft);">&#9638; Grid Energy Harvest</a>
  </div>
  <div class="cards">
    <div class="card"><div class="lbl">Sovereign</div><div class="big" id="c_sov">—</div><div class="sub">local GPU serving?</div></div>
    <div class="card"><div class="lbl">Tasks gated</div><div class="big" id="c_tasks" style="color:var(--blue)">—</div><div class="sub">Bekenstein ledger</div></div>
    <div class="card"><div class="lbl">All within bound</div><div class="big" id="c_within" style="color:var(--green)">—</div><div class="sub">F19/TH6 gate</div></div>
    <div class="card"><div class="lbl">Total joules <span class="sample">sample</span></div><div class="big" id="c_joules" style="color:var(--warn)">—</div><div class="sub">estimate · not metered</div></div>
  </div>
  <div class="grid2">
    <div class="panel">
      <h2>(1) GPU engine status<span class="meta">/code/healthz</span></h2>
      <div class="kv" id="hz_kv" style="display:none">
        <div><span class="k">Hardware</span><span class="v">NVIDIA RTX 5000 @ betterwithage</span></div>
        <div><span class="k">Sovereign</span><span class="v" id="hz_sov">—</span></div>
        <div><span class="k">Inference path</span><span class="v" id="hz_inf">—</span></div>
        <div><span class="k">Backend / mode</span><span class="v" id="hz_back">—</span></div>
        <div><span class="k">GPU</span><span class="v" id="hz_gpu">—</span></div>
        <div><span class="k">Doctrine</span><span class="v" id="hz_doc">—</span></div>
        <div><span class="k">Posture</span><span class="v" id="hz_posture">—</span></div>
      </div>
      <div class="empty" id="hz_empty">/code/healthz unreachable — posture cannot be confirmed. Showing no sovereignty claim (honest empty-state).</div>
    </div>
    <div class="panel">
      <h2>(4) Power window<span class="meta">off-peak clock</span></h2>
      <div class="win" id="win">
        <div class="cell" data-w="cheap"><div class="t">Cheap (off-peak)</div><div class="v">—</div></div>
        <div class="cell" data-w="normal"><div class="t">Normal</div><div class="v">—</div></div>
        <div class="cell" data-w="dear"><div class="t">Dear (peak)</div><div class="v">—</div></div>
      </div>
      <div class="simnote"><b>Client-side estimate:</b> the window (cheap / normal / dear) is computed from <b>your local clock</b> as an off-peak heuristic (cheap before 08:00 / after 20:00) — it mirrors the engine's off-peak provider but is <b>not</b> a live tariff feed. No price is claimed as metered.</div>
    </div>
  </div>
  <div class="panel">
    <h2>(3) Bekenstein bound<span class="meta">Σ shannon_bits vs Σ (output_bytes · 8)</span></h2>
    <div class="bek" id="bek" style="display:none">
      <div class="bek-bar"><div class="bek-fill" id="bek_fill" style="width:0%"></div><div class="bek-ceiling" title="ceiling = Σ output_bytes·8"></div></div>
      <div class="bek-lbl">
        <span>Σ shannon_bits: <span id="bek_sh" style="color:var(--teal)">—</span></span>
        <span>ceiling Σ n·8: <span id="bek_ceil" style="color:var(--gold)">—</span> · <span id="bek_pct">—</span></span>
      </div>
      <div class="simnote" id="bek_note"><b>Proven inequality (F19/TH6):</b> empirical byte-entropy is always ≤ n·8, so the fill never exceeds the gold ceiling unless an upstream over-claim occurs (then it turns red). Kernel-checked in EnergyBudgetWitness.lean (0-sorry).</div>
    </div>
    <div class="empty" id="bek_empty">/v1/energy/budget unreachable — no bound to plot (honest empty-state).</div>
  </div>
  <div class="panel">
    <h2>(2) Energy-budget ledger<span class="meta">/v1/energy/budget · per-task receipts</span></h2>
    <div class="scrollx" id="led_wrap" style="display:none">
      <table>
        <thead><tr>
          <th>task_hash</th><th>bytes</th><th>shannon_bits</th><th>bekenstein n·8</th><th>within</th><th>energy_source</th><th>joules_est <span class="sample">sample</span></th><th>ts</th>
        </tr></thead>
        <tbody id="led_body"></tbody>
      </table>
    </div>
    <div class="empty" id="led_empty">No per-task receipts available. The in-memory ledger resets on process restart; track a task via <code>/v1/energy/budget?bytes=…</code> to populate it. Showing summary only if present.</div>
    <div class="simnote"><b>joules_est is SAMPLE/ESTIMATE</b> — no real power meter is wired (doctrine v11/v12). The <b>within</b> check is the real, proven F19/TH6 gate: <code>shannon_bits ≤ output_bytes·8</code>.</div>
  </div>
  <div class="panel" id="frugality_panel">
    <h2>Frugality &rarr; energy <span class="meta">a11oy Restraint · less code = fewer tokens = fewer joules</span></h2>
    <div class="cards" style="margin-bottom:.4rem;">
      <div class="card"><div class="lbl">Frugality rate</div><div class="big" id="fe_rate" style="color:var(--teal)">—</div><div class="sub" id="fe_dec">decisions that cut code</div></div>
      <div class="card"><div class="lbl">Lines saved</div><div class="big" id="fe_loc" style="color:var(--gold)">—</div><div class="sub">cumulative (MODELED)</div></div>
      <div class="card"><div class="lbl">Tokens saved</div><div class="big" id="fe_tok" style="color:var(--cream)">—</div><div class="sub">≈ lines × tokens/LOC</div></div>
      <div class="card"><div class="lbl">Joules saved <span id="fe_jlbl" class="sample">sample</span></div><div class="big" id="fe_j" style="color:var(--warn)">—</div><div class="sub" id="fe_jpt">J/token —</div></div>
    </div>
    <div class="simnote" id="fe_note"><b>Joules-saved = tokens-saved × J/token.</b> The J/token is the LIVE on-box MEASURED figure ONLY when the sovereign GPU probe is live (label MEASURED); otherwise our honest SAMPLE constant — same single source of truth as the rest of this page. Lines-saved is OUR MODELED ladder figure, never Ponytail's measured numbers. Ladder adopted from <a href="https://github.com/DietrichGebert/ponytail" target="_blank" rel="noopener">Ponytail (MIT)</a>; governed (signed receipts + Λ). See the full bench at <a href="/restraint-bench">/restraint-bench</a>.</div>
  </div>
  <div class="panel" id="energy3d_panel">
    <h2>(5) Holographic 3D Energy Ops<span class="meta" id="e3d_count">16-19 live 3D graphs · 0 CDN · WebGPU/WebGL2</span>
      <button class="flag" id="e3d_toggle" style="float:right;font-size:11px;cursor:pointer;">Enable 3D</button>
    </h2>
    <div class="simnote" style="margin-bottom:.6rem">
      The full <b>press-play holographic showcase</b>: 16-19 distinct live 3D graphs (measured-joules orbital, negative-price
      column field, compute-fabric hex, per-job particle stream, signed-receipt hash-chain, joules reservoir vs MODELED
      1-day ceiling, throughput surface, earnings gauge, scale-out hologram, node-health ring, and more) — each wired by
      <code>szl3d_live.poll</code> to a real a11oy energy endpoint
      (<code>/energy/operator/status</code>, <code>/energy/ledger</code>, <code>/energy/projection</code>,
      <code>/harvest/posture</code>, <code>/compute-pool</code>) and carrying its doctrine <b>honesty chip</b>
      (MEASURED / MODELED / SAMPLE / STRUCTURAL-ONLY). Nothing is fabricated: on 404 a graph shows
      <b>NO-LIVE-DATA</b>, on a degraded payload it shows <b>DEGRADED</b> — never a fake number. Same shared module as
      <a href="/holographic">/holographic</a> and <code>/energy-holographic</code>. WebGPU with WebGL2 fallback.
    </div>
    <div id="energy3d_mount" style="width:100%;height:520px;border:1px solid var(--gold-line);border-radius:10px;background:#05070d;display:none;position:relative;overflow:hidden;"></div>
    <div class="empty" id="e3d_off">3D is off (default). Click <b>Enable 3D</b> to boot the holographic showcase on the live energy endpoints. The 2D panels above are always available as the complete non-3D fallback.</div>
    <div class="meta mono" style="color:var(--muted);font-size:10px;margin-top:.5rem;">
      0 runtime CDN · three.js r170 vendored same-origin · WebGPU→WebGL2 fallback · every value MEASURED-or-labeled (never fabricated) · revenue MODELED until a real charge clears · Λ = Conjecture 1 · trust &lt;100%.
    </div>
  </div>

  <div class="footnote">
    <b>Honest by design.</b> Posture is <b>derived</b> from /code/healthz: GREEN only when <code>sovereign:true</code> AND <code>inference=self-hosted-gpu</code>; MAINTENANCE when reachable but on router fallback; DOWN when unreachable — sovereignty is <b>never assumed</b>. The Bekenstein gate is <b>F19 (locked-8) / TH6</b>, a machine-checked inequality (EnergyBudgetWitness.lean, 0-sorry). <b>All energy figures are SAMPLE/ESTIMATE</b> until a real meter is wired. <b>No free-energy / perpetual-motion claims.</b> Λ trust = <b>Conjecture 1</b> (machine-checked FALSE — advisory, never a theorem). Coherence governor C(t)=C₀·e^(−t/τ_c) via /v1/qbio/coherence is EXPERIMENTAL. <b>0 runtime CDN</b> — system fonts and all 3D libs served same-origin from /static/3d/vendor.
  </div>
</div>
<script>
const A="/api/a11oy";
const $=id=>document.getElementById(id);
async function getJSON(u,opt){try{const r=await fetch(u,opt);if(!r.ok)return null;return await r.json();}catch(e){return null;}}
function esc(s){return String(s==null?'':s).replace(/[&<>"']/g,function(c){return({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]||c);});}
function fmt(n,d){if(n==null||isNaN(n))return '—';const x=Number(n);return d!=null?x.toFixed(d):String(x);}

// (1) GPU engine status — posture DERIVED honestly (never assume sovereign)
function derivePosture(hz){
  if(!hz)return {cls:'red',txt:'DOWN — healthz unreachable'};
  const sov=hz.sovereign===true, inf=String(hz.inference||'');
  if(sov && inf==='self-hosted-gpu')return {cls:'green',txt:'GREEN — sovereign GPU serving'};
  return {cls:'yellow',txt:'MAINTENANCE — router fallback (not sovereign)'};
}
async function loadHealthz(){
  const hz=await getJSON(A+"/code/healthz");
  if(!hz){
    $('hz_kv').style.display='none'; $('hz_empty').style.display='block';
    $('c_sov').textContent='—'; $('c_sov').style.color='var(--muted)';
    $('livelbl').textContent='FALLBACK';
    return;
  }
  $('hz_empty').style.display='none'; $('hz_kv').style.display='block';
  const sov=hz.sovereign===true;
  $('hz_sov').innerHTML=`<span class="pill ${sov?'green':'yellow'}">${sov?'true':'false'}</span>`;
  $('hz_inf').textContent=esc(hz.inference||'—');
  $('hz_back').textContent=esc((hz.backend||'—')+' / '+(hz.mode||'—'));
  $('hz_gpu').textContent=esc(hz.gpu!=null?(typeof hz.gpu==='object'?JSON.stringify(hz.gpu):hz.gpu):'(not reported by healthz)');
  $('hz_doc').textContent=esc(hz.doctrine||'—');
  const p=derivePosture(hz);
  $('hz_posture').innerHTML=`<span class="pill ${p.cls}">${esc(p.txt)}</span>`;
  $('c_sov').textContent=sov?'YES':'NO';
  $('c_sov').style.color=sov?'var(--green)':'var(--yellow)';
  $('livelbl').textContent=(hz.mode==='live')?'LIVE · RT':'STUB';
}

// (4) power window — client-side off-peak heuristic (mirrors OffPeakProvider)
function offPeakWindow(d){const h=d.getHours();return (h<8||h>=20)?'cheap':'normal';}
function loadWindow(){
  const now=new Date();
  const w=offPeakWindow(now);
  const hh=String(now.getHours()).padStart(2,'0')+':'+String(now.getMinutes()).padStart(2,'0');
  document.querySelectorAll('#win .cell').forEach(c=>{
    const on=c.dataset.w===w; c.classList.toggle('on',on);
    c.querySelector('.v').textContent=on?('NOW · '+hh):'—';
  });
}

// (2)+(3) Bekenstein ledger + bound visual
function renderBek(sumSh,sumCeil){
  if(sumCeil==null||sumCeil<=0){$('bek').style.display='none';$('bek_empty').style.display='block';return;}
  $('bek_empty').style.display='none'; $('bek').style.display='block';
  const pct=sumSh/sumCeil; const over=sumSh>sumCeil+1e-9;
  const f=$('bek_fill');
  f.style.width=Math.min(pct,1)*100+'%';
  f.classList.toggle('over',over);
  $('bek_sh').textContent=fmt(sumSh,1);
  $('bek_ceil').textContent=fmt(sumCeil,0);
  $('bek_pct').textContent=(pct*100).toFixed(1)+'% of ceiling'+(over?' — OVER (upstream over-claim!)':'');
}
function ledgerRows(b){
  // accept several shapes: explicit ledger/receipts array, single receipt, else none
  if(Array.isArray(b.ledger))return b.ledger;
  if(Array.isArray(b.receipts))return b.receipts;
  if(b.receipt)return [b.receipt];
  return [];
}
async function loadBudget(){
  const b=await getJSON(A+"/v1/energy/budget");
  if(!b){
    $('led_wrap').style.display='none'; $('led_empty').style.display='block';
    $('bek').style.display='none'; $('bek_empty').style.display='block';
    $('c_tasks').textContent='—'; $('c_within').textContent='—'; $('c_joules').textContent='—';
    return;
  }
  const rows=ledgerRows(b);
  // summary cards (prefer explicit summary fields; fall back to row sums)
  const s=b.summary||b;
  const tc=s.task_count!=null?s.task_count:rows.length;
  $('c_tasks').textContent=tc;
  const allWithin=(s.all_within_bound!=null)?s.all_within_bound
                  :(rows.length?rows.every(r=>r.within_bound):null);
  $('c_within').textContent=allWithin==null?'—':(allWithin?'YES':'NO');
  $('c_within').style.color=allWithin===false?'var(--red)':'var(--green)';
  const tj=(s.total_joules_est!=null)?s.total_joules_est
           :rows.reduce((a,r)=>a+(Number(r.joules_est)||0),0);
  $('c_joules').textContent=fmt(tj,2);
  // bound visual
  const sumSh=(s.total_shannon_bits!=null)?s.total_shannon_bits
              :rows.reduce((a,r)=>a+(Number(r.shannon_bits)||0),0);
  const sumCeil=(s.total_bekenstein_bound_bits!=null)?s.total_bekenstein_bound_bits
              :rows.reduce((a,r)=>a+(Number(r.bekenstein_bound_bits)||0),0);
  renderBek(sumSh,sumCeil);
  // ledger table
  if(!rows.length){$('led_wrap').style.display='none'; $('led_empty').style.display='block'; return;}
  $('led_empty').style.display='none'; $('led_wrap').style.display='block';
  $('led_body').innerHTML=rows.map(r=>{
    const wb=r.within_bound===true;
    return `<tr>
      <td title="${esc(r.task_hash||'')}">${esc(String(r.task_hash||'—').slice(0,16))}…</td>
      <td>${esc(r.output_bytes??'—')}</td>
      <td>${fmt(r.shannon_bits,1)}</td>
      <td>${esc(r.bekenstein_bound_bits??'—')}</td>
      <td class="${wb?'ok':'bad'}">${r.within_bound==null?'—':(wb?'✓':'✗')}</td>
      <td>${esc(r.energy_source||'—')}</td>
      <td>${fmt(r.joules_est,3)}</td>
      <td>${esc(r.ts||'—')}</td>
    </tr>`;
  }).join('');
}

async function loadFrugalityEnergy(){
  const e=await getJSON(A+"/v1/restraint/energy");
  if(!e){return;}
  const c=e.cumulative||{}; const jpt=e.j_per_token||{};
  $('fe_rate').textContent=c.frugality_rate!=null?(c.frugality_rate*100).toFixed(0)+'%':'—';
  $('fe_dec').textContent=(c.decisions_that_saved!=null?c.decisions_that_saved:'—')+' / '+(c.decisions!=null?c.decisions:'—')+' decisions cut code';
  $('fe_loc').textContent=c.cumulative_lines_saved!=null?c.cumulative_lines_saved:'—';
  $('fe_tok').textContent=c.cumulative_tokens_saved!=null?fmt(c.cumulative_tokens_saved,0):'—';
  $('fe_j').textContent=c.cumulative_joules_saved_total!=null?fmt(c.cumulative_joules_saved_total,0)+' J':'—';
  const lbl=String(c.joules_label||'SAMPLE').toUpperCase();
  const jb=$('fe_jlbl');
  jb.textContent=lbl.toLowerCase();
  jb.style.color=(lbl==='MEASURED')?'var(--green)':'var(--yellow)';
  $('fe_jpt').textContent='J/token '+(jpt.j_per_token!=null?fmt(jpt.j_per_token,4):'—')+' · '+String(jpt.label||'SAMPLE').toUpperCase();
}
async function loadAll(){loadWindow();await Promise.all([loadHealthz(),loadBudget(),loadFrugalityEnergy()]);}
loadAll();
setInterval(loadAll,30000);
</script>

<!-- (5) Holographic 3D Energy Ops: the SHARED 16-19 graph showcase, lazy-booted on toggle.
     0 runtime CDN: three.js r170 + szl3d toolkit served same-origin via the importmap above.
     The exact same module renders on /holographic and /energy-holographic. -->
<script type="module">
const mount=document.getElementById('energy3d_mount');
const offEl=document.getElementById('e3d_off');
const toggle=document.getElementById('e3d_toggle');
const countEl=document.getElementById('e3d_count');
let started=false, stage=null, showcase=null, mods=null;

async function loadMods(){
  if(mods) return mods;
  const [szl3d, live, label, THREE, sc] = await Promise.all([
    import("/static/3d/szl3d/szl3d_boot.js").then(m=>m.default||m),
    import("/static/3d/szl3d/szl3d_live.js"),
    import("/static/3d/szl3d/szl3d_label.js"),
    import("three"),
    import("/static/3d/energy_showcase/showcase.js"),
  ]);
  mods={szl3d, live, label, THREE, buildShowcase: sc.buildShowcase};
  return mods;
}

async function start(){
  if(started) return; started=true;
  mount.style.display='block'; offEl.style.display='none';
  toggle.textContent='Disable 3D'; toggle.classList.add('active');
  try{
    const m=await loadMods();
    stage=await m.szl3d.boot(mount,{ bloom:{strength:0.8,radius:0.5,threshold:0.18}, cameraPos:[0,5,22] });
    stage.start();
    const ctx={ stage, container: mount, live: m.live, label: m.label, THREE: m.THREE, szl3d: m.szl3d };
    showcase=m.buildShowcase(ctx);
    if(countEl) countEl.textContent=showcase.count+' live 3D graphs (' + stage.backend.toUpperCase() + ', 0 CDN)';
    window.__SZL_ENERGY_SHOWCASE__=showcase;
  }catch(e){
    if(console) console.error('[energy3d] boot failed:',e);
    mount.innerHTML='<div style="padding:24px;color:#9fb1bf;font:13px ui-monospace,monospace;text-align:center">3D unavailable on this device. All values remain available as JSON at the energy endpoints; the 2D panels above are the complete fallback.</div>';
  }
}
function stop(){
  if(!started) return; started=false;
  mount.style.display='none'; offEl.style.display='block';
  toggle.textContent='Enable 3D'; toggle.classList.remove('active');
  try{ if(showcase) showcase.dispose(); }catch(_){}
  try{ if(stage) stage.dispose(); }catch(_){}
  showcase=null; stage=null;
}
toggle.addEventListener('click',()=>{ started?stop():start(); });
</script>

</body>
</html>