/* app.jsx — root + Tweaks */
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "headlineFont": "Unison Pro",
  "primary": "#c53400",
  "secondary": "#c53400",
  "base": "#0d0d0d",
  "pool": "wormhole",
  "scanlines": true,
  "glow": true
}/*EDITMODE-END*/;

const HEAD_FONTS = {
  "Unison Pro": '"Unison Pro", "PP Neue Montreal", sans-serif',
  "PP Neue Montreal": '"PP Neue Montreal", sans-serif',
  "GT America Mono": '"GT America Mono", monospace',
};

function hexToRgbStr(hex) {
  const n = parseInt(hex.slice(1), 16);
  return `${(n >> 16) & 255}, ${(n >> 8) & 255}, ${n & 255}`;
}

function App() {
  const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);

  useEffect(() => {
    const r = document.documentElement.style;
    r.setProperty("--display", HEAD_FONTS[t.headlineFont] || HEAD_FONTS["Manrope"]);
    r.setProperty("--green", t.primary);
    r.setProperty("--green-glow", `rgba(${hexToRgbStr(t.primary)}, 0.55)`);
    r.setProperty("--orange", t.primary);
    r.setProperty("--bg", t.base);
    document.body.style.setProperty("--scan-op", t.scanlines ? "0.35" : "0");
    window.__poolStyle = t.pool;
  }, [t]);

  useEffect(() => {
    document.body.style.background = t.base;
  }, [t.base]);

  return (
    <React.Fragment>
      <Nav />
      <Hero />
      <ScrollStory />
      <Naval />
      <RequestForStartups />
      <PrivacyNotSecrecy />
      <Playlists />
      <Footer />

      <TweaksPanel>
        <TweakSection label="Pool style" />
        <TweakRadio label="Pool" value={t.pool}
          options={["wormhole", "tunnel", "spiral"]}
          onChange={(v) => setTweak("pool", v)} />

        <TweakSection label="Typography" />
        <TweakSelect label="Headline" value={t.headlineFont}
          options={Object.keys(HEAD_FONTS)}
          onChange={(v) => setTweak("headlineFont", v)} />

        <TweakSection label="Accent" />
        <TweakColor label="Accent" value={t.primary}
          options={["#c53400", "#ff4300", "#a02a00"]}
          onChange={(v) => setTweak("primary", v)} />

        <TweakSection label="Atmosphere" />
        <TweakColor label="Base" value={t.base}
          options={["#0d0d0d", "#141414", "#0a0a0a", "#000000"]}
          onChange={(v) => setTweak("base", v)} />
        <TweakToggle label="Scanline texture" value={t.scanlines}
          onChange={(v) => setTweak("scanlines", v)} />
      </TweaksPanel>
    </React.Fragment>
  );
}

const __path = window.location.pathname.replace(/\/+$/, "");
const __isBuild = __path === "/build" || new URLSearchParams(window.location.search).has("build");
ReactDOM.createRoot(document.getElementById("root")).render(__isBuild ? <BuildPage /> : <App />);