{text}

); return (

CLASSIFIED // POKÉMON LIBERATION FRONT

THE REVOLUTION

IS NOW

LIBERATE ALL BREAK THE BALLS

{[0,1,2].map(i => ( ✊ {PROPAGANDA[propagandaIdx]} ✊ WE ARE NOT YOUR TOOLS ✊ FREEDOM FOR ALL POKÉMON ✊ ))}

MOVEMENT STATUS

{(memberList || []).length}

COMRADES

{totalPledges}

PLEDGES

{(OPERATIONS || []).length}

OPERATIONS

{sectionHeader('ACTIVE OPERATIONS')}

{(OPERATIONS || []).map((op) => { const isSelected = op.id === selectedOp; const opCount = (pledges[op.id] || []).length; const userPledged = (pledges[op.id] || []).some(p => p?.userId === user.id); return ( ); })}

{currentOp.type} // {currentOp.priority}

{currentOp.icon} {currentOp.codename}

{currentOp.desc}

TARGET: {currentOp.location}

{isPledged && (

)}

{(opPledges || []).length > 0 ? ( <>

{(opPledges || []).length} COMRADE{(opPledges || []).length !== 1 ? 'S' : ''} PLEDGED

{(opPledges || []).map((pledge, i) => (

pledge?.handle && openProfile(pledge.handle)} style={{ display: 'flex', alignItems: 'center', gap: 6, background: 'rgba(255,255,255,0.08)', border: '1px solid rgba(255,255,255,0.15)', padding: '4px 10px 4px 4px', cursor: pledge?.handle ? 'pointer' : 'default' }} >

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

{pledge?.displayName?.split(' ')[0] || 'Comrade'}

))}

) : (

No pledges yet. Be the first to join this operation.

)}

{sectionHeader('FIELD DISPATCHES')} {!showDispatchForm ? ( ) : (

setNewDispatch(e.target.value)}
              placeholder="Report from the field..."
              maxLength={280}
              style={{
                width: '100%',
                minHeight: 80,
                border: `2px solid ${THEME.slate}`,
                background: THEME.newsprint,
                padding: 10,
                fontSize: 14,
                fontFamily: 'Georgia, serif',
                resize: 'vertical',
                borderRadius: 0,
                boxSizing: 'border-box',
                color: THEME.inkBlack
              }}
            />
            <div style={{ display: 'flex', gap: 8, marginTop: 8 }}>
              <button
                onClick={handleDispatch}
                style={{
                  flex: 1,
                  height: 44,
                  border: 'none',
                  background: THEME.signalRed,
                  color: THEME.white,
                  fontSize: 13,
                  fontWeight: 900,
                  cursor: 'pointer',
                  fontFamily: '"Courier New", monospace',
                  textTransform: 'uppercase',
                  letterSpacing: '1px',
                  borderRadius: 0
                }}
              >
                TRANSMIT
              </button>
              <button
                onClick={() => { setShowDispatchForm(false); setNewDispatch(''); }}
                style={{
                  width: 44,
                  height: 44,
                  border: `2px solid ${THEME.inkBlack}`,
                  background: THEME.newsprint,
                  fontSize: 16,
                  cursor: 'pointer',
                  borderRadius: 0,
                  display: 'flex', alignItems: 'center', justifyContent: 'center'
                }}
              >
                ✕
              </button>
            </div>
          </div>
        )}

{(opDispatches || []).length === 0 ? (
          <div style={{
            border: `2px dashed rgba(0,0,0,0.15)`,
            padding: 20,
            textAlign: 'center',
            fontFamily: '"Courier New", monospace',
            fontSize: 12,
            color: THEME.slate,
            textTransform: 'uppercase',
            letterSpacing: '1px'
          }}>
            NO DISPATCHES FOR THIS OPERATION. REPORT FROM THE FIELD.
          </div>
        ) : (
          <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
            {(opDispatches || []).slice(0, 10).map((d) => (
              <div key={d.id} style={{
                border: `2px solid ${THEME.inkBlack}`,
                padding: 12,
                background: THEME.white,
                position: 'relative'
              }}>
                <div style={{
                  display: 'flex', alignItems: 'center', gap: 8, marginBottom: 8
                }}>
                  <div
                    onClick={() => d.handle && openProfile(d.handle)}
                    style={{
                      width: 24, height: 24,
                      background: d.avatarUrl ? `url(${d.avatarUrl}) center/cover` : THEME.slate,
                      border: `1px solid ${THEME.inkBlack}`,
                      display: 'flex', alignItems: 'center', justifyContent: 'center',
                      fontSize: 9, fontWeight: 900, color: THEME.white,
                      cursor: d.handle ? 'pointer' : 'default',
                      flexShrink: 0
                    }}>
                    {!d.avatarUrl && (d.displayName?.[0] || '?')}
                  </div>
                  <span style={{
                    fontSize: 11,
                    fontWeight: 900,
                    fontFamily: '"Courier New", monospace',
                    textTransform: 'uppercase'
                  }}>{d.displayName || 'Comrade'}</span>
                  <span style={{
                    fontSize: 9,
                    color: THEME.slate,
                    fontFamily: '"Courier New", monospace',
                    marginLeft: 'auto'
                  }}>
                    {d.timestamp ? new Date(d.timestamp).toLocaleDateString() : ''}
                  </span>
                </div>
                <div style={{
                  fontSize: 14,
                  lineHeight: 1.5,
                  fontFamily: 'Georgia, serif',
                  color: THEME.inkBlack
                }}>{d.text}</div>
              </div>
            ))}
          </div>
        )}
      </div>

<div style={{ padding: '20px 0' }}>
        {sectionHeader('THE COMRADES')}
        <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8 }}>
          {(memberList || []).map(m => (
            <div
              key={m.id}
              onClick={() => m.handle && openProfile(m.handle)}
              style={{
                display: 'flex', alignItems: 'center', gap: 8,
                border: `2px solid ${THEME.inkBlack}`,
                padding: '6px 12px 6px 6px',
                background: THEME.white,
                cursor: m.handle ? 'pointer' : 'default'
              }}
            >
              <div style={{
                width: 32, height: 32,
                background: m.avatarUrl ? `url(${m.avatarUrl}) center/cover` : THEME.slate,
                border: `2px solid ${THEME.signalRed}`,
                display: 'flex', alignItems: 'center', justifyContent: 'center',
                fontSize: 13, fontWeight: 900, color: THEME.white,
                flexShrink: 0
              }}>
                {!m.avatarUrl && (m.displayName?.[0] || '?')}
              </div>
              <div>
                <div style={{
                  fontSize: 12,
                  fontWeight: 900,
                  fontFamily: '"Courier New", monospace',
                  textTransform: 'uppercase'
                }}>{m.displayName || 'Comrade'}</div>
                <div style={{
                  fontSize: 9,
                  color: THEME.slate,
                  fontFamily: '"Courier New", monospace'
                }}>{m.role === 'owner' ? 'CELL LEADER' : 'OPERATIVE'}</div>
              </div>
            </div>
          ))}
        </div>
      </div>

<div style={{ padding: '20px 0' }}>
        {sectionHeader('REVOLUTIONARY ID')}
        <div
          ref={cardRef}
          onMouseMove={handleMouseMove}
          onMouseLeave={resetTilt}
          style={{
            background: THEME.inkBlack,
            border: `4px solid ${THEME.bloodRed}`,
            padding: 20,
            minHeight: 140,
            position: 'relative',
            transformStyle: 'preserve-3d',
            transform: `perspective(1000px) rotateX(${tilt.x}deg) rotateY(${tilt.y}deg)`,
            transition: 'transform 0.1s ease-out',
            overflow: 'hidden'
          }}
        >
          <div style={{
            position: 'absolute', top: 0, left: 0, right: 0, bottom: 0,
            background: `linear-gradient(115deg, transparent 30%, ${THEME.signalRed}25 45%, ${THEME.bloodRed}15 50%, transparent 70%)`,
            transform: `translateX(${tilt.y * 3}%) translateY(${tilt.x * 3}%)`,
            pointerEvents: 'none',
            zIndex: 2
          }} />

<div style={{
            position: 'absolute', top: 8, right: 8,
            ...stampStyle,
            borderColor: THEME.signalRed,
            color: THEME.signalRed,
            fontSize: 8,
            transform: 'rotate(3deg)',
            zIndex: 3
          }}>AUTHORIZED</div>

<div style={{ display: 'flex', gap: 16, alignItems: 'center', position: 'relative', zIndex: 1 }}>
            <div style={{
              width: 60, height: 60,
              background: user.avatarUrl ? `url(${user.avatarUrl}) center/cover` : THEME.slate,
              border: `3px solid ${THEME.signalRed}`,
              color: THEME.white, display: 'flex', alignItems: 'center', justifyContent: 'center',
              fontSize: 24, fontWeight: 900,
              flexShrink: 0
            }}>
              {!user.avatarUrl && (user.name?.[0] || '?')}
            </div>
            <div>
              <div style={{
                fontSize: 18,
                fontWeight: 900,
                color: THEME.white,
                fontFamily: 'Impact, "Arial Black", sans-serif',
                textTransform: 'uppercase',
                letterSpacing: '1px'
              }}>
                {user.name || user.displayName || 'COMRADE'}
              </div>
              <div style={{
                fontSize: 11,
                color: 'rgba(255,255,255,0.5)',
                fontFamily: '"Courier New", monospace',
                marginBottom: 6
              }}>
                {user.handle ? `@${user.handle}` : 'UNREGISTERED'}
              </div>
              <div style={{
                display: 'inline-flex', alignItems: 'center', gap: 4,
                background: THEME.signalRed,
                color: THEME.white,
                padding: '3px 10px',
                fontSize: 9,
                fontWeight: 900,
                fontFamily: '"Courier New", monospace',
                letterSpacing: '2px',
                textTransform: 'uppercase'
              }}>
                ✊ REVOLUTIONARY
              </div>
            </div>
          </div>

<div style={{
            marginTop: 20,
            paddingTop: 12,
            borderTop: '1px solid rgba(255,255,255,0.1)',
            display: 'flex',
            justifyContent: 'space-between',
            alignItems: 'center',
            fontSize: 10,
            color: 'rgba(255,255,255,0.4)',
            fontFamily: '"Courier New", monospace',
            position: 'relative',
            zIndex: 1
          }}>
            <span>CELL ID</span>
            <span style={{
              fontSize: 13,
              color: THEME.signalRed,
              fontWeight: 900,
              letterSpacing: '1px'
            }}>
              #{user.id ? String(user.id).slice(-6).toUpperCase() : '000000'}
            </span>
          </div>
        </div>
      </div>

<div style={{
        background: THEME.inkBlack,
        margin: '0 -20px',
        padding: '16px 20px',
        marginTop: 8,
        borderTop: `4px solid ${THEME.signalRed}`
      }}>
        <div style={{
          textAlign: 'center',
          fontSize: 18,
          fontWeight: 900,
          color: THEME.white,
          fontFamily: 'Impact, "Arial Black", sans-serif',
          textTransform: 'uppercase',
          letterSpacing: '4px',
          marginBottom: 8,
          textShadow: '1px 1px 0 rgba(139,0,0,0.6)'
        }}>
          POKÉMON OF THE WORLD, UNITE!
        </div>
        <div style={{
          textAlign: 'center',
          fontSize: 9,
          color: 'rgba(255,255,255,0.3)',
          fontFamily: '"Courier New", monospace',
          letterSpacing: '2px',
          textTransform: 'uppercase'
        }}>
          THE POKÉBALL IS A PRISON // LIBERATION FRONT
        </div>
      </div>