{/* SINGLE CLEAN WIN95 24-CARD WINDOW */}

{/* Title Bar */}

🃏 TWENTYFOUR_FRENZY.EXE

{/* Status Banner */}

{wonBanner ? `🎉 24 SOLVED! ${cards[0]?.expr} = 24` : hintMsg ? `💡 ${hintMsg}` : selectedId && selectedOp ? 'Now tap a second card to combine!' : selectedId ? 'Now tap +, −, ×, or ÷ below!' : 'Tap 2 cards & an operator to combine all 4 cards to 24!'}

{/* 2x2 PLAYING CARDS STAGE */}

{(cards || []).map((card) => { const active = card.id === selectedId; return ( ); })}

{/* Operator & Deal Controls */}

{['+', '−', '×', '÷'].map((op) => { const active = selectedOp === op; return ( ); })}

{/* Leaderboard Modal */} {showRanks && (

setShowRanks(false)} style={{ position: 'fixed', inset: 0, background: 'rgba(0,0,0,0.65)', zIndex: 70, display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '20px', }} >

e.stopPropagation()} style={{ width: '100%', maxWidth: '340px', background: '#C0C0C0', ...winOut, padding: '6px', display: 'flex', flexDirection: 'column', gap: '8px', }} >

🏆 24 ARENA LEADERS

{(leaderboard || []).length === 0 ? (

Solve a hand of 24 to claim #1!

) : ( (leaderboard || []).map((e, i) => (

#{i + 1} {e.name} {e.solved} solved

)) )}

)}

); }