// ============================================================
// Monarch — Simulateurs avancés (moteur fiscal 2026)
//   AdvancedSecuritiesSimulator      — dichotomie cession de titres (CEHR, abattements)
//   RealEstateDichotomySimulator     — particulier (sablier) vs SCI à l'IS (amortissement)
//   SoleProprietorshipSaleSimulator  — cession de fonds en nom propre (EI : PVCT/PVLT)
//   PersonalRealEstateOBOSimulator   — hémorragie foncière vs OBO immobilier
// Toujours : NET APRÈS IMPÔT mis en avant. PFU 31,4 %. PS 18,6 %.
// Requiert window.MSC (simcore.jsx) + window.__mscShared (simulators2.jsx).
// ============================================================

(function () {
  const { useState, useEffect } = React;
  const M = window.MSC;
  const { C, SERIF, BODY, IS, fmt, pct, CountEuro, injectCore, useReveal,
    Eyebrow, Label, MoneyInput, Toggle, Shell, InputsCard, Doctrine, Alert, CTAEmail, Gauge, ProsCons } = M;
  function shared() { return window.__mscShared; }

  // ---- constantes 2026 ----
  const PFU = 0.314, PS_FIN = 0.186, PS_IMMO = 0.186;
  function cehr(base, couple) {
    const s1 = couple ? 500000 : 250000, s2 = couple ? 1000000 : 500000;
    let t = 0;
    t += Math.max(0, Math.min(base, s2) - s1) * 0.03;
    t += Math.max(0, base - s2) * 0.04;
    return t;
  }
  // TMI choisie
  const TMIs = [{ id: "11", v: 0.11, label: "11 %" }, { id: "30", v: 0.30, label: "30 %" }, { id: "41", v: 0.41, label: "41 %" }, { id: "45", v: 0.45, label: "45 %" }];

  function TMIToggle({ value, onChange }) {
    return <Toggle full options={TMIs.map((t) => ({ id: t.id, label: t.label }))} value={value} onChange={onChange} />;
  }

  // Grand bloc "net après impôt"
  function NetHero({ label, value, base, run, dark }) {
    return (
      <div style={{ background: dark ? C.encre : C.albatre, color: dark ? "#fff" : C.encre, border: dark ? "none" : `1px solid ${C.trait}`, padding: "clamp(22px,3vw,30px)" }}>
        <div style={{ fontFamily: BODY, fontSize: 12.5, color: dark ? "#9ea7a0" : C.gris, marginBottom: 6 }}>{label}</div>
        <CountEuro value={value} run={run} style={{ fontFamily: SERIF, fontSize: "clamp(30px,4.4vw,52px)", fontWeight: 500, color: dark ? "#fff" : C.encre, letterSpacing: "-0.01em", lineHeight: 1 }} />
        {base > 0 && <div style={{ fontFamily: BODY, fontSize: 13, color: dark ? C.sauge : C.ardoise, fontWeight: 600, marginTop: 8 }}>{pct(value, base)} % du montant cédé conservés</div>}
      </div>);
  }

  // =====================================================
  // 1. CESSION DE TITRES — La dichotomie fiscale
  // =====================================================
  function AdvancedSecuritiesSimulator() {
    useEffect(injectCore, []);
    const { ParamRecap, Synth } = shared();
    const [valo, setValo] = useState(2000000);
    const [acq, setAcq] = useState(10000);
    const [date, setDate] = useState("pre");
    const [abat, setAbat] = useState("pme");
    const [tmi, setTmi] = useState("41");
    const [done, setDone] = useState(false);
    const [busy, setBusy] = useState(false);
    const reveal = useReveal(done, 250);

    const V = Math.max(0, Number(valo) || 0);
    const A = Math.max(0, Number(acq) || 0);
    const pv = Math.max(0, V - A);
    const couple = true;
    const tmiV = TMIs.find((t) => t.id === tmi).v;
    const ceh = cehr(pv, couple);

    // PFU
    const taxPFU = pv * PFU + ceh;
    // Barème (seulement si pré-2018) : abattement IR uniquement
    const abPct = date === "pre" ? (abat === "pme" ? 0.85 : 0.65) : 0;
    const irBareme = pv * (1 - abPct) * tmiV;
    const psBareme = pv * PS_FIN;
    const taxBareme = date === "pre" ? (irBareme + psBareme + ceh) : Infinity;
    const usesBareme = taxBareme < taxPFU;
    const taxPropre = Math.min(taxPFU, taxBareme);
    const netPropre = V - taxPropre;
    const tauxEffPropre = pv > 0 ? (taxPropre / pv) * 100 : 0;

    // Holding — titres de participation
    const taxHolding = pv * 0.03;
    const netHolding = V - taxHolding;
    const gain = netHolding - netPropre;

    const go = () => { setBusy(true); setDone(false); setTimeout(() => { setBusy(false); setDone(true); }, 700); };

    return (
      <Shell eyebrow="Cession & plus-values · Titres de société (2026)"
        title="Vendre vos titres : combien vous gardez vraiment."
        intro="Le simulateur retient automatiquement l'imposition personnelle la plus favorable (impôt forfaitaire de 31,4 % ou barème), surtaxe des hauts revenus comprise, et la compare à une vente via votre holding.">
        {!done &&
          <InputsCard onCompute={go} computing={busy} label="Comparer le net après impôt">
            <div><Label>Valorisation de cession</Label><MoneyInput value={valo} onChange={setValo} min={50000} max={50000000} step={50000} /></div>
            <div><Label>Prix d'acquisition historique</Label><MoneyInput value={acq} onChange={setAcq} min={0} max={5000000} step={5000} /></div>
            <div><Label>Date d'acquisition des titres</Label><Toggle full options={[{ id: "pre", label: "Pré-2018" }, { id: "post", label: "Post-2018" }]} value={date} onChange={setDate} /></div>
            {date === "pre" &&
              <div><Label>Abattement applicable</Label><Toggle full options={[{ id: "commun", label: "Droit commun (65 %)" }, { id: "pme", label: "PME < 10 ans (85 %)" }]} value={abat} onChange={setAbat} /></div>}
            <div><Label>Tranche marginale (TMI)</Label><TMIToggle value={tmi} onChange={setTmi} /></div>
          </InputsCard>}

        {done &&
          <div style={{ marginTop: 36 }}>
            <ParamRecap items={[["Cession", fmt(V)], ["Plus-value", fmt(pv)], ["Titres", date === "pre" ? "Pré-2018" : "Post-2018"], ["TMI", tmi + " %"]]} onEdit={() => setDone(false)} />

            <div className="msc-grid2" style={{ marginTop: 16 }}>
              {/* Colonne A */}
              <div style={{ border: `1px solid ${C.trait}`, background: C.blanc, padding: "clamp(22px,3vw,32px)", display: "flex", flexDirection: "column" }}>
                <Eyebrow>Colonne A · le mirage de l'abattement</Eyebrow>
                <h3 style={{ fontFamily: SERIF, fontSize: 22, fontWeight: 500, margin: "10px 0 16px", letterSpacing: "-0.01em" }}>Cession en nom propre</h3>
                <Gauge run={reveal} base={V} segments={[{ value: netPropre, keep: true }, { value: taxPropre }]} height={18} />
                <div style={{ marginTop: 16 }}>
                  <NetHero label="Net après impôt" value={netPropre} base={V} run={reveal} />
                </div>
                <p style={{ fontFamily: BODY, fontSize: 13.5, color: C.gris, lineHeight: 1.6, margin: "16px 0 0" }}>
                  {usesBareme ? `Malgré votre abattement de ${Math.round(abPct * 100)} %, ` : "Au PFU, "}les prélèvements sociaux (18,6 %) et la CEHR détruisent <b style={{ color: "#a23b3b" }}>{fmt(taxPropre)}</b>. Taux effectif réel : <b style={{ color: C.encre }}>{tauxEffPropre.toFixed(1).replace(".", ",")} %</b>.
                </p>
                <div style={{ marginTop: 12, fontFamily: BODY, fontSize: 12.5, color: C.grisC, lineHeight: 1.6 }}>
                  dont CEHR {fmt(ceh)} · PS {fmt(pv * PS_FIN)} (jamais abattus)
                </div>
              </div>

              {/* Colonne B */}
              <div style={{ background: C.encre, color: "#fff", padding: "clamp(22px,3vw,32px)", display: "flex", flexDirection: "column" }}>
                <Eyebrow color={C.sauge}>Colonne B · la sanctuarisation</Eyebrow>
                <h3 style={{ fontFamily: SERIF, fontSize: 22, fontWeight: 500, margin: "10px 0 16px", letterSpacing: "-0.01em", color: "#fff" }}>La holding Monarch</h3>
                <div style={{ height: 18, background: "rgba(255,255,255,.08)", overflow: "hidden", borderRadius: 2 }}>
                  <div style={{ height: "100%", width: reveal ? pct(netHolding, V) + "%" : 0, transition: "width 1.1s cubic-bezier(.2,.7,.3,1)", background: C.sauge }} />
                </div>
                <div style={{ marginTop: 16 }}>
                  <NetHero label="Net après impôt (conservé dans la holding)" value={netHolding} base={V} run={reveal} dark />
                </div>
                <p style={{ fontFamily: BODY, fontSize: 13.5, color: "#cfd2cf", lineHeight: 1.6, margin: "16px 0 0" }}>
                  Frottement confiné à <b style={{ color: "#fff" }}>3 %</b> (QPFC 12 % × IS 25 %). Régime des titres de participation.
                </p>
              </div>
            </div>

            <Synth reveal={reveal} value={gain} label="Capital supplémentaire préservé via la holding" sub="à objectif identique, par rapport à la meilleure imposition personnelle" />

            <Doctrine open={reveal} eyebrow="À retenir" title="Vendre via une holding coûte bien moins d'impôt" accent={C.sauge}>
              <p style={{ margin: 0 }}>L'attachement aux abattements pré-2018 est une illusion mathématique. Les prélèvements sociaux et la CEHR s'appliquent sur la <b style={{ color: "#fff" }}>totalité</b> de votre plus-value, rendant la détention en nom propre irrémédiablement inférieure à l'architecture de groupe (imposition effective de 3 %). Purger l'impôt aujourd'hui via un <b style={{ color: "#fff" }}>apport-cession (150-0 B ter)</b> est la seule voie pour sanctuariser votre capital futur — tout en verrouillant votre gouvernance par des parts de préférence, dans le respect de la prohibition des clauses léonines.</p>
            </Doctrine>

            <ProsCons open={reveal}
              pour={["Vendre via une holding limite l'impôt à environ 3 % de la plus-value.", "Le capital reste disponible dans la holding pour réinvestir aussitôt.", "Vous gardez la main sur le calendrier et la destination des fonds."]}
              contre={["Il faut avoir créé la holding en amont (idéalement bien avant la vente).", "L'argent reste dans la société : le sortir personnellement sera taxé.", "Montage à encadrer juridiquement pour être sûr et durable."]} />

            <CTAEmail />
          </div>}
      </Shell>);
  }

  // =====================================================
  // 2. IMMOBILIER — La double impasse (particulier vs IS)
  // =====================================================
  function abatIR(d) { if (d <= 5) return 0; if (d >= 22) return 1; return (d - 5) * 0.06; }
  function abatPS(d) { if (d <= 5) return 0; if (d >= 30) return 1; if (d <= 21) return (d - 5) * 0.0165; if (d === 22) return 0.28; return 0.28 + (d - 22) * 0.09; }
  function surtaxe(pvi) { if (pvi <= 50000) return 0; const r = pvi <= 100000 ? 0.02 : pvi <= 150000 ? 0.03 : pvi <= 200000 ? 0.04 : pvi <= 250000 ? 0.05 : 0.06; return pvi * r; }

  function RealEstateDichotomySimulator() {
    useEffect(injectCore, []);
    const { ParamRecap } = shared();
    const [achat, setAchat] = useState(300000);
    const [cession, setCession] = useState(500000);
    const [duree, setDuree] = useState(15);
    const [done, setDone] = useState(false);
    const [busy, setBusy] = useState(false);
    const reveal = useReveal(done, 250);

    const P = Math.max(0, Number(achat) || 0);
    const R = Math.max(0, Number(cession) || 0);
    const D = Math.max(0, Math.min(30, Number(duree) || 0));
    const pv = Math.max(0, R - P);
    // particulier
    const baseIR = pv * (1 - abatIR(D)), basePS = pv * (1 - abatPS(D));
    const irPart = baseIR * 0.19, psPart = basePS * PS_IMMO, surPart = surtaxe(baseIR);
    const taxPart = irPart + psPart + surPart;
    const netPart = R - taxPart;
    // IS
    const vnc = P * Math.max(0, 1 - 0.03 * D);
    const baseISv = Math.max(0, R - vnc);
    const isTax = IS(baseISv);
    const netIS = R - isTax;

    const go = () => { setBusy(true); setDone(false); setTimeout(() => { setBusy(false); setDone(true); }, 700); };

    return (
      <Shell eyebrow="Patrimoine du dirigeant · Plus-value immobilière (2026)"
        title="Revendre un bien immobilier : à votre nom ou en société ?"
        intro="À votre nom, l'impôt baisse avec les années mais le capital reste bloqué. En société (IS), le capital grossit plus vite mais la revente coûte plus cher. Comparez ce qu'il vous reste.">
        {!done &&
          <InputsCard onCompute={go} computing={busy} label="Comparer le net après impôt">
            <div><Label>Prix d'acquisition</Label><MoneyInput value={achat} onChange={setAchat} min={10000} max={10000000} step={10000} /></div>
            <div><Label>Prix de cession estimé</Label><MoneyInput value={cession} onChange={setCession} min={10000} max={20000000} step={10000} /></div>
            <div style={{ gridColumn: "1 / -1" }}>
              <Label>Durée de détention</Label>
              <div style={{ fontFamily: SERIF, fontSize: 30, fontWeight: 500, color: C.encre }}>{D} ans</div>
              <input type="range" min="0" max="30" step="1" value={D} onChange={(e) => setDuree(Number(e.target.value))} style={{ width: "100%", marginTop: 8, accentColor: C.sauge }} />
            </div>
          </InputsCard>}

        {done &&
          <div style={{ marginTop: 36 }}>
            <ParamRecap items={[["Acquisition", fmt(P)], ["Cession", fmt(R)], ["Détention", D + " ans"], ["PV brute", fmt(pv)]]} onEdit={() => setDone(false)} />

            <div className="msc-grid2" style={{ marginTop: 16 }}>
              {/* Bloc 1 : particulier */}
              <div style={{ border: `1px solid ${C.trait}`, background: C.blanc, padding: "clamp(22px,3vw,32px)" }}>
                <Eyebrow>À votre nom (ou SCI à l'IR)</Eyebrow>
                <h3 style={{ fontFamily: SERIF, fontSize: 21, fontWeight: 500, margin: "10px 0 16px", letterSpacing: "-0.01em" }}>Deux impôts qui disparaîssent à des rythmes différents</h3>
                <Timeline reveal={reveal} duree={D} abIR={abatIR(D)} abPS={abatPS(D)} />
                <div style={{ marginTop: 16 }}><NetHero label={`Net après impôt à ${D} ans`} value={netPart} base={R} run={reveal} /></div>
                <p style={{ fontFamily: BODY, fontSize: 13, color: C.gris, marginTop: 12, lineHeight: 1.6 }}>Fiscalité résiduelle {fmt(taxPart)} (IR {fmt(irPart)} · PS {fmt(psPart)} · surtaxe {fmt(surPart)}). Le piège : bloquer le capital 30 ans, sans effet de levier.</p>
              </div>
              {/* Bloc 2 : IS */}
              <div style={{ border: `1px solid ${C.trait}`, background: C.blanc, padding: "clamp(22px,3vw,32px)" }}>
                <Eyebrow>En société à l'IS</Eyebrow>
                <h3 style={{ fontFamily: SERIF, fontSize: 21, fontWeight: 500, margin: "10px 0 16px", letterSpacing: "-0.01em" }}>Les amortissements gonflent l'impôt à la revente</h3>
                <VNCBar reveal={reveal} P={P} R={R} vnc={vnc} baseIS={baseISv} />
                <div style={{ marginTop: 16 }}><NetHero label="Net après IS (avant extraction)" value={netIS} base={R} run={reveal} /></div>
                <p style={{ fontFamily: BODY, fontSize: 13, color: C.gris, marginTop: 12, lineHeight: 1.6 }}>VNC tombée à {fmt(vnc)} → base imposable {fmt(baseISv)}. IS dû : <b style={{ color: "#a23b3b" }}>{fmt(isTax)}</b>. Capitalise admirablement, désastreux à la revente.</p>
              </div>
            </div>

            <Doctrine open={reveal} eyebrow="À retenir" title="Choisir le bon montage selon votre horizon" accent={C.sauge}>
              <p style={{ margin: 0 }}>La gestion immobilière subit deux impasses : l'attentisme stérile du nom propre, ou le mur fiscal de l'IS à la revente. L'ingénierie Monarch résout l'équation par la <b style={{ color: "#fff" }}>désimbrication</b> ou l'<b style={{ color: "#fff" }}>OBO immobilier</b> : racheter votre propre bien via votre holding aujourd'hui pour purger l'imposition et libérer massivement de la trésorerie personnelle.</p>
            </Doctrine>

            <ProsCons open={reveal}
              pour={["À votre nom, l'impôt disparaît avec le temps (exonération à long terme).", "En société, le bien se finance mieux et le capital grossit plus vite.", "Chaque option a un cas où elle est la plus avantageuse."]}
              contre={["À votre nom, le capital reste bloqué de longues années pour éviter l'impôt.", "En société, la revente coûte plus cher (amortissements repris).", "Le bon choix dépend de votre horizon et de votre objectif — il s'anticipe."]} />

            <CTAEmail note="Étude de faisabilité d'un OBO immobilier lors du premier rendez-vous." />
          </div>}
      </Shell>);
  }

  function Timeline({ reveal, duree, abIR, abPS }) {
    const [on, setOn] = useState(false);
    useEffect(() => { if (reveal) { const id = setTimeout(() => setOn(true), 200); return () => clearTimeout(id); } else setOn(false); }, [reveal]);
    const x0 = 24, x1 = 320, W = x1 - x0, X = (yr) => x0 + W * (yr / 30), cur = X(duree);
    const bar = (y, end, frac, label, color) => {
      const full = X(end) - x0;
      return (
        <g>
          <rect x={x0} y={y} width={full} height={16} fill="none" stroke={C.trait} strokeWidth="1" />
          <rect x={x0} y={y} width={on ? full * frac : full} height={16} fill={color} opacity="0.85" style={{ transition: "width 1s cubic-bezier(.2,.7,.3,1)" }} />
          <text x={x0} y={y - 6} fontFamily="'Archivo',sans-serif" fontSize="10" fontWeight="600" fill={C.encre}>{label}</text>
        </g>);
    };
    return (
      <svg viewBox="0 0 344 150" style={{ width: "100%", height: "auto", display: "block" }} role="img" aria-label="Sablier immobilier">
        {[0, 10, 22, 30].map((yr) =>
          <g key={yr}><line x1={X(yr)} y1="20" x2={X(yr)} y2="120" stroke={C.trait} strokeWidth="0.5" strokeDasharray={yr === 22 || yr === 30 ? "3 3" : undefined} /><text x={X(yr)} y="136" fontFamily="'Archivo',sans-serif" fontSize="9.5" fill={C.grisC} textAnchor="middle">an {yr}</text></g>)}
        {bar(36, 22, 1 - abIR, "IR (19 %)", C.ardoise)}
        {bar(80, 30, 1 - abPS, "PS (18,6 %)", C.saugeF)}
        <line x1={cur} y1="16" x2={cur} y2="124" stroke={C.encre} strokeWidth="1.4" />
        <circle cx={cur} cy="16" r="3" fill={C.encre} />
      </svg>);
  }

  function VNCBar({ reveal, P, R, vnc, baseIS }) {
    const [on, setOn] = useState(false);
    useEffect(() => { if (reveal) { const id = setTimeout(() => setOn(true), 250); return () => clearTimeout(id); } else setOn(false); }, [reveal]);
    const max = Math.max(R, 1);
    return (
      <svg viewBox="0 0 344 120" style={{ width: "100%", height: "auto", display: "block" }} role="img" aria-label="Étau VNC">
        <text x="0" y="14" fontFamily="'Archivo',sans-serif" fontSize="10" fill={C.gris}>Prix de revente</text>
        <rect x="0" y="20" width={(R / max) * 344} height="18" fill="none" stroke={C.encre} strokeWidth="1" />
        <text x="0" y="58" fontFamily="'Archivo',sans-serif" fontSize="10" fill={C.gris}>VNC (après amortissements)</text>
        <rect x="0" y="64" width={on ? (vnc / max) * 344 : (P / max) * 344} height="18" fill={C.albatre} stroke={C.trait} strokeWidth="1" style={{ transition: "width 1.1s cubic-bezier(.2,.7,.3,1)" }} />
        <rect x={on ? (vnc / max) * 344 : (P / max) * 344} y="64" width={on ? (baseIS / max) * 344 : 0} height="18" fill="url(#vncHatch)" stroke={C.ardoise} strokeWidth="1" style={{ transition: "all 1.1s cubic-bezier(.2,.7,.3,1)" }} />
        <defs><pattern id="vncHatch" width="6" height="6" patternTransform="rotate(45)" patternUnits="userSpaceOnUse"><line x1="0" y1="0" x2="0" y2="6" stroke={C.ardoise} strokeWidth="0.8" opacity="0.5" /></pattern></defs>
        <text x="0" y="104" fontFamily="'Archivo',sans-serif" fontSize="10" fill={C.ardoiseF}>Zone hachurée = base imposable IS</text>
      </svg>);
  }

  // =====================================================
  // 3. CESSION DE FONDS EN NOM PROPRE (EI) — La guillotine
  // =====================================================
  function SoleProprietorshipSaleSimulator() {
    useEffect(injectCore, []);
    const { ParamRecap } = shared();
    const [origine, setOrigine] = useState(0);
    const [prix, setPrix] = useState(400000);
    const [materiel, setMateriel] = useState(50000);
    const [exo, setExo] = useState("aucune");
    const [tmi, setTmi] = useState("41");
    const [done, setDone] = useState(false);
    const [busy, setBusy] = useState(false);
    const reveal = useReveal(done, 250);

    const O = Math.max(0, Number(origine) || 0);
    const P = Math.max(0, Number(prix) || 0);
    const mat = Math.min(Math.max(0, Number(materiel) || 0), P);
    const tmiV = TMIs.find((t) => t.id === tmi).v;
    const pvct = mat;                       // amortissements repris
    const pvlt = Math.max(0, P - mat - O);  // valeur du fonds
    const rateCT = Math.min(0.5, tmiV + 0.09); // IR + cotisations TNS (indicatif)

    let exoFonds = 0, exoIRct = 0; // fractions exonérées
    if (exo === "art238") { const f = P <= 300000 ? 1 : (P >= 500000 ? 0 : (500000 - P) / 200000); exoFonds = f; exoIRct = f; }
    else if (exo === "retraite") { exoFonds = 1; exoIRct = 1; } // IR/IS exonéré ; PS/cotisations dus

    let taxCT, taxLT;
    if (exo === "retraite") {
      taxCT = pvct * 0.097;            // cotisations résiduelles (indicatif)
      taxLT = pvlt * 0.172;            // PS résiduels
    } else {
      taxCT = pvct * rateCT * (1 - exoIRct);
      taxLT = pvlt * 0.30 * (1 - exoFonds);
    }
    const totalTax = taxCT + taxLT;
    const net = P - totalTax;
    const totalExo = exoFonds >= 1 && exo !== "aucune";

    const go = () => { setBusy(true); setDone(false); setTimeout(() => { setBusy(false); setDone(true); }, 700); };

    return (
      <Shell eyebrow="Cession & plus-values · Entreprise individuelle"
        title="Vendre votre fonds quand vous êtes en nom propre."
        intro="Quand le fonds est exploité en entreprise individuelle, la vente sépare deux plus-values : le matériel déjà amorti (taxé à l'impôt sur le revenu + cotisations) et le fonds lui-même (taxé à 30 %).">
        {!done &&
          <InputsCard onCompute={go} computing={busy} label="Diagnostiquer le net après impôt">
            <div><Label>Valeur d'acquisition historique</Label><MoneyInput value={origine} onChange={setOrigine} min={0} max={5000000} step={10000} /></div>
            <div><Label>Prix de cession global</Label><MoneyInput value={prix} onChange={setPrix} min={10000} max={20000000} step={10000} /></div>
            <div><Label>Dont matériel amorti (PVCT)</Label><MoneyInput value={materiel} onChange={setMateriel} min={0} max={P} step={5000} /></div>
            <div><Label>Tranche marginale (TMI)</Label><TMIToggle value={tmi} onChange={setTmi} /></div>
            <div style={{ gridColumn: "1 / -1" }}>
              <Label>Exonération</Label>
              <Toggle full options={[{ id: "aucune", label: "Aucune" }, { id: "art238", label: "Fonds < 500 k€ (238 quindecies)" }, { id: "retraite", label: "Départ retraite (151 septies A)" }]} value={exo} onChange={setExo} />
            </div>
          </InputsCard>}

        {done &&
          <div style={{ marginTop: 36 }}>
            <ParamRecap items={[["Cession", fmt(P)], ["Matériel (PVCT)", fmt(pvct)], ["Fonds (PVLT)", fmt(pvlt)], ["Exonération", exo === "aucune" ? "Aucune" : exo === "art238" ? "238 quindecies" : "Retraite"]]} onEdit={() => setDone(false)} />

            <div style={{ marginTop: 16, border: `1px solid ${C.trait}`, background: C.blanc, padding: "clamp(22px,3vw,32px)" }}>
              <Eyebrow>{totalExo ? "Le vide stratégique" : "La guillotine fiscale"}</Eyebrow>
              <h3 style={{ fontFamily: SERIF, fontSize: "clamp(20px,2.4vw,28px)", fontWeight: 500, letterSpacing: "-0.01em", margin: "10px 0 18px" }}>{totalExo ? "Exonération — mais cash non structuré" : "Deux plus-values, deux impôts"}</h3>
              {!totalExo &&
                <div style={{ display: "flex", flexDirection: "column", gap: 20 }}>
                  <GuillotineRow label="Matériel · PVCT" sub={exo === "retraite" ? "cotisations TNS résiduelles" : `IR + cotisations TNS ≈ ${Math.round(rateCT * 100)} %`} base={pvct} tax={taxCT} reveal={reveal} />
                  <GuillotineRow label="Fonds · PVLT" sub={exo === "retraite" ? "PS 17,2 % résiduels" : "30 % (12,8 % IR + 17,2 % PS)"} base={pvlt} tax={taxLT} reveal={reveal} />
                </div>}
              <div style={{ marginTop: 22 }}>
                <NetHero label="Net après impôt sur vos comptes personnels" value={net} base={P} run={reveal} dark />
              </div>
              <p style={{ fontFamily: BODY, fontSize: 13.5, color: C.gris, lineHeight: 1.6, margin: "16px 0 0" }}>
                {totalExo
                  ? <>Vous bénéficiez de l'exonération : <b style={{ color: C.encre }}>{fmt(net)}</b> atterrissent sur vos comptes. Le piège se referme : cette trésorerie massive, non structurée, subira l'inflation, la fiscalité foncière en direct et l'IFI.</>
                  : <>L'empilement des cotisations sur le matériel et de l'impôt sur le fonds détruit <b style={{ color: "#a23b3b" }}>{fmt(totalTax)}</b>.</>}
              </p>
            </div>

            <Doctrine open={reveal} eyebrow="À retenir" title="Le nom propre est rarement le bon cadre pour vendre" accent={C.sauge}>
              <p style={{ margin: 0 }}>Que vous subissiez l'impôt de plein fouet ou que vous encaissiez le fruit d'une exonération, le nom propre est une impasse. L'ingénierie Monarch intervient en amont : l'<b style={{ color: "#fff" }}>apport du fonds à une société (art. 151 octies)</b> permet de basculer dans l'écosystème de l'IS et de la holding avant la cession. Si le fonds est déjà vendu, nous structurons immédiatement votre liquidité via une <b style={{ color: "#fff" }}>société civile patrimoniale</b> pour sanctuariser vos réinvestissements et verrouiller votre gouvernance.</p>
            </Doctrine>

            <ProsCons open={reveal}
              pour={["Des exonérations existent (départ en retraite, petite valeur de fonds).", "Opération simple quand l'activité est détenue en nom propre.", "Possibilité d'anticiper en apportant le fonds à une société avant de vendre."]}
              contre={["En nom propre, l'impôt et les cotisations s'empilent rapidement.", "Une exonération d'impôt ne dispense pas toujours des cotisations sociales.", "Sans structuration en amont, peu de leviers une fois la vente faite."]} />

            <CTAEmail note="Audit de votre structure de cession lors du premier rendez-vous." />
          </div>}
      </Shell>);
  }

  function GuillotineRow({ label, sub, base, tax, reveal }) {
    const [on, setOn] = useState(false);
    useEffect(() => { if (reveal) { const id = setTimeout(() => setOn(true), 120); return () => clearTimeout(id); } else setOn(false); }, [reveal]);
    const net = Math.max(0, base - tax);
    return (
      <div>
        <div style={{ display: "flex", justifyContent: "space-between", alignItems: "baseline", marginBottom: 8, flexWrap: "wrap", gap: 8 }}>
          <span style={{ fontFamily: BODY, fontSize: 13, color: C.ardoise, letterSpacing: "0.08em", textTransform: "uppercase", fontWeight: 600 }}>{label}</span>
          <span style={{ fontFamily: BODY, fontSize: 12.5, color: C.gris }}>{sub}</span>
        </div>
        <div style={{ display: "flex", height: 20, border: `1px solid ${C.trait}`, overflow: "hidden", background: C.albatre }}>
          <div title="net" style={{ height: "100%", width: on ? pct(net, base) + "%" : "100%", transition: "width 1s cubic-bezier(.2,.7,.3,1)", background: C.saugeF }} />
          <div title="impôt" style={{ height: "100%", flex: 1, backgroundColor: "rgba(162,59,59,.1)", backgroundImage: "repeating-linear-gradient(135deg, rgba(162,59,59,.5) 0, rgba(162,59,59,.5) 1.5px, transparent 1.5px, transparent 6px)" }} />
        </div>
        <div style={{ display: "flex", justifyContent: "space-between", marginTop: 6, fontFamily: BODY, fontSize: 12.5 }}>
          <span style={{ color: C.saugeF, fontWeight: 600 }}>net {fmt(net)}</span>
          <span style={{ color: "#a23b3b", fontWeight: 600 }}>impôt {fmt(tax)}</span>
        </div>
      </div>);
  }

  // =====================================================
  // 4. OBO IMMOBILIER — Hémorragie foncière vs extraction
  // =====================================================
  function PersonalRealEstateOBOSimulator() {
    useEffect(injectCore, []);
    const { ParamRecap } = shared();
    const [valeur, setValeur] = useState(500000);
    const [achat, setAchat] = useState(300000);
    const [duree, setDuree] = useState(12);
    const [loyer, setLoyer] = useState(25000);
    const [tmi, setTmi] = useState("41");
    const [done, setDone] = useState(false);
    const [busy, setBusy] = useState(false);
    const reveal = useReveal(done, 250);

    const V = Math.max(0, Number(valeur) || 0);
    const P = Math.max(0, Number(achat) || 0);
    const D = Math.max(0, Math.min(30, Number(duree) || 0));
    const L = Math.max(0, Number(loyer) || 0);
    const tmiV = TMIs.find((t) => t.id === tmi).v;
    // A : hémorragie
    const taxLoyer = L * (tmiV + PS_IMMO);
    const netLoyer = L - taxLoyer;
    const tauxConfisc = L > 0 ? (taxLoyer / L) * 100 : 0;
    const rendementNet = V > 0 ? (netLoyer / V) * 100 : 0;
    // B : OBO — purge PV particulier
    const pv = Math.max(0, V - P);
    const pvTax = pv * (1 - abatIR(D)) * 0.19 + pv * (1 - abatPS(D)) * PS_IMMO + surtaxe(pv * (1 - abatIR(D)));
    const cashExtrait = V - pvTax;

    const go = () => { setBusy(true); setDone(false); setTimeout(() => { setBusy(false); setDone(true); }, 700); };

    return (
      <Shell eyebrow="Patrimoine du dirigeant · OBO immobilier"
        title="Un bien locatif qui rapporte au lieu de coûter."
        intro="Détenu à votre nom, un bien locatif est lourdement taxé chaque année. L'OBO immobilier vous permet d'encaisser des liquidités aujourd'hui, sans vendre le bien à un tiers.">
        {!done &&
          <InputsCard onCompute={go} computing={busy} label="Calculer mon opération">
            <div><Label>Valeur actuelle du bien</Label><MoneyInput value={valeur} onChange={setValeur} min={50000} max={20000000} step={10000} /></div>
            <div><Label>Prix d'acquisition historique</Label><MoneyInput value={achat} onChange={setAchat} min={0} max={20000000} step={10000} /></div>
            <div><Label>Loyers annuels nets de charges</Label><MoneyInput value={loyer} onChange={setLoyer} min={0} max={1000000} step={1000} /></div>
            <div><Label>TMI du propriétaire</Label><TMIToggle value={tmi} onChange={setTmi} /></div>
            <div style={{ gridColumn: "1 / -1" }}>
              <Label>Durée de détention</Label>
              <div style={{ fontFamily: SERIF, fontSize: 28, fontWeight: 500, color: C.encre }}>{D} ans</div>
              <input type="range" min="0" max="30" step="1" value={D} onChange={(e) => setDuree(Number(e.target.value))} style={{ width: "100%", marginTop: 8, accentColor: C.sauge }} />
            </div>
          </InputsCard>}

        {done &&
          <div style={{ marginTop: 36 }}>
            <ParamRecap items={[["Bien", fmt(V)], ["Loyers/an", fmt(L)], ["TMI", tmi + " %"], ["Détention", D + " ans"]]} onEdit={() => setDone(false)} />

            <div className="msc-grid2" style={{ marginTop: 16 }}>
              {/* Gauche : prison fiscale */}
              <div style={{ border: `1px solid ${C.trait}`, background: C.blanc, padding: "clamp(22px,3vw,32px)" }}>
                <Eyebrow>Si vous ne faites rien</Eyebrow>
                <h3 style={{ fontFamily: SERIF, fontSize: 21, fontWeight: 500, margin: "10px 0 16px", letterSpacing: "-0.01em" }}>Le statu quo</h3>
                <p style={{ fontFamily: BODY, fontSize: 14, color: "#2c2e2d", lineHeight: 1.6, margin: "0 0 0" }}>
                  Votre capital de <b>{fmt(V)}</b> est gelé. Chaque année, l'État confisque <b style={{ color: "#a23b3b" }}>{Math.round(tauxConfisc)} %</b> de vos loyers ({fmt(taxLoyer)}). Rendement net réel : <b>{rendementNet.toFixed(1).replace(".", ",")} %</b>.
                </p>
                <p style={{ fontFamily: BODY, fontSize: 12.5, color: C.grisC, lineHeight: 1.6, margin: "10px 0 0" }}>
                  Soit votre tranche marginale d'imposition ({tmi} %) + les prélèvements sociaux (18,6 %) : les revenus fonciers s'ajoutent à vos autres revenus et sont taxés au taux marginal.
                </p>
              </div>
              {/* Droite : extraction */}
              <div style={{ background: C.encre, color: "#fff", padding: "clamp(22px,3vw,32px)" }}>
                <Eyebrow color={C.sauge}>Le mouvement · l'extraction</Eyebrow>
                <h3 style={{ fontFamily: SERIF, fontSize: 21, fontWeight: 500, margin: "10px 0 16px", letterSpacing: "-0.01em", color: "#fff" }}>L'OBO immobilier</h3>
                <div style={{ fontFamily: BODY, fontSize: 12.5, color: "#9ea7a0", marginBottom: 6 }}>Liquidités extraites sur votre compte personnel (net après impôt sur la plus-value)</div>
                <CountEuro value={cashExtrait} run={reveal} style={{ fontFamily: SERIF, fontSize: "clamp(30px,4.4vw,52px)", fontWeight: 500, color: "#fff", letterSpacing: "-0.01em", lineHeight: 1 }} />
                <div style={{ fontFamily: BODY, fontSize: 13, color: C.sauge, fontWeight: 600, marginTop: 10 }}>après purge de la plus-value ({fmt(pvTax)})</div>
                <p style={{ fontFamily: BODY, fontSize: 13.5, color: "#cfd2cf", lineHeight: 1.6, margin: "16px 0 0" }}>
                  Loyers futurs dans la SCI à l'IS : froissement fiscal proche de <b style={{ color: "#fff" }}>0 %</b> grâce à la déduction des intérêts d'emprunt et de l'amortissement. L'actif s'autofinance.
                </p>
              </div>
            </div>

            <Doctrine open={reveal} eyebrow="À retenir" title="Rendre un bien liquide sans le vendre à un tiers" accent={C.sauge}>
              <p style={{ margin: 0 }}>Conserver un bien locatif en nom propre est une destruction mathématique de valeur. L'OBO immobilier permet de purger la plus-value latente et de <b style={{ color: "#fff" }}>monétiser votre patrimoine sans le vendre à un tiers</b>. Vous encaissez instantanément des centaines de milliers d'euros, tandis que l'actif bascule dans un environnement de capitalisation pur (l'IS). Le cabinet structure cette mutation (statuts, pactes, gouvernance) pour que vous conserviez le contrôle absolu de l'édifice, tout en rendant sa valeur liquide aujourd'hui.</p>
            </Doctrine>

            <ProsCons open={reveal}
              pour={["Vous encaissez des liquidités sans vendre le bien à un tiers.", "Le bien passe dans un cadre où il se finance mieux (loyers ≈ emprunt).", "Vous gardez le contrôle total de l'actif."]}
              contre={["L'opération déclenche l'impôt sur la plus-value au moment du rachat.", "Elle suppose un emprunt et des frais de mise en place.", "À calibrer avec soin pour que les loyers couvrent bien la dette."]} />

            <CTAEmail note="Étude du potentiel d'extraction de votre patrimoine lors du premier rendez-vous." />
          </div>}
      </Shell>);
  }

  function Vault({ reveal }) {
    const [on, setOn] = useState(false);
    useEffect(() => { if (reveal) { const id = setTimeout(() => setOn(true), 200); return () => clearTimeout(id); } else setOn(false); }, [reveal]);
    return (
      <svg viewBox="0 0 200 120" style={{ width: "100%", maxWidth: 220, height: "auto", display: "block" }} role="img" aria-label="Coffre verrouillé">
        <defs><pattern id="leakH" width="6" height="6" patternTransform="rotate(45)" patternUnits="userSpaceOnUse"><line x1="0" y1="0" x2="0" y2="6" stroke="#a23b3b" strokeWidth="0.8" opacity="0.5" /></pattern></defs>
        <rect x="40" y="20" width="120" height="84" fill={C.albatre} stroke={C.encre} strokeWidth="1.4" />
        <circle cx="100" cy="62" r="16" fill="none" stroke={C.encre} strokeWidth="1.4" />
        <line x1="100" y1="62" x2="112" y2="62" stroke={C.encre} strokeWidth="1.4" />
        <line x1="100" y1="62" x2="100" y2="50" stroke={C.encre} strokeWidth="1.4" />
        {[30, 60, 90].map((dy, i) =>
          <rect key={i} x="160" y={28 + dy * 0.5} width={on ? 28 : 0} height="8" fill="url(#leakH)" style={{ transition: "width .8s ease", transitionDelay: (i * 200) + "ms" }} />)}
      </svg>);
  }

  window.AdvancedSecuritiesSimulator = AdvancedSecuritiesSimulator;
  window.RealEstateDichotomySimulator = RealEstateDichotomySimulator;
  window.SoleProprietorshipSaleSimulator = SoleProprietorshipSaleSimulator;
  window.PersonalRealEstateOBOSimulator = PersonalRealEstateOBOSimulator;
})();