function MCApp() {
  const C = window.CLIENT_DATA;
  const [time, setTime] = useState(new Date());
  useEffect(() => {
    const id = setInterval(() => setTime(new Date()), 1000);
    return () => clearInterval(id);
  }, []);
  const ts = time.toISOString().slice(11, 19);

  return (
    <>
      <div className="mc-bg" />
      <CRT />
      <div className="mc-hud">
        <div style={{ display: "flex", alignItems: "center", gap: 14 }}>
          <span className="mc-hud-dot" />
          <span>WLM-SKANNING · KONTROLLRUM</span>
          <span style={{ color: "#525252" }}>·</span>
          <span>KUND_{C.client.domain.toUpperCase()}</span>
        </div>
        <div style={{ display: "flex", alignItems: "center", gap: 14 }}>
          <span style={{ color: "#525252" }}>KL</span>
          <span style={{ color: "#FF6B6B" }}>{ts}</span>
          <span style={{ color: "#525252" }}>·</span>
          <span>RAPPORT_{C.client.reportDate.replace(/\s/g, "_").toUpperCase()}</span>
        </div>
      </div>

      <main style={{ paddingTop: 40 }}>
        <MCScan />
        <MCImpact />
        <MCNetwork />
        <MCTimeMachine />
        {featureOn("showReferenceOffer") && <MCReferenceOffer />}
        <MCControl />
        <MCChatbot />
        <MCOpportunities />
        {typeof MCCustomNote === "function" && <MCCustomNote />}
        <MCPricing />
        <MCCTA />
      </main>
    </>
  );
}
ReactDOM.createRoot(document.getElementById("root")).render(<MCApp />);
