// Interactive case study — "The Oil Play" (Sergei Fedorov / Joseph Zada)
// Reuses Stamp2 / Choices / Question / PeerStat / ScoreTracker / MoneyCounter
// from case-study.jsx (loaded earlier in the script order).

const OIL_TOTAL_FRAMES = 6;
const OIL_SCENE_NUM = {
  scene1: 1, scene2a: 2, scene2b: 2,
  scene3a: 3, scene3b: 3, scene3c: 3,
  scene4a: 4, scene4b: 4, scene4c: 4,
  scene5: 5, scene6: 6,
};

const FinalScoreOil = ({ score }) => {
  let comparison;
  if (score >= 4)      comparison = (<>You spotted every red flag. <strong>Most people catch 1 or 2.</strong> You would have protected your money.</>);
  else if (score >= 3) comparison = (<>Strong instincts. <strong>You caught more than most.</strong> But even one missed flag can cost millions.</>);
  else if (score >= 2) comparison = (<>You're about average. <strong>Most people score 2 of 4. Sergei Fedorov scored 0.</strong></>);
  else                 comparison = (<>You made the same choices Sergei Fedorov made. <strong>That path cost him $43.00M.</strong></>);
  return (
    <div className="ic-final-score">
      <div className="ic-final-score-eyebrow">★ YOUR SCORE ★</div>
      <div className="ic-final-score-number">{score}/4</div>
      <div className="ic-final-score-sub">RED FLAGS SPOTTED</div>
      <div className="ic-final-score-cmp">{comparison}</div>
    </div>
  );
};

const OilPlayCase = ({ onBack }) => {
  const [scene, setScene] = React.useState('scene1');
  const [score, setScore] = React.useState(0);
  const [moneyAtRisk, setMoneyAtRisk] = React.useState(0);
  const [flags, setFlags] = React.useState([null, null, null, null]);
  const [showHud, setShowHud] = React.useState(false);

  const choose = (nextScene, result, qNum, moneyAdd) => {
    if (qNum && result) {
      setShowHud(true);
      setFlags(prev => {
        const next = [...prev];
        if (!next[qNum - 1]) next[qNum - 1] = result;
        return next;
      });
      if (result === 'safe' && !flags[qNum - 1]) setScore(s => s + 1);
    }
    if (moneyAdd > 0) setMoneyAtRisk(m => m + moneyAdd);
    setScene(nextScene);
    window.scrollTo({ top: 0, behavior: 'auto' });
  };

  const num = OIL_SCENE_NUM[scene] || 1;

  const renderScene = () => {
    switch (scene) {
      case 'scene1': return (
        <>
          <p className="ic-narrative">
            You're one of the best players in the NHL. You just signed a
            <span className="gold"> $38.00M</span> contract — one of the biggest in
            hockey history. You're <strong>28 years old</strong>. A man approaches through mutual
            friends. <strong>Charismatic. Mansion. Luxury cars. Extravagant parties.</strong>
            He says he's extremely wealthy with <em>deep ties to Saudi Arabian oil ventures</em>.
            He says he can combine your money with his to buy oil sitting on offshore tankers —
            buy low, sell high. Quick, substantial returns.
          </p>
          <Question text="What do you do?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "He clearly has money. The lifestyle checks out. Other people are invested. You give him money.", to: 'scene2a', result: 'danger', qNum: 1, money: 5_000_000 },
              { letter: 'B', text: "You want proof of the oil deals — actual documentation of the tankers, the purchases, and the profits.", to: 'scene2b', result: 'safe', qNum: 1 },
            ]} />
          </Question>
        </>
      );

      case 'scene2a': return (
        <>
          <Stamp2 kind="danger" label="WHAT THE PLAYER DID">
            The real player chose this path. Impressed by the lifestyle, the confidence,
            the connections. Over the next several years he kept giving the man
            money — millions at a time.
          </Stamp2>
          <PeerStat number="71%" text="of players invest here. The lifestyle sells the lie." />
          <p className="ic-narrative">
            A few years go by. You've now invested over <span className="gold">$20.00M</span>.
            The reported returns look good on paper. But you start noticing: whenever you
            ask for your money back, <strong>there's always a reason it's not available yet</strong>.
            He's waiting on a transfer from Saudi Arabia. The oil is sitting on tankers.
            He's expecting a <strong>billion-dollar inheritance from the Saudi royal family</strong>.
          </p>
          <Question text="He says the money is coming. Do you believe him?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "He's been right so far, and he lives like a billionaire. You wait.", to: 'scene3a', result: 'danger', qNum: 2, money: 15_000_000 },
              { letter: 'B', text: "Something feels wrong. You hire a lawyer to investigate.", to: 'scene3b', result: 'safe', qNum: 2 },
            ]} />
          </Question>
        </>
      );

      case 'scene2b': return (
        <>
          <Stamp2 kind="safe" label="GOOD INSTINCT">
            You're asking the right question. But this man was extraordinarily convincing.
            He once <strong>hired actors to pose as a Saudi prince and princess at a party</strong>
            to convince investors his connections were real. The documentation he produced
            looked legitimate.
          </Stamp2>
          <PeerStat number="29%" text="of players ask for proof first. Most trust the lifestyle." />
          <p className="ic-narrative">
            Even if you asked, this man would have provided "proof" — fabricated trading
            confirmations, fake account statements, stories about oil on tankers.
            <strong> The entire operation was a lie from top to bottom.</strong> The oil deals
            didn't exist. The Saudi connections were invented. The money went straight to
            funding mansions, cars, parties, and paying off earlier investors.
          </p>
          <Question text="So how do you catch someone who fakes everything?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "You don't look at what he shows you. You look at where your money actually goes after you hand it over.", to: 'scene3c', result: 'safe', qNum: 2 },
              { letter: 'B', text: "You trust the documents he provides and invest.", to: 'scene3a', result: 'danger', qNum: 2, money: 15_000_000 },
            ]} />
          </Question>
        </>
      );

      case 'scene3a': return (
        <>
          <Stamp2 kind="danger" label="THIS IS WHERE IT GETS WORSE">
            The money wasn't invested in oil. <span className="red">There were no oil deals.
            There were no tankers. There was no Saudi royal family inheritance.</span>
            Every dollar went one of three places: his personal lifestyle, paying off other
            investors, or credit card bills. He spent <span className="gold">$4.00M on
            credit cards alone</span>.
          </Stamp2>
          <PeerStat number="58%" text="of players keep waiting. The sunk-cost fallacy kicks in." />
          <p className="ic-narrative">
            By now you've given this man over <span className="gold">$40.00M</span> across
            <strong> 11 years</strong>. You ask for your money. He stalls. You demand payment.
            He agrees to pay you <span className="gold">$60.00M</span> to settle.
            <strong> He never pays a dollar of it.</strong>
          </p>
          <Question text="What do you do now?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "You keep trying to get your money through private negotiations.", to: 'scene4a', result: 'danger', qNum: 3, money: 23_000_000 },
              { letter: 'B', text: "You sue. And you call the FBI.", to: 'scene4b', result: 'safe', qNum: 3 },
            ]} />
          </Question>
        </>
      );

      case 'scene3b': return (
        <>
          <Stamp2 kind="safe" label="THIS IS WHAT THE REAL PLAYER EVENTUALLY DID">
            After years of excuses and delays, the real player finally hired a lawyer and
            filed a civil lawsuit, claiming <strong>$43.00M</strong> had been embezzled
            over 11 years.
          </Stamp2>
          <p className="ic-narrative">
            But here's the painful truth: <strong>the lawsuit came 11 years too late</strong>.
            By the time lawyers got involved the money was gone — spent on mansions, luxury
            cars, extravagant parties, paying off earlier investors.
            <span className="red"> No oil was ever purchased. No tankers existed. The money
            went straight into personal accounts.</span>
          </p>
          <Question text="Could this have been caught earlier?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "Yes — if someone had been watching where the money actually went from day one.", to: 'scene4c', result: 'safe', qNum: 3 },
              { letter: 'B', text: "It's hard to say. Some cons are just too good.", to: 'scene4a', result: 'danger', qNum: 3, money: 23_000_000 },
            ]} />
          </Question>
        </>
      );

      case 'scene3c': return (
        <>
          <Stamp2 kind="safe" label="THAT'S EXACTLY RIGHT">
            You don't verify a deal by reading documents the person pitching you provides.
            You verify it by watching where your money actually goes. If someone says they're
            buying oil futures, the banking data will show whether money moved to an oil
            trading account — or to a credit-card company and a mortgage payment.
          </Stamp2>
          <PeerStat number="17%" text="of players figure out to follow the money instead of trusting the documents." />
          <p className="ic-narrative">
            The real player never had that visibility. For <strong>11 years</strong> he
            trusted what his manager told him. Over <span className="gold">$40.00M</span>
            went straight into personal spending. No oil was ever purchased. No tankers existed.
            <strong> At one party, the manager hired actors to pose as a Saudi prince and
            princess</strong> to keep the illusion alive.
          </p>
          <Question text="Ready to see who this really happened to?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "Show me the real case.", to: 'scene5', result: 'safe', qNum: 3 },
            ]} />
          </Question>
        </>
      );

      case 'scene4a': return (
        <>
          <Stamp2 kind="danger" label="THE MONEY IS GONE">
            Private negotiations with a con man don't work. He agreed to pay $60.00M to settle.
            He never paid a dollar. Meanwhile he was still spending other victims' money
            on his lifestyle. The FBI eventually got involved — but only after years of damage.
          </Stamp2>
          <p className="ic-narrative">
            The real player eventually sued and the federal government prosecuted. But the
            money was already gone. <strong>Over $50.00M stolen from more than 20
            victims</strong> — including other hockey players.
          </p>
          <Question text="Could continuous monitoring have prevented this?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "Show me.", to: 'scene5', result: 'safe', qNum: 4 },
            ]} />
          </Question>
        </>
      );

      case 'scene4b': return (
        <>
          <Stamp2 kind="safe" label="RIGHT MOVE — BUT LATE">
            The real player eventually sued and the FBI got involved. But 11 years of
            damage was already done. A lawsuit recovers what's left. Continuous monitoring
            would have caught it before the first million disappeared.
          </Stamp2>
          <p className="ic-narrative">
            The federal government prosecuted. The con man was convicted. But most of the
            money was already spent. <strong>You can't un-spend a mansion.</strong>
          </p>
          <Question text="Ready to see who this really happened to?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "Show me the real case.", to: 'scene5', result: 'safe', qNum: 4 },
            ]} />
          </Question>
        </>
      );

      case 'scene4c': return (
        <>
          <Stamp2 kind="safe" label="THAT'S THE ANSWER">
            If someone had been watching the banking data from day one, the fraud would
            have been obvious after the first transaction. No money ever went to an oil
            trading account. It all went to personal spending, credit cards, and real estate.
          </Stamp2>
          <p className="ic-narrative">
            <strong>That technology didn't exist when this happened. It exists now.</strong>
          </p>
          <Question text="Ready to see who this really happened to?">
            <Choices choose={choose} items={[
              { letter: 'A', text: "Show me.", to: 'scene5', result: 'safe', qNum: 4 },
            ]} />
          </Question>
        </>
      );

      case 'scene5': return (
        <>
          <div className="ic-reveal">
            <div className="ic-reveal-eyebrow">★ THE REAL CASE ★</div>
            <h2 className="ic-reveal-name">SERGEI<br />FEDOROV</h2>
            <div className="ic-reveal-amount">$43.00M LOST</div>
            <div className="ic-reveal-sub">3× Stanley Cup Champion · Hart Trophy Winner · NHL Legend</div>
          </div>
          <FinalScoreOil score={score} />
          <p className="ic-narrative">
            Sergei Fedorov won three Stanley Cups and the Hart Trophy as the NHL's Most
            Valuable Player during his time with the Detroit Red Wings. In 1998 he signed
            a <span className="gold">$38.00M</span> contract. That same year, he met
            <strong> Joseph Zada</strong>.
          </p>
          <ol className="ic-timeline">
            <li><span className="yr">1998</span><span className="tx">Fedorov meets Joseph Zada. Zada presents himself as extremely wealthy with ties to Saudi Arabian oil. Fedorov begins investing.</span></li>
            <li><span className="yr">1998 — 2009</span><span className="tx">Over 11 years, Zada takes ~$43.00M from Fedorov, claiming to invest it in oil. None of it is invested. Zada spends it on mansions, luxury vehicles, extravagant parties, and paying off other victims.</span></li>
            <li><span className="yr">2009</span><span className="tx">Fedorov files a civil lawsuit claiming $43.00M in embezzlement. Zada agrees to pay $60.00M to settle. He never pays.</span></li>
            <li><span className="yr">SEP 2013</span><span className="tx">Federal grand jury indicts Zada on fraud charges.</span></li>
            <li><span className="yr">AUG 2015</span><span className="tx">Fedorov testifies at trial that he lost $40.00M to the scheme.</span></li>
            <li><span className="yr">SEP 2015</span><span className="tx">Zada convicted on 15 counts of mail fraud. Total Ponzi scheme: ~$50.00M across 20+ victims — including other hockey players.</span></li>
            <li><span className="yr">SENTENCED</span><span className="tx">Zada sentenced to 17.5 years in federal prison. Released to home confinement in his Grosse Pointe Shores mansion in May 2020 under the CARES Act.</span></li>
          </ol>
          <button className="ic-continue" onClick={() => choose('scene6', null, null, 0)}>
            WHAT WOULD MONITORING HAVE CAUGHT? <span>→</span>
          </button>
        </>
      );

      case 'scene6': return (
        <>
          <div className="ic-monitoring">
            <div className="ic-monitoring-title">WHAT CONTINUOUS MONITORING WOULD HAVE CAUGHT</div>
            <p>
              If the entities Zada claimed to be investing through had been connected to a
              continuous monitoring platform:
            </p>
            <ul>
              <li><strong>No oil purchases existed.</strong> Banking data would have shown zero transactions with any oil trading platform, tanker company, or commodity exchange. The money went straight to personal accounts, credit cards, and real estate.</li>
              <li><strong>Ponzi payments were traceable.</strong> Money from newer victims going directly out to earlier investors — the signature pattern of a Ponzi scheme — would have been visible in real time.</li>
              <li><strong>Lifestyle spending was the tell.</strong> Zada spent $4.00M on credit cards alone. Money flowing to luxury retailers, car dealerships, and mortgage companies instead of oil ventures would have been flagged immediately.</li>
            </ul>
            <p>
              Fedorov wouldn't have needed to wait 11 years and file a lawsuit. He would
              have known the moment the first dollar went somewhere other than an oil trade.
            </p>
          </div>

          <p className="ic-narrative ic-closer">
            <strong>Sergei Fedorov was one of the greatest players to ever lace up skates.
            He lost $43.00M because no one was watching where his money actually went.</strong>
            <br /><br />
            Joseph Zada defrauded more than 20 people — including other hockey players. He
            lived in mansions, threw parties with hired actors posing as Saudi royalty,
            and spent a decade telling people their money was growing in oil futures that
            never existed.
            <br /><br />
            NHLAA Athlete Awareness makes sure someone is always watching.
          </p>

          <div className="ic-cta-box">
            <h3>ACTIVATE YOUR NHLAA<br />ATHLETE AWARENESS</h3>
            <p>
              Any company you're invested in — or considering — submit it for review and
              we'll have continuous monitoring live within 24 hours.
            </p>
            <ActivationForm source="oil-play" />
          </div>

          <div className="ic-source">
            Case sourced from the <a href="https://pcfi.org" target="_blank" rel="noopener noreferrer">Private Company Fraud Institute (PCFI)</a><br />
            Powered by <a href="https://oware.com" target="_blank" rel="noopener noreferrer">Athlete Awareness (Oware™)</a>
          </div>
        </>
      );

      default: return null;
    }
  };

  return (
    <div className="page active interactive-case">
      <Nav onBack={onBack} meta={`THE OIL PLAY · FRAME ${String(num).padStart(2,'0')} / 0${OIL_TOTAL_FRAMES}`} />
      <div className="ic-progress" style={{ width: `${(num / OIL_TOTAL_FRAMES) * 100}%` }} />

      {showHud && (
        <>
          <ScoreTracker flags={flags} />
          <MoneyCounter target={moneyAtRisk} />
        </>
      )}

      <section className="ic-section paper-tex">
        <header className="ic-header">
          <div className="ic-eyebrow">★ NHLAA ATHLETE AWARENESS · INTERACTIVE CASE ★</div>
          <h1 className="ic-title">THE OIL PLAY</h1>
          <p className="ic-subtitle">A real NHL case. Real money lost. Your decisions.</p>
        </header>
        <div className="ic-frame-label">FRAME {String(num).padStart(2,'0')} / 0{OIL_TOTAL_FRAMES}</div>
        <div key={scene} className="ic-scene">
          {renderScene()}
        </div>
      </section>
    </div>
  );
};

Object.assign(window, { OilPlayCase });
