{/* Background grid lines */}

{/* Header */}

BLUEPRINT

UNSW · Architect of Ambition

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

{!m?.avatarUrl && (m?.displayName?.[0] ?? '?')}

))}

{/* Discipline bar */}

Grand Progress {totalProgress}%

{state?.currentStreak ?? 0}

STREAK

{/* Tab switcher */}

{[{ key: 'map', label: '🏛️ Blueprint' }, { key: 'ledger', label: '📜 Ledger' }].map(tab => ( ))}

{/* Main content area */}

{/* === MAP VIEW === */} {view === 'map' && (

{/* District grid - bento style */}

{(districts || []).map((dist, idx) => { const d = dist ?? { id: 'unknown', name: 'Unknown', emoji: '❓', color: '#666', goals: [], progress: 0 }; const isSelected = selectedDistrict === d.id; const goals = d?.goals ?? []; const doneCount = (goals || []).filter(g => g?.done).length; return (

setSelectedDistrict(isSelected ? null : d.id)}>

{d.emoji}

{d.name}

{doneCount}/{(goals || []).length} milestones

{/* Progress ring */}

{d?.progress ?? 0}%

{(goals || []).slice(0, 6).map((g, gi) => (

))}

); })}

{/* Expanded district detail */} {selectedDistrict && (() => { const d = (districts || []).find(dd => dd?.id === selectedDistrict); if (!d) return null; const goals = d?.goals ?? []; return (

{d.emoji} {d.name} — Active Objectives

{(goals || []).map(g => { if (!g) return null; return (

toggleGoal(d.id, g.id)} style={{ display: 'flex', alignItems: 'flex-start', gap: 12, padding: '12px 0', borderBottom: '1px solid rgba(201,168,76,0.06)', cursor: 'pointer', transform: tapPulse === g.id ? 'scale(0.97)' : 'scale(1)', transition: 'transform 0.2s ease' }}>

{g.done ? '✓' : ''}

{g.text}

{g.milestone && ( ⭐ MILESTONE )}

); })} {/* Add goal */}

setNewGoalText(e.target.value)} onKeyDown={(e) => { if (e.key === 'Enter') addGoal(d.id); }} placeholder="Add new objective..." style={{ flex: 1, padding: '12px 14px', background: 'rgba(201,168,76,0.05)', border: '1px solid rgba(201,168,76,0.15)', borderRadius: 10, color: '#E8DCC8', fontFamily: bodyFont, fontSize: 14, outline: 'none' }} />

); })()}

)} {/* === LEDGER VIEW === */} {view === 'ledger' && (

✦ The Discipline Ledger ✦

{(ledger || []).map((entry, idx) => { const e = entry ?? { id: 'unknown', date: '', text: '', type: 'reflection', streak: null, seal: false }; const isStreak = e.type === 'streak'; return (

e.seal && triggerSeal(e.id)} style={{ marginBottom: 16, padding: 18, background: isStreak ? 'linear-gradient(135deg, rgba(201,168,76,0.08), rgba(26,21,16,0.95))' : 'rgba(20,17,13,0.9)', border: '1px solid rgba(201,168,76,0.12)', borderRadius: 14, position: 'relative', animation: `fadeSlideUp 0.5s ease ${0.1 + idx * 0.1}s both`, cursor: e.seal ? 'pointer' : 'default', transition: 'transform 0.3s ease', transform: sealAnim === e.id ? 'scale(1.03)' : 'scale(1)' }}> {/* Parchment texture overlay */}

{e.date} {isStreak && (

🔥 {e.streak} days

)}

{isStreak ? `${e.text} — ${e.streak} days strong` : e.text}

{/* Golden wax seal */} {e.seal && (

✦

)} {/* Loyalty mention highlight */} {(e.text ?? '').includes('Nhi') && (

🤝 Pillar of Loyalty — Nhi

)}

); })} {/* Bottom flourish */}

✦ ✦ ✦

)}

{/* Bottom bar with discipline stats */}

{[ { label: 'Discipline', value: state?.totalDiscipline ?? 0, emoji: '⚡' }, { label: 'Goals Set', value: (districts || []).reduce((a, d) => a + (d?.goals?.length ?? 0), 0), emoji: '🎯' }, { label: 'Achieved', value: (districts || []).reduce((a, d) => a + (d?.goals ?? []).filter(g => g?.done).length, 0), emoji: '✨' }, { label: 'Builders', value: (memberList || []).length, emoji: '🏛️' } ].map((stat, i) => (

{stat.emoji}

{stat.value}

{stat.label}

))}

{/* Global animation keyframes */}

); }