/* aevion.ai — app composition: boot, session ledger, reveal observer, tweaks */
const { useState: useStateA, useEffect: useEffectA } = React;

const AEV_TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "signal": "#00FF66",
  "scanlines": false,
  "pulse": true,
  "ledgerHud": true
}/*EDITMODE-END*/;

function aevPrefersReduced() {
  try { return window.matchMedia('(prefers-reduced-motion: reduce)').matches; } catch (e) { return false; }
}

function AevionSite() {
  const [t, setTweak] = useTweaks(AEV_TWEAK_DEFAULTS);
  const [booting, setBooting] = useStateA(() => {
    try { return !aevPrefersReduced() && !sessionStorage.getItem('aevBooted'); } catch (e) { return false; }
  });
  const [entries, setEntries] = useStateA([]);
  const [total, setTotal] = useStateA(7);

  /* the page audits itself: each section earns a receipt as it verifies into view */
  useEffectA(() => {
    const els = Array.from(document.querySelectorAll('[data-ledger]'));
    setTotal(els.length);
    const seen = new Set();
    function record(el) {
      el.classList.add('revealed');
      const id = el.dataset.ledger;
      if (!seen.has(id)) {
        seen.add(id);
        window.AevSound.blip(620 + seen.size * 50, 0.07);
        setEntries(prev => prev.concat({ id, hash: window.aevHash(id) }));
      }
    }
    let ioFired = false;
    let io = null;
    try {
      io = new IntersectionObserver(es => {
        ioFired = true;
        es.forEach(e => { if (e.isIntersecting) { record(e.target); } });
      }, { threshold: 0.18 });
      els.forEach(el => io.observe(el));
    } catch (e) { /* IO unavailable */ }

    /* fallback: if IO never fires (throttled or sandboxed), reveal by scroll
       position so the page is never blank and the ledger still completes */
    function sweep() {
      const vh = window.innerHeight;
      els.forEach(el => {
        if (seen.has(el.dataset.ledger)) { return; }
        const r = el.getBoundingClientRect();
        if (r.top < vh * 0.85 && r.bottom > 0) { record(el); }
      });
    }
    let usingFallback = false;
    const arm = setTimeout(() => {
      if (!ioFired) {
        usingFallback = true;
        sweep();
        window.addEventListener('scroll', sweep, { passive: true });
      }
    }, 1400);
    return () => {
      clearTimeout(arm);
      if (io) { io.disconnect(); }
      if (usingFallback) { window.removeEventListener('scroll', sweep); }
    };
  }, []);

  function finishBoot() {
    try { sessionStorage.setItem('aevBooted', '1'); } catch (e) { /* private mode */ }
    setBooting(false);
  }

  const sig = window.AEV_SIGNALS[t.signal] || window.AEV_SIGNALS['#00FF66'];
  const vars = {
    '--aev-green': t.signal,
    '--aev-green-bright': sig.bright,
    '--aev-green-dim': sig.dim,
    '--aev-glow-green': sig.glow
  };
  return (
    <div className="aev site" style={vars} data-pulse={t.pulse}>
      <div className="site-gridbg" aria-hidden="true"></div>
      <SiteNav></SiteNav>
      <ProofPacketHero></ProofPacketHero>
      <GateStatusCards></GateStatusCards>
      <ReceiptWall></ReceiptWall>
      <VerifierDemo></VerifierDemo>
      <ProofCityMap></ProofCityMap>
      <ClaimFirewall></ClaimFirewall>
      <SiteFooter></SiteFooter>
      {t.ledgerHud ? <LedgerHUD entries={entries} total={total}></LedgerHUD> : null}
      {t.scanlines ? <div className="scanlines" aria-hidden="true"></div> : null}
      {booting ? <BootOverlay onDone={finishBoot}></BootOverlay> : null}
      <TweaksPanel>
        <TweakSection label="Signal"></TweakSection>
        <TweakColor label="Proof signal" value={t.signal}
          options={['#00FF66', '#00F0FF', '#FFB800']}
          onChange={v => setTweak('signal', v)}></TweakColor>
        <TweakSection label="Atmosphere"></TweakSection>
        <TweakToggle label="CRT scanlines" value={t.scanlines}
          onChange={v => setTweak('scanlines', v)}></TweakToggle>
        <TweakToggle label="Status pulse" value={t.pulse}
          onChange={v => setTweak('pulse', v)}></TweakToggle>
        <TweakToggle label="Session ledger HUD" value={t.ledgerHud}
          onChange={v => setTweak('ledgerHud', v)}></TweakToggle>
      </TweaksPanel>
    </div>
  );
}

{ const __rootEl = document.getElementById('root'); if (__rootEl) { ReactDOM.createRoot(__rootEl).render(<AevionSite></AevionSite>); } }
