// ============ APP ============

function App() {
  const [tweaks, setTweaks] = React.useState(window.__TWEAKS || {});

  // Apply tweaks as data attributes
  React.useEffect(() => {
    const b = document.body;
    b.dataset.grain = tweaks.grain || "on";
    b.dataset.placeholders = tweaks.placeholders || "textured";
    b.dataset.hero = tweaks.heroVariant || "editorial";
    b.dataset.accent = tweaks.accent || "terracotta";
    b.dataset.serif = tweaks.serifStyle || "fraunces";
  }, [tweaks]);

  return (
    <>
      <Navbar />
      <Hero />
      <Ribbon />
      <About />
      <Menu />
      <Experience />
      <Locations />
      <Franchise />
      <Instagram />
      <Footer />
      <FloatBtns />
      <TweaksPanel state={tweaks} set={setTweaks} />
    </>
  );
}

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<App />);