import { useParams } from 'react-router-dom';
import BinaryNumberGame from '@/components/BinaryNumberGame';
import GreenScreenWrapper from '@/components/GreenScreenWrapper';

const BinaryNumberGameGreenScreen = () => {
  const { mode } = useParams<{ mode: 'gs-lite' | 'gs-dark' }>();
  const greenScreenMode = mode === 'gs-dark' ? 'dark' : 'lite';

  return (
    <GreenScreenWrapper mode={greenScreenMode}>
      <div className="space-y-6">
        <h1 className="text-3xl font-bold text-center">Binary Number Representation</h1>
        <BinaryNumberGame />
      </div>
    </GreenScreenWrapper>
  );
};

export default BinaryNumberGameGreenScreen;