const { useState: useAppState, useEffect: useAppEffect } = React;

function TweaksPanel() { return null; }

function App() {
  const [tweaks, setTweaks] = useAppState(() => ({ ...window.__TWEAKS }));

  useAppEffect(() => {
    document.body.setAttribute('data-theme', tweaks.theme);
    document.body.setAttribute('data-accent', tweaks.accent);
  }, [tweaks.theme, tweaks.accent]);

  return (
    <>
      <Nav />
      <Hero headline={tweaks.headline} variant={tweaks.heroVariant} />
      <HowItWorks />
      <WhyDictation />
      <Features />
      <Security />
      <Pricing />
      <FooterCTA />
      <Footer />
    </>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);
