{/* ✨ HEADER ✨ */}

⏳ {daysUntil} Days to Paradise

{editMode ? ( setTripName(e.target.value)} onBlur={() => { setEditMode(false); saveData({ ...appData, tripName }); }} autoFocus style={{ fontSize: 28, fontWeight: 800, background: 'transparent', border: 'none', borderBottom: `2px solid ${THEME.colors.primary}`, textAlign: 'center', color: THEME.colors.text, width: '100%', fontFamily: 'inherit' }} /> ) : (

setEditMode(true)} style={{ fontSize: 32, fontWeight: 800, margin: 0, background: `linear-gradient(45deg, #FF9A9E 0%, #FECFEF 99%, #FECFEF 100%)`, WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', cursor: 'pointer' }}> {tripName} ✏️

)} {/* 👥 MEMBERS BUBBLES */}

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

openProfile(m.handle)} style={{ width: 40, height: 40, borderRadius: '50%', border: '3px solid white', marginLeft: i > 0 ? -12 : 0, backgroundImage: `url(${m.avatarUrl})`, backgroundSize: 'cover', backgroundColor: THEME.colors.secondary, boxShadow: '0 4px 10px rgba(0,0,0,0.1)', zIndex: (activeMembers || []).length - i, display: 'flex', alignItems: 'center', justifyContent: 'center', fontSize: 18, cursor: 'pointer', transition: 'transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275)' }}> {!m.avatarUrl && (['🧚', '🧜‍♀️', '🦄', '🐬'][i % 4])}

))}

{/* 🍱 BENTO GRID ITINERARY */}

{(days || []).map((day, i) => (

{/* Day Header */}

{day.day}

{day.title}

{day.theme}

{/* Activities List */}

{(day.activities || []).map(act => (

{}} >

{act.icon}

{act.title}

{act.time} • {act.desc}

))}

{/* Re-roll Button */}

))}

{/* ✨ FLOATING ACTION BUTTON ✨ */}

{/* 🎊 CONFETTI OVERLAY (Simple CSS Implementation) */} {showConfetti && (

{/* Simulating confetti with emoji particles */} {Array.from({ length: 20 }).map((_, i) => (

{['✨', '🌸', '🍬', '🦄', '🥥'][i % 5]}

))}

)} {/* STYLE INJECTION FOR ANIMATIONS */}

); }