// Act 1 — BOOT. A brief system-initialization moment that resolves into the hero.
// Lines reveal in sequence, then the overlay fades. Reduced-motion: shows at once, fades fast.

const { useState: useStateB, useEffect: useEffectB } = React;

function Boot({ onDone, reduced }) {
  const [n, setN] = useStateB(reduced ? WB.boot.length : 0);
  const [done, setDone] = useStateB(false);

  useEffectB(() => {
    const finish = () => { setDone(true); window.setTimeout(() => onDone && onDone(), 720); };
    if (reduced) { const t = window.setTimeout(finish, 600); return () => window.clearTimeout(t); }
    let i = 0;
    const iv = window.setInterval(() => {
      i += 1; setN(i);
      if (i >= WB.boot.length) { window.clearInterval(iv); window.setTimeout(finish, 700); }
    }, 300);
    return () => window.clearInterval(iv);
  }, []);

  return (
    <div className="wb-boot" data-done={done}>
      <div className="wb-boot__inner">
        {WB.boot.map((line, i) => (
          <div className="wb-boot__line" data-in={i < n} key={i}>
            <span className="wb-boot__caret">›</span>
            <span>{line}</span>
          </div>
        ))}
      </div>
    </div>
  );
}

window.Boot = Boot;