// The 10-line version every junior ships first.

// Works in the reviewer's mouse-and-Chrome demo. Fails silently for

// seven user groups the moment it ships.

function BrokenDialog({ open, onClose, children }) {

  if (!open) return null;

  return (

    <div className="fixed inset-0 bg-black/50 flex items-center justify-center">

      <div className="bg-white p-6 rounded-lg">

        {children}

        <button onClick={onClose}>Close</button>

      </div>

    </div>

  );

}

// Seven silent failures:

//   1. position: fixed broken inside transform-ancestor (containing

//      block collapse — overlay covers parent panel, not viewport)

//   2. Tab leaves the dialog and lands behind the overlay (no trap)

//   3. Screen reader walks background content (no inert / aria-hidden)

//   4. Esc does nothing (no keydown handler)

//   5. Backdrop click does nothing (no pointerdown handler)

//   6. Focus vanishes on close (no restore)

//   7. Page scrolls behind on iOS + jumps 15px on desktop (no lock)