{/* Header & Members */}

🎀 Reel Roulette 🎬

{(memberList || []).map((m, i) => (

m.handle ? openProfile(m.handle) : null} style={{ width: 32, height: 32, borderRadius: '50%', border: '2px solid #FFF', background: m.avatarUrl ? `url(${m.avatarUrl}) center/cover` : '#FFD1DC', display: 'flex', alignItems: 'center', justifyContent: 'center', marginLeft: i > 0 ? -10 : 0, zIndex: 10 - i, cursor: m.handle ? 'pointer' : 'default', boxShadow: '0 2px 4px rgba(0,0,0,0.1)' }} > {!m.avatarUrl && {m.displayName?.[0] || '👤'}}

))}

{/* Wheel Area */}

{/* Pointer Pointer */}

📍

{/* The Wheel */}

{(movies || []).map((m, i) => { // Math to place text radiating outward const angle = (i * segmentAngle) + (segmentAngle / 2); return (

8 ? 12 : 14, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', maxWidth: '100px', textShadow: '1px 1px 0px rgba(255,255,255,0.8)' }}> {m.title}

); })} {/* Center Hub */}

🌸

{/* Spin Button */}

{/* Movie List Area */}

{(movies || []).map(m => (

{m.isDemo ? Demo : null} {m.title}

{m._user?.profileImageUrl ? (

) : 👤} Added by {m.addedBy}

))}

{/* Celebration Modal */} {showResult && (

{/* Confetti Particles */} {Array.from({ length: 25 }).map((_, i) => (

{['🌸', '🎀', '✨', '💖', '🦢'][Math.floor(Math.random() * 5)]}

))}

💌

Tonight's Pick!

{showResult.movie.title}

Spun by {showResult.spinner}

)}

); }