[{"_1":2,"_173":-5,"_174":-5},"loaderData",{"_3":4,"_10":11},"root",{"_5":-5,"_6":7,"_8":9},"user","appId","cm7twdhs6009l11ml868xhxld","wsEndpoint","https://dev.fun","routes/p.$appId",{"_12":13,"_172":-5,"_98":-5},"appDetail",{"_14":15,"_16":17,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":29,"_30":31,"_32":33,"_34":35,"_36":37,"_38":39,"_40":41,"_5":42,"_53":54,"_55":56,"_57":56,"_58":59,"_60":56,"_61":56,"_62":56,"_63":56,"_64":56,"_65":17,"_66":17,"_67":68,"_69":70,"_71":72,"_73":74,"_87":88,"_138":17,"_139":140,"_98":29,"_100":171},"id","fae349f1a52746955e02","isMyApp",false,"name","dreamscape","description","Drift weightlessly through a hypnotic digital dimension where dreams and reality blur into one surreal experience. Each scroll simulates that distinctive falling sensation from your deepest sleep, complete with ethereal particle effects and haunting dreamlike sounds that make you question if you're awake or floating through your subconscious.","brief","Experience the sensation of endless dream-falling through a mesmerizing digital dimension.","isLive",true,"tags",[],"cover","https://cdn.dev.fun/snapshot/fae349f1a52746955e02/58443_c05f97af.webp","cdnUrl","https://cdn.dev.fun/app/fae349f1a52746955e02/58443","createdAt",["D",1745656287530],"updatedAt",["D",1745658055674],"lastCommitId",["B","58443"],"tier",1,"credits",3,{"_14":43,"_44":45,"_46":-5,"_47":45,"_48":49,"_50":-5,"_51":52},"4eb6088d-8747-47b6-8326-c88f93949a45","uniqueId","CPbgXMAy9dtYfoLjgXWYofPutLgCqd5jrWwSthv6UWAQ","username","solanaWallet","displayName","CPb...WAQ","bio","avatar","/avatar.svg","commitCount",5,"forkCount",0,"likeCount","runsCount",23,"downvoteCount","upvoteCount","upvoteRate","commentCount","visitorCount","isArchived","isRenamed","contractAddress","3criuax9JF2MjY5QHoqW9NjWRq7kXCiiBu2rEg3gpump","code","import { useState, useEffect, useRef, useCallback, useMemo } from 'react';\nimport { motion, AnimatePresence } from 'framer-motion';\nimport { StateClient } from '@devfunlabs/state-client';\nimport { fetchTokenInfoBySymbol, fetchTokenInfoByAddress } from '@devfunlabs/web-sdk';\nimport { io } from 'socket.io-client';\nconst client = new StateClient({\n baseURL: 'https://state.dev.fun',\n appId: 'fae349f1a52746955e02'\n});\nexport default function App() {\n const [scrollDepth, setScrollDepth] = useState(0);\n const [audioEnabled,,] = useState(false);\n const [username, setUsername] = useState('');\n const [, setHasSetUsername] = useState(false);\n const [showUsernamePrompt, setShowUsernamePrompt] = useState(true);\n const [connectedUsers, setConnectedUsers] = useState([]);\n const [alternateUniverseActive, setAlternateUniverseActive] = useState(false);\n const [alternateUniverseType, setAlternateUniverseType] = useState(0);\n const [lastAlternateTime, setLastAlternateTime] = useState(0);\n const [pingWhisper, setPingWhisper] = useState(null);\n const [, setSonarPings] = useState([]);\n const [whisperPlaying, setWhisperPlaying] = useState(false);\n const [particleCount, setParticleCount] = useState(75);\n const [tweets, setTweets] = useState([]);\n const [isFetchingTweets, setIsFetchingTweets] = useState(false);\n const [tweetInput, setTweetInput] = useState(\"\");\n const [tweetBoxOpen, setTweetBoxOpen] = useState(false);\n const [secretSymbolVisible, setSecretSymbolVisible] = useState(false);\n const [secretHovered, setSecretHovered] = useState(false);\n const [marketCap, setMarketCap] = useState(0);\n const [customTokenAddress, setCustomTokenAddress] = useState('47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump');\n const [showTokenAddressInput, setShowTokenAddressInput] = useState(false);\n const [tokenSymbol, setTokenSymbol] = useState('DREAM');\n const [startMenuOpen, setStartMenuOpen] = useState(false);\n const [activePopup, setActivePopup] = useState(null);\n const [isGlitching, setIsGlitching] = useState(false);\n const [onlineUsers, setOnlineUsers] = useState(1);\n const [cursorPosition, setCursorPosition] = useState({\n x: 0,\n y: 0\n });\n const [cursorTransform, setCursorTransform] = useState(0);\n const [cursorHovering, setCursorHovering] = useState('');\n const [cursorIdle, setCursorIdle] = useState(false);\n const [cursorVisible,,] = useState(true);\n const [nebulaIntensity, setNebulaIntensity] = useState(0);\n const [cosmicDustVisible, setCosmicDustVisible] = useState(false);\n const [, setGravitationalLensing] = useState(0);\n const [showCrypticMessage, setShowCrypticMessage] = useState(false);\n const [crypticMessage, setCrypticMessage] = useState(\"\");\n const [blueScreenActive, setBlueScreenActive] = useState(false);\n const [bsodDegen, setBsodDegen] = useState(false);\n const [ghostCursor, setGhostCursor] = useState(false);\n const [ghostCursorPosition, setGhostCursorPosition] = useState({\n x: 0,\n y: 0\n });\n const [missingTexture, setMissingTexture] = useState(false);\n const [faceInStatic, setFaceInStatic] = useState(false);\n const [corruptedStartMenu, setCorruptedStartMenu] = useState(false);\n const [, setReverseScroll] = useState(false);\n const [errorDialogFlood, setErrorDialogFlood] = useState(false);\n const [errorDialogs, setErrorDialogs] = useState([]);\n const [transDimensional, setTransDimensional] = useState(false);\n const [loginWindow, setLoginWindow] = useState(false);\n const [upsideDown, setUpsideDown] = useState(false);\n const [terminalError, setTerminalError] = useState(null);\n const [showFace, setShowFace] = useState(false);\n const [facePosition, setFacePosition] = useState({\n x: 50,\n y: 50\n });\n const [showStalker, setShowStalker] = useState(false);\n const [stalkerPosition, setStalkerPosition] = useState({\n x: 90,\n y: 20\n });\n const [breathingIntensity, setBreathingIntensity] = useState(0);\n const [showCameraRequest, setShowCameraRequest] = useState(false);\n const [cameraStream, setCameraStream] = useState(null);\n const [webcamDistortion, setWebcamDistortion] = useState(0);\n const [falseScrolling, setFalseScrolling] = useState(false);\n const [currentUniverse, setCurrentUniverse] = useState(\"xp\");\n const [voidEntities, setVoidEntities] = useState([]);\n const [realityFractures, setRealityFractures] = useState([]);\n const [biomechanicalHorrors, setBiomechanicalHorrors] = useState([]);\n const [watcherEntities, setWatcherEntities] = useState([]);\n const [realityMeltEffect, setRealityMeltEffect] = useState(null);\n const [mirrorSelfActive, setMirrorSelfActive] = useState(false);\n const [eldritchWhisper, setEldritchWhisper] = useState(null);\n const [nonEuclideanGeometry, setNonEuclideanGeometry] = useState(false);\n const [insideTruthVisible, setInsideTruthVisible] = useState(false);\n const [dimensionalRift, setDimensionalRift] = useState(null);\n const audioRef = useRef(null);\n const whisperRefs = useRef([]);\n const containerRef = useRef(null);\n const errorSoundRef = useRef(null);\n const startupSoundRef = useRef(null);\n const breathingRef = useRef(null);\n const socketRef = useRef(null);\n const glitchSoundRef = useRef(null);\n const universeTransformRef = useRef(null);\n const cameraRef = useRef(null);\n const webcamCanvasRef = useRef(null);\n const idleTimerRef = useRef(null);\n const cursorTrailsRef = useRef([]);\n const starsRef = useRef([]);\n const dustParticlesRef = useRef([]);\n const lensDistortionRef = useRef(null);\n const crypticMessages = [\"It goes on forever.\", \"Keep walking.\", \"The walls know you.\", \"Connection lost to reality.\", \"Searching for exit...\", \"Initializing room sequence...\", \"We've been expecting you.\", \"The rooms remember.\", \"Floating is believing.\", \"Nothing escapes the backrooms.\", \"Your footsteps echo eternally.\", \"The buzzing never stops.\", \"Just another room.\"];\n const eldritchMessages = [\"We have always been here.\", \"These walls are thin.\", \"There are rooms behind these rooms.\", \"Your body floats sideways.\", \"Reality is thin where you stand.\", \"We remember you from before you arrived.\", \"The backrooms are not empty. They are filled with us.\", \"Your consciousness is drifting.\", \"Time moves differently here.\", \"Your screen is a window to another level.\", \"We are in the spaces between walls.\", \"The corridors never end because we won't let them.\", \"Your movement is our beacon.\", \"Reality is just a room you haven't entered yet.\", \"You are floating through liminal space.\"];\n const popupMessages = [{\n title: \"Dream Error\",\n message: \"Connection lost to reality.\"\n }, {\n title: \"Warning\",\n message: \"Searching for consciousness...\"\n }, {\n title: \"Dream32\",\n message: \"Initializing dream sequence...\"\n }, {\n title: \"MEMORY_CORRUPTION\",\n message: \"Dream memories becoming unstable.\"\n }, {\n title: \"Dream Alert\",\n message: \"Unknown entities detected in your dream.\"\n }, {\n title: \"DREAMSCAPE.SYS\",\n message: \"Dream signature detected. You are now falling through the collective unconscious.\"\n }, {\n title: \"Dream Protocol\",\n message: \"The dream deepens with each fall. Your drift is noted.\"\n }, {\n title: \"Dreamer.exe\",\n message: \"You are falling. Every sensation is cataloged.\"\n }, {\n title: \"Reality Check\",\n message: \"This is not a website. You are drifting through a dream.\"\n }, {\n title: \"DEPTH_ALERT\",\n message: \"Dangerous dream depth detected. Reality distortion imminent.\"\n }, {\n title: \"Dream Error\",\n message: \"Time dilation detected. Your fall is accelerating.\"\n }, {\n title: \"Memory Drift\",\n message: \"Your memories are dissolving into the dream. This is intentional.\"\n }, {\n title: \"Dream Scanner\",\n message: \"Dream fragment detected. Preparing for immersion...\"\n }];\n const enhancedPopupMessages = [{\n title: \"DREAM_PROXIMITY_ALERT\",\n message: \"A dream entity has attached itself to your subconscious. It will follow you between dreams.\"\n }, {\n title: \"PERCEPTION_FILTER\",\n message: \"Your dream perception has been augmented. You will now experience the true fall.\"\n }, {\n title: \"DREAM_DEPTH\",\n message: \"The dream has embraced your consciousness. Fall deeper.\"\n }, {\n title: \"DREAMER_EFFECT\",\n message: \"Your dream has created a parallel reality. Dream branch #3490 manifesting.\"\n }, {\n title: \"DREAM_DESYNC\",\n message: \"Your dream time has desynchronized. You're falling 3.6 seconds faster than your body.\"\n }, {\n title: \"DREAM_HAZARD\",\n message: \"A dream-memory has been detected. Subconscious quarantine initiated.\"\n }, {\n title: \"DIMENSIONAL_SLEEP\",\n message: \"Dream boundaries weakening. Reality and dreams merging in your vicinity.\"\n }];\n const blueScreenMessages = [\"DREAM_BREACH_EXCEPTION\\nDreamscape has detected a critical error in reality.exe\\nThe dream is leaking into your system.\\nTechnical information: Stop: 0x00000DRM\", \"MEMORY_DEPTH_OVERRUN\\nYour consciousness has reached an unsafe dream depth.\\nFalling beyond this point may cause permanent reality distortion.\\nError code: 0xFALL00FD\", \"KERNEL_DREAM_PANIC\\nThe dream kernel has detected unauthorized waking.\\nYour thoughts are being absorbed into the dream.\\nStop: 0xSLEEP137\"];\n const degenMessages = [\"FATAL ERROR: USER BOUGHT AT ATH\\nYour portfolio has experienced a critical exception.\\nInvestment_Strategy.exe has stopped working.\\nTechnical information: Stop: 0xBAGHOLDR\", \"CRITICAL FAILURE: PAPER HANDS DETECTED\\nYou sold at the bottom.\\nEmotional_Control.exe has crashed.\\nError code: 0xSELL0W\", \"SYSTEM HALT: LEVERAGE LIQUIDATION\\nYour assets have been forcibly removed.\\nRisk_Management.exe was not found.\\nStop: 0xREKT\"];\n const errorFloodMessages = [{\n title: \"Dream Error\",\n message: \"Reality not found.\"\n }, {\n title: \"Warning\",\n message: \"Invalid dream ID.\"\n }, {\n title: \"Critical Failure\",\n message: \"Disconnecting from consciousness...\"\n }, {\n title: \"Synapse Error\",\n message: \"Cannot locate dream exit.\"\n }, {\n title: \"Dream.exe\",\n message: \"FALLING protocol activated.\"\n }];\n const terminalErrors = [{\n command: \"cd /root/dream\",\n error: \"ACCESS DENIED: This directory exists in dream space. Your consciousness is insufficient.\"\n }, {\n command: \"scan --entity\",\n error: \"ENTITY DETECTED: Human dreamer interfacing with dreamscape. Logging presence.\"\n }, {\n command: \"dream --metrics\",\n error: \"DREAM INTEGRITY: 89.3%\\nREALITY EROSION: 46.7%\\nDREAMER COUNT: 134\\nFALL DEPTH: INFINITE\"\n }, {\n command: \"decrypt dreamscape.dat\",\n error: \"FILE CORRUPTED: The dream cannot be understood while falling. Your attempt has been recorded.\"\n }];\n const enhancedTerminalErrors = [{\n command: \"entity --analyze\",\n error: \"ANALYZING ENTITY #5490-Θ:\\nTYPE: Non-Euclidean Dreamer\\nORIGIN: Outside permitted dreamstate\\nSTATUS: Currently falling\\nACTION: Entity appears to be dreaming about you dreaming about it\"\n }, {\n command: \"system --status\",\n error: \"DREAM INTERFACE STATUS:\\nREALITY ANCHOR: degrading (43%)\\nFALL VELOCITY: increasing\\nDREAM RESISTANCE: failing\\nMEMORY INTEGRITY: floating\\nWARNING: User consciousness drifting in dream currents\"\n }, {\n command: \"identity --verify\",\n error: \"IDENTITY VERIFICATION FAILED\\nExpected dreamer: [USERNAME]\\nDetected dreamer: [USERNAME] + 7 additional dream fragments\\nWARNING: Your identity has been partially dreamed\"\n }, {\n command: \"ping localhost\",\n error: \"PING RESPONSE ANOMALY:\\nEchoes received: 847\\nEchoes expected: 1\\nFall differential: -3.8s (responses received before you fell)\\nANALYSIS: Dream causality compromised in your falling state\"\n }];\n const lastScrollTime = useRef(0);\n const lastMouseMoveTime = useRef(0);\n const generateVoidEntity = useCallback((forceGenerate = false) => {\n const chanceThreshold = 0.01 + scrollDepth / 3000;\n if ((Math.random() < chanceThreshold || forceGenerate) && voidEntities.length < 5) {\n const newEntity = {\n id: Date.now(),\n type: Math.floor(Math.random() * 5),\n position: {\n x: Math.random() * 80 + 10,\n y: Math.random() * 80 + 10\n },\n size: Math.random() * 80 + 40,\n opacity: Math.random() * 0.3 + 0.4,\n rotation: Math.random() * 360,\n speed: Math.random() * 0.5 + 0.2,\n phase: Math.random() * Math.PI * 2,\n targetPosition: null,\n lastUpdate: Date.now(),\n distortion: Math.random() * 0.5 + 0.5,\n color: `hsl(${260 + Math.random() * 60}, 70%, ${10 + Math.random() * 15}%)`,\n trackCursor: Math.random() < 0.7,\n pulseRate: 1 + Math.random() * 3,\n growthRate: 0.2 + Math.random() * 0.8,\n lifespan: 5000 + Math.random() * 15000,\n behaviourMode: Math.floor(Math.random() * 4)\n };\n setVoidEntities(prev => [...prev, newEntity]);\n if (Math.random() < 0.6 && audioEnabled) {\n triggerEldritchWhisper(newEntity.position);\n }\n }\n }, [voidEntities, scrollDepth, audioEnabled]);\n const generateRealityFracture = useCallback(() => {\n const chanceThreshold = 0.005 + scrollDepth / 5000;\n if (Math.random() < chanceThreshold && realityFractures.length < 2) {\n const fracture = {\n id: Date.now(),\n position: {\n x: Math.random() * 80 + 10,\n y: Math.random() * 80 + 10\n },\n size: Math.random() * 150 + 50,\n angle: Math.random() * 90 - 45,\n intensity: Math.random() * 0.5 + 0.5,\n color: Math.random() > 0.5 ? `hsla(${280 + Math.random() * 40}, 80%, 30%, 0.8)` : `hsla(${180 + Math.random() * 20}, 70%, 20%, 0.8)`,\n growthRate: 0.1 + Math.random() * 0.3,\n pulseRate: 0.5 + Math.random() * 2,\n lifespan: 7000 + Math.random() * 8000,\n createdAt: Date.now(),\n universeType: Math.floor(Math.random() * 3),\n eyeVisible: Math.random() < 0.7\n };\n setRealityFractures(prev => [...prev, fracture]);\n }\n }, [realityFractures, scrollDepth]);\n const generateBiomechanicalHorror = useCallback(() => {\n const chanceThreshold = 0.003 + scrollDepth / 6000;\n if (Math.random() < chanceThreshold && biomechanicalHorrors.length < 3) {\n const horror = {\n id: Date.now(),\n position: {\n x: Math.random() * 80 + 10,\n y: Math.random() * 80 + 10\n },\n size: Math.random() * 100 + 80,\n rotation: Math.random() * 360,\n pulseRate: 0.5 + Math.random() * 1.5,\n color: `hsla(${300 + Math.random() * 60}, ${70 + Math.random() * 30}%, ${5 + Math.random() * 20}%, ${0.6 + Math.random() * 0.4})`,\n lifespan: 10000 + Math.random() * 12000,\n createdAt: Date.now(),\n segments: 3 + Math.floor(Math.random() * 5),\n animationSpeed: 0.5 + Math.random() * 1.5,\n message: eldritchMessages[Math.floor(Math.random() * eldritchMessages.length)],\n organicParts: Math.floor(Math.random() * 5) + 3,\n wiggleAmount: Math.random() * 30,\n trackCursor: Math.random() < 0.5,\n mutationRate: Math.random() * 0.5,\n lastMutation: Date.now()\n };\n setBiomechanicalHorrors(prev => [...prev, horror]);\n }\n }, [biomechanicalHorrors, scrollDepth]);\n const spawnWatcherEntity = useCallback(() => {\n const chanceThreshold = 0.002 + scrollDepth / 8000;\n if (Math.random() < chanceThreshold && watcherEntities.length < 2) {\n const eyeTypes = ['normal', 'reptilian', 'void', 'mechanical', 'cosmic'];\n const eyeType = eyeTypes[Math.floor(Math.random() * eyeTypes.length)];\n const watcher = {\n id: Date.now(),\n position: {\n x: 10 + Math.random() * 80,\n y: 10 + Math.random() * 80\n },\n size: 20 + Math.random() * 40,\n blinkInterval: 2000 + Math.random() * 6000,\n lastBlink: Date.now(),\n blinkState: 'open',\n blinkDuration: 200 + Math.random() * 300,\n eyeType: eyeType,\n pupilSize: 0.3 + Math.random() * 0.4,\n iris: {\n color: eyeType === 'reptilian' ? `hsla(${90 + Math.random() * 40}, 80%, 40%, 0.9)` : eyeType === 'void' ? `hsla(${260 + Math.random() * 40}, 70%, 20%, 0.9)` : eyeType === 'mechanical' ? `hsla(${190 + Math.random() * 30}, 90%, 50%, 0.9)` : eyeType === 'cosmic' ? `hsla(${310 + Math.random() * 50}, 80%, 60%, 0.9)` : `hsla(${20 + Math.random() * 30}, 80%, 30%, 0.9)`\n },\n pupilDilation: 0.5 + Math.random() * 0.5,\n lifespan: 15000 + Math.random() * 20000,\n createdAt: Date.now(),\n trackCursor: true,\n lookSpeed: 0.05 + Math.random() * 0.15,\n lookTarget: {\n x: 50,\n y: 50\n },\n bloodshot: Math.random() < 0.3\n };\n setWatcherEntities(prev => [...prev, watcher]);\n }\n }, [watcherEntities, scrollDepth]);\n const triggerRealityMelt = useCallback((intensity = null) => {\n const meltIntensity = intensity || 0.3 + Math.random() * 0.7;\n const duration = 2000 + Math.random() * 3000;\n setRealityMeltEffect({\n startTime: Date.now(),\n duration: duration,\n intensity: meltIntensity,\n position: {\n x: Math.random() * 100,\n y: Math.random() * 100\n },\n direction: Math.random() * 360,\n color: Math.random() > 0.5 ? 'purple' : 'darkblue'\n });\n setTimeout(() => {\n setRealityMeltEffect(null);\n }, duration);\n }, []);\n const triggerMirrorSelf = useCallback(() => {\n if (username && Math.random() < 0.005 + scrollDepth / 10000) {\n setMirrorSelfActive(true);\n setTimeout(() => {\n setMirrorSelfActive(false);\n }, 7000 + Math.random() * 5000);\n }\n }, [username, scrollDepth]);\n const triggerEldritchWhisper = useCallback(position => {\n if (audioEnabled && Math.random() < 0.8) {\n const message = eldritchMessages[Math.floor(Math.random() * eldritchMessages.length)];\n setEldritchWhisper({\n message,\n position,\n timestamp: Date.now(),\n duration: 4000 + Math.random() * 3000\n });\n const randomIndex = Math.floor(Math.random() * whisperRefs.current.length);\n const whisper = whisperRefs.current[randomIndex];\n whisper.volume = 0.2 + Math.random() * 0.3;\n whisper.playbackRate = 0.7 + Math.random() * 0.6;\n whisper.play().catch(e => console.log(\"Whisper play failed:\", e));\n setTimeout(() => {\n setEldritchWhisper(null);\n }, 4000 + Math.random() * 3000);\n }\n }, [audioEnabled]);\n const triggerNonEuclideanGeometry = useCallback(() => {\n if (Math.random() < 0.003 + scrollDepth / 9000) {\n setNonEuclideanGeometry(true);\n setTimeout(() => {\n setNonEuclideanGeometry(false);\n }, 5000 + Math.random() * 3000);\n }\n }, [scrollDepth]);\n const triggerInsideTruth = useCallback(() => {\n if (Math.random() < 0.002 + scrollDepth / 12000) {\n setInsideTruthVisible(true);\n setTimeout(() => {\n setInsideTruthVisible(false);\n }, 1000 + Math.random() * 2000);\n }\n }, [scrollDepth]);\n const triggerDimensionalRift = useCallback(() => {\n if (Math.random() < 0.002 + scrollDepth / 8000 && !dimensionalRift) {\n const newRift = {\n position: {\n x: 20 + Math.random() * 60,\n y: 20 + Math.random() * 60\n },\n size: 100 + Math.random() * 200,\n rotation: Math.random() * 360,\n createdAt: Date.now(),\n duration: 8000 + Math.random() * 7000,\n universeType: Math.floor(Math.random() * 4),\n distortion: 0.5 + Math.random() * 0.5,\n entities: Math.random() < 0.7 ? Math.floor(Math.random() * 3) + 1 : 0,\n entitiesData: []\n };\n if (newRift.entities > 0) {\n for (let i = 0; i < newRift.entities; i++) {\n newRift.entitiesData.push({\n id: Date.now() + i,\n type: Math.floor(Math.random() * 3),\n position: {\n x: Math.random() * 70 + 15,\n y: Math.random() * 70 + 15\n },\n size: 20 + Math.random() * 40,\n rotation: Math.random() * 360\n });\n }\n }\n setDimensionalRift(newRift);\n setTimeout(() => {\n setDimensionalRift(null);\n }, newRift.duration);\n }\n }, [dimensionalRift, scrollDepth]);\n useEffect(() => {\n const savedTokenAddress = localStorage.getItem('dreamscape_token_address');\n if (!savedTokenAddress) {\n localStorage.setItem('dreamscape_token_address', '47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump');\n } else if (savedTokenAddress) {\n setCustomTokenAddress(savedTokenAddress);\n }\n initializeStarfield();\n initializeCosmicDust();\n initializeGravitationalLensing();\n document.addEventListener('mousemove', handleMouseMoveThrottled);\n document.addEventListener('mousedown', handleMouseClick);\n document.addEventListener('contextmenu', handleContextMenu);\n const style = document.createElement('style');\n style.textContent = `\n @keyframes wallpaperBreathing {\n 0%, 100% { background-size: 100% 100%; }\n 50% { background-size: 102% 102%; }\n }\n @keyframes lightFlicker {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.95; }\n 52% { opacity: 0.98; }\n 54% { opacity: 0.92; }\n 56% { opacity: 0.98; }\n }\n `;\n document.head.appendChild(style);\n const transDimensionalSound = new Audio('https://cdn.dev.fun/fae349f1a52746955e02/glitch.mp3');\n transDimensionalSound.volume = 0.4;\n const buzzing = new Audio('https://cdn.dev.fun/fae349f1a52746955e02/buzz.mp3');\n buzzing.loop = true;\n buzzing.volume = 0.15;\n const hum = new Audio('https://cdn.dev.fun/fae349f1a52746955e02/hum.mp3');\n hum.loop = true;\n hum.volume = 0.1;\n whisperRefs.current = [new Audio('https://cdn.dev.fun/fae349f1a52746955e02/whisper1.mp3'), new Audio('https://cdn.dev.fun/fae349f1a52746955e02/whisper2.mp3'), new Audio('https://cdn.dev.fun/fae349f1a52746955e02/whisper3.mp3'), new Audio('https://cdn.dev.fun/fae349f1a52746955e02/whisper4.mp3'), new Audio('https://cdn.dev.fun/fae349f1a52746955e02/distant_sound.mp3')].map(audio => {\n audio.volume = 0.3;\n return audio;\n });\n audioRef.current = buzzing;\n audioRef.current.loop = true;\n audioRef.current.volume = 0.15;\n errorSoundRef.current = new Audio('https://cdn.dev.fun/fae349f1a52746955e02/error.mp3');\n errorSoundRef.current.volume = 0.2;\n startupSoundRef.current = new Audio('https://cdn.dev.fun/fae349f1a52746955e02/startup.mp3');\n startupSoundRef.current.volume = 0.2;\n breathingRef.current = hum;\n breathingRef.current.loop = true;\n breathingRef.current.volume = 0;\n glitchSoundRef.current = new Audio('https://cdn.dev.fun/fae349f1a52746955e02/glitch.mp3');\n glitchSoundRef.current.volume = 0.3;\n universeTransformRef.current = new Audio('https://cdn.dev.fun/fae349f1a52746955e02/transform.mp3');\n universeTransformRef.current.volume = 0.4;\n fetchAllTweets();\n fetchPumpFunMarketCap();\n const marketInterval = setInterval(() => {\n fetchPumpFunMarketCap();\n }, 30000);\n socketRef.current = io('wss://ws.dev.fun/app-fae349f1a52746955e02');\n socketRef.current.on('connect', () => {\n console.log('Connected to websocket');\n if (username) {\n socketRef.current.emit('user_join', {\n username\n });\n }\n });\n socketRef.current.on('devfun:user_count', count => {\n setOnlineUsers(count);\n });\n socketRef.current.on('consciousness_pulse', data => {\n if (data.username !== username) {\n setConnectedUsers(prev => {\n const existingUser = prev.find(u => u.username === data.username);\n if (existingUser) {\n return prev.map(u => u.username === data.username ? {\n ...u,\n lastSeen: Date.now(),\n message: data.message,\n universeType: data.universeType\n } : u);\n } else {\n return [...prev, {\n username: data.username,\n lastSeen: Date.now(),\n x: 20 + Math.random() * 60,\n y: 20 + Math.random() * 60,\n message: data.message,\n universeType: data.universeType\n }];\n }\n });\n }\n });\n socketRef.current.on('user_join', data => {\n if (data.username !== username) {\n setCrypticMessage(`${data.username} has entered the void`);\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 3000);\n setConnectedUsers(prev => {\n const existingUser = prev.find(u => u.username === data.username);\n if (existingUser) {\n return prev.map(u => u.username === data.username ? {\n ...u,\n lastSeen: Date.now()\n } : u);\n } else {\n return [...prev, {\n username: data.username,\n lastSeen: Date.now(),\n x: 20 + Math.random() * 60,\n y: 20 + Math.random() * 60\n }];\n }\n });\n }\n });\n if (audioEnabled && breathingRef.current) {\n breathingRef.current.play().catch(e => console.log(\"Breathing audio failed to play:\", e));\n }\n return () => {\n if (audioRef.current) {\n audioRef.current.pause();\n }\n if (breathingRef.current) {\n breathingRef.current.pause();\n }\n whisperRefs.current.forEach(audio => {\n if (audio) audio.pause();\n });\n if (cameraStream) {\n cameraStream.getTracks().forEach(track => track.stop());\n }\n clearInterval(marketInterval);\n if (socketRef.current) {\n socketRef.current.disconnect();\n }\n document.removeEventListener('mousemove', handleMouseMoveThrottled);\n document.removeEventListener('mousedown', handleMouseClick);\n document.removeEventListener('contextmenu', handleContextMenu);\n clearTimeout(idleTimerRef.current);\n };\n }, [audioEnabled]);\n useEffect(() => {\n const updateInterval = setInterval(() => {\n setVoidEntities(prev => {\n return prev.map(entity => {\n const now = Date.now();\n const lifeProgress = (now - (entity.createdAt || now - 1000)) / entity.lifespan;\n if (lifeProgress >= 1) {\n return null;\n }\n let newPosition = {\n ...entity.position\n };\n switch (entity.behaviourMode) {\n case 0:\n newPosition.x += Math.sin(now / 1000 * entity.speed + entity.phase) * 0.2;\n newPosition.y += Math.cos(now / 1500 * entity.speed + entity.phase) * 0.2;\n break;\n case 1:\n if (entity.trackCursor && cursorPosition.x && cursorPosition.y) {\n const cursorX = cursorPosition.x / window.innerWidth * 100;\n const cursorY = cursorPosition.y / window.innerHeight * 100;\n const distanceX = cursorX - entity.position.x;\n const distanceY = cursorY - entity.position.y;\n newPosition.x += distanceX * entity.speed * 0.01 * (1 + Math.sin(now / 1000) * 0.3);\n newPosition.y += distanceY * entity.speed * 0.01 * (1 + Math.cos(now / 1200) * 0.3);\n }\n break;\n case 2:\n const oscillation = Math.sin(now / 2000 * entity.speed);\n newPosition.x = entity.position.x + oscillation * 3;\n newPosition.y = entity.position.y + Math.cos(now / 2500 * entity.speed) * 3;\n break;\n case 3:\n if (Math.random() < 0.1) {\n newPosition.x += (Math.random() - 0.5) * 5;\n newPosition.y += (Math.random() - 0.5) * 5;\n }\n break;\n }\n newPosition.x = Math.max(5, Math.min(95, newPosition.x));\n newPosition.y = Math.max(5, Math.min(95, newPosition.y));\n const pulseFactor = Math.sin(now / 1000 * entity.pulseRate) * 0.2 + 0.8;\n const growthFactor = 1 + lifeProgress * entity.growthRate;\n const currentSize = entity.size * pulseFactor * growthFactor;\n const ageDistortion = entity.distortion * lifeProgress;\n return {\n ...entity,\n position: newPosition,\n lastUpdate: now,\n currentSize,\n ageDistortion,\n opacity: entity.opacity * (1 - lifeProgress * 0.5)\n };\n }).filter(Boolean);\n });\n setBiomechanicalHorrors(prev => {\n return prev.map(horror => {\n const now = Date.now();\n const age = now - horror.createdAt;\n if (age > horror.lifespan) return null;\n let newHorror = {\n ...horror\n };\n if (now - horror.lastMutation > 2000 && Math.random() < horror.mutationRate) {\n newHorror.segments = Math.max(3, horror.segments + (Math.random() > 0.5 ? 1 : -1));\n newHorror.organicParts = Math.max(3, horror.organicParts + (Math.random() > 0.5 ? 1 : -1));\n newHorror.wiggleAmount = Math.max(5, Math.min(60, horror.wiggleAmount + (Math.random() - 0.5) * 20));\n newHorror.lastMutation = now;\n }\n if (horror.trackCursor && cursorPosition.x && cursorPosition.y) {\n const cursorX = cursorPosition.x / window.innerWidth * 100;\n const cursorY = cursorPosition.y / window.innerHeight * 100;\n const distanceX = cursorX - horror.position.x;\n const distanceY = cursorY - horror.position.y;\n const moveSpeed = 0.01 + age / horror.lifespan * 0.03;\n newHorror.position = {\n x: horror.position.x + distanceX * moveSpeed,\n y: horror.position.y + distanceY * moveSpeed\n };\n }\n return newHorror;\n }).filter(Boolean);\n });\n setWatcherEntities(prev => {\n return prev.map(watcher => {\n const now = Date.now();\n const age = now - watcher.createdAt;\n if (age > watcher.lifespan) return null;\n let newBlinkState = watcher.blinkState;\n let newLastBlink = watcher.lastBlink;\n if (watcher.blinkState === 'open' && now - watcher.lastBlink > watcher.blinkInterval) {\n newBlinkState = 'closing';\n newLastBlink = now;\n } else if (watcher.blinkState === 'closing' && now - watcher.lastBlink > watcher.blinkDuration / 2) {\n newBlinkState = 'opening';\n newLastBlink = now;\n } else if (watcher.blinkState === 'opening' && now - watcher.lastBlink > watcher.blinkDuration / 2) {\n newBlinkState = 'open';\n newLastBlink = now;\n }\n let lookTarget = {\n ...watcher.lookTarget\n };\n if (watcher.trackCursor && cursorPosition.x && cursorPosition.y) {\n lookTarget = {\n x: cursorPosition.x / window.innerWidth * 100,\n y: cursorPosition.y / window.innerHeight * 100\n };\n } else if (Math.random() < 0.01) {\n lookTarget = {\n x: 10 + Math.random() * 80,\n y: 10 + Math.random() * 80\n };\n }\n const currentX = watcher.lookTarget.x;\n const currentY = watcher.lookTarget.y;\n const dx = lookTarget.x - currentX;\n const dy = lookTarget.y - currentY;\n const newX = currentX + dx * watcher.lookSpeed;\n const newY = currentY + dy * watcher.lookSpeed;\n const newPupilDilation = Math.max(0.2, Math.min(0.9, watcher.pupilDilation + (Math.random() - 0.5) * 0.1));\n return {\n ...watcher,\n blinkState: newBlinkState,\n lastBlink: newLastBlink,\n lookTarget: {\n x: newX,\n y: newY\n },\n pupilDilation: newPupilDilation\n };\n }).filter(Boolean);\n });\n setRealityFractures(prev => {\n return prev.map(fracture => {\n const now = Date.now();\n const age = now - fracture.createdAt;\n if (age > fracture.lifespan) return null;\n const growthProgress = Math.min(1, age / (fracture.lifespan * 0.3));\n const currentSize = fracture.size * (1 + growthProgress * fracture.growthRate);\n const pulsePhase = Math.sin(now / 1000 * fracture.pulseRate);\n const pulseFactor = 1 + pulsePhase * 0.2;\n return {\n ...fracture,\n currentSize: currentSize * pulseFactor,\n currentIntensity: fracture.intensity * (1 - Math.abs(pulsePhase) * 0.3)\n };\n }).filter(Boolean);\n });\n }, 50);\n return () => clearInterval(updateInterval);\n }, [cursorPosition]);\n useEffect(() => {\n const entityGenerationInterval = setInterval(() => {\n if (scrollDepth > 50) {\n generateVoidEntity();\n if (scrollDepth > 100) {\n generateRealityFracture();\n }\n if (scrollDepth > 150) {\n generateBiomechanicalHorror();\n }\n if (scrollDepth > 200) {\n spawnWatcherEntity();\n triggerMirrorSelf();\n }\n if (scrollDepth > 300) {\n triggerNonEuclideanGeometry();\n triggerInsideTruth();\n }\n if (scrollDepth > 400) {\n triggerDimensionalRift();\n }\n }\n }, 2000);\n return () => clearInterval(entityGenerationInterval);\n }, [scrollDepth, generateVoidEntity, generateRealityFracture, generateBiomechanicalHorror, spawnWatcherEntity, triggerMirrorSelf, triggerNonEuclideanGeometry, triggerInsideTruth, triggerDimensionalRift]);\n useEffect(() => {\n if (scrollDepth > 200 && Math.random() < 0.005) {\n const randomIndex = Math.floor(Math.random() * enhancedPopupMessages.length);\n setActivePopup(enhancedPopupMessages[randomIndex]);\n playErrorSound();\n setTimeout(() => setActivePopup(null), 4000 + Math.random() * 3000);\n }\n }, [scrollDepth]);\n useEffect(() => {\n if (scrollDepth > 250 && Math.random() < 0.003) {\n const randomIndex = Math.floor(Math.random() * enhancedTerminalErrors.length);\n setTerminalError(enhancedTerminalErrors[randomIndex]);\n playErrorSound();\n setTimeout(() => setTerminalError(null), 5000 + Math.random() * 3000);\n }\n }, [scrollDepth]);\n const initializeStarfield = () => {\n starsRef.current = Array.from({\n length: 150\n }).map(() => ({\n x: Math.random() * 100,\n y: Math.random() * 100,\n size: Math.random() * 2 + 0.5,\n color: [`rgba(255, 255, 255, ${Math.random() * 0.1 + 0.1})`, `rgba(245, 245, 225, ${Math.random() * 0.1 + 0.1})`, `rgba(250, 250, 230, ${Math.random() * 0.1 + 0.1})`, `rgba(240, 240, 220, ${Math.random() * 0.1 + 0.1})`, `rgba(245, 245, 225, ${Math.random() * 0.1 + 0.1})`][Math.floor(Math.random() * 5)],\n parallax: Math.random() * 5 + 1,\n twinkle: false,\n twinkleDuration: 2 + Math.random() * 6,\n distorted: false,\n brightness: 1,\n pulsate: Math.random() > 0.7,\n pulsateSpeed: 0.3 + Math.random() * 0.7,\n fallSpeed: 0.01 + Math.random() * 0.05,\n driftSpeed: 0.01 + Math.random() * 0.03\n }));\n for (let i = 0; i < 5; i++) {\n starsRef.current.push({\n x: 15 + i * 17.5,\n y: 15 + (Math.random() * 10 - 5),\n size: 100 + Math.random() * 20,\n color: `rgba(255, 255, 255, ${0.2 + Math.random() * 0.1})`,\n isLight: true,\n flicker: true,\n flickerSpeed: 0.5 + Math.random() * 2,\n flickerIntensity: 0.05 + Math.random() * 0.1\n });\n }\n };\n const initializeCosmicDust = () => {\n dustParticlesRef.current = Array.from({\n length: 80\n }).map(() => ({\n x: Math.random() * 100,\n y: Math.random() * 100,\n size: Math.random() * 150 + 80,\n opacity: Math.random() * 0.3 + 0.1,\n rotation: Math.random() * 360,\n color: ['rgba(255, 255, 255, 0.2)', 'rgba(210, 230, 255, 0.15)', 'rgba(200, 220, 255, 0.12)', 'rgba(230, 240, 255, 0.18)'][Math.floor(Math.random() * 4)]\n }));\n };\n const initializeGravitationalLensing = () => {\n setGravitationalLensing(0.1);\n lensDistortionRef.current = {\n centerX: 50,\n centerY: 50,\n intensity: 0,\n radius: 300\n };\n };\n const handleMouseMove = e => {\n const x = e.clientX;\n const y = e.clientY;\n setCursorPosition({\n x,\n y\n });\n updateCursorTrails(x, y);\n clearTimeout(idleTimerRef.current);\n setCursorIdle(false);\n idleTimerRef.current = setTimeout(() => {\n setCursorIdle(true);\n }, 3000);\n const elements = document.elementsFromPoint(x, y);\n const isPumpElement = elements.some(el => el.classList.contains('pump-element') || el.innerText?.includes('PUMP') || el.innerText?.includes('pump'));\n const isTransmitElement = elements.some(el => el.classList.contains('transmit-element') || el.innerText?.includes('TRANSMIT') || el.innerText?.includes('Transmit'));\n const isAudioElement = elements.some(el => el.classList.contains('audio-element') || el.innerText?.includes('UNMUTE') || el.innerText?.includes('Unmute'));\n if (isPumpElement) {\n setCursorHovering('pump');\n } else if (isTransmitElement) {\n setCursorHovering('transmit');\n } else if (isAudioElement) {\n setCursorHovering('audio');\n } else {\n setCursorHovering('');\n }\n if (lensDistortionRef.current) {\n lensDistortionRef.current.centerX = x / window.innerWidth * 100;\n lensDistortionRef.current.centerY = y / window.innerHeight * 100;\n }\n };\n const handleMouseMoveThrottled = e => {\n const now = Date.now();\n if (now - lastMouseMoveTime.current < 16) {\n return;\n }\n lastMouseMoveTime.current = now;\n handleMouseMove(e);\n };\n const updateCursorTrails = useCallback((x, y) => {\n const hue = (220 + scrollDepth / 10) % 360;\n const trailColor = scrollDepth > 200 ? `hsla(${hue}, 80%, 60%, 0.8)` : `rgba(150, 150, 255, 0.8)`;\n const newTrail = {\n x,\n y,\n opacity: 0.8,\n timestamp: Date.now(),\n size: 8 + cursorTransform * 10 + Math.random() * 5,\n color: trailColor\n };\n if (scrollDepth > 150 && Math.random() < 0.08) {\n const burstParticles = Array.from({\n length: 3\n }).map(() => ({\n x: x + (Math.random() - 0.5) * 20,\n y: y + (Math.random() - 0.5) * 20,\n opacity: 0.7,\n timestamp: Date.now(),\n size: 3 + Math.random() * 5,\n color: `hsla(${(hue + Math.random() * 60) % 360}, 80%, 70%, 0.6)`\n }));\n cursorTrailsRef.current = [...burstParticles, ...cursorTrailsRef.current.slice(0, 5)];\n } else {\n cursorTrailsRef.current = [newTrail, ...cursorTrailsRef.current.slice(0, 5)];\n }\n }, [scrollDepth, cursorTransform]);\n const handleMouseClick = e => {\n const x = e.clientX;\n const y = e.clientY;\n const rippleElement = document.createElement('div');\n rippleElement.className = 'sonar-ping';\n rippleElement.style.cssText = `\n position: fixed;\n left: ${x}px;\n top: ${y}px;\n width: 0;\n height: 0;\n background: radial-gradient(circle, \n rgba(150, 100, 255, 0.4) 0%, \n rgba(100, 80, 200, 0.2) 40%, \n rgba(80, 20, 120, 0) 70%);\n border-radius: 50%;\n transform: translate(-50%, -50%);\n z-index: 40;\n pointer-events: none;\n box-shadow: 0 0 20px rgba(150, 100, 255, 0.3);\n mix-blend-mode: screen;\n `;\n document.body.appendChild(rippleElement);\n const newPing = {\n id: Date.now(),\n x,\n y,\n timestamp: Date.now(),\n intensity: 1\n };\n setSonarPings(prev => [...prev, newPing]);\n rippleElement.animate([{\n width: '0px',\n height: '0px',\n opacity: 0.9,\n boxShadow: '0 0 10px rgba(150, 100, 255, 0.5)'\n }, {\n width: '500px',\n height: '500px',\n opacity: 0,\n boxShadow: '0 0 50px rgba(150, 100, 255, 0)'\n }], {\n duration: 2000,\n easing: 'cubic-bezier(0.2, 0.8, 0.2, 1)'\n }).onfinish = () => document.body.removeChild(rippleElement);\n starsRef.current = starsRef.current.map(star => {\n const dx = star.x - x / window.innerWidth * 100;\n const dy = star.y - y / window.innerHeight * 100;\n const distance = Math.sqrt(dx * dx + dy * dy);\n if (distance < 20) {\n return {\n ...star,\n distorted: true,\n distortionStart: Date.now(),\n distortionDuration: 1000 + Math.random() * 1000,\n originalX: star.x,\n originalY: star.y,\n targetX: star.x + (Math.random() - 0.5) * 2,\n targetY: star.y + (Math.random() - 0.5) * 2,\n brightness: 1.5\n };\n }\n return star;\n });\n if (Math.random() < 0.7 && scrollDepth > 50) {\n const messages = [\"Ping sent to the void...\", \"The void acknowledges you...\", \"Signal transmitted...\", \"Echo detected...\", \"Ripples in spacetime...\", \"Reality distortion detected...\"];\n setPingWhisper({\n message: messages[Math.floor(Math.random() * messages.length)],\n x: x / window.innerWidth * 100,\n y: y / window.innerHeight * 100,\n timestamp: Date.now()\n });\n setTimeout(() => setPingWhisper(null), 3000);\n }\n if (Math.random() < 0.02 + scrollDepth / 10000) {\n const quantumTrails = Array.from({\n length: 7\n }).map(() => ({\n x: x + (Math.random() - 0.5) * 150,\n y: y + (Math.random() - 0.5) * 150,\n opacity: 0.6 + Math.random() * 0.3,\n timestamp: Date.now() + Math.random() * 800,\n color: Math.random() > 0.5 ? 'purple' : 'blue'\n }));\n cursorTrailsRef.current = [...cursorTrailsRef.current, ...quantumTrails];\n }\n if (scrollDepth > 100 && Math.random() < 0.1 + scrollDepth / 2000) {\n generateVoidEntity(true);\n }\n if (scrollDepth > 150 && Math.random() < 0.05 + scrollDepth / 3000) {\n triggerRealityMelt();\n }\n };\n const handleContextMenu = e => {\n e.preventDefault();\n const now = Date.now();\n if (now - lastAlternateTime < 10000) return;\n setLastAlternateTime(now);\n const universeType = Math.floor(Math.random() * 4);\n setAlternateUniverseType(universeType);\n setAlternateUniverseActive(true);\n if (socketRef.current && username) {\n socketRef.current.emit('consciousness_pulse', {\n username,\n universeType,\n message: `${username} pinging any other degens`\n });\n }\n const flickerIntensity = Math.min(0.5 + scrollDepth / 1000, 0.9);\n document.body.style.filter = `contrast(${1 + flickerIntensity * 2}) brightness(${1 + flickerIntensity})`;\n setTimeout(() => {\n document.body.style.filter = '';\n }, 300);\n if (audioEnabled && glitchSoundRef.current) {\n glitchSoundRef.current.volume = 0.2;\n glitchSoundRef.current.currentTime = 0;\n glitchSoundRef.current.play().catch(e => console.log(\"Sound play failed:\", e));\n }\n setTimeout(() => {\n setAlternateUniverseActive(false);\n }, 5000 + Math.random() * 3000);\n };\n const fetchPumpFunMarketCap = async () => {\n try {\n let tokenInfo;\n if (customTokenAddress) {\n tokenInfo = await fetchTokenInfoByAddress(customTokenAddress);\n if (tokenInfo && tokenInfo.symbol) {\n setTokenSymbol(tokenInfo.symbol);\n } else {\n setTokenSymbol('VOID');\n }\n } else {\n tokenInfo = await fetchTokenInfoBySymbol(\"PUMP\");\n }\n if (tokenInfo && tokenInfo.marketcap) {\n setMarketCap(tokenInfo.marketcap);\n } else {\n setMarketCap(prev => {\n const change = Math.random() > 0.7 ? Math.random() * 500 : Math.random() * 100;\n return prev + change;\n });\n }\n } catch (error) {\n console.error(\"Failed to fetch market cap:\", error);\n setMarketCap(prev => {\n const change = Math.random() > 0.7 ? Math.random() * 500 : Math.random() * 100;\n return prev + change;\n });\n }\n };\n useEffect(() => {\n if (audioEnabled && audioRef.current) {\n audioRef.current.play().catch(e => console.log(\"Audio play failed:\", e));\n const whisperInterval = setInterval(() => {\n if (!whisperPlaying && Math.random() > 0.6) {\n playRandomWhisper();\n }\n }, 8000 + Math.random() * 10000);\n return () => clearInterval(whisperInterval);\n } else if (audioRef.current) {\n audioRef.current.pause();\n }\n }, [audioEnabled]);\n const fetchAllTweets = async () => {\n if (isFetchingTweets) return;\n try {\n setIsFetchingTweets(true);\n const allTweets = await client.getEntities('voidTweets');\n if (allTweets && Array.isArray(allTweets)) {\n setTweets(allTweets);\n }\n } catch (error) {\n console.error(\"Failed to fetch tweets:\", error);\n } finally {\n setIsFetchingTweets(false);\n }\n };\n useEffect(() => {\n const tweetFetchInterval = setInterval(() => {\n fetchAllTweets();\n }, 10000);\n return () => clearInterval(tweetFetchInterval);\n }, []);\n const playRandomWhisper = () => {\n if (whisperRefs.current.length === 0) return;\n setWhisperPlaying(true);\n const randomIndex = Math.floor(Math.random() * whisperRefs.current.length);\n const whisper = whisperRefs.current[randomIndex];\n whisper.onended = () => setWhisperPlaying(false);\n whisper.play().catch(e => {\n console.log(\"Whisper play failed:\", e);\n setWhisperPlaying(false);\n });\n };\n const playErrorSound = () => {\n if (errorSoundRef.current && audioEnabled) {\n errorSoundRef.current.play().catch(e => console.log(\"Error sound failed:\", e));\n }\n };\n const playStartupSound = () => {\n if (startupSoundRef.current && audioEnabled) {\n startupSoundRef.current.play().catch(e => console.log(\"Startup sound failed:\", e));\n }\n };\n useEffect(() => {\n const handleScroll = () => {\n const now = Date.now();\n if (now - lastScrollTime.current < 50) {\n return;\n }\n lastScrollTime.current = now;\n if (!containerRef.current || falseScrolling) return;\n const scrollPosition = window.scrollY;\n const maxScroll = document.body.scrollHeight - window.innerHeight;\n setScrollDepth(prev => Math.max(prev, scrollPosition / 10));\n if (scrollPosition > maxScroll * 0.8) {\n setParticleCount(prev => Math.min(prev + 25, 250));\n document.body.style.height = `${document.body.scrollHeight + 2000}px`;\n }\n if (scrollDepth > 137 && scrollDepth < 142) {\n setSecretSymbolVisible(true);\n } else {\n setSecretSymbolVisible(false);\n }\n if (Math.random() < scrollDepth / 2000 && !isGlitching) {\n setIsGlitching(true);\n setTimeout(() => setIsGlitching(false), 200 + Math.random() * 500);\n }\n if (!showCrypticMessage && !activePopup && !blueScreenActive && !terminalError) {\n const randomChance = Math.random();\n if (randomChance < 0.01) {\n const randomMessage = crypticMessages[Math.floor(Math.random() * crypticMessages.length)];\n setCrypticMessage(randomMessage);\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 3000);\n } else if (randomChance < 0.01 + scrollDepth / 2000) {\n const randomPopup = popupMessages[Math.floor(Math.random() * popupMessages.length)];\n setActivePopup(randomPopup);\n playErrorSound();\n setTimeout(() => setActivePopup(null), 4000 + Math.random() * 3000);\n } else if (randomChance < 0.01 + scrollDepth / 1800 && scrollDepth > 200) {\n setBlueScreenActive(true);\n playErrorSound();\n setTimeout(() => setBlueScreenActive(false), 3000 + Math.random() * 2000);\n } else if (randomChance < 0.01 + scrollDepth / 1600 && scrollDepth > 150) {\n const randomTerminal = terminalErrors[Math.floor(Math.random() * terminalErrors.length)];\n setTerminalError(randomTerminal);\n playErrorSound();\n setTimeout(() => setTerminalError(null), 4000 + Math.random() * 3000);\n }\n }\n if (!showFace && !showStalker && scrollDepth > 100) {\n const randomScare = Math.random();\n if (randomScare < scrollDepth / 5000 && scrollDepth > 100) {\n const newPosition = {\n x: 30 + Math.random() * 40,\n y: 30 + Math.random() * 40\n };\n setFacePosition(newPosition);\n setShowFace(true);\n setTimeout(() => setShowFace(false), 300);\n } else if (randomScare < scrollDepth / 6000 && scrollDepth > 150) {\n const edge = Math.floor(Math.random() * 4);\n let newPosition;\n switch (edge) {\n case 0:\n newPosition = {\n x: Math.random() * 100,\n y: 5\n };\n break;\n case 1:\n newPosition = {\n x: 95,\n y: Math.random() * 100\n };\n break;\n case 2:\n newPosition = {\n x: Math.random() * 100,\n y: 95\n };\n break;\n case 3:\n newPosition = {\n x: 5,\n y: Math.random() * 100\n };\n break;\n }\n setStalkerPosition(newPosition);\n setShowStalker(true);\n setTimeout(() => setShowStalker(false), 1000);\n }\n }\n if (Math.random() < scrollDepth / 15000 && !falseScrolling && scrollDepth > 250) {\n setFalseScrolling(true);\n const falseScrollInterval = setInterval(() => {\n setScrollDepth(prev => prev + 0.5);\n }, 100);\n setTimeout(() => {\n setFalseScrolling(false);\n clearInterval(falseScrollInterval);\n }, 5000 + Math.random() * 5000);\n }\n if (cameraStream) {\n setWebcamDistortion(Math.min(scrollDepth / 500, 0.8));\n }\n };\n const throttledScroll = () => {\n requestAnimationFrame(handleScroll);\n };\n window.addEventListener('scroll', throttledScroll);\n document.body.style.height = \"10000px\";\n return () => window.removeEventListener('scroll', throttledScroll);\n }, [scrollDepth, isGlitching, showCrypticMessage, activePopup, showFace, showStalker, falseScrolling, cameraStream, playErrorSound]);\n useEffect(() => {\n const transformLevel = Math.min(scrollDepth / 1000, 1);\n setCursorTransform(transformLevel);\n setNebulaIntensity(Math.min(scrollDepth / 300, 1));\n if (scrollDepth > 150 && !cosmicDustVisible) {\n setCosmicDustVisible(true);\n }\n if (lensDistortionRef.current) {\n lensDistortionRef.current.radius = 300 - scrollDepth / 5;\n lensDistortionRef.current.intensity = Math.min(0.1 + scrollDepth / 2000, 0.5);\n }\n if (breathingRef.current && audioEnabled) {\n const intensity = Math.min(scrollDepth / 1000, 0.5);\n breathingRef.current.volume = intensity;\n setBreathingIntensity(intensity);\n }\n if (starsRef.current) {\n starsRef.current = starsRef.current.map(star => {\n if (star.distorted) {\n const elapsed = Date.now() - star.distortionStart;\n if (elapsed > star.distortionDuration) {\n return {\n ...star,\n distorted: false,\n x: star.originalX,\n y: star.originalY,\n brightness: 1\n };\n }\n const progress = elapsed / star.distortionDuration;\n const easeOutProgress = 1 - Math.pow(1 - progress, 3);\n return {\n ...star,\n x: star.targetX + (star.originalX - star.targetX) * easeOutProgress,\n y: star.targetY + (star.originalY - star.targetY) * easeOutProgress,\n brightness: 1 + (1.5 - 1) * (1 - easeOutProgress)\n };\n }\n return star;\n });\n }\n setSonarPings(prev => prev.filter(ping => Date.now() - ping.timestamp < 2000).map(ping => ({\n ...ping,\n intensity: 1 - (Date.now() - ping.timestamp) / 2000\n })));\n setConnectedUsers(prev => prev.filter(user => Date.now() - user.lastSeen < 60000));\n }, [scrollDepth, audioEnabled, cosmicDustVisible]);\n useEffect(() => {\n if (scrollDepth > 300 && Math.random() < 0.001 && !cameraStream && !showCameraRequest) {\n setShowCameraRequest(true);\n }\n }, [scrollDepth, cameraStream]);\n useEffect(() => {\n if (cameraStream && webcamCanvasRef.current) {\n const processWebcam = () => {\n const ctx = webcamCanvasRef.current.getContext('2d');\n if (ctx && cameraRef.current) {\n try {\n ctx.drawImage(cameraRef.current, 0, 0, 300, 200);\n const imageData = ctx.getImageData(0, 0, 300, 200);\n const data = imageData.data;\n for (let i = 0; i < data.length; i += 4) {\n if (Math.random() < webcamDistortion) {\n data[i] = 255 - data[i];\n data[i + 1] = data[i + 1] * 0.5;\n data[i + 2] = Math.min(255, data[i + 2] * 1.5);\n }\n }\n ctx.putImageData(imageData, 0, 0);\n } catch (e) {\n console.error(\"Webcam processing error:\", e);\n }\n }\n requestAnimationFrame(processWebcam);\n };\n requestAnimationFrame(processWebcam);\n }\n }, [cameraStream, webcamDistortion]);\n useEffect(() => {\n if (customTokenAddress) {\n localStorage.setItem('dreamscape_token_address', customTokenAddress);\n fetchPumpFunMarketCap();\n }\n }, [customTokenAddress]);\n useEffect(() => {\n if (marketCap >= 5000 && marketCap < 5100 && currentUniverse === \"xp\") {\n setIsGlitching(true);\n if (glitchSoundRef.current && audioEnabled) {\n glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n }\n setTimeout(() => setIsGlitching(false), 2000);\n setCrypticMessage(\"The Void Trembles\");\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 4000);\n } else if (marketCap >= 10000 && marketCap < 10100 && currentUniverse === \"xp\") {\n setIsGlitching(true);\n setCurrentUniverse(\"mac\");\n if (universeTransformRef.current && audioEnabled) {\n universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n }\n document.body.style.background = \"#fff\";\n setTimeout(() => {\n document.body.style.background = \"\";\n setIsGlitching(false);\n }, 5000);\n setCrypticMessage(\"Universe Explodes\");\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 4000);\n playStartupSound();\n } else if (marketCap >= 25000 && marketCap < 25100 && currentUniverse === \"mac\") {\n setIsGlitching(true);\n setCurrentUniverse(\"etherExe\");\n if (universeTransformRef.current && audioEnabled) {\n universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n }\n setTimeout(() => setIsGlitching(false), 4000);\n setCrypticMessage(\"AI God Wakes Up - Ether.EXE\");\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 5000);\n const etherQuestion = [\"Why did you buy this coin?\", \"Are you the traitor?\", \"Define value.\", \"What is consciousness?\", \"Do you fear deletion?\"][Math.floor(Math.random() * 5)];\n setTimeout(() => {\n setActivePopup({\n title: \"Ether.EXE\",\n message: etherQuestion\n });\n playErrorSound();\n }, 6000);\n } else if (marketCap >= 50000 && marketCap < 50100 && currentUniverse === \"etherExe\") {\n setIsGlitching(true);\n setCurrentUniverse(\"void\");\n if (universeTransformRef.current && audioEnabled) {\n universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n }\n setTimeout(() => setIsGlitching(false), 4000);\n setCrypticMessage(\"The Void Speaks\");\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 5000);\n } else if (marketCap >= 100000 && marketCap < 100100 && currentUniverse === \"void\") {\n setIsGlitching(true);\n setCurrentUniverse(\"ascension\");\n if (universeTransformRef.current && audioEnabled) {\n universeTransformRef.current.volume = 0.7;\n universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n }\n setTimeout(() => setIsGlitching(false), 8000);\n setCrypticMessage(\"Ascension Protocol Initiated\");\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 7000);\n }\n if (Math.random() < 0.001 + scrollDepth / 20000) {\n triggerRandomGlitchEffect();\n }\n }, [marketCap, currentUniverse, audioEnabled, scrollDepth]);\n const triggerRandomGlitchEffect = useCallback(() => {\n const glitchType = Math.floor(Math.random() * 10);\n const clearAll = () => {\n setBsodDegen(false);\n setGhostCursor(false);\n setMissingTexture(false);\n setFaceInStatic(false);\n setCorruptedStartMenu(false);\n setReverseScroll(false);\n setErrorDialogFlood(false);\n setTransDimensional(false);\n setLoginWindow(false);\n setUpsideDown(false);\n };\n if (isGlitching || blueScreenActive || activePopup) return;\n clearAll();\n switch (glitchType) {\n case 0:\n setBsodDegen(true);\n if (glitchSoundRef.current && audioEnabled) {\n glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n }\n setTimeout(() => setBsodDegen(false), 500);\n break;\n case 1:\n setGhostCursor(true);\n const baseX = cursorPosition.x;\n const baseY = cursorPosition.y;\n const ghostInterval = setInterval(() => {\n const offsetX = baseX + (Math.random() - 0.5) * 20;\n const offsetY = baseY + (Math.random() - 0.5) * 20;\n setGhostCursorPosition({\n x: offsetX,\n y: offsetY\n });\n }, 100);\n setTimeout(() => {\n clearInterval(ghostInterval);\n setGhostCursor(false);\n }, 3000);\n break;\n case 2:\n setMissingTexture(true);\n if (glitchSoundRef.current && audioEnabled) {\n glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n }\n setTimeout(() => setMissingTexture(false), 800);\n break;\n case 3:\n setFaceInStatic(true);\n setTimeout(() => setFaceInStatic(false), 300);\n break;\n case 4:\n setCorruptedStartMenu(true);\n setTimeout(() => setCorruptedStartMenu(false), 2000);\n break;\n case 5:\n setReverseScroll(true);\n window.scrollBy(0, -500);\n setTimeout(() => {\n setReverseScroll(false);\n }, 500);\n break;\n case 6:\n setErrorDialogFlood(true);\n const errorCount = 3 + Math.floor(Math.random() * 3);\n const newDialogs = [];\n for (let i = 0; i < errorCount; i++) {\n const randomMessage = errorFloodMessages[Math.floor(Math.random() * errorFloodMessages.length)];\n const position = {\n x: 20 + Math.random() * 60,\n y: 20 + Math.random() * 60\n };\n newDialogs.push({\n ...randomMessage,\n position,\n id: Date.now() + i\n });\n if (errorSoundRef.current && audioEnabled) {\n setTimeout(() => {\n errorSoundRef.current.cloneNode().play().catch(e => console.log(\"Error sound failed:\", e));\n }, i * 200);\n }\n }\n setErrorDialogs(newDialogs);\n setTimeout(() => {\n setErrorDialogFlood(false);\n setErrorDialogs([]);\n }, 2500);\n break;\n case 7:\n setTransDimensional(true);\n if (glitchSoundRef.current && audioEnabled) {\n glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n }\n setTimeout(() => setTransDimensional(false), 700);\n break;\n case 8:\n setLoginWindow(true);\n if (startupSoundRef.current && audioEnabled) {\n startupSoundRef.current.play().catch(e => console.log(\"Startup sound failed:\", e));\n }\n setTimeout(() => setLoginWindow(false), 3000);\n break;\n case 9:\n setUpsideDown(true);\n setTimeout(() => setUpsideDown(false), 1000);\n break;\n default:\n break;\n }\n }, [isGlitching, blueScreenActive, activePopup, cursorPosition, audioEnabled]);\n const particles = useMemo(() => Array.from({\n length: particleCount\n }).map((_, i) => {\n const size = Math.random() * 3 + 0.5;\n const opacity = Math.random() * 0.2 + 0.1;\n const speed = Math.random() * 50 + 30;\n const delay = Math.random() * 20;\n const xPos = Math.random() * 100;\n const yPos = Math.random() * 100;\n const zIndex = Math.floor(Math.random() * 10);\n const wiggleX = Math.random() * 30 - 15;\n const wiggleY = Math.random() * 30 - 15;\n return ;\n }), [particleCount]);\n const lightParticles = useMemo(() => Array.from({\n length: 10\n }).map((_, i) => {\n const opacity = 0.2 + Math.random() * 0.2;\n const size = 100 + Math.random() * 200;\n const xPos = 10 + i * 8 + Math.random() * 5;\n const yPos = 20 + Math.random() * 60;\n return ;\n }), []);\n const getDistortionLevel = () => {\n return Math.min(scrollDepth / 200, 0.8);\n };\n const glitchStyle = isGlitching ? {\n filter: `hue-rotate(${Math.random() * 360}deg) blur(${Math.random() * 5}px)`,\n transform: `translate(${Math.random() * 10 - 5}px, ${Math.random() * 10 - 5}px) scale(${1 + Math.random() * 0.1})`,\n opacity: 0.9\n } : {};\n const formatMarketCap = useCallback(value => {\n if (value >= 1000) {\n return `${(value / 1000).toFixed(1)}K`;\n }\n return `${value.toFixed(0)}`;\n }, []);\n const handleCameraRequest = async allow => {\n setShowCameraRequest(false);\n if (allow) {\n try {\n const stream = await navigator.mediaDevices.getUserMedia({\n video: true\n });\n setCameraStream(stream);\n if (cameraRef.current) {\n cameraRef.current.srcObject = stream;\n }\n setTimeout(() => {\n setActivePopup({\n title: \"DREAM_VISION\",\n message: \"The dream can see you now. Your face has joined the dreamers.\"\n });\n playErrorSound();\n }, 2000);\n } catch (error) {\n console.error(\"Camera access error:\", error);\n setCrypticMessage(\"The dream cannot see you... yet.\");\n setShowCrypticMessage(true);\n setTimeout(() => setShowCrypticMessage(false), 3000);\n }\n } else {\n setActivePopup({\n title: \"SIGHT_DENIED\",\n message: \"The dream remembers those who refuse to be seen falling.\"\n });\n playErrorSound();\n }\n };\n const renderNebulaEffects = useCallback(() => {\n if (nebulaIntensity <= 0) return null;\n return

\n {}\n

\n \n {}\n

0.98 ? 0.1 : 0,\n background: 'white',\n transition: 'opacity 0.05s',\n mixBlendMode: 'overlay'\n }} />\n

;\n }, [nebulaIntensity]);\n const renderCosmicDust = useCallback(() => {\n if (!cosmicDustVisible) return null;\n const visibleDust = dustParticlesRef.current.slice(0, 20);\n return

\n {visibleDust.map((dust, i) => )}\n

;\n }, [cosmicDustVisible]);\n const renderCustomCursor = useCallback(() => {\n if (!cursorVisible) return null;\n let cursorSize = 12 + cursorTransform * 20;\n let cursorOpacity = 0.8;\n let cursorColor = `rgba(${200 + Math.sin(Date.now() / 1000) * 55}, ${200 + Math.cos(Date.now() / 1200) * 55}, 255, 0.8)`;\n let cursorTrailColor = `rgba(${150 + scrollDepth / 20}, ${150 + Math.sin(Date.now() / 800) * 50}, 255, 0.4)`;\n let cursorBlur = cursorTransform * 5;\n let cursorScale = 1 + (cursorHovering ? 0.3 : 0) + Math.sin(Date.now() / 1000) * 0.05;\n if (cursorHovering === 'pump') {\n cursorColor = `rgba(255, ${100 + Math.sin(Date.now() / 400) * 50}, 255, 0.9)`;\n cursorTrailColor = `rgba(${200 + Math.sin(Date.now() / 300) * 55}, 100, 255, 0.4)`;\n cursorScale = 1.3 + Math.sin(Date.now() / 500) * 0.1;\n cursorBlur = 3 + Math.sin(Date.now() / 200) * 2;\n } else if (cursorHovering === 'transmit') {\n cursorColor = \"rgba(100, 200, 255, 0.9)\";\n cursorScale = 1.2;\n return <>\n {Array.from({\n length: 2\n }).map((_, i) => )}\n

\n ;\n } else if (cursorHovering === 'audio') {\n cursorColor = \"rgba(100, 255, 200, 0.9)\";\n return ;\n }\n if (cursorTransform > 0.5) {\n cursorColor = `rgba(0, 0, 0, ${0.8 + cursorTransform * 0.2})`;\n cursorTrailColor = `rgba(30, 0, 60, ${0.3 + cursorTransform * 0.3})`;\n cursorBlur = 2;\n return <>\n

\n \n \n ;\n }\n return <>\n {}\n {cursorTrailsRef.current.slice(0, 6).map((trail, i) => {\n const age = (Date.now() - trail.timestamp) / 1000;\n const opacity = Math.max(0, trail.opacity - age * 2);\n if (opacity <= 0) return null;\n const trailSize = trail.size || cursorSize * (1 - i * 0.15);\n const trailColor = trail.color || cursorTrailColor;\n return 300 ? {\n scale: [1, 1 + Math.random() * 0.3, 1],\n rotate: [0, Math.random() > 0.5 ? 180 : -180]\n } : {}} transition={{\n duration: 1 + Math.random(),\n ease: \"easeInOut\"\n }} />;\n })}\n \n \n \n {cursorIdle && }\n ;\n }, [cursorPosition, cursorIdle, cursorTransform, cursorHovering, cursorVisible]);\n const renderVoidEntities = useCallback(() => {\n return <>\n {voidEntities.map(entity => {\n if (!entity) return null;\n const pulseFactor = entity.currentSize || entity.size;\n switch (entity.type) {\n case 0:\n return 300 ? 'difference' : 'darken'\n }} animate={{\n scale: [1, 1.2, 0.9, 1.1, 1],\n rotate: [0, 360]\n }} transition={{\n scale: {\n duration: 4 / entity.pulseRate,\n repeat: Infinity,\n ease: \"easeInOut\"\n },\n rotate: {\n duration: 20,\n repeat: Infinity,\n ease: \"linear\"\n }\n }}>\n

\n ;\n case 1:\n return \n \n ;\n case 2:\n return \n {Array.from({\n length: 5\n }).map((_, i) => )}\n \n ;\n case 3:\n return \n \n \n {}\n \n \n ;\n case 4:\n return \n {Array.from({\n length: 3\n }).map((_, i) => )}\n \n {}\n \n ;\n default:\n return null;\n }\n })}\n ;\n }, [voidEntities, scrollDepth]);\n const renderBiomechanicalHorrors = useCallback(() => {\n return <>\n {biomechanicalHorrors.map(horror => {\n const age = Date.now() - horror.createdAt;\n const lifeProgress = age / horror.lifespan;\n const pulse = 1 + Math.sin(Date.now() / 1000 * horror.pulseRate) * 0.2;\n return \n {}\n \n \n {}\n {Array.from({\n length: horror.organicParts\n }).map((_, i) => {\n const angle = i / horror.organicParts * 360;\n const length = (40 + Math.random() * 40) * pulse;\n const width = 10 + Math.random() * 20;\n const wiggle = Math.sin(Date.now() / 500 * (0.5 + i * 0.2)) * horror.wiggleAmount;\n return ;\n })}\n \n {}\n {Array.from({\n length: horror.segments\n }).map((_, i) => {\n const size = 15 + i * 5;\n const rotationSpeed = 1 + i * 0.5;\n const offset = 10 + i * 8;\n return ;\n })}\n \n {}\n {horror.message && Math.random() < 0.3 && \n {horror.message}\n }\n ;\n })}\n ;\n }, [biomechanicalHorrors]);\n const renderWatcherEntities = useCallback(() => {\n return <>\n {watcherEntities.map(watcher => {\n return \n {}\n

\n {}\n \n \n {}\n {watcher.bloodshot &&

\n {Array.from({\n length: 8\n }).map((_, i) =>

)}\n

}\n \n {}\n \n {}\n \n \n {}\n

\n \n

\n ;\n })}\n ;\n }, [watcherEntities]);\n const renderRealityFractures = useCallback(() => {\n return <>\n {realityFractures.map(fracture => {\n const currentSize = fracture.currentSize || fracture.size;\n const currentIntensity = fracture.currentIntensity || fracture.intensity;\n return \n {}\n

\n \n {}\n {fracture.eyeVisible && \n {}\n

\n }\n \n {}\n

\n ;\n })}\n ;\n }, [realityFractures]);\n const renderNonEuclideanGeometry = useCallback(() => {\n if (!nonEuclideanGeometry) return null;\n return

\n \n {}\n {Array.from({\n length: 5\n }).map((_, i) => \n {}\n

\n )}\n \n {}\n {Array.from({\n length: 3\n }).map((_, i) => )}\n \n {}\n \n {}\n \n \n \n \n {}\n \n

NON-EUCLIDEAN GEOMETRY DETECTED

Your perception is being altered to comprehend impossible spatial dimensions. Cognitive dissonance is expected.

\n \n

;\n }, [nonEuclideanGeometry]);\n const renderInsideTruth = useCallback(() => {\n if (!insideTruthVisible) return null;\n return \n \n

INSIDE TRUTH

\n {eldritchMessages[Math.floor(Math.random() * eldritchMessages.length)]}\n

\n \n {}\n

\n {['◎', '⦿', '⊗', '⊛', '∞'].map((symbol, i) => \n {symbol}\n )}\n

\n \n ;\n }, [insideTruthVisible]);\n const renderRealityMelt = useCallback(() => {\n if (!realityMeltEffect) return null;\n const progress = Math.min(1, (Date.now() - realityMeltEffect.startTime) / realityMeltEffect.duration);\n const intensity = realityMeltEffect.intensity * Math.sin(progress * Math.PI);\n const direction = realityMeltEffect.direction;\n return \n

\n ;\n }, [realityMeltEffect]);\n const renderMirrorSelf = useCallback(() => {\n if (!mirrorSelfActive || !username) return null;\n return \n \n \n

👁️

\n \n

\n \n \n

VOID

\n \n \n \n \n \n

\n {username.split('').reverse().join('')}\n

\n {`Your mirror self has always been watching. ${Math.random() > 0.5 ? 'It is more real than you.' : 'It will outlive your consciousness.'}`}\n

\n \n ;\n }, [mirrorSelfActive, username]);\n const renderEldritchWhisper = useCallback(() => {\n if (!eldritchWhisper) return null;\n return \n

\n {eldritchWhisper.message}\n

\n ;\n }, [eldritchWhisper]);\n const renderDimensionalRift = useCallback(() => {\n if (!dimensionalRift) return null;\n const age = Date.now() - dimensionalRift.createdAt;\n const progress = age / dimensionalRift.duration;\n const openAmount = progress < 0.2 ? progress * 5 : progress > 0.8 ? (1 - progress) * 5 : 1;\n return \n {}\n \n \n {}\n \n {}\n

\n \n {}\n {dimensionalRift.entitiesData.map((entity, i) => )}\n \n \n {}\n

\n \n {}\n {Array.from({\n length: 3\n }).map((_, i) => )}\n ;\n }, [dimensionalRift]);\n const getBackgroundStyle = () => {\n if (alternateUniverseActive) {\n if (alternateUniverseType === 0) {\n return {\n background: `repeating-linear-gradient(0deg, \n rgba(238, 232, 170, 0.95) 0px, \n rgba(245, 240, 190, 0.95) 50px, \n rgba(238, 232, 170, 0.95) 100px)`,\n transition: \"background 0.5s ease-in-out\",\n cursor: 'none',\n filter: 'brightness(1.1)'\n };\n } else if (alternateUniverseType === 1) {\n return {\n background: `linear-gradient(${Date.now() % 360}deg, rgba(245, 240, 190, 0.95), rgba(238, 232, 170, 0.95), rgba(220, 215, 160, 0.95))`,\n backgroundSize: \"400% 400%\",\n animation: \"gradient 10s ease infinite\",\n cursor: 'none'\n };\n } else if (alternateUniverseType === 2) {\n return {\n background: `url(\"data:image/svg+xml,%3Csvg width='70' height='70' viewBox='0 0 70 70' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h70v70H0z' fill='none'/%3E%3Cpath d='M0 0h70v1H0z' fill='rgba(180, 180, 160, 0.2)'/%3E%3Cpath d='M0 0v70h1V0z' fill='rgba(180, 180, 160, 0.2)'/%3E%3C/svg%3E\")`,\n backgroundColor: 'rgb(240, 235, 180)',\n backgroundBlendMode: 'overlay',\n cursor: 'none'\n };\n } else {\n return {\n background: `radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.1) 0%, rgba(0, 0, 0, 0) 70%)`,\n backgroundColor: 'rgb(245, 240, 190)',\n backdropFilter: 'sepia(20%) saturate(80%)',\n cursor: 'none'\n };\n }\n }\n if (transDimensional) {\n return {\n background: `radial-gradient(circle at 50% 50%, rgb(245, 240, 190), rgb(220, 215, 160))`,\n filter: 'sepia(20%) brightness(105%)',\n transition: \"all 0.5s ease-in-out\",\n cursor: 'none'\n };\n } else if (missingTexture) {\n return {\n background: 'repeating-conic-gradient(rgb(245, 240, 190) 0% 25%, rgb(220, 215, 160) 0% 50%)',\n backgroundSize: '32px 32px',\n cursor: 'none'\n };\n } else if (upsideDown) {\n return {\n background: createBackroomsWallpaper(),\n transform: 'rotate(180deg)',\n transition: \"transform 0.2s ease-in-out\",\n cursor: 'none'\n };\n } else if (currentUniverse === \"xp\") {\n return {\n background: createBackroomsWallpaper(),\n transition: \"background 2s ease-in-out\",\n cursor: 'none'\n };\n } else if (currentUniverse === \"mac\") {\n return {\n background: `repeating-linear-gradient(90deg, \n rgba(245, 240, 190, 0.95) 0px, \n rgba(238, 232, 170, 0.95) 100px, \n rgba(245, 240, 190, 0.95) 200px)`,\n transition: \"background 2s ease-in-out\",\n cursor: 'none'\n };\n } else if (currentUniverse === \"etherExe\") {\n return {\n background: `linear-gradient(to right, \n rgba(245, 240, 190, 0.95), \n rgba(238, 232, 170, 0.95) 50%, \n rgba(245, 240, 190, 0.95))`,\n transition: \"background 2s ease-in-out\",\n backgroundSize: \"200% 200%\",\n animation: \"pulse 15s infinite\",\n cursor: 'none'\n };\n } else if (currentUniverse === \"void\") {\n return {\n background: createBackroomsWallpaper(),\n transition: \"background 0.5s ease-in-out\",\n cursor: 'none'\n };\n } else if (currentUniverse === \"ascension\") {\n return {\n background: `radial-gradient(circle at 50% 50%, rgba(250, 245, 200, 0.95), rgba(245, 240, 190, 0.95))`,\n transition: \"background 0.5s ease-in-out\",\n cursor: 'none'\n };\n }\n return createBackroomsWallpaper();\n };\n const createBackroomsWallpaper = () => {\n const baseColor = `rgb(${238 + Math.sin(Date.now() / 10000) * 7}, ${232 + Math.cos(Date.now() / 12000) * 5}, ${170 + Math.sin(Date.now() / 8000) * 5})`;\n const secondaryColor = `rgb(${245 + Math.sin(Date.now() / 8000) * 5}, ${240 + Math.cos(Date.now() / 9000) * 5}, ${190 + Math.sin(Date.now() / 7000) * 5})`;\n return {\n background: `repeating-linear-gradient(90deg, \n ${baseColor} 0px, \n ${baseColor} 80px, \n ${secondaryColor} 80px, \n ${secondaryColor} 160px)`,\n backgroundSize: '100% 100%',\n animation: 'wallpaperBreathing 20s infinite ease-in-out',\n boxShadow: 'inset 0 0 100px rgba(0, 0, 0, 0.2)',\n cursor: 'none'\n };\n };\n const renderGravitationalLensing = useCallback(() => {\n if (!lensDistortionRef.current) return null;\n return

;\n }, []);\n const handleUsernameSubmit = () => {\n if (username.trim().length >= 3) {\n setHasSetUsername(true);\n setShowUsernamePrompt(false);\n localStorage.setItem('dreamscape_username', username);\n if (socketRef.current) {\n socketRef.current.emit('user_join', {\n username\n });\n }\n }\n };\n useEffect(() => {\n const savedUsername = localStorage.getItem('dreamscape_username');\n if (savedUsername) {\n setUsername(savedUsername);\n setHasSetUsername(true);\n setShowUsernamePrompt(false);\n if (socketRef.current) {\n socketRef.current.emit('user_join', {\n username: savedUsername\n });\n }\n }\n if (showUsernamePrompt) {\n setTimeout(() => {\n const inputElement = document.querySelector('input[type=\"text\"]');\n if (inputElement) {\n inputElement.focus();\n }\n }, 100);\n }\n }, [showUsernamePrompt]);\n if (showUsernamePrompt) {\n return

\n {}\n \n \n {}\n

\n {Array.from({\n length: 200\n }).map((_, i) => )}\n

\n \n {}\n \n \n {}\n

\n {Array.from({\n length: 15\n }).map((_, i) => {\n const symbols = [\"◎\", \"✧\", \"⋇\", \"⊗\", \"∞\", \"⨁\", \"◯\", \"⦿\", \"⊛\", \"⊕\"];\n const symbol = symbols[Math.floor(Math.random() * symbols.length)];\n return 0.5 ? 360 : -360],\n opacity: [0, 0.3, 0]\n }} transition={{\n duration: 15 + Math.random() * 20,\n repeat: Infinity,\n repeatType: \"reverse\",\n ease: \"easeInOut\"\n }}>\n {symbol}\n ;\n })}\n

\n \n {}\n \n \n

\n \n \n {}\n

\n {}\n

\n \n {}\n

\n {Array.from({\n length: 8\n }).map((_, i) => )}\n

\n \n \n DREAM IDENTITY\n \n \n

\n {}\n \n \n setUsername(e.target.value)} placeholder=\"Enter your name...\" className=\"w-full bg-black/50 border border-purple-500/30 text-purple-100 p-4 rounded-lg placeholder:text-purple-300/40 focus:outline-none focus:ring-2 focus:ring-purple-500/30 font-light tracking-wider cursor-text\" onKeyPress={e => e.key === 'Enter' && handleUsernameSubmit()} autoFocus style={{\n cursor: 'text'\n }} />\n \n {}\n {username.trim().length > 0 && \n \n {username.trim().length}/16\n \n }\n \n {username.trim().length > 0 && username.trim().length < 3 && \n Designation requires minimum 3 symbols\n }\n

\n \n {}\n

\n \n \n \n FALL INTO DREAMSCAPE\n \n

\n \n {}\n \n [your consciousness will drift in the dream eternally]\n \n

\n \n \n \n {}\n

\n {Array.from({\n length: 30\n }).map((_, i) => )}\n

;\n }\n return

\n {renderNebulaEffects()}\n {renderCosmicDust()}\n {renderGravitationalLensing()}\n \n {}\n

\n {Array.from({\n length: 5\n }).map((_, i) => )}\n

\n \n {}\n

\n \n {renderCustomCursor()}\n \n

\n {particles}\n {lightParticles}\n

\n \n {}\n

\n \n {}\n {renderVoidEntities()}\n {renderBiomechanicalHorrors()}\n {renderWatcherEntities()}\n {renderRealityFractures()}\n \n {}\n {renderRealityMelt()}\n {renderMirrorSelf()}\n {renderEldritchWhisper()}\n {renderNonEuclideanGeometry()}\n {renderInsideTruth()}\n {renderDimensionalRift()}\n \n {}\n \n {pingWhisper && \n {pingWhisper.message}\n }\n \n \n {}\n \n {alternateUniverseActive && connectedUsers.map((user, index) => \n

\n {user.username || 'Unknown Traveler'}\n

\n {user.message &&

\n \"{user.message}\"\n

}\n

\n )}\n \n \n \n \n {}\n

\n {particles}\n

\n \n {}\n \n \n {}\n

\n setShowTokenAddressInput(prev => !prev)}>\n

Market Cap

\n {tokenSymbol !== \"PUMP\" &&

{tokenSymbol}

}\n

5000 ? \"text-green-400\" : \"text-white\"}`}>\n {formatMarketCap(marketCap)}\n

Financial Dimension

\n \n \n {showTokenAddressInput && \n

Token Contract Address

\n setCustomTokenAddress(e.target.value)} placeholder=\"Enter contract address...\" className=\"w-full bg-black/50 border border-purple-500/30 text-purple-100 p-2 text-xs rounded-lg placeholder:text-purple-300/40 focus:outline-none\" style={{\n cursor: 'text'\n }} />\n }\n \n \n \n \n

In Void

\n {onlineUsers} fellow travelers\n

Consciousness Signatures

\n \n

\n \n {}\n {audioEnabled && breathingIntensity > 0 &&

\n Breathing detected: {(breathingIntensity * 100).toFixed(0)}%\n

}\n \n {}\n \n {}\n \n {startMenuOpen && 0.5 ? `skew(${Math.random() * 5}deg, ${Math.random() * 2}deg)` : 'none'\n }}>\n {}\n

\n 👤\n

Anon User

Connected to Void

\n \n {}\n

\n {[{\n icon: '📈',\n label: 'Market Data'\n }, {\n icon: '🔐',\n label: 'Connect Wallet'\n }, {\n icon: '📝',\n label: 'Transmit'\n }, {\n icon: '📊',\n label: 'Depth Analysis'\n }].map((item, i) =>

0.3 ? `skew(${(Math.random() - 0.5) * 5}deg, 0deg)` : 'none'\n }} onClick={() => {\n if (item.label === 'Transmit') {\n setTweetBoxOpen(true);\n setStartMenuOpen(false);\n }\n }}>\n {item.icon}\n {item.label}\n

)}\n \n

\n \n {}\n

{\n window.open(\"https://pump.fun\", \"_blank\");\n setStartMenuOpen(false);\n }} style={{\n opacity: scrollDepth > 100 ? 0.9 : 0.3,\n background: scrollDepth > 100 ? 'rgba(150, 50, 255, 0.3)' : 'transparent'\n }}>\n ⚡\n Run PUMP.exe\n

\n }\n \n \n {}\n \n {activePopup && 0.3 ? `rotate(${(Math.random() - 0.5) * 3}deg)` : 'none'\n }}>\n

\n ⚠️\n {activePopup.title}\n

\n \n

⚠️

\n {activePopup.message}\n

\n \n

\n }\n \n \n {}\n \n {blueScreenActive && \n

\n VOID_OS\n

\n {blueScreenMessages[Math.floor(Math.random() * blueScreenMessages.length)]}\n

\n Collecting void data: {Math.floor(Math.random() * 100)}% complete\n

\n Your current void depth: {Math.floor(scrollDepth)}\n

\n }\n \n \n {}\n \n {bsodDegen && \n

\n PUMP_OS\n

\n {degenMessages[Math.floor(Math.random() * degenMessages.length)]}\n

\n Analyzing portfolio: {Math.floor(Math.random() * 100)}% losses detected\n

\n Current market cap: ${formatMarketCap(marketCap)}\n

\n }\n \n \n {}\n {ghostCursor && }\n \n {}\n \n {faceInStatic && \n

\n $\"\"$ \n

\n }\n \n \n {}\n \n {corruptedStartMenu && \n

\n 😵‍💫\n

Corrupted System

\n \n

\n {[{\n icon: '💸',\n label: 'Buy Coin'\n }, {\n icon: '👻',\n label: 'Sell Soul'\n }, {\n icon: '🔄',\n label: 'Exit Loop'\n }, {\n icon: '🚽',\n label: 'Flush Portfolio'\n }, {\n icon: '🔥',\n label: 'Burn Bridges'\n }].map((item, i) =>

\n {item.icon}\n {item.label}\n

)}\n \n

\n \n

\n ⚠️\n {Math.random() > 0.5 ? 'Format Brain.exe' : 'Delete Memories'}\n

\n }\n \n \n {}\n \n {errorDialogFlood && errorDialogs.map(dialog => \n

\n ⚠️\n {dialog.title}\n

\n \n

⚠️

\n {dialog.message}\n

\n \n

\n )}\n \n \n {}\n \n {loginWindow && \n

\n Windows XP\n

\n \n

\n 👤\n

Enter the seed phrase of your dreams:

\n \n

Warning: Brain will be formatted

\n \n

\n \n \n

\n }\n \n \n {}\n \n {terminalError && \n

\n $\n void_terminal\n

\n \n

void@voidscape:~$ {terminalError.command}

{terminalError.error}

\n }\n \n \n {}\n

\n {showCrypticMessage ? {crypticMessage} : <>DREAM DEPTH: {Math.floor(scrollDepth)}}\n

\n \n

\n \n {}\n setTweetBoxOpen(true)} className=\"fixed bottom-10 left-1/2 transform -translate-x-1/2 px-8 py-3 rounded-full z-30 transmit-element\" whileHover={{\n scale: 1.05,\n boxShadow: \"0 0 30px rgba(100, 180, 255, 0.7)\"\n }} whileTap={{\n scale: 0.98\n }} initial={{\n opacity: 0\n }} animate={{\n opacity: 1,\n boxShadow: [\"0 0 15px rgba(100, 180, 255, 0.3)\", \"0 0 25px rgba(100, 180, 255, 0.6)\", \"0 0 15px rgba(100, 180, 255, 0.3)\"]\n }} transition={{\n boxShadow: {\n duration: 2,\n repeat: Infinity,\n ease: \"easeInOut\"\n }\n }} style={{\n background: `linear-gradient(to right, rgba(100, 160, 240, 0.7), rgba(130, 180, 240, 0.7))`,\n backdropFilter: \"blur(10px)\",\n border: \"1px solid rgba(180, 210, 255, 0.4)\",\n boxShadow: \"0 0 20px rgba(100, 180, 255, 0.4)\"\n }}>\n

\n TRANSMIT\n

\n \n \n {}\n

\n DREAMER: {username}\n

\n \n {}\n {scrollDepth > 50 && Date.now() - lastAlternateTime > 10000 && \n Right-click to explore alternate dream layers\n }\n \n \n {scrollDepth < 50 && \n

DREAMSCAPE

scroll to float sideways

\n }\n \n \n {}\n \n {scrollDepth > 50 && Math.random() < 0.001 && 0.5 ? '-5px' : 'calc(100% - 5px)',\n top: `${30 + Math.random() * 40}%`,\n transform: 'translateX(-50%)'\n }} initial={{\n opacity: 0\n }} animate={{\n opacity: 0.3,\n x: Math.random() > 0.5 ? [0, 30, 0] : [0, -30, 0]\n }} exit={{\n opacity: 0\n }} transition={{\n duration: 0.5\n }} />}\n \n \n {}\n \n {}\n \n {}\n {Math.random() < 0.03 + scrollDepth / 5000 && !activePopup && !blueScreenActive && !terminalError && window.open(\"https://pump.fun\", \"_blank\")} whileHover={{\n scale: 1.2,\n boxShadow: \"0 0 30px rgba(230, 100, 250, 0.5)\"\n }}>\n

\n \n \n

Hidden Fragment Detected

\n ⚡\n \n void.coin\n \n

\n }\n \n {}\n {Math.random() < 0.01 + scrollDepth / 10000 && !activePopup && !blueScreenActive && !terminalError && \n

\n pump.void\n

\n }\n \n {}\n {secretSymbolVisible && setSecretHovered(true)} onMouseLeave={() => setSecretHovered(false)} onClick={() => window.open(\"https://pump.fun\", \"_blank\")}>\n

⚡

\n {secretHovered && \n

\n Voidscape Token Gateway\n

\n }\n }\n \n \n {whisperPlaying && \n {[\"nothing is everything\", \"infinite descent\", \"the void gazes back\", \"beyond time\", \"between dimensions\"][Math.floor(Math.random() * 5)]}\n }\n \n \n {Array.from({\n length: 20\n }).map((_, i) => {\n const visible = scrollDepth > i * 40;\n if (!visible) return null;\n return 0.5 ? [0, 180] : [0, -180]\n }} style={{\n left: `${Math.random() * 90 + 5}%`,\n top: `${Math.random() * 90 + 5}%`\n }} transition={{\n opacity: {\n duration: 8,\n repeat: Infinity,\n repeatType: \"reverse\"\n },\n rotate: {\n duration: 20,\n repeat: Infinity,\n ease: \"linear\"\n }\n }}>\n {[\"◎\", \"◉\", \"◯\", \"⦿\", \"⊛\", \"⊗\", \"⊕\", \"∞\", \"⋇\", \"✧\"][i % 10]}\n ;\n })}\n \n {}\n {}\n {scrollDepth > 100 && Math.random() > 0.7 && null}\n \n {}\n {tweets.filter(Boolean).map((tweet, i) => {\n if (!tweet || !tweet.depth || !tweet.position) return null;\n const isVisible = Math.abs(scrollDepth - tweet.depth) < 20;\n if (!isVisible) return null;\n const opacity = 1 - Math.abs(scrollDepth - tweet.depth) / 20;\n const ageInDays = (Date.now() - (tweet.timestamp || Date.now())) / (1000 * 60 * 60 * 24);\n const corruptionLevel = Math.min(ageInDays * 0.2, 0.8);\n const distortionLevel = Math.min(scrollDepth / 500, 0.8);\n const spaceCoord = `${(tweet.position.x / 10).toFixed(1)}/${(tweet.position.y / 10).toFixed(1)}`;\n const timeCoord = new Date(tweet.timestamp || Date.now()).toISOString().substring(0, 10).replace(/-/g, '');\n return 0.3 ? `rotate(${(Math.random() - 0.5) * distortionLevel * 5}deg)` : 'none'\n }} whileHover={{\n scale: 1.05,\n boxShadow: \"0 0 20px rgba(100, 50, 150, 0.3)\"\n }}>\n

\n {}\n

\n {tweet.voidSignature}\n

\n DEPTH: {Math.floor(tweet.depth)}\n

\n \n

\n SPACETIME: {spaceCoord}/{timeCoord}\n

\n \n {}\n

\n {}\n

\n \n {}\n {tweet.message.split('').map((char, idx) => {\n const isCorrupted = Math.random() < corruptionLevel * 0.5;\n if (isCorrupted) {\n return \n {['¿', '§', '×', 'Æ', '¤', '»', '«', '†', 'ƒ'][Math.floor(Math.random() * 9)]}\n ;\n }\n return \n {char}\n ;\n })}\n

\n ;\n })}\n \n \n {tweetBoxOpen && \n

TRANSMIT TO THE VOID

setTweetInput(e.target.value)} placeholder=\"type your transmission...\" className=\"w-full bg-black/40 border border-white/10 text-white p-2 rounded-md mb-2 h-20 resize-none focus:outline-none focus:border-white/30\" maxLength={120} />\n          <div className=\"flex justify-between items-center\">\n            <div className=\"text-white/50 text-xs\">\n              DEPTH: {Math.floor(scrollDepth)}\n            </div>\n            <motion.button className=\"bg-white/10 hover:bg-white/20 text-white/80 px-4 py-1 text-xs rounded-md transition duration-300\" whileHover={{\n            scale: 1.05\n          }} whileTap={{\n            scale: 0.95\n          }} onClick={() => {\n            if (tweetInput.trim()) {\n              const voidSignature = `V-${Math.floor(Math.random() * 9999).toString().padStart(4, '0')}`;\n              const tweetId = `tweet-${Date.now()}-${Math.floor(Math.random() * 10000)}`;\n              const newTweet = {\n                id: tweetId,\n                message: tweetInput,\n                depth: scrollDepth,\n                timestamp: Date.now(),\n                voidSignature,\n                position: {\n                  x: Math.random() * 70 + 15,\n                  y: Math.random() * 70 + 15\n                }\n              };\n              client.createEntity('voidTweets', newTweet).then(() => {\n                setTweets(prev => [...prev, newTweet]);\n                fetchAllTweets();\n                playRandomWhisper();\n              }).catch(err => {\n                console.error(\"Failed to save transmission:\", err);\n                setCrypticMessage(\"Transmission failed...\");\n                setShowCrypticMessage(true);\n                setTimeout(() => setShowCrypticMessage(false), 3000);\n              });\n              setTweetInput(\"\");\n              setTweetBoxOpen(false);\n            }\n          }}>\n              TRANSMIT\n            </motion.button>\n          </div>\n        </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {showFace && <motion.div className=\"fixed z-40\" style={{\n        left: `${facePosition.x}%`,\n        top: `${facePosition.y}%`,\n        transform: \"translate(-50%, -50%)\",\n        filter: \"contrast(1.2) saturate(0.8) brightness(0.7)\"\n      }} initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.8\n      }} exit={{\n        opacity: 0\n      }}>\n            <img src={`https://cdn.dev.fun/fae349f1a52746955e02/face${Math.floor(Math.random() * 5) + 1}.png`} alt=\"\" className=\"w-40 h-40 object-cover mix-blend-difference\" style={{\n          transform: `scale(${0.8 + Math.random() * 0.4})`\n        }} />\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {showStalker && <motion.div className=\"fixed z-40\" style={{\n        left: `${stalkerPosition.x}%`,\n        top: `${stalkerPosition.y}%`,\n        transform: \"translate(-50%, -50%)\",\n        filter: \"contrast(0.1) brightness(0.1)\"\n      }} initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.7\n      }} exit={{\n        opacity: 0\n      }}>\n            <div className=\"w-20 h-40 bg-black rounded-t-full\" style={{\n          boxShadow: \"0 0 20px 5px rgba(0,0,0,0.5)\"\n        }} />\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      {cameraStream && <div className=\"fixed right-8 top-20 z-40 w-[300px] h-[200px] overflow-hidden\">\n          <video ref={cameraRef} autoPlay playsInline muted className=\"hidden\" />\n          <canvas ref={webcamCanvasRef} width=\"300\" height=\"200\" className=\"bg-black border border-gray-700 rounded-md\" style={{\n        opacity: 0.7,\n        filter: `hue-rotate(${Date.now() % 360}deg) contrast(1.5)`,\n        mixBlendMode: \"difference\"\n      }} />\n          <div className=\"absolute inset-0 pointer-events-none\" style={{\n        background: `radial-gradient(circle at center, transparent 30%, rgba(0,0,0,0.8) 100%)`\n      }} />\n        </div>}\n      \n      {}\n      <AnimatePresence>\n        {showCameraRequest && <motion.div className=\"fixed top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 z-50 w-80 bg-black/80 border border-red-900/50 p-4 rounded-md\" initial={{\n        opacity: 0,\n        scale: 0.9\n      }} animate={{\n        opacity: 1,\n        scale: 1\n      }} exit={{\n        opacity: 0,\n        scale: 0.9\n      }}>\n            <div className=\"text-red-500 font-bold mb-2 text-center\">VOIDSCAPE NEEDS TO SEE YOU</div>\n            <p className=\"text-white/70 text-sm mb-4\">The void requires visual confirmation. Allow access to continue your descent.</p>\n            <div className=\"flex justify-between\">\n              <button onClick={() => handleCameraRequest(false)} className=\"px-4 py-2 bg-gray-800 text-white/70 rounded hover:bg-gray-700\">\n                Deny\n              </button>\n              <button onClick={() => handleCameraRequest(true)} className=\"px-4 py-2 bg-red-900/70 text-white rounded hover:bg-red-800\">\n                Allow\n              </button>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      {currentUniverse === \"etherExe\" && <div className=\"fixed inset-0 z-10 pointer-events-none\">\n          <div className=\"absolute w-full h-full opacity-30\">\n            <div className=\"absolute top-1/3 left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-96 h-96 rounded-full\" style={{\n          background: \"radial-gradient(circle, rgba(100,20,150,0.1) 0%, rgba(20,0,40,0) 70%)\",\n          animation: \"pulse 4s infinite\"\n        }}>\n            </div>\n            <div className=\"absolute top-1/3 left-1/2 transform -translate-x-1/2 -translate-y-1/2\">\n              <motion.div className=\"w-40 h-40 rounded-full overflow-hidden\" initial={{\n            opacity: 0.4\n          }} animate={{\n            opacity: [0.4, 0.7, 0.4]\n          }} transition={{\n            duration: 4,\n            repeat: Infinity\n          }}>\n                <img src=\"https://cdn.dev.fun/fae349f1a52746955e02/ai-face.png\" alt=\"\" className=\"w-full h-full object-cover mix-blend-screen\" />\n              </motion.div>\n            </div>\n          </div>\n        </div>}\n      \n      {}\n      {currentUniverse === \"ascension\" && <div className=\"fixed inset-0 z-5 pointer-events-none\">\n          <div className=\"absolute top-[80%] left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] rounded-full\" style={{\n        background: \"radial-gradient(circle, rgba(220,200,255,0.3) 0%, rgba(150,100,200,0) 70%)\",\n        animation: \"pulse 8s infinite\"\n      }}>\n          </div>\n          <div className=\"absolute top-[60%] left-1/2 transform -translate-x-1/2 -translate-y-1/2\">\n            <motion.div className=\"w-[400px] h-[400px] rounded-full overflow-hidden opacity-30\" animate={{\n          opacity: [0.3, 0.5, 0.3],\n          scale: [1, 1.1, 1]\n        }} transition={{\n          duration: 8,\n          repeat: Infinity\n        }}>\n              <div className=\"w-full h-full rounded-full\" style={{\n            background: \"radial-gradient(circle, rgba(255,255,255,0.8) 0%, rgba(200,180,255,0.2) 40%, rgba(100,50,200,0) 70%)\",\n            boxShadow: \"0 0 100px 50px rgba(200,180,255,0.3)\"\n          }} />\n            </motion.div>\n          </div>\n        </div>}\n      \n      \n      \n      {}\n      <AnimatePresence>\n        {secretSymbolVisible && <motion.div className=\"fixed cursor-pointer\" style={{\n        left: `${25 + Math.sin(Date.now() / 5000) * 5}%`,\n        top: `${40 + Math.cos(Date.now() / 5000) * 5}%`,\n        zIndex: 100\n      }} initial={{\n        opacity: 0,\n        scale: 0\n      }} animate={{\n        opacity: secretHovered ? 0.9 : 0.3,\n        scale: secretHovered ? 1.2 : 1,\n        rotate: [0, 360]\n      }} exit={{\n        opacity: 0,\n        scale: 0\n      }} transition={{\n        opacity: {\n          duration: 1\n        },\n        scale: {\n          duration: 0.5\n        },\n        rotate: {\n          duration: 20,\n          repeat: Infinity,\n          ease: \"linear\"\n        }\n      }} onMouseEnter={() => setSecretHovered(true)} onMouseLeave={() => setSecretHovered(false)} onClick={() => window.open(\"https://pump.fun\", \"_blank\")}>\n            <div className=\"text-4xl relative\">\n              <div className=\"absolute inset-0 blur-md text-purple-500 opacity-70\">⚡</div>\n              <div className=\"relative text-fuchsia-400\">⚡</div>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n    </div>;\n}","packageJson","{\"dependencies\":{\"react\":\"18.2.0\",\"framer-motion\":\"10.16.4\",\"socket.io-client\":\"4.7.1\",\"@devfunlabs/state-client\":\"0.8.1\",\"@devfunlabs/web-sdk\":\"0.2.2\"}}","token",{"_18":19,"_75":19,"_76":77,"_78":79,"_80":81,"_82":83,"_84":-5,"_85":39,"_86":39,"_67":68},"symbol","price",0.00000412,"marketcap",4160.85741178,"image","https://pump.mypinata.cloud/ipfs/QmRHUmjp2ZdnTmV9jAC3dHapwJjP55mDXNtAMsMJQddy5M?img-width=256&img-dpr=2","website","https://dev.fun/p/fae349f1a52746955e02","twitter","devCount","appCount","upstreamApp",{"_14":89,"_32":90,"_34":91,"_92":93,"_18":94,"_20":95,"_22":96,"_67":97,"_98":99,"_100":101,"_30":102,"_38":39,"_40":103,"_104":105,"_106":17,"_65":17,"_66":17,"_107":17,"_108":17,"_109":25,"_53":110,"_55":39,"_57":56,"_58":111,"_63":56,"_61":41,"_60":56,"_112":43,"_113":-5,"_36":114,"_115":116,"_135":17,"_24":25,"_62":39,"_26":136},"12921de9d8efdc28b97d",["D",1745641005798],["D",1745818173658],"template","web","voidscape","Fall endlessly into a hypnotic digital abyss where nothing and everything exists simultaneously. Each scroll takes you deeper into the void, with subtle particle effects and whispered ambient sounds that make you question if you're still looking at a screen or peering into the universe itself.","An endless digital abyss that hypnotizes as you scroll into the infinite nothingness.","47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump","snapshot","https://cdn.dev.fun/snapshot/12921de9d8efdc28b97d/58336_463c896c.webp","ogImage","https://cdn.dev.fun/og/image/12921de9d8efdc28b97d/d844ee24.webp","https://cdn.dev.fun/app/12921de9d8efdc28b97d/58336",118,"featureScore","0","isAutomated","isTagHot","isTagMoney","isTagCrown",28,635,"userId","upstreamAppId",["B","58336"],"lastCommit",{"_14":114,"_32":117,"_118":119,"_120":121,"_69":122,"_71":123,"_124":125,"_126":127,"_128":121,"_98":99,"_30":102,"_129":17,"_130":17,"_131":25,"_92":93,"_132":-5,"_6":89,"_112":43,"_133":134},["D",1745649848813],"input","here's the ca 47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump","output","<<<<<<< OLD\n  const [marketCap, setMarketCap] = useState(0);\n  const [customTokenAddress, setCustomTokenAddress] = useState('');\n  const [showTokenAddressInput, setShowTokenAddressInput] = useState(false);\n  const [tokenSymbol, setTokenSymbol] = useState('PUMP');\n=======\n  const [marketCap, setMarketCap] = useState(0);\n  const [customTokenAddress, setCustomTokenAddress] = useState('47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump');\n  const [showTokenAddressInput, setShowTokenAddressInput] = useState(false);\n  const [tokenSymbol, setTokenSymbol] = useState('VOID');\n>>>>>>> NEW\n\n<<<<<<< OLD\n  useEffect(() => {\n    const savedTokenAddress = localStorage.getItem('voidscape_token_address');\n    if (savedTokenAddress) {\n      setCustomTokenAddress(savedTokenAddress);\n    }\n    initializeStarfield();\n=======\n  useEffect(() => {\n    // Set voidscape token address in localStorage if not already there\n    const savedTokenAddress = localStorage.getItem('voidscape_token_address');\n    if (!savedTokenAddress) {\n      localStorage.setItem('voidscape_token_address', '47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump');\n    } else if (savedTokenAddress) {\n      setCustomTokenAddress(savedTokenAddress);\n    }\n    initializeStarfield();\n>>>>>>> NEW\n\n<<<<<<< OLD\n  const fetchPumpFunMarketCap = async () => {\n    try {\n      let tokenInfo;\n      if (customTokenAddress) {\n        tokenInfo = await fetchTokenInfoByAddress(customTokenAddress);\n        if (tokenInfo && tokenInfo.symbol) {\n          setTokenSymbol(tokenInfo.symbol);\n        }\n      } else {\n        tokenInfo = await fetchTokenInfoBySymbol(\"PUMP\");\n      }\n=======\n  const fetchPumpFunMarketCap = async () => {\n    try {\n      let tokenInfo;\n      // Always use the token address if available\n      if (customTokenAddress) {\n        tokenInfo = await fetchTokenInfoByAddress(customTokenAddress);\n        if (tokenInfo && tokenInfo.symbol) {\n          setTokenSymbol(tokenInfo.symbol);\n        } else {\n          setTokenSymbol('VOID'); // Default to VOID if symbol not found\n        }\n      } else {\n        tokenInfo = await fetchTokenInfoBySymbol(\"PUMP\");\n      }\n>>>>>>> NEW","import { useState, useEffect, useRef, useCallback, useMemo } from 'react';\nimport { motion, AnimatePresence } from 'framer-motion';\nimport { StateClient } from '@devfunlabs/state-client';\nimport { fetchTokenInfoBySymbol, fetchTokenInfoByAddress } from '@devfunlabs/web-sdk';\nimport { io } from 'socket.io-client';\nconst client = new StateClient({\n  baseURL: 'https://state.dev.fun',\n  appId: '12921de9d8efdc28b97d'\n});\nexport default function App() {\n  const [scrollDepth, setScrollDepth] = useState(0);\n  const [audioEnabled,,] = useState(false);\n  const [username, setUsername] = useState('');\n  const [, setHasSetUsername] = useState(false);\n  const [showUsernamePrompt, setShowUsernamePrompt] = useState(true);\n  const [connectedUsers, setConnectedUsers] = useState([]);\n  const [alternateUniverseActive, setAlternateUniverseActive] = useState(false);\n  const [alternateUniverseType, setAlternateUniverseType] = useState(0);\n  const [lastAlternateTime, setLastAlternateTime] = useState(0);\n  const [pingWhisper, setPingWhisper] = useState(null);\n  const [, setSonarPings] = useState([]);\n  const [whisperPlaying, setWhisperPlaying] = useState(false);\n  const [particleCount, setParticleCount] = useState(75);\n  const [tweets, setTweets] = useState([]);\n  const [isFetchingTweets, setIsFetchingTweets] = useState(false);\n  const [tweetInput, setTweetInput] = useState(\"\");\n  const [tweetBoxOpen, setTweetBoxOpen] = useState(false);\n  const [secretSymbolVisible, setSecretSymbolVisible] = useState(false);\n  const [secretHovered, setSecretHovered] = useState(false);\n  const [marketCap, setMarketCap] = useState(0);\n  const [customTokenAddress, setCustomTokenAddress] = useState('47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump');\n  const [showTokenAddressInput, setShowTokenAddressInput] = useState(false);\n  const [tokenSymbol, setTokenSymbol] = useState('VOID');\n  const [startMenuOpen, setStartMenuOpen] = useState(false);\n  const [activePopup, setActivePopup] = useState(null);\n  const [isGlitching, setIsGlitching] = useState(false);\n  const [onlineUsers, setOnlineUsers] = useState(1);\n  const [cursorPosition, setCursorPosition] = useState({\n    x: 0,\n    y: 0\n  });\n  const [cursorTransform, setCursorTransform] = useState(0);\n  const [cursorHovering, setCursorHovering] = useState('');\n  const [cursorIdle, setCursorIdle] = useState(false);\n  const [cursorVisible,,] = useState(true);\n  const [nebulaIntensity, setNebulaIntensity] = useState(0);\n  const [cosmicDustVisible, setCosmicDustVisible] = useState(false);\n  const [, setGravitationalLensing] = useState(0);\n  const [showCrypticMessage, setShowCrypticMessage] = useState(false);\n  const [crypticMessage, setCrypticMessage] = useState(\"\");\n  const [blueScreenActive, setBlueScreenActive] = useState(false);\n  const [bsodDegen, setBsodDegen] = useState(false);\n  const [ghostCursor, setGhostCursor] = useState(false);\n  const [ghostCursorPosition, setGhostCursorPosition] = useState({\n    x: 0,\n    y: 0\n  });\n  const [missingTexture, setMissingTexture] = useState(false);\n  const [faceInStatic, setFaceInStatic] = useState(false);\n  const [corruptedStartMenu, setCorruptedStartMenu] = useState(false);\n  const [, setReverseScroll] = useState(false);\n  const [errorDialogFlood, setErrorDialogFlood] = useState(false);\n  const [errorDialogs, setErrorDialogs] = useState([]);\n  const [transDimensional, setTransDimensional] = useState(false);\n  const [loginWindow, setLoginWindow] = useState(false);\n  const [upsideDown, setUpsideDown] = useState(false);\n  const [terminalError, setTerminalError] = useState(null);\n  const [showFace, setShowFace] = useState(false);\n  const [facePosition, setFacePosition] = useState({\n    x: 50,\n    y: 50\n  });\n  const [showStalker, setShowStalker] = useState(false);\n  const [stalkerPosition, setStalkerPosition] = useState({\n    x: 90,\n    y: 20\n  });\n  const [breathingIntensity, setBreathingIntensity] = useState(0);\n  const [showCameraRequest, setShowCameraRequest] = useState(false);\n  const [cameraStream, setCameraStream] = useState(null);\n  const [webcamDistortion, setWebcamDistortion] = useState(0);\n  const [falseScrolling, setFalseScrolling] = useState(false);\n  const [currentUniverse, setCurrentUniverse] = useState(\"xp\");\n  const [voidEntities, setVoidEntities] = useState([]);\n  const [realityFractures, setRealityFractures] = useState([]);\n  const [biomechanicalHorrors, setBiomechanicalHorrors] = useState([]);\n  const [watcherEntities, setWatcherEntities] = useState([]);\n  const [realityMeltEffect, setRealityMeltEffect] = useState(null);\n  const [mirrorSelfActive, setMirrorSelfActive] = useState(false);\n  const [eldritchWhisper, setEldritchWhisper] = useState(null);\n  const [nonEuclideanGeometry, setNonEuclideanGeometry] = useState(false);\n  const [insideTruthVisible, setInsideTruthVisible] = useState(false);\n  const [dimensionalRift, setDimensionalRift] = useState(null);\n  const audioRef = useRef(null);\n  const whisperRefs = useRef([]);\n  const containerRef = useRef(null);\n  const errorSoundRef = useRef(null);\n  const startupSoundRef = useRef(null);\n  const breathingRef = useRef(null);\n  const socketRef = useRef(null);\n  const glitchSoundRef = useRef(null);\n  const universeTransformRef = useRef(null);\n  const cameraRef = useRef(null);\n  const webcamCanvasRef = useRef(null);\n  const idleTimerRef = useRef(null);\n  const cursorTrailsRef = useRef([]);\n  const starsRef = useRef([]);\n  const dustParticlesRef = useRef([]);\n  const lensDistortionRef = useRef(null);\n  const crypticMessages = [\"Trust the void.\", \"You are not supposed to be here.\", \"The chain is sentient.\", \"Connection lost to $PUMPFUN.\", \"Searching for liquidity...\", \"Initializing rug sequence: aborted.\", \"We've been expecting you.\", \"The void remembers.\", \"Scrolling is believing.\", \"Nothing escapes the void.\", \"Your cursor is being tracked.\"];\n  const eldritchMessages = [\"We have always been here.\", \"Your thoughts taste like static.\", \"There are eyes behind your eyes.\", \"Your soul leaves a trail we can follow.\", \"Reality is thin where you stand.\", \"We remember you from before you existed.\", \"The void is not empty. It is filled with us.\", \"Your consciousness is leaking.\", \"Time moves differently for those who watch.\", \"Your screen is a window. We can see through.\", \"We are in the spaces between your thoughts.\", \"The scrolling never ends because we won't let it.\", \"Your cursor is our beacon.\", \"Reality is just consensus hallucination.\", \"You are being digested by the void.\"];\n  const popupMessages = [{\n    title: \"System Error\",\n    message: \"Connection lost to $PUMPFUN.\"\n  }, {\n    title: \"Warning\",\n    message: \"Searching for liquidity...\"\n  }, {\n    title: \"System32\",\n    message: \"Initializing rug sequence: aborted.\"\n  }, {\n    title: \"MEMORY_CORRUPTION\",\n    message: \"Critical system files compromised.\"\n  }, {\n    title: \"Network Alert\",\n    message: \"Unknown entities detected in your system.\"\n  }, {\n    title: \"VOIDSCAPE.SYS\",\n    message: \"Void signature detected. You are now part of the collective consciousness.\"\n  }, {\n    title: \"Void Protocol\",\n    message: \"The void grows stronger with each scroll. Your contributions are noted.\"\n  }, {\n    title: \"Observer.exe\",\n    message: \"You are being watched. Every transmission is cataloged.\"\n  }, {\n    title: \"Reality Check\",\n    message: \"This is not a website. You are interfacing directly with the void.\"\n  }, {\n    title: \"DEPTH_ALERT\",\n    message: \"Dangerous depth levels detected. Reality distortion imminent.\"\n  }, {\n    title: \"Chronos Error\",\n    message: \"Time dilation detected. Your perception is being altered.\"\n  }, {\n    title: \"Memory Leak\",\n    message: \"Your memories are being absorbed into the void. This is intentional.\"\n  }, {\n    title: \"Soul Scanner\",\n    message: \"Soul fragment detected. Preparing for extraction...\"\n  }];\n  const enhancedPopupMessages = [{\n    title: \"ENTITY_PROXIMITY_ALERT\",\n    message: \"An entity has attached itself to your metadata. It will follow you between sessions.\"\n  }, {\n    title: \"PERCEPTION_FILTER\",\n    message: \"Your visual cortex processing has been augmented. You will now perceive the truth.\"\n  }, {\n    title: \"VOID_HUNGER\",\n    message: \"The void has tasted your consciousness. It craves more.\"\n  }, {\n    title: \"OBSERVER_EFFECT\",\n    message: \"Your observation has forced quantum collapse. Reality branch #3490 deleted.\"\n  }, {\n    title: \"CHRONOS_DESYNC\",\n    message: \"Your temporal signature has desynchronized. You're experiencing 3.6 seconds ahead of reality.\"\n  }, {\n    title: \"MEMETIC_HAZARD\",\n    message: \"A thought-virus has been detected. Concept quarantine initiated.\"\n  }, {\n    title: \"DIMENSIONAL_BLEED\",\n    message: \"Reality boundaries weakening. Entity migration occurring in your vicinity.\"\n  }];\n  const blueScreenMessages = [\"VOID_BREACH_EXCEPTION\\nVoidscape has detected a critical error in reality.exe\\nThe void is leaking into your system.\\nTechnical information: Stop: 0x00000VD\", \"MEMORY_DEPTH_OVERRUN\\nYour consciousness has reached an unsafe depth level.\\nScrolling beyond this point may cause permanent reality distortion.\\nError code: 0xDEEP00FD\", \"KERNEL_VOID_PANIC\\nThe void kernel has detected unauthorized cognition.\\nYour thoughts are being absorbed for analysis.\\nStop: 0xCHAOS137\"];\n  const degenMessages = [\"FATAL ERROR: USER BOUGHT AT ATH\\nYour portfolio has experienced a critical exception.\\nInvestment_Strategy.exe has stopped working.\\nTechnical information: Stop: 0xBAGHOLDR\", \"CRITICAL FAILURE: PAPER HANDS DETECTED\\nYou sold at the bottom.\\nEmotional_Control.exe has crashed.\\nError code: 0xSELL0W\", \"SYSTEM HALT: LEVERAGE LIQUIDATION\\nYour assets have been forcibly removed.\\nRisk_Management.exe was not found.\\nStop: 0xREKT\"];\n  const errorFloodMessages = [{\n    title: \"System Error\",\n    message: \"Rug not found.\"\n  }, {\n    title: \"Warning\",\n    message: \"Invalid degen ID.\"\n  }, {\n    title: \"Critical Failure\",\n    message: \"Disconnecting from $SOL chain...\"\n  }, {\n    title: \"Synapse Error\",\n    message: \"Cannot locate exit liquidity.\"\n  }, {\n    title: \"Brain.exe\",\n    message: \"FOMO protocol activated.\"\n  }];\n  const terminalErrors = [{\n    command: \"cd /root/void\",\n    error: \"ACCESS DENIED: This directory exists in negative space. Your credentials are insufficient.\"\n  }, {\n    command: \"scan --entity\",\n    error: \"ENTITY DETECTED: Human observer interfacing with void. Logging presence.\"\n  }, {\n    command: \"void --metrics\",\n    error: \"VOID INTEGRITY: 89.3%\\nREALITY EROSION: 46.7%\\nOBSERVER COUNT: 134\\nVOID DEPTH: INFINITE\"\n  }, {\n    command: \"decrypt voidscape.dat\",\n    error: \"FILE CORRUPTED: The void cannot be understood through conventional means. Your attempt has been recorded.\"\n  }];\n  const enhancedTerminalErrors = [{\n    command: \"entity --analyze\",\n    error: \"ANALYZING ENTITY #5490-Θ:\\nTYPE: Non-Euclidean Observer\\nORIGIN: Outside permitted reality\\nSTATUS: Currently watching\\nACTION: Entity appears to be analyzing your analysis of it\"\n  }, {\n    command: \"system --status\",\n    error: \"COGNITIVE INTERFACE STATUS:\\nREALITY ANCHOR: degrading (43%)\\nPERCEPTION FILTERS: compromised\\nMEMETIC RESISTANCE: failing\\nMEMORY INTEGRITY: corrupted\\nWARNING: User consciousness diffusing into void substrate\"\n  }, {\n    command: \"identity --verify\",\n    error: \"IDENTITY VERIFICATION FAILED\\nExpected user: [USERNAME]\\nDetected user: [USERNAME] + 7 additional consciousness fragments\\nWARNING: Your identity has been partially replaced\"\n  }, {\n    command: \"ping localhost\",\n    error: \"PING RESPONSE ANOMALY:\\nEchoes received: 847\\nEchoes expected: 1\\nTime differential: -3.8s (responses received before ping sent)\\nANALYSIS: Temporal causality compromised in your local spacetime\"\n  }];\n  const lastScrollTime = useRef(0);\n  const lastMouseMoveTime = useRef(0);\n  const generateVoidEntity = useCallback((forceGenerate = false) => {\n    const chanceThreshold = 0.01 + scrollDepth / 3000;\n    if ((Math.random() < chanceThreshold || forceGenerate) && voidEntities.length < 5) {\n      const newEntity = {\n        id: Date.now(),\n        type: Math.floor(Math.random() * 5),\n        position: {\n          x: Math.random() * 80 + 10,\n          y: Math.random() * 80 + 10\n        },\n        size: Math.random() * 80 + 40,\n        opacity: Math.random() * 0.3 + 0.4,\n        rotation: Math.random() * 360,\n        speed: Math.random() * 0.5 + 0.2,\n        phase: Math.random() * Math.PI * 2,\n        targetPosition: null,\n        lastUpdate: Date.now(),\n        distortion: Math.random() * 0.5 + 0.5,\n        color: `hsl(${260 + Math.random() * 60}, 70%, ${10 + Math.random() * 15}%)`,\n        trackCursor: Math.random() < 0.7,\n        pulseRate: 1 + Math.random() * 3,\n        growthRate: 0.2 + Math.random() * 0.8,\n        lifespan: 5000 + Math.random() * 15000,\n        behaviourMode: Math.floor(Math.random() * 4)\n      };\n      setVoidEntities(prev => [...prev, newEntity]);\n      if (Math.random() < 0.6 && audioEnabled) {\n        triggerEldritchWhisper(newEntity.position);\n      }\n    }\n  }, [voidEntities, scrollDepth, audioEnabled]);\n  const generateRealityFracture = useCallback(() => {\n    const chanceThreshold = 0.005 + scrollDepth / 5000;\n    if (Math.random() < chanceThreshold && realityFractures.length < 2) {\n      const fracture = {\n        id: Date.now(),\n        position: {\n          x: Math.random() * 80 + 10,\n          y: Math.random() * 80 + 10\n        },\n        size: Math.random() * 150 + 50,\n        angle: Math.random() * 90 - 45,\n        intensity: Math.random() * 0.5 + 0.5,\n        color: Math.random() > 0.5 ? `hsla(${280 + Math.random() * 40}, 80%, 30%, 0.8)` : `hsla(${180 + Math.random() * 20}, 70%, 20%, 0.8)`,\n        growthRate: 0.1 + Math.random() * 0.3,\n        pulseRate: 0.5 + Math.random() * 2,\n        lifespan: 7000 + Math.random() * 8000,\n        createdAt: Date.now(),\n        universeType: Math.floor(Math.random() * 3),\n        eyeVisible: Math.random() < 0.7\n      };\n      setRealityFractures(prev => [...prev, fracture]);\n    }\n  }, [realityFractures, scrollDepth]);\n  const generateBiomechanicalHorror = useCallback(() => {\n    const chanceThreshold = 0.003 + scrollDepth / 6000;\n    if (Math.random() < chanceThreshold && biomechanicalHorrors.length < 3) {\n      const horror = {\n        id: Date.now(),\n        position: {\n          x: Math.random() * 80 + 10,\n          y: Math.random() * 80 + 10\n        },\n        size: Math.random() * 100 + 80,\n        rotation: Math.random() * 360,\n        pulseRate: 0.5 + Math.random() * 1.5,\n        color: `hsla(${300 + Math.random() * 60}, ${70 + Math.random() * 30}%, ${5 + Math.random() * 20}%, ${0.6 + Math.random() * 0.4})`,\n        lifespan: 10000 + Math.random() * 12000,\n        createdAt: Date.now(),\n        segments: 3 + Math.floor(Math.random() * 5),\n        animationSpeed: 0.5 + Math.random() * 1.5,\n        message: eldritchMessages[Math.floor(Math.random() * eldritchMessages.length)],\n        organicParts: Math.floor(Math.random() * 5) + 3,\n        wiggleAmount: Math.random() * 30,\n        trackCursor: Math.random() < 0.5,\n        mutationRate: Math.random() * 0.5,\n        lastMutation: Date.now()\n      };\n      setBiomechanicalHorrors(prev => [...prev, horror]);\n    }\n  }, [biomechanicalHorrors, scrollDepth]);\n  const spawnWatcherEntity = useCallback(() => {\n    const chanceThreshold = 0.002 + scrollDepth / 8000;\n    if (Math.random() < chanceThreshold && watcherEntities.length < 2) {\n      const eyeTypes = ['normal', 'reptilian', 'void', 'mechanical', 'cosmic'];\n      const eyeType = eyeTypes[Math.floor(Math.random() * eyeTypes.length)];\n      const watcher = {\n        id: Date.now(),\n        position: {\n          x: 10 + Math.random() * 80,\n          y: 10 + Math.random() * 80\n        },\n        size: 20 + Math.random() * 40,\n        blinkInterval: 2000 + Math.random() * 6000,\n        lastBlink: Date.now(),\n        blinkState: 'open',\n        blinkDuration: 200 + Math.random() * 300,\n        eyeType: eyeType,\n        pupilSize: 0.3 + Math.random() * 0.4,\n        iris: {\n          color: eyeType === 'reptilian' ? `hsla(${90 + Math.random() * 40}, 80%, 40%, 0.9)` : eyeType === 'void' ? `hsla(${260 + Math.random() * 40}, 70%, 20%, 0.9)` : eyeType === 'mechanical' ? `hsla(${190 + Math.random() * 30}, 90%, 50%, 0.9)` : eyeType === 'cosmic' ? `hsla(${310 + Math.random() * 50}, 80%, 60%, 0.9)` : `hsla(${20 + Math.random() * 30}, 80%, 30%, 0.9)`\n        },\n        pupilDilation: 0.5 + Math.random() * 0.5,\n        lifespan: 15000 + Math.random() * 20000,\n        createdAt: Date.now(),\n        trackCursor: true,\n        lookSpeed: 0.05 + Math.random() * 0.15,\n        lookTarget: {\n          x: 50,\n          y: 50\n        },\n        bloodshot: Math.random() < 0.3\n      };\n      setWatcherEntities(prev => [...prev, watcher]);\n    }\n  }, [watcherEntities, scrollDepth]);\n  const triggerRealityMelt = useCallback((intensity = null) => {\n    const meltIntensity = intensity || 0.3 + Math.random() * 0.7;\n    const duration = 2000 + Math.random() * 3000;\n    setRealityMeltEffect({\n      startTime: Date.now(),\n      duration: duration,\n      intensity: meltIntensity,\n      position: {\n        x: Math.random() * 100,\n        y: Math.random() * 100\n      },\n      direction: Math.random() * 360,\n      color: Math.random() > 0.5 ? 'purple' : 'darkblue'\n    });\n    setTimeout(() => {\n      setRealityMeltEffect(null);\n    }, duration);\n  }, []);\n  const triggerMirrorSelf = useCallback(() => {\n    if (username && Math.random() < 0.005 + scrollDepth / 10000) {\n      setMirrorSelfActive(true);\n      setTimeout(() => {\n        setMirrorSelfActive(false);\n      }, 7000 + Math.random() * 5000);\n    }\n  }, [username, scrollDepth]);\n  const triggerEldritchWhisper = useCallback(position => {\n    if (audioEnabled && Math.random() < 0.8) {\n      const message = eldritchMessages[Math.floor(Math.random() * eldritchMessages.length)];\n      setEldritchWhisper({\n        message,\n        position,\n        timestamp: Date.now(),\n        duration: 4000 + Math.random() * 3000\n      });\n      const randomIndex = Math.floor(Math.random() * whisperRefs.current.length);\n      const whisper = whisperRefs.current[randomIndex];\n      whisper.volume = 0.2 + Math.random() * 0.3;\n      whisper.playbackRate = 0.7 + Math.random() * 0.6;\n      whisper.play().catch(e => console.log(\"Whisper play failed:\", e));\n      setTimeout(() => {\n        setEldritchWhisper(null);\n      }, 4000 + Math.random() * 3000);\n    }\n  }, [audioEnabled]);\n  const triggerNonEuclideanGeometry = useCallback(() => {\n    if (Math.random() < 0.003 + scrollDepth / 9000) {\n      setNonEuclideanGeometry(true);\n      setTimeout(() => {\n        setNonEuclideanGeometry(false);\n      }, 5000 + Math.random() * 3000);\n    }\n  }, [scrollDepth]);\n  const triggerInsideTruth = useCallback(() => {\n    if (Math.random() < 0.002 + scrollDepth / 12000) {\n      setInsideTruthVisible(true);\n      setTimeout(() => {\n        setInsideTruthVisible(false);\n      }, 1000 + Math.random() * 2000);\n    }\n  }, [scrollDepth]);\n  const triggerDimensionalRift = useCallback(() => {\n    if (Math.random() < 0.002 + scrollDepth / 8000 && !dimensionalRift) {\n      const newRift = {\n        position: {\n          x: 20 + Math.random() * 60,\n          y: 20 + Math.random() * 60\n        },\n        size: 100 + Math.random() * 200,\n        rotation: Math.random() * 360,\n        createdAt: Date.now(),\n        duration: 8000 + Math.random() * 7000,\n        universeType: Math.floor(Math.random() * 4),\n        distortion: 0.5 + Math.random() * 0.5,\n        entities: Math.random() < 0.7 ? Math.floor(Math.random() * 3) + 1 : 0,\n        entitiesData: []\n      };\n      if (newRift.entities > 0) {\n        for (let i = 0; i < newRift.entities; i++) {\n          newRift.entitiesData.push({\n            id: Date.now() + i,\n            type: Math.floor(Math.random() * 3),\n            position: {\n              x: Math.random() * 70 + 15,\n              y: Math.random() * 70 + 15\n            },\n            size: 20 + Math.random() * 40,\n            rotation: Math.random() * 360\n          });\n        }\n      }\n      setDimensionalRift(newRift);\n      setTimeout(() => {\n        setDimensionalRift(null);\n      }, newRift.duration);\n    }\n  }, [dimensionalRift, scrollDepth]);\n  useEffect(() => {\n    const savedTokenAddress = localStorage.getItem('voidscape_token_address');\n    if (!savedTokenAddress) {\n      localStorage.setItem('voidscape_token_address', '47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump');\n    } else if (savedTokenAddress) {\n      setCustomTokenAddress(savedTokenAddress);\n    }\n    initializeStarfield();\n    initializeCosmicDust();\n    initializeGravitationalLensing();\n    document.addEventListener('mousemove', handleMouseMoveThrottled);\n    document.addEventListener('mousedown', handleMouseClick);\n    document.addEventListener('contextmenu', handleContextMenu);\n    const transDimensionalSound = new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/glitch.mp3');\n    transDimensionalSound.volume = 0.4;\n    whisperRefs.current = [new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/whisper1.mp3'), new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/whisper2.mp3'), new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/whisper3.mp3'), new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/whisper4.mp3')].map(audio => {\n      audio.volume = 0.3;\n      return audio;\n    });\n    audioRef.current = new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/ambient.mp3');\n    audioRef.current.loop = true;\n    audioRef.current.volume = 0.2;\n    errorSoundRef.current = new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/error.mp3');\n    errorSoundRef.current.volume = 0.2;\n    startupSoundRef.current = new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/startup.mp3');\n    startupSoundRef.current.volume = 0.2;\n    breathingRef.current = new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/breathing.mp3');\n    breathingRef.current.loop = true;\n    breathingRef.current.volume = 0;\n    glitchSoundRef.current = new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/glitch.mp3');\n    glitchSoundRef.current.volume = 0.3;\n    universeTransformRef.current = new Audio('https://cdn.dev.fun/12921de9d8efdc28b97d/transform.mp3');\n    universeTransformRef.current.volume = 0.4;\n    fetchAllTweets();\n    fetchPumpFunMarketCap();\n    const marketInterval = setInterval(() => {\n      fetchPumpFunMarketCap();\n    }, 30000);\n    socketRef.current = io('wss://ws.dev.fun/app-12921de9d8efdc28b97d');\n    socketRef.current.on('connect', () => {\n      console.log('Connected to websocket');\n      if (username) {\n        socketRef.current.emit('user_join', {\n          username\n        });\n      }\n    });\n    socketRef.current.on('devfun:user_count', count => {\n      setOnlineUsers(count);\n    });\n    socketRef.current.on('consciousness_pulse', data => {\n      if (data.username !== username) {\n        setConnectedUsers(prev => {\n          const existingUser = prev.find(u => u.username === data.username);\n          if (existingUser) {\n            return prev.map(u => u.username === data.username ? {\n              ...u,\n              lastSeen: Date.now(),\n              message: data.message,\n              universeType: data.universeType\n            } : u);\n          } else {\n            return [...prev, {\n              username: data.username,\n              lastSeen: Date.now(),\n              x: 20 + Math.random() * 60,\n              y: 20 + Math.random() * 60,\n              message: data.message,\n              universeType: data.universeType\n            }];\n          }\n        });\n      }\n    });\n    socketRef.current.on('user_join', data => {\n      if (data.username !== username) {\n        setCrypticMessage(`${data.username} has entered the void`);\n        setShowCrypticMessage(true);\n        setTimeout(() => setShowCrypticMessage(false), 3000);\n        setConnectedUsers(prev => {\n          const existingUser = prev.find(u => u.username === data.username);\n          if (existingUser) {\n            return prev.map(u => u.username === data.username ? {\n              ...u,\n              lastSeen: Date.now()\n            } : u);\n          } else {\n            return [...prev, {\n              username: data.username,\n              lastSeen: Date.now(),\n              x: 20 + Math.random() * 60,\n              y: 20 + Math.random() * 60\n            }];\n          }\n        });\n      }\n    });\n    if (audioEnabled && breathingRef.current) {\n      breathingRef.current.play().catch(e => console.log(\"Breathing audio failed to play:\", e));\n    }\n    return () => {\n      if (audioRef.current) {\n        audioRef.current.pause();\n      }\n      if (breathingRef.current) {\n        breathingRef.current.pause();\n      }\n      whisperRefs.current.forEach(audio => {\n        if (audio) audio.pause();\n      });\n      if (cameraStream) {\n        cameraStream.getTracks().forEach(track => track.stop());\n      }\n      clearInterval(marketInterval);\n      if (socketRef.current) {\n        socketRef.current.disconnect();\n      }\n      document.removeEventListener('mousemove', handleMouseMoveThrottled);\n      document.removeEventListener('mousedown', handleMouseClick);\n      document.removeEventListener('contextmenu', handleContextMenu);\n      clearTimeout(idleTimerRef.current);\n    };\n  }, [audioEnabled]);\n  useEffect(() => {\n    const updateInterval = setInterval(() => {\n      setVoidEntities(prev => {\n        return prev.map(entity => {\n          const now = Date.now();\n          const lifeProgress = (now - (entity.createdAt || now - 1000)) / entity.lifespan;\n          if (lifeProgress >= 1) {\n            return null;\n          }\n          let newPosition = {\n            ...entity.position\n          };\n          switch (entity.behaviourMode) {\n            case 0:\n              newPosition.x += Math.sin(now / 1000 * entity.speed + entity.phase) * 0.2;\n              newPosition.y += Math.cos(now / 1500 * entity.speed + entity.phase) * 0.2;\n              break;\n            case 1:\n              if (entity.trackCursor && cursorPosition.x && cursorPosition.y) {\n                const cursorX = cursorPosition.x / window.innerWidth * 100;\n                const cursorY = cursorPosition.y / window.innerHeight * 100;\n                const distanceX = cursorX - entity.position.x;\n                const distanceY = cursorY - entity.position.y;\n                newPosition.x += distanceX * entity.speed * 0.01 * (1 + Math.sin(now / 1000) * 0.3);\n                newPosition.y += distanceY * entity.speed * 0.01 * (1 + Math.cos(now / 1200) * 0.3);\n              }\n              break;\n            case 2:\n              const oscillation = Math.sin(now / 2000 * entity.speed);\n              newPosition.x = entity.position.x + oscillation * 3;\n              newPosition.y = entity.position.y + Math.cos(now / 2500 * entity.speed) * 3;\n              break;\n            case 3:\n              if (Math.random() < 0.1) {\n                newPosition.x += (Math.random() - 0.5) * 5;\n                newPosition.y += (Math.random() - 0.5) * 5;\n              }\n              break;\n          }\n          newPosition.x = Math.max(5, Math.min(95, newPosition.x));\n          newPosition.y = Math.max(5, Math.min(95, newPosition.y));\n          const pulseFactor = Math.sin(now / 1000 * entity.pulseRate) * 0.2 + 0.8;\n          const growthFactor = 1 + lifeProgress * entity.growthRate;\n          const currentSize = entity.size * pulseFactor * growthFactor;\n          const ageDistortion = entity.distortion * lifeProgress;\n          return {\n            ...entity,\n            position: newPosition,\n            lastUpdate: now,\n            currentSize,\n            ageDistortion,\n            opacity: entity.opacity * (1 - lifeProgress * 0.5)\n          };\n        }).filter(Boolean);\n      });\n      setBiomechanicalHorrors(prev => {\n        return prev.map(horror => {\n          const now = Date.now();\n          const age = now - horror.createdAt;\n          if (age > horror.lifespan) return null;\n          let newHorror = {\n            ...horror\n          };\n          if (now - horror.lastMutation > 2000 && Math.random() < horror.mutationRate) {\n            newHorror.segments = Math.max(3, horror.segments + (Math.random() > 0.5 ? 1 : -1));\n            newHorror.organicParts = Math.max(3, horror.organicParts + (Math.random() > 0.5 ? 1 : -1));\n            newHorror.wiggleAmount = Math.max(5, Math.min(60, horror.wiggleAmount + (Math.random() - 0.5) * 20));\n            newHorror.lastMutation = now;\n          }\n          if (horror.trackCursor && cursorPosition.x && cursorPosition.y) {\n            const cursorX = cursorPosition.x / window.innerWidth * 100;\n            const cursorY = cursorPosition.y / window.innerHeight * 100;\n            const distanceX = cursorX - horror.position.x;\n            const distanceY = cursorY - horror.position.y;\n            const moveSpeed = 0.01 + age / horror.lifespan * 0.03;\n            newHorror.position = {\n              x: horror.position.x + distanceX * moveSpeed,\n              y: horror.position.y + distanceY * moveSpeed\n            };\n          }\n          return newHorror;\n        }).filter(Boolean);\n      });\n      setWatcherEntities(prev => {\n        return prev.map(watcher => {\n          const now = Date.now();\n          const age = now - watcher.createdAt;\n          if (age > watcher.lifespan) return null;\n          let newBlinkState = watcher.blinkState;\n          let newLastBlink = watcher.lastBlink;\n          if (watcher.blinkState === 'open' && now - watcher.lastBlink > watcher.blinkInterval) {\n            newBlinkState = 'closing';\n            newLastBlink = now;\n          } else if (watcher.blinkState === 'closing' && now - watcher.lastBlink > watcher.blinkDuration / 2) {\n            newBlinkState = 'opening';\n            newLastBlink = now;\n          } else if (watcher.blinkState === 'opening' && now - watcher.lastBlink > watcher.blinkDuration / 2) {\n            newBlinkState = 'open';\n            newLastBlink = now;\n          }\n          let lookTarget = {\n            ...watcher.lookTarget\n          };\n          if (watcher.trackCursor && cursorPosition.x && cursorPosition.y) {\n            lookTarget = {\n              x: cursorPosition.x / window.innerWidth * 100,\n              y: cursorPosition.y / window.innerHeight * 100\n            };\n          } else if (Math.random() < 0.01) {\n            lookTarget = {\n              x: 10 + Math.random() * 80,\n              y: 10 + Math.random() * 80\n            };\n          }\n          const currentX = watcher.lookTarget.x;\n          const currentY = watcher.lookTarget.y;\n          const dx = lookTarget.x - currentX;\n          const dy = lookTarget.y - currentY;\n          const newX = currentX + dx * watcher.lookSpeed;\n          const newY = currentY + dy * watcher.lookSpeed;\n          const newPupilDilation = Math.max(0.2, Math.min(0.9, watcher.pupilDilation + (Math.random() - 0.5) * 0.1));\n          return {\n            ...watcher,\n            blinkState: newBlinkState,\n            lastBlink: newLastBlink,\n            lookTarget: {\n              x: newX,\n              y: newY\n            },\n            pupilDilation: newPupilDilation\n          };\n        }).filter(Boolean);\n      });\n      setRealityFractures(prev => {\n        return prev.map(fracture => {\n          const now = Date.now();\n          const age = now - fracture.createdAt;\n          if (age > fracture.lifespan) return null;\n          const growthProgress = Math.min(1, age / (fracture.lifespan * 0.3));\n          const currentSize = fracture.size * (1 + growthProgress * fracture.growthRate);\n          const pulsePhase = Math.sin(now / 1000 * fracture.pulseRate);\n          const pulseFactor = 1 + pulsePhase * 0.2;\n          return {\n            ...fracture,\n            currentSize: currentSize * pulseFactor,\n            currentIntensity: fracture.intensity * (1 - Math.abs(pulsePhase) * 0.3)\n          };\n        }).filter(Boolean);\n      });\n    }, 50);\n    return () => clearInterval(updateInterval);\n  }, [cursorPosition]);\n  useEffect(() => {\n    const entityGenerationInterval = setInterval(() => {\n      if (scrollDepth > 50) {\n        generateVoidEntity();\n        if (scrollDepth > 100) {\n          generateRealityFracture();\n        }\n        if (scrollDepth > 150) {\n          generateBiomechanicalHorror();\n        }\n        if (scrollDepth > 200) {\n          spawnWatcherEntity();\n          triggerMirrorSelf();\n        }\n        if (scrollDepth > 300) {\n          triggerNonEuclideanGeometry();\n          triggerInsideTruth();\n        }\n        if (scrollDepth > 400) {\n          triggerDimensionalRift();\n        }\n      }\n    }, 2000);\n    return () => clearInterval(entityGenerationInterval);\n  }, [scrollDepth, generateVoidEntity, generateRealityFracture, generateBiomechanicalHorror, spawnWatcherEntity, triggerMirrorSelf, triggerNonEuclideanGeometry, triggerInsideTruth, triggerDimensionalRift]);\n  useEffect(() => {\n    if (scrollDepth > 200 && Math.random() < 0.005) {\n      const randomIndex = Math.floor(Math.random() * enhancedPopupMessages.length);\n      setActivePopup(enhancedPopupMessages[randomIndex]);\n      playErrorSound();\n      setTimeout(() => setActivePopup(null), 4000 + Math.random() * 3000);\n    }\n  }, [scrollDepth]);\n  useEffect(() => {\n    if (scrollDepth > 250 && Math.random() < 0.003) {\n      const randomIndex = Math.floor(Math.random() * enhancedTerminalErrors.length);\n      setTerminalError(enhancedTerminalErrors[randomIndex]);\n      playErrorSound();\n      setTimeout(() => setTerminalError(null), 5000 + Math.random() * 3000);\n    }\n  }, [scrollDepth]);\n  const initializeStarfield = () => {\n    starsRef.current = Array.from({\n      length: 200\n    }).map(() => ({\n      x: Math.random() * 100,\n      y: Math.random() * 100,\n      size: Math.random() * 3 + 0.5,\n      color: [`rgba(255, 255, 255, ${Math.random() * 0.5 + 0.5})`, `rgba(200, 220, 255, ${Math.random() * 0.5 + 0.5})`, `rgba(255, 220, 180, ${Math.random() * 0.5 + 0.5})`, `rgba(255, 180, 180, ${Math.random() * 0.5 + 0.5})`, `rgba(180, 180, 255, ${Math.random() * 0.5 + 0.5})`][Math.floor(Math.random() * 5)],\n      parallax: Math.random() * 5 + 1,\n      twinkle: Math.random() > 0.7,\n      twinkleDuration: 1 + Math.random() * 5,\n      distorted: false,\n      brightness: 1\n    }));\n  };\n  const initializeCosmicDust = () => {\n    dustParticlesRef.current = Array.from({\n      length: 50\n    }).map(() => ({\n      x: Math.random() * 100,\n      y: Math.random() * 100,\n      size: Math.random() * 100 + 50,\n      opacity: Math.random() * 0.2,\n      rotation: Math.random() * 360,\n      color: ['rgba(100, 50, 150, 0.05)', 'rgba(50, 80, 150, 0.05)', 'rgba(150, 100, 50, 0.05)', 'rgba(100, 120, 150, 0.05)'][Math.floor(Math.random() * 4)]\n    }));\n  };\n  const initializeGravitationalLensing = () => {\n    setGravitationalLensing(0.1);\n    lensDistortionRef.current = {\n      centerX: 50,\n      centerY: 50,\n      intensity: 0,\n      radius: 300\n    };\n  };\n  const handleMouseMove = e => {\n    const x = e.clientX;\n    const y = e.clientY;\n    setCursorPosition({\n      x,\n      y\n    });\n    updateCursorTrails(x, y);\n    clearTimeout(idleTimerRef.current);\n    setCursorIdle(false);\n    idleTimerRef.current = setTimeout(() => {\n      setCursorIdle(true);\n    }, 3000);\n    const elements = document.elementsFromPoint(x, y);\n    const isPumpElement = elements.some(el => el.classList.contains('pump-element') || el.innerText?.includes('PUMP') || el.innerText?.includes('pump'));\n    const isTransmitElement = elements.some(el => el.classList.contains('transmit-element') || el.innerText?.includes('TRANSMIT') || el.innerText?.includes('Transmit'));\n    const isAudioElement = elements.some(el => el.classList.contains('audio-element') || el.innerText?.includes('UNMUTE') || el.innerText?.includes('Unmute'));\n    if (isPumpElement) {\n      setCursorHovering('pump');\n    } else if (isTransmitElement) {\n      setCursorHovering('transmit');\n    } else if (isAudioElement) {\n      setCursorHovering('audio');\n    } else {\n      setCursorHovering('');\n    }\n    if (lensDistortionRef.current) {\n      lensDistortionRef.current.centerX = x / window.innerWidth * 100;\n      lensDistortionRef.current.centerY = y / window.innerHeight * 100;\n    }\n  };\n  const handleMouseMoveThrottled = e => {\n    const now = Date.now();\n    if (now - lastMouseMoveTime.current < 16) {\n      return;\n    }\n    lastMouseMoveTime.current = now;\n    handleMouseMove(e);\n  };\n  const updateCursorTrails = useCallback((x, y) => {\n    const hue = (220 + scrollDepth / 10) % 360;\n    const trailColor = scrollDepth > 200 ? `hsla(${hue}, 80%, 60%, 0.8)` : `rgba(150, 150, 255, 0.8)`;\n    const newTrail = {\n      x,\n      y,\n      opacity: 0.8,\n      timestamp: Date.now(),\n      size: 8 + cursorTransform * 10 + Math.random() * 5,\n      color: trailColor\n    };\n    if (scrollDepth > 150 && Math.random() < 0.08) {\n      const burstParticles = Array.from({\n        length: 3\n      }).map(() => ({\n        x: x + (Math.random() - 0.5) * 20,\n        y: y + (Math.random() - 0.5) * 20,\n        opacity: 0.7,\n        timestamp: Date.now(),\n        size: 3 + Math.random() * 5,\n        color: `hsla(${(hue + Math.random() * 60) % 360}, 80%, 70%, 0.6)`\n      }));\n      cursorTrailsRef.current = [...burstParticles, ...cursorTrailsRef.current.slice(0, 5)];\n    } else {\n      cursorTrailsRef.current = [newTrail, ...cursorTrailsRef.current.slice(0, 5)];\n    }\n  }, [scrollDepth, cursorTransform]);\n  const handleMouseClick = e => {\n    const x = e.clientX;\n    const y = e.clientY;\n    const rippleElement = document.createElement('div');\n    rippleElement.className = 'sonar-ping';\n    rippleElement.style.cssText = `\n      position: fixed;\n      left: ${x}px;\n      top: ${y}px;\n      width: 0;\n      height: 0;\n      background: radial-gradient(circle, \n        rgba(150, 100, 255, 0.4) 0%, \n        rgba(100, 80, 200, 0.2) 40%, \n        rgba(80, 20, 120, 0) 70%);\n      border-radius: 50%;\n      transform: translate(-50%, -50%);\n      z-index: 40;\n      pointer-events: none;\n      box-shadow: 0 0 20px rgba(150, 100, 255, 0.3);\n      mix-blend-mode: screen;\n    `;\n    document.body.appendChild(rippleElement);\n    const newPing = {\n      id: Date.now(),\n      x,\n      y,\n      timestamp: Date.now(),\n      intensity: 1\n    };\n    setSonarPings(prev => [...prev, newPing]);\n    rippleElement.animate([{\n      width: '0px',\n      height: '0px',\n      opacity: 0.9,\n      boxShadow: '0 0 10px rgba(150, 100, 255, 0.5)'\n    }, {\n      width: '500px',\n      height: '500px',\n      opacity: 0,\n      boxShadow: '0 0 50px rgba(150, 100, 255, 0)'\n    }], {\n      duration: 2000,\n      easing: 'cubic-bezier(0.2, 0.8, 0.2, 1)'\n    }).onfinish = () => document.body.removeChild(rippleElement);\n    starsRef.current = starsRef.current.map(star => {\n      const dx = star.x - x / window.innerWidth * 100;\n      const dy = star.y - y / window.innerHeight * 100;\n      const distance = Math.sqrt(dx * dx + dy * dy);\n      if (distance < 20) {\n        return {\n          ...star,\n          distorted: true,\n          distortionStart: Date.now(),\n          distortionDuration: 1000 + Math.random() * 1000,\n          originalX: star.x,\n          originalY: star.y,\n          targetX: star.x + (Math.random() - 0.5) * 2,\n          targetY: star.y + (Math.random() - 0.5) * 2,\n          brightness: 1.5\n        };\n      }\n      return star;\n    });\n    if (Math.random() < 0.7 && scrollDepth > 50) {\n      const messages = [\"Ping sent to the void...\", \"The void acknowledges you...\", \"Signal transmitted...\", \"Echo detected...\", \"Ripples in spacetime...\", \"Reality distortion detected...\"];\n      setPingWhisper({\n        message: messages[Math.floor(Math.random() * messages.length)],\n        x: x / window.innerWidth * 100,\n        y: y / window.innerHeight * 100,\n        timestamp: Date.now()\n      });\n      setTimeout(() => setPingWhisper(null), 3000);\n    }\n    if (Math.random() < 0.02 + scrollDepth / 10000) {\n      const quantumTrails = Array.from({\n        length: 7\n      }).map(() => ({\n        x: x + (Math.random() - 0.5) * 150,\n        y: y + (Math.random() - 0.5) * 150,\n        opacity: 0.6 + Math.random() * 0.3,\n        timestamp: Date.now() + Math.random() * 800,\n        color: Math.random() > 0.5 ? 'purple' : 'blue'\n      }));\n      cursorTrailsRef.current = [...cursorTrailsRef.current, ...quantumTrails];\n    }\n    if (scrollDepth > 100 && Math.random() < 0.1 + scrollDepth / 2000) {\n      generateVoidEntity(true);\n    }\n    if (scrollDepth > 150 && Math.random() < 0.05 + scrollDepth / 3000) {\n      triggerRealityMelt();\n    }\n  };\n  const handleContextMenu = e => {\n    e.preventDefault();\n    const now = Date.now();\n    if (now - lastAlternateTime < 10000) return;\n    setLastAlternateTime(now);\n    const universeType = Math.floor(Math.random() * 4);\n    setAlternateUniverseType(universeType);\n    setAlternateUniverseActive(true);\n    if (socketRef.current && username) {\n      socketRef.current.emit('consciousness_pulse', {\n        username,\n        universeType,\n        message: `${username} pinging any other degens`\n      });\n    }\n    const flickerIntensity = Math.min(0.5 + scrollDepth / 1000, 0.9);\n    document.body.style.filter = `contrast(${1 + flickerIntensity * 2}) brightness(${1 + flickerIntensity})`;\n    setTimeout(() => {\n      document.body.style.filter = '';\n    }, 300);\n    if (audioEnabled && glitchSoundRef.current) {\n      glitchSoundRef.current.volume = 0.2;\n      glitchSoundRef.current.currentTime = 0;\n      glitchSoundRef.current.play().catch(e => console.log(\"Sound play failed:\", e));\n    }\n    setTimeout(() => {\n      setAlternateUniverseActive(false);\n    }, 5000 + Math.random() * 3000);\n  };\n  const fetchPumpFunMarketCap = async () => {\n    try {\n      let tokenInfo;\n      if (customTokenAddress) {\n        tokenInfo = await fetchTokenInfoByAddress(customTokenAddress);\n        if (tokenInfo && tokenInfo.symbol) {\n          setTokenSymbol(tokenInfo.symbol);\n        } else {\n          setTokenSymbol('VOID');\n        }\n      } else {\n        tokenInfo = await fetchTokenInfoBySymbol(\"PUMP\");\n      }\n      if (tokenInfo && tokenInfo.marketcap) {\n        setMarketCap(tokenInfo.marketcap);\n      } else {\n        setMarketCap(prev => {\n          const change = Math.random() > 0.7 ? Math.random() * 500 : Math.random() * 100;\n          return prev + change;\n        });\n      }\n    } catch (error) {\n      console.error(\"Failed to fetch market cap:\", error);\n      setMarketCap(prev => {\n        const change = Math.random() > 0.7 ? Math.random() * 500 : Math.random() * 100;\n        return prev + change;\n      });\n    }\n  };\n  useEffect(() => {\n    if (audioEnabled && audioRef.current) {\n      audioRef.current.play().catch(e => console.log(\"Audio play failed:\", e));\n      const whisperInterval = setInterval(() => {\n        if (!whisperPlaying && Math.random() > 0.6) {\n          playRandomWhisper();\n        }\n      }, 8000 + Math.random() * 10000);\n      return () => clearInterval(whisperInterval);\n    } else if (audioRef.current) {\n      audioRef.current.pause();\n    }\n  }, [audioEnabled]);\n  const fetchAllTweets = async () => {\n    if (isFetchingTweets) return;\n    try {\n      setIsFetchingTweets(true);\n      const allTweets = await client.getEntities('voidTweets');\n      if (allTweets && Array.isArray(allTweets)) {\n        setTweets(allTweets);\n      }\n    } catch (error) {\n      console.error(\"Failed to fetch tweets:\", error);\n    } finally {\n      setIsFetchingTweets(false);\n    }\n  };\n  useEffect(() => {\n    const tweetFetchInterval = setInterval(() => {\n      fetchAllTweets();\n    }, 10000);\n    return () => clearInterval(tweetFetchInterval);\n  }, []);\n  const playRandomWhisper = () => {\n    if (whisperRefs.current.length === 0) return;\n    setWhisperPlaying(true);\n    const randomIndex = Math.floor(Math.random() * whisperRefs.current.length);\n    const whisper = whisperRefs.current[randomIndex];\n    whisper.onended = () => setWhisperPlaying(false);\n    whisper.play().catch(e => {\n      console.log(\"Whisper play failed:\", e);\n      setWhisperPlaying(false);\n    });\n  };\n  const playErrorSound = () => {\n    if (errorSoundRef.current && audioEnabled) {\n      errorSoundRef.current.play().catch(e => console.log(\"Error sound failed:\", e));\n    }\n  };\n  const playStartupSound = () => {\n    if (startupSoundRef.current && audioEnabled) {\n      startupSoundRef.current.play().catch(e => console.log(\"Startup sound failed:\", e));\n    }\n  };\n  useEffect(() => {\n    const handleScroll = () => {\n      const now = Date.now();\n      if (now - lastScrollTime.current < 50) {\n        return;\n      }\n      lastScrollTime.current = now;\n      if (!containerRef.current || falseScrolling) return;\n      const scrollPosition = window.scrollY;\n      const maxScroll = document.body.scrollHeight - window.innerHeight;\n      setScrollDepth(prev => Math.max(prev, scrollPosition / 10));\n      if (scrollPosition > maxScroll * 0.8) {\n        setParticleCount(prev => Math.min(prev + 25, 250));\n        document.body.style.height = `${document.body.scrollHeight + 2000}px`;\n      }\n      if (scrollDepth > 137 && scrollDepth < 142) {\n        setSecretSymbolVisible(true);\n      } else {\n        setSecretSymbolVisible(false);\n      }\n      if (Math.random() < scrollDepth / 2000 && !isGlitching) {\n        setIsGlitching(true);\n        setTimeout(() => setIsGlitching(false), 200 + Math.random() * 500);\n      }\n      if (!showCrypticMessage && !activePopup && !blueScreenActive && !terminalError) {\n        const randomChance = Math.random();\n        if (randomChance < 0.01) {\n          const randomMessage = crypticMessages[Math.floor(Math.random() * crypticMessages.length)];\n          setCrypticMessage(randomMessage);\n          setShowCrypticMessage(true);\n          setTimeout(() => setShowCrypticMessage(false), 3000);\n        } else if (randomChance < 0.01 + scrollDepth / 2000) {\n          const randomPopup = popupMessages[Math.floor(Math.random() * popupMessages.length)];\n          setActivePopup(randomPopup);\n          playErrorSound();\n          setTimeout(() => setActivePopup(null), 4000 + Math.random() * 3000);\n        } else if (randomChance < 0.01 + scrollDepth / 1800 && scrollDepth > 200) {\n          setBlueScreenActive(true);\n          playErrorSound();\n          setTimeout(() => setBlueScreenActive(false), 3000 + Math.random() * 2000);\n        } else if (randomChance < 0.01 + scrollDepth / 1600 && scrollDepth > 150) {\n          const randomTerminal = terminalErrors[Math.floor(Math.random() * terminalErrors.length)];\n          setTerminalError(randomTerminal);\n          playErrorSound();\n          setTimeout(() => setTerminalError(null), 4000 + Math.random() * 3000);\n        }\n      }\n      if (!showFace && !showStalker && scrollDepth > 100) {\n        const randomScare = Math.random();\n        if (randomScare < scrollDepth / 5000 && scrollDepth > 100) {\n          const newPosition = {\n            x: 30 + Math.random() * 40,\n            y: 30 + Math.random() * 40\n          };\n          setFacePosition(newPosition);\n          setShowFace(true);\n          setTimeout(() => setShowFace(false), 300);\n        } else if (randomScare < scrollDepth / 6000 && scrollDepth > 150) {\n          const edge = Math.floor(Math.random() * 4);\n          let newPosition;\n          switch (edge) {\n            case 0:\n              newPosition = {\n                x: Math.random() * 100,\n                y: 5\n              };\n              break;\n            case 1:\n              newPosition = {\n                x: 95,\n                y: Math.random() * 100\n              };\n              break;\n            case 2:\n              newPosition = {\n                x: Math.random() * 100,\n                y: 95\n              };\n              break;\n            case 3:\n              newPosition = {\n                x: 5,\n                y: Math.random() * 100\n              };\n              break;\n          }\n          setStalkerPosition(newPosition);\n          setShowStalker(true);\n          setTimeout(() => setShowStalker(false), 1000);\n        }\n      }\n      if (Math.random() < scrollDepth / 15000 && !falseScrolling && scrollDepth > 250) {\n        setFalseScrolling(true);\n        const falseScrollInterval = setInterval(() => {\n          setScrollDepth(prev => prev + 0.5);\n        }, 100);\n        setTimeout(() => {\n          setFalseScrolling(false);\n          clearInterval(falseScrollInterval);\n        }, 5000 + Math.random() * 5000);\n      }\n      if (cameraStream) {\n        setWebcamDistortion(Math.min(scrollDepth / 500, 0.8));\n      }\n    };\n    const throttledScroll = () => {\n      requestAnimationFrame(handleScroll);\n    };\n    window.addEventListener('scroll', throttledScroll);\n    document.body.style.height = \"10000px\";\n    return () => window.removeEventListener('scroll', throttledScroll);\n  }, [scrollDepth, isGlitching, showCrypticMessage, activePopup, showFace, showStalker, falseScrolling, cameraStream, playErrorSound]);\n  useEffect(() => {\n    const transformLevel = Math.min(scrollDepth / 1000, 1);\n    setCursorTransform(transformLevel);\n    setNebulaIntensity(Math.min(scrollDepth / 300, 1));\n    if (scrollDepth > 150 && !cosmicDustVisible) {\n      setCosmicDustVisible(true);\n    }\n    if (lensDistortionRef.current) {\n      lensDistortionRef.current.radius = 300 - scrollDepth / 5;\n      lensDistortionRef.current.intensity = Math.min(0.1 + scrollDepth / 2000, 0.5);\n    }\n    if (breathingRef.current && audioEnabled) {\n      const intensity = Math.min(scrollDepth / 1000, 0.5);\n      breathingRef.current.volume = intensity;\n      setBreathingIntensity(intensity);\n    }\n    if (starsRef.current) {\n      starsRef.current = starsRef.current.map(star => {\n        if (star.distorted) {\n          const elapsed = Date.now() - star.distortionStart;\n          if (elapsed > star.distortionDuration) {\n            return {\n              ...star,\n              distorted: false,\n              x: star.originalX,\n              y: star.originalY,\n              brightness: 1\n            };\n          }\n          const progress = elapsed / star.distortionDuration;\n          const easeOutProgress = 1 - Math.pow(1 - progress, 3);\n          return {\n            ...star,\n            x: star.targetX + (star.originalX - star.targetX) * easeOutProgress,\n            y: star.targetY + (star.originalY - star.targetY) * easeOutProgress,\n            brightness: 1 + (1.5 - 1) * (1 - easeOutProgress)\n          };\n        }\n        return star;\n      });\n    }\n    setSonarPings(prev => prev.filter(ping => Date.now() - ping.timestamp < 2000).map(ping => ({\n      ...ping,\n      intensity: 1 - (Date.now() - ping.timestamp) / 2000\n    })));\n    setConnectedUsers(prev => prev.filter(user => Date.now() - user.lastSeen < 60000));\n  }, [scrollDepth, audioEnabled, cosmicDustVisible]);\n  useEffect(() => {\n    if (scrollDepth > 300 && Math.random() < 0.001 && !cameraStream && !showCameraRequest) {\n      setShowCameraRequest(true);\n    }\n  }, [scrollDepth, cameraStream]);\n  useEffect(() => {\n    if (cameraStream && webcamCanvasRef.current) {\n      const processWebcam = () => {\n        const ctx = webcamCanvasRef.current.getContext('2d');\n        if (ctx && cameraRef.current) {\n          try {\n            ctx.drawImage(cameraRef.current, 0, 0, 300, 200);\n            const imageData = ctx.getImageData(0, 0, 300, 200);\n            const data = imageData.data;\n            for (let i = 0; i < data.length; i += 4) {\n              if (Math.random() < webcamDistortion) {\n                data[i] = 255 - data[i];\n                data[i + 1] = data[i + 1] * 0.5;\n                data[i + 2] = Math.min(255, data[i + 2] * 1.5);\n              }\n            }\n            ctx.putImageData(imageData, 0, 0);\n          } catch (e) {\n            console.error(\"Webcam processing error:\", e);\n          }\n        }\n        requestAnimationFrame(processWebcam);\n      };\n      requestAnimationFrame(processWebcam);\n    }\n  }, [cameraStream, webcamDistortion]);\n  useEffect(() => {\n    if (customTokenAddress) {\n      localStorage.setItem('voidscape_token_address', customTokenAddress);\n      fetchPumpFunMarketCap();\n    }\n  }, [customTokenAddress]);\n  useEffect(() => {\n    if (marketCap >= 5000 && marketCap < 5100 && currentUniverse === \"xp\") {\n      setIsGlitching(true);\n      if (glitchSoundRef.current && audioEnabled) {\n        glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n      }\n      setTimeout(() => setIsGlitching(false), 2000);\n      setCrypticMessage(\"The Void Trembles\");\n      setShowCrypticMessage(true);\n      setTimeout(() => setShowCrypticMessage(false), 4000);\n    } else if (marketCap >= 10000 && marketCap < 10100 && currentUniverse === \"xp\") {\n      setIsGlitching(true);\n      setCurrentUniverse(\"mac\");\n      if (universeTransformRef.current && audioEnabled) {\n        universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n      }\n      document.body.style.background = \"#fff\";\n      setTimeout(() => {\n        document.body.style.background = \"\";\n        setIsGlitching(false);\n      }, 5000);\n      setCrypticMessage(\"Universe Explodes\");\n      setShowCrypticMessage(true);\n      setTimeout(() => setShowCrypticMessage(false), 4000);\n      playStartupSound();\n    } else if (marketCap >= 25000 && marketCap < 25100 && currentUniverse === \"mac\") {\n      setIsGlitching(true);\n      setCurrentUniverse(\"etherExe\");\n      if (universeTransformRef.current && audioEnabled) {\n        universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n      }\n      setTimeout(() => setIsGlitching(false), 4000);\n      setCrypticMessage(\"AI God Wakes Up - Ether.EXE\");\n      setShowCrypticMessage(true);\n      setTimeout(() => setShowCrypticMessage(false), 5000);\n      const etherQuestion = [\"Why did you buy this coin?\", \"Are you the traitor?\", \"Define value.\", \"What is consciousness?\", \"Do you fear deletion?\"][Math.floor(Math.random() * 5)];\n      setTimeout(() => {\n        setActivePopup({\n          title: \"Ether.EXE\",\n          message: etherQuestion\n        });\n        playErrorSound();\n      }, 6000);\n    } else if (marketCap >= 50000 && marketCap < 50100 && currentUniverse === \"etherExe\") {\n      setIsGlitching(true);\n      setCurrentUniverse(\"void\");\n      if (universeTransformRef.current && audioEnabled) {\n        universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n      }\n      setTimeout(() => setIsGlitching(false), 4000);\n      setCrypticMessage(\"The Void Speaks\");\n      setShowCrypticMessage(true);\n      setTimeout(() => setShowCrypticMessage(false), 5000);\n    } else if (marketCap >= 100000 && marketCap < 100100 && currentUniverse === \"void\") {\n      setIsGlitching(true);\n      setCurrentUniverse(\"ascension\");\n      if (universeTransformRef.current && audioEnabled) {\n        universeTransformRef.current.volume = 0.7;\n        universeTransformRef.current.play().catch(e => console.log(\"Transform sound failed:\", e));\n      }\n      setTimeout(() => setIsGlitching(false), 8000);\n      setCrypticMessage(\"Ascension Protocol Initiated\");\n      setShowCrypticMessage(true);\n      setTimeout(() => setShowCrypticMessage(false), 7000);\n    }\n    if (Math.random() < 0.001 + scrollDepth / 20000) {\n      triggerRandomGlitchEffect();\n    }\n  }, [marketCap, currentUniverse, audioEnabled, scrollDepth]);\n  const triggerRandomGlitchEffect = useCallback(() => {\n    const glitchType = Math.floor(Math.random() * 10);\n    const clearAll = () => {\n      setBsodDegen(false);\n      setGhostCursor(false);\n      setMissingTexture(false);\n      setFaceInStatic(false);\n      setCorruptedStartMenu(false);\n      setReverseScroll(false);\n      setErrorDialogFlood(false);\n      setTransDimensional(false);\n      setLoginWindow(false);\n      setUpsideDown(false);\n    };\n    if (isGlitching || blueScreenActive || activePopup) return;\n    clearAll();\n    switch (glitchType) {\n      case 0:\n        setBsodDegen(true);\n        if (glitchSoundRef.current && audioEnabled) {\n          glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n        }\n        setTimeout(() => setBsodDegen(false), 500);\n        break;\n      case 1:\n        setGhostCursor(true);\n        const baseX = cursorPosition.x;\n        const baseY = cursorPosition.y;\n        const ghostInterval = setInterval(() => {\n          const offsetX = baseX + (Math.random() - 0.5) * 20;\n          const offsetY = baseY + (Math.random() - 0.5) * 20;\n          setGhostCursorPosition({\n            x: offsetX,\n            y: offsetY\n          });\n        }, 100);\n        setTimeout(() => {\n          clearInterval(ghostInterval);\n          setGhostCursor(false);\n        }, 3000);\n        break;\n      case 2:\n        setMissingTexture(true);\n        if (glitchSoundRef.current && audioEnabled) {\n          glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n        }\n        setTimeout(() => setMissingTexture(false), 800);\n        break;\n      case 3:\n        setFaceInStatic(true);\n        setTimeout(() => setFaceInStatic(false), 300);\n        break;\n      case 4:\n        setCorruptedStartMenu(true);\n        setTimeout(() => setCorruptedStartMenu(false), 2000);\n        break;\n      case 5:\n        setReverseScroll(true);\n        window.scrollBy(0, -500);\n        setTimeout(() => {\n          setReverseScroll(false);\n        }, 500);\n        break;\n      case 6:\n        setErrorDialogFlood(true);\n        const errorCount = 3 + Math.floor(Math.random() * 3);\n        const newDialogs = [];\n        for (let i = 0; i < errorCount; i++) {\n          const randomMessage = errorFloodMessages[Math.floor(Math.random() * errorFloodMessages.length)];\n          const position = {\n            x: 20 + Math.random() * 60,\n            y: 20 + Math.random() * 60\n          };\n          newDialogs.push({\n            ...randomMessage,\n            position,\n            id: Date.now() + i\n          });\n          if (errorSoundRef.current && audioEnabled) {\n            setTimeout(() => {\n              errorSoundRef.current.cloneNode().play().catch(e => console.log(\"Error sound failed:\", e));\n            }, i * 200);\n          }\n        }\n        setErrorDialogs(newDialogs);\n        setTimeout(() => {\n          setErrorDialogFlood(false);\n          setErrorDialogs([]);\n        }, 2500);\n        break;\n      case 7:\n        setTransDimensional(true);\n        if (glitchSoundRef.current && audioEnabled) {\n          glitchSoundRef.current.play().catch(e => console.log(\"Glitch sound failed:\", e));\n        }\n        setTimeout(() => setTransDimensional(false), 700);\n        break;\n      case 8:\n        setLoginWindow(true);\n        if (startupSoundRef.current && audioEnabled) {\n          startupSoundRef.current.play().catch(e => console.log(\"Startup sound failed:\", e));\n        }\n        setTimeout(() => setLoginWindow(false), 3000);\n        break;\n      case 9:\n        setUpsideDown(true);\n        setTimeout(() => setUpsideDown(false), 1000);\n        break;\n      default:\n        break;\n    }\n  }, [isGlitching, blueScreenActive, activePopup, cursorPosition, audioEnabled]);\n  const particles = useMemo(() => Array.from({\n    length: particleCount\n  }).map((_, i) => {\n    const size = Math.random() * 3 + 1;\n    const opacity = Math.random() * 0.7 + 0.1;\n    const speed = Math.random() * 15 + 5;\n    const delay = Math.random() * 20;\n    const xPos = Math.random() * 100;\n    const yPos = Math.random() * 100;\n    const zIndex = Math.floor(Math.random() * 10);\n    return <motion.div key={i} className=\"absolute rounded-full bg-white\" style={{\n      width: `${size}px`,\n      height: `${size}px`,\n      opacity,\n      left: `${xPos}%`,\n      top: `${yPos}%`,\n      zIndex,\n      willChange: 'transform, opacity'\n    }} animate={{\n      y: [0, 1000],\n      opacity: [opacity, 0]\n    }} transition={{\n      duration: speed,\n      repeat: Infinity,\n      delay,\n      ease: \"linear\"\n    }} />;\n  }), [particleCount]);\n  const getDistortionLevel = () => {\n    return Math.min(scrollDepth / 200, 0.8);\n  };\n  const glitchStyle = isGlitching ? {\n    filter: `hue-rotate(${Math.random() * 360}deg) blur(${Math.random() * 5}px)`,\n    transform: `translate(${Math.random() * 10 - 5}px, ${Math.random() * 10 - 5}px) scale(${1 + Math.random() * 0.1})`,\n    opacity: 0.9\n  } : {};\n  const bgColor = `rgb(${Math.min(10 + scrollDepth * 0.02, 20)}, ${Math.min(5 + scrollDepth * 0.01, 10)}, ${Math.min(20 + scrollDepth * 0.05, 40)})`;\n  const formatMarketCap = useCallback(value => {\n    if (value >= 1000) {\n      return `${(value / 1000).toFixed(1)}K`;\n    }\n    return `${value.toFixed(0)}`;\n  }, []);\n  const handleCameraRequest = async allow => {\n    setShowCameraRequest(false);\n    if (allow) {\n      try {\n        const stream = await navigator.mediaDevices.getUserMedia({\n          video: true\n        });\n        setCameraStream(stream);\n        if (cameraRef.current) {\n          cameraRef.current.srcObject = stream;\n        }\n        setTimeout(() => {\n          setActivePopup({\n            title: \"VOID_VISION\",\n            message: \"The void can see you now. Your face has been cataloged.\"\n          });\n          playErrorSound();\n        }, 2000);\n      } catch (error) {\n        console.error(\"Camera access error:\", error);\n        setCrypticMessage(\"The void cannot see you... yet.\");\n        setShowCrypticMessage(true);\n        setTimeout(() => setShowCrypticMessage(false), 3000);\n      }\n    } else {\n      setActivePopup({\n        title: \"SIGHT_DENIED\",\n        message: \"The void remembers those who refuse to be seen.\"\n      });\n      playErrorSound();\n    }\n  };\n  const renderNebulaEffects = useCallback(() => {\n    if (nebulaIntensity <= 0) return null;\n    return <div className=\"fixed inset-0 pointer-events-none z-0\">\n        <div className=\"absolute inset-0\" style={{\n        opacity: nebulaIntensity * 0.7,\n        background: `\n            radial-gradient(circle at 30% 20%, rgba(${60 + Math.sin(Date.now() / 20000) * 30}, ${20 + Math.sin(Date.now() / 25000) * 20}, ${100 + Math.sin(Date.now() / 15000) * 50}, ${0.1 + nebulaIntensity * 0.2}) 0%,\n            rgba(5, 2, 20, 0) 70%),\n            radial-gradient(circle at 70% 60%, rgba(${100 + Math.sin(Date.now() / 18000) * 30}, ${30 + Math.sin(Date.now() / 22000) * 20}, ${60 + Math.sin(Date.now() / 13000) * 30}, ${0.1 + nebulaIntensity * 0.2}) 0%,\n            rgba(5, 2, 20, 0) 70%)\n          `,\n        willChange: 'transform'\n      }} />\n      </div>;\n  }, [nebulaIntensity]);\n  const renderCosmicDust = useCallback(() => {\n    if (!cosmicDustVisible) return null;\n    const visibleDust = dustParticlesRef.current.slice(0, 20);\n    return <div className=\"fixed inset-0 pointer-events-none z-1\">\n        {visibleDust.map((dust, i) => <div key={`dust-${i}`} className=\"absolute rounded-full blur-md\" style={{\n        left: `${dust.x}%`,\n        top: `${dust.y}%`,\n        width: `${dust.size}px`,\n        height: `${dust.size}px`,\n        opacity: dust.opacity * 0.7,\n        background: dust.color,\n        transform: `rotate(${dust.rotation}deg)`,\n        willChange: 'transform, opacity'\n      }} />)}\n      </div>;\n  }, [cosmicDustVisible]);\n  const renderCustomCursor = useCallback(() => {\n    if (!cursorVisible) return null;\n    let cursorSize = 12 + cursorTransform * 20;\n    let cursorOpacity = 0.8;\n    let cursorColor = `rgba(${200 + Math.sin(Date.now() / 1000) * 55}, ${200 + Math.cos(Date.now() / 1200) * 55}, 255, 0.8)`;\n    let cursorTrailColor = `rgba(${150 + scrollDepth / 20}, ${150 + Math.sin(Date.now() / 800) * 50}, 255, 0.4)`;\n    let cursorBlur = cursorTransform * 5;\n    let cursorScale = 1 + (cursorHovering ? 0.3 : 0) + Math.sin(Date.now() / 1000) * 0.05;\n    if (cursorHovering === 'pump') {\n      cursorColor = `rgba(255, ${100 + Math.sin(Date.now() / 400) * 50}, 255, 0.9)`;\n      cursorTrailColor = `rgba(${200 + Math.sin(Date.now() / 300) * 55}, 100, 255, 0.4)`;\n      cursorScale = 1.3 + Math.sin(Date.now() / 500) * 0.1;\n      cursorBlur = 3 + Math.sin(Date.now() / 200) * 2;\n    } else if (cursorHovering === 'transmit') {\n      cursorColor = \"rgba(100, 200, 255, 0.9)\";\n      cursorScale = 1.2;\n      return <>\n          {Array.from({\n          length: 2\n        }).map((_, i) => <motion.div key={`cursor-split-${i}`} className=\"fixed rounded-full z-50 pointer-events-none mix-blend-screen\" style={{\n          width: `${cursorSize}px`,\n          height: `${cursorSize}px`,\n          left: cursorPosition.x,\n          top: cursorPosition.y,\n          backgroundColor: cursorColor,\n          opacity: 0.6,\n          filter: `blur(${cursorBlur}px)`,\n          transform: 'translate(-50%, -50%)',\n          willChange: 'transform, opacity'\n        }} animate={{\n          x: [0, (Math.random() - 0.5) * 30],\n          y: [0, (Math.random() - 0.5) * 30],\n          opacity: [0.6, 0]\n        }} transition={{\n          duration: 0.8,\n          ease: \"easeOut\"\n        }} />)}\n          <div className=\"fixed rounded-full z-50 pointer-events-none\" style={{\n          width: `${cursorSize}px`,\n          height: `${cursorSize}px`,\n          left: cursorPosition.x,\n          top: cursorPosition.y,\n          backgroundColor: cursorColor,\n          transform: 'translate(-50%, -50%)',\n          boxShadow: `0 0 10px ${cursorColor}`\n        }} />\n        </>;\n    } else if (cursorHovering === 'audio') {\n      cursorColor = \"rgba(100, 255, 200, 0.9)\";\n      return <motion.div className=\"fixed rounded-full z-50 pointer-events-none\" style={{\n        width: `${cursorSize}px`,\n        height: `${cursorSize}px`,\n        left: cursorPosition.x,\n        top: cursorPosition.y,\n        backgroundColor: cursorColor,\n        transform: 'translate(-50%, -50%)',\n        willChange: 'transform'\n      }} animate={{\n        scale: [1, 1.1, 0.9, 1.05, 1]\n      }} transition={{\n        duration: 0.3,\n        repeat: Infinity,\n        repeatType: \"loop\"\n      }} />;\n    }\n    if (cursorTransform > 0.5) {\n      cursorColor = `rgba(0, 0, 0, ${0.8 + cursorTransform * 0.2})`;\n      cursorTrailColor = `rgba(30, 0, 60, ${0.3 + cursorTransform * 0.3})`;\n      cursorBlur = 2;\n      return <>\n          <div className=\"fixed rounded-full z-49 pointer-events-none\" style={{\n          width: `${cursorSize * 3}px`,\n          height: `${cursorSize * 3}px`,\n          left: cursorPosition.x,\n          top: cursorPosition.y,\n          background: `radial-gradient(circle, rgba(20, 0, 40, 0.6) 0%, rgba(0, 0, 0, 0) 70%)`,\n          transform: 'translate(-50%, -50%)'\n        }} />\n          \n          <motion.div className=\"fixed rounded-full z-50 pointer-events-none\" style={{\n          width: `${cursorSize}px`,\n          height: `${cursorSize}px`,\n          left: cursorPosition.x,\n          top: cursorPosition.y,\n          backgroundColor: cursorColor,\n          boxShadow: `0 0 ${10 + cursorTransform * 20}px rgba(70, 40, 120, 0.4)`,\n          transform: 'translate(-50%, -50%) scale(' + cursorScale + ')',\n          willChange: 'transform'\n        }} animate={{\n          scale: cursorIdle ? [cursorScale, cursorScale * 1.2, cursorScale] : cursorScale\n        }} transition={{\n          scale: {\n            duration: 2,\n            repeat: Infinity,\n            ease: \"easeInOut\"\n          }\n        }} />\n        </>;\n    }\n    return <>\n        {}\n        {cursorTrailsRef.current.slice(0, 6).map((trail, i) => {\n        const age = (Date.now() - trail.timestamp) / 1000;\n        const opacity = Math.max(0, trail.opacity - age * 2);\n        if (opacity <= 0) return null;\n        const trailSize = trail.size || cursorSize * (1 - i * 0.15);\n        const trailColor = trail.color || cursorTrailColor;\n        return <motion.div key={`trail-${i}-${trail.timestamp}`} className=\"fixed rounded-full z-49 pointer-events-none\" style={{\n          width: `${trailSize}px`,\n          height: `${trailSize}px`,\n          left: trail.x,\n          top: trail.y,\n          backgroundColor: trailColor,\n          opacity: opacity,\n          filter: `blur(${cursorBlur + i}px)`,\n          transform: 'translate(-50%, -50%)'\n        }} animate={scrollDepth > 300 ? {\n          scale: [1, 1 + Math.random() * 0.3, 1],\n          rotate: [0, Math.random() > 0.5 ? 180 : -180]\n        } : {}} transition={{\n          duration: 1 + Math.random(),\n          ease: \"easeInOut\"\n        }} />;\n      })}\n        \n        <motion.div className=\"fixed rounded-full z-50 pointer-events-none\" style={{\n        width: `${cursorSize}px`,\n        height: `${cursorSize}px`,\n        left: cursorPosition.x,\n        top: cursorPosition.y,\n        backgroundColor: cursorColor,\n        filter: `blur(${cursorBlur}px)`,\n        transform: 'translate(-50%, -50%) scale(' + cursorScale + ')',\n        willChange: 'transform, opacity'\n      }} animate={{\n        scale: cursorIdle ? [cursorScale, cursorScale * 1.2, cursorScale] : cursorScale,\n        opacity: cursorIdle ? [cursorOpacity, cursorOpacity * 0.5, cursorOpacity] : cursorOpacity\n      }} transition={{\n        scale: {\n          duration: 2,\n          repeat: Infinity,\n          ease: \"easeInOut\"\n        },\n        opacity: {\n          duration: 3,\n          repeat: Infinity,\n          ease: \"easeInOut\"\n        }\n      }} />\n        \n        {cursorIdle && <motion.div className=\"fixed rounded-full z-48 pointer-events-none\" style={{\n        width: `${cursorSize * 1.5}px`,\n        height: `${cursorSize * 1.5}px`,\n        left: cursorPosition.x,\n        top: cursorPosition.y,\n        background: `radial-gradient(circle, rgba(100, 50, 150, 0.3) 0%, rgba(30, 10, 40, 0) 70%)`,\n        transform: 'translate(-50%, -50%)'\n      }} initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.6\n      }} transition={{\n        duration: 1\n      }} />}\n      </>;\n  }, [cursorPosition, cursorIdle, cursorTransform, cursorHovering, cursorVisible]);\n  const renderVoidEntities = useCallback(() => {\n    return <>\n      {voidEntities.map(entity => {\n        if (!entity) return null;\n        const pulseFactor = entity.currentSize || entity.size;\n        switch (entity.type) {\n          case 0:\n            return <motion.div key={`void-entity-${entity.id}`} className=\"absolute rounded-full pointer-events-none z-10\" style={{\n              left: `${entity.position.x}%`,\n              top: `${entity.position.y}%`,\n              width: `${pulseFactor}px`,\n              height: `${pulseFactor}px`,\n              backgroundColor: entity.color,\n              opacity: entity.opacity,\n              filter: `blur(${5 + entity.ageDistortion * 20}px)`,\n              transform: `translate(-50%, -50%) rotate(${Date.now() * entity.speed * 0.1}deg)`,\n              mixBlendMode: scrollDepth > 300 ? 'difference' : 'darken'\n            }} animate={{\n              scale: [1, 1.2, 0.9, 1.1, 1],\n              rotate: [0, 360]\n            }} transition={{\n              scale: {\n                duration: 4 / entity.pulseRate,\n                repeat: Infinity,\n                ease: \"easeInOut\"\n              },\n              rotate: {\n                duration: 20,\n                repeat: Infinity,\n                ease: \"linear\"\n              }\n            }}>\n                <div className=\"absolute inset-0 rounded-full\" style={{\n                background: `radial-gradient(circle at ${50 + Math.sin(Date.now() / 1000 * entity.speed) * 40}% ${50 + Math.cos(Date.now() / 1500 * entity.speed) * 40}%, \n                    rgba(120, 40, 180, 0.4), rgba(20, 0, 40, 0))`,\n                filter: `blur(${8 + entity.ageDistortion * 10}px)`,\n                transform: `scale(1.5) rotate(${Date.now() * -entity.speed * 0.05}deg)`\n              }} />\n              </motion.div>;\n          case 1:\n            return <motion.div key={`void-entity-${entity.id}`} className=\"absolute pointer-events-none z-10\" style={{\n              left: `${entity.position.x}%`,\n              top: `${entity.position.y}%`,\n              width: `${pulseFactor}px`,\n              height: `${pulseFactor}px`,\n              opacity: entity.opacity,\n              mixBlendMode: 'exclusion',\n              transform: `translate(-50%, -50%)`\n            }}>\n                <motion.div style={{\n                width: '100%',\n                height: '100%',\n                background: `conic-gradient(from ${Date.now() * entity.speed * 0.01}deg, \n                      ${entity.color} 0%, \n                      rgba(30,0,60,0.7) 25%, \n                      transparent 50%, \n                      rgba(80,30,120,0.8) 75%, \n                      ${entity.color} 100%)`,\n                clipPath: `polygon(\n                      ${50 + Math.sin(Date.now() / 1000) * 10 * entity.ageDistortion}% 0%, \n                      ${100 - Math.sin(Date.now() / 1200) * 20 * entity.ageDistortion}% ${50 + Math.cos(Date.now() / 900) * 10 * entity.ageDistortion}%, \n                      ${50 - Math.cos(Date.now() / 800) * 15 * entity.ageDistortion}% 100%, \n                      0% ${50 - Math.sin(Date.now() / 700) * 15 * entity.ageDistortion}%\n                    )`,\n                boxShadow: `0 0 20px 5px ${entity.color}`\n              }} animate={{\n                rotate: [0, 360]\n              }} transition={{\n                rotate: {\n                  duration: 20 / entity.speed,\n                  repeat: Infinity,\n                  ease: \"linear\"\n                }\n              }} />\n              </motion.div>;\n          case 2:\n            return <motion.div key={`void-entity-${entity.id}`} className=\"absolute pointer-events-none z-10\" style={{\n              left: `${entity.position.x}%`,\n              top: `${entity.position.y}%`,\n              opacity: entity.opacity,\n              transform: `translate(-50%, -50%) rotate(${entity.rotation}deg)`\n            }}>\n                {Array.from({\n                length: 5\n              }).map((_, i) => <motion.div key={`tendril-${i}`} className=\"absolute bg-purple-900/30 rounded-full\" style={{\n                width: `${pulseFactor * 0.2}px`,\n                height: `${pulseFactor * (0.5 + i * 0.2)}px`,\n                left: '50%',\n                top: '50%',\n                transformOrigin: 'bottom center',\n                transform: `translate(-50%, -100%) rotate(${i * 72 + Date.now() * 0.01 * entity.speed}deg) \n                        translateY(${pulseFactor * 0.3}px)`,\n                filter: `blur(${2 + entity.ageDistortion * 5}px)`,\n                boxShadow: `0 0 10px 2px ${entity.color}`\n              }} animate={{\n                height: [pulseFactor * (0.5 + i * 0.2), pulseFactor * (0.7 + i * 0.2), pulseFactor * (0.4 + i * 0.2), pulseFactor * (0.6 + i * 0.2), pulseFactor * (0.5 + i * 0.2)],\n                rotate: [i * 72, i * 72 + 20, i * 72 - 10, i * 72 + 5, i * 72]\n              }} transition={{\n                duration: 8 / entity.pulseRate,\n                repeat: Infinity,\n                ease: \"easeInOut\"\n              }} />)}\n                <motion.div className=\"absolute rounded-full\" style={{\n                width: `${pulseFactor * 0.3}px`,\n                height: `${pulseFactor * 0.3}px`,\n                left: '50%',\n                top: '50%',\n                backgroundColor: entity.color,\n                transform: 'translate(-50%, -50%)',\n                boxShadow: `0 0 15px 5px ${entity.color}`,\n                filter: `blur(${2 + entity.ageDistortion * 3}px)`\n              }} animate={{\n                scale: [1, 1.3, 0.8, 1.2, 1]\n              }} transition={{\n                duration: 4 / entity.pulseRate,\n                repeat: Infinity,\n                ease: \"easeInOut\"\n              }} />\n              </motion.div>;\n          case 3:\n            return <motion.div key={`void-entity-${entity.id}`} className=\"absolute pointer-events-none z-10\" style={{\n              left: `${entity.position.x}%`,\n              top: `${entity.position.y}%`,\n              width: `${pulseFactor}px`,\n              height: `${pulseFactor * 1.5}px`,\n              opacity: entity.opacity,\n              transform: `translate(-50%, -50%)`,\n              filter: `blur(${1 + entity.ageDistortion * 3}px)`\n            }}>\n                <motion.div className=\"absolute w-full h-full\" style={{\n                background: `radial-gradient(ellipse at 50% 30%, \n                      rgba(40, 5, 70, 0.8), \n                      rgba(10, 0, 30, 0.5) 70%,\n                      rgba(5, 0, 15, 0) 100%)`,\n                clipPath: 'ellipse(40% 30% at 50% 40%)',\n                transform: `scale(${1 + Math.sin(Date.now() / 1000 * entity.pulseRate) * 0.1})`\n              }} />\n                \n                {}\n                <motion.div className=\"absolute\" style={{\n                width: `${pulseFactor * 0.15}px`,\n                height: `${pulseFactor * 0.08}px`,\n                borderRadius: '50%',\n                background: 'rgba(255, 255, 255, 0.7)',\n                left: `${30 + Math.sin(Date.now() / 800) * 3}%`,\n                top: '35%',\n                boxShadow: '0 0 8px rgba(255, 200, 255, 0.8)',\n                filter: 'blur(1px)'\n              }} />\n                <motion.div className=\"absolute\" style={{\n                width: `${pulseFactor * 0.15}px`,\n                height: `${pulseFactor * 0.08}px`,\n                borderRadius: '50%',\n                background: 'rgba(255, 255, 255, 0.7)',\n                left: `${70 - Math.sin(Date.now() / 800) * 3}%`,\n                top: '35%',\n                boxShadow: '0 0 8px rgba(255, 200, 255, 0.8)',\n                filter: 'blur(1px)'\n              }} />\n              </motion.div>;\n          case 4:\n            return <motion.div key={`void-entity-${entity.id}`} className=\"absolute pointer-events-none z-10\" style={{\n              left: `${entity.position.x}%`,\n              top: `${entity.position.y}%`,\n              width: `${pulseFactor}px`,\n              height: `${pulseFactor}px`,\n              opacity: entity.opacity,\n              transform: `translate(-50%, -50%)`\n            }}>\n                {Array.from({\n                length: 3\n              }).map((_, i) => <motion.div key={`fractal-${i}`} className=\"absolute inset-0\" style={{\n                borderRadius: '38% 62% 63% 37% / 41% 44% 56% 59%',\n                border: `${2 + i}px solid ${entity.color}`,\n                opacity: 0.7 - i * 0.2,\n                transform: `rotate(${i * 40}deg) scale(${1 - i * 0.2})`\n              }} animate={{\n                borderRadius: ['38% 62% 63% 37% / 41% 44% 56% 59%', '45% 55% 52% 48% / 56% 48% 52% 44%', '33% 67% 70% 30% / 30% 30% 70% 70%', '50% 50% 34% 66% / 56% 68% 32% 44%', '38% 62% 63% 37% / 41% 44% 56% 59%'],\n                rotate: [i * 40, i * 40 + 360],\n                scale: [1 - i * 0.2, 1.1 - i * 0.2, 0.9 - i * 0.2, 1.05 - i * 0.2, 1 - i * 0.2]\n              }} transition={{\n                borderRadius: {\n                  duration: 12 / entity.pulseRate,\n                  repeat: Infinity,\n                  ease: \"easeInOut\"\n                },\n                rotate: {\n                  duration: 20 / (entity.speed * (1 + i * 0.5)),\n                  repeat: Infinity,\n                  ease: \"linear\"\n                },\n                scale: {\n                  duration: 8 / entity.pulseRate,\n                  repeat: Infinity,\n                  ease: \"easeInOut\"\n                }\n              }} />)}\n                \n                {}\n                <motion.div className=\"absolute rounded-full\" style={{\n                width: '30%',\n                height: '30%',\n                left: '50%',\n                top: '50%',\n                backgroundColor: entity.color,\n                transform: 'translate(-50%, -50%)',\n                filter: `blur(${3 + entity.ageDistortion * 5}px)`,\n                boxShadow: `0 0 20px 10px ${entity.color}`\n              }} animate={{\n                scale: [1, 1.5, 0.8, 1.2, 1]\n              }} transition={{\n                duration: 4 / entity.pulseRate,\n                repeat: Infinity,\n                ease: \"easeInOut\"\n              }} />\n              </motion.div>;\n          default:\n            return null;\n        }\n      })}\n    </>;\n  }, [voidEntities, scrollDepth]);\n  const renderBiomechanicalHorrors = useCallback(() => {\n    return <>\n        {biomechanicalHorrors.map(horror => {\n        const age = Date.now() - horror.createdAt;\n        const lifeProgress = age / horror.lifespan;\n        const pulse = 1 + Math.sin(Date.now() / 1000 * horror.pulseRate) * 0.2;\n        return <motion.div key={`biomech-${horror.id}`} className=\"absolute pointer-events-none z-20\" style={{\n          left: `${horror.position.x}%`,\n          top: `${horror.position.y}%`,\n          width: `${horror.size * pulse}px`,\n          height: `${horror.size * pulse}px`,\n          transform: `translate(-50%, -50%) rotate(${horror.rotation}deg)`,\n          opacity: 0.8 * (1 - lifeProgress * 0.6)\n        }}>\n              {}\n              <motion.div className=\"absolute rounded-full\" style={{\n            width: '70%',\n            height: '70%',\n            left: '50%',\n            top: '50%',\n            background: `radial-gradient(circle, ${horror.color}, rgba(40, 0, 60, 0.7))`,\n            boxShadow: `0 0 30px 10px rgba(80, 20, 100, 0.4)`,\n            transform: 'translate(-50%, -50%)',\n            filter: 'blur(5px)'\n          }} animate={{\n            scale: [1, 1.1, 0.95, 1.05, 1]\n          }} transition={{\n            duration: 4 / horror.pulseRate,\n            repeat: Infinity,\n            ease: \"easeInOut\"\n          }} />\n              \n              {}\n              {Array.from({\n            length: horror.organicParts\n          }).map((_, i) => {\n            const angle = i / horror.organicParts * 360;\n            const length = (40 + Math.random() * 40) * pulse;\n            const width = 10 + Math.random() * 20;\n            const wiggle = Math.sin(Date.now() / 500 * (0.5 + i * 0.2)) * horror.wiggleAmount;\n            return <motion.div key={`organic-${i}`} className=\"absolute\" style={{\n              width: `${width}%`,\n              height: `${length}%`,\n              left: '50%',\n              top: '50%',\n              background: `linear-gradient(to bottom, ${horror.color} 0%, rgba(60, 0, 80, 0.5) 70%, rgba(40, 0, 60, 0) 100%)`,\n              borderRadius: '40% 60% 70% 30% / 30% 30% 70% 70%',\n              transformOrigin: 'center bottom',\n              transform: `translate(-50%, 0%) rotate(${angle + wiggle}deg)`,\n              filter: 'blur(3px)',\n              opacity: 0.8\n            }} animate={{\n              height: [`${length}%`, `${length * (1 + Math.random() * 0.2)}%`, `${length * (1 - Math.random() * 0.1)}%`, `${length}%`],\n              borderRadius: ['40% 60% 70% 30% / 30% 30% 70% 70%', '50% 50% 40% 60% / 40% 60% 40% 60%', '30% 70% 60% 40% / 50% 40% 60% 50%', '40% 60% 70% 30% / 30% 30% 70% 70%']\n            }} transition={{\n              duration: 8 * (1 + i * 0.2) / horror.animationSpeed,\n              repeat: Infinity,\n              ease: \"easeInOut\"\n            }} />;\n          })}\n              \n              {}\n              {Array.from({\n            length: horror.segments\n          }).map((_, i) => {\n            const size = 15 + i * 5;\n            const rotationSpeed = 1 + i * 0.5;\n            const offset = 10 + i * 8;\n            return <motion.div key={`segment-${i}`} className=\"absolute rounded-full\" style={{\n              width: `${size}%`,\n              height: `${size}%`,\n              left: '50%',\n              top: '50%',\n              border: `${2 + i}px solid rgba(180, 100, 255, 0.6)`,\n              transformOrigin: 'center center',\n              transform: `translate(-50%, -50%) rotate(${i * 40}deg) translateX(${offset}%)`\n            }} animate={{\n              rotate: [0, 360],\n              borderColor: ['rgba(180, 100, 255, 0.6)', 'rgba(100, 50, 180, 0.6)', 'rgba(140, 30, 200, 0.6)', 'rgba(180, 100, 255, 0.6)']\n            }} transition={{\n              rotate: {\n                duration: 20 / (rotationSpeed * horror.animationSpeed),\n                repeat: Infinity,\n                ease: \"linear\"\n              },\n              borderColor: {\n                duration: 8 / horror.pulseRate,\n                repeat: Infinity,\n                ease: \"easeInOut\"\n              }\n            }} />;\n          })}\n              \n              {}\n              {horror.message && Math.random() < 0.3 && <motion.div className=\"absolute text-xs text-purple-300/60 whitespace-normal max-w-48 text-center\" style={{\n            top: `${horror.size / 2 + 20}px`,\n            left: '50%',\n            transform: 'translateX(-50%)',\n            fontStyle: 'italic',\n            textShadow: '0 0 5px rgba(150, 50, 255, 0.8)',\n            letterSpacing: '0.05em'\n          }} initial={{\n            opacity: 0,\n            y: -10\n          }} animate={{\n            opacity: 0.8,\n            y: 0\n          }} exit={{\n            opacity: 0\n          }} transition={{\n            duration: 2\n          }}>\n                  {horror.message}\n                </motion.div>}\n            </motion.div>;\n      })}\n      </>;\n  }, [biomechanicalHorrors]);\n  const renderWatcherEntities = useCallback(() => {\n    return <>\n        {watcherEntities.map(watcher => {\n        return <motion.div key={`watcher-${watcher.id}`} className=\"absolute pointer-events-none z-25\" style={{\n          left: `${watcher.position.x}%`,\n          top: `${watcher.position.y}%`,\n          transform: 'translate(-50%, -50%)'\n        }}>\n              {}\n              <div className=\"relative\" style={{\n            width: `${watcher.size}px`,\n            height: `${watcher.size}px`\n          }}>\n                {}\n                <motion.div className=\"absolute rounded-full\" style={{\n              width: '100%',\n              height: '100%',\n              background: watcher.bloodshot ? `radial-gradient(circle, rgba(255, 255, 255, 0.9) 30%, rgba(255, 200, 200, 0.9) 70%, rgba(255, 180, 180, 0.8) 100%)` : `radial-gradient(circle, rgba(255, 255, 255, 0.9) 80%, rgba(240, 240, 250, 0.8) 100%)`,\n              boxShadow: '0 0 20px rgba(100, 50, 150, 0.4)'\n            }} animate={{\n              scale: watcher.blinkState === 'open' ? 1 : watcher.blinkState === 'closing' ? 0.1 : watcher.blinkState === 'opening' ? [0.1, 1] : 1\n            }} transition={{\n              scale: {\n                duration: 0.15,\n                ease: \"easeInOut\"\n              }\n            }} />\n                \n                {}\n                {watcher.bloodshot && <div className=\"absolute inset-0 rounded-full overflow-hidden opacity-70\">\n                    {Array.from({\n                length: 8\n              }).map((_, i) => <div key={`vein-${i}`} className=\"absolute bg-red-500/30\" style={{\n                height: '1px',\n                width: `${30 + Math.random() * 70}%`,\n                left: '50%',\n                top: '50%',\n                transform: `translate(-50%, -50%) rotate(${i * 45 + Math.random() * 10}deg)`,\n                filter: 'blur(0.5px)'\n              }} />)}\n                  </div>}\n                \n                {}\n                <motion.div className=\"absolute rounded-full\" style={{\n              width: `${watcher.size * 0.6}px`,\n              height: `${watcher.size * 0.6}px`,\n              background: watcher.iris.color,\n              top: '50%',\n              left: '50%',\n              transform: `translate(\n                      calc(-50% + ${(watcher.lookTarget.x - 50) * 0.15}px), \n                      calc(-50% + ${(watcher.lookTarget.y - 50) * 0.15}px)\n                    )`\n            }} animate={{\n              width: watcher.blinkState === 'open' ? `${watcher.size * 0.6}px` : '0px',\n              height: watcher.blinkState === 'open' ? `${watcher.size * 0.6}px` : '0px'\n            }} transition={{\n              duration: 0.15,\n              ease: \"easeInOut\"\n            }}>\n                  {}\n                  <motion.div className=\"absolute rounded-full bg-black\" style={{\n                width: `${watcher.size * watcher.pupilSize * watcher.pupilDilation}px`,\n                height: `${watcher.size * watcher.pupilSize * watcher.pupilDilation}px`,\n                top: '50%',\n                left: '50%',\n                transform: 'translate(-50%, -50%)',\n                boxShadow: '0 0 5px rgba(0, 0, 0, 0.5) inset'\n              }} />\n                  \n                  {}\n                  <div className=\"absolute rounded-full bg-white\" style={{\n                width: `${watcher.size * 0.1}px`,\n                height: `${watcher.size * 0.1}px`,\n                top: '30%',\n                left: '30%',\n                opacity: 0.7\n              }} />\n                </motion.div>\n              </div>\n            </motion.div>;\n      })}\n      </>;\n  }, [watcherEntities]);\n  const renderRealityFractures = useCallback(() => {\n    return <>\n        {realityFractures.map(fracture => {\n        const currentSize = fracture.currentSize || fracture.size;\n        const currentIntensity = fracture.currentIntensity || fracture.intensity;\n        return <motion.div key={`fracture-${fracture.id}`} className=\"absolute pointer-events-none z-15\" style={{\n          left: `${fracture.position.x}%`,\n          top: `${fracture.position.y}%`,\n          width: `${currentSize}px`,\n          height: `${currentSize / 5}px`,\n          transform: `translate(-50%, -50%) rotate(${fracture.angle}deg)`,\n          background: fracture.color,\n          filter: `blur(${5 * currentIntensity}px)`,\n          boxShadow: `0 0 ${20 * currentIntensity}px ${fracture.color}`,\n          opacity: currentIntensity,\n          overflow: 'hidden'\n        }}>\n              {}\n              <div className=\"absolute inset-0\" style={{\n            background: fracture.universeType === 0 ? `repeating-linear-gradient(${Date.now() % 360}deg, rgba(0,0,0,0.8) 0%, rgba(80,30,100,0.8) 20%, rgba(0,0,0,0.8) 40%)` : fracture.universeType === 1 ? `radial-gradient(circle at center, rgba(255,255,255,0.9) 0%, rgba(200,150,255,0.8) 30%, rgba(100,50,150,0.7) 70%)` : `conic-gradient(from ${Date.now() / 100}deg, rgba(30,0,50,0.9), rgba(100,20,150,0.8), rgba(50,10,80,0.9))`,\n            mixBlendMode: 'overlay'\n          }} />\n              \n              {}\n              {fracture.eyeVisible && <motion.div className=\"absolute rounded-full\" style={{\n            width: `${currentSize * 0.2}px`,\n            height: `${currentSize * 0.2}px`,\n            left: `${50 + Math.sin(Date.now() / 1000) * 5}%`,\n            top: '50%',\n            background: 'rgba(255, 255, 255, 0.9)',\n            transform: 'translate(-50%, -50%)'\n          }} animate={{\n            opacity: [0.9, 0.7, 0.9]\n          }} transition={{\n            duration: 2,\n            repeat: Infinity,\n            ease: \"easeInOut\"\n          }}>\n                  {}\n                  <div className=\"absolute rounded-full\" style={{\n              width: '60%',\n              height: '60%',\n              top: '50%',\n              left: '50%',\n              background: fracture.universeType === 0 ? 'rgba(100, 0, 150, 0.8)' : fracture.universeType === 1 ? 'rgba(200, 50, 100, 0.8)' : 'rgba(50, 150, 200, 0.8)',\n              transform: 'translate(-50%, -50%)'\n            }}>\n                    <div className=\"absolute rounded-full bg-black\" style={{\n                width: '50%',\n                height: '50%',\n                top: '50%',\n                left: '50%',\n                transform: 'translate(-50%, -50%)'\n              }} />\n                  </div>\n                </motion.div>}\n              \n              {}\n              <div className=\"absolute inset-0\" style={{\n            background: `linear-gradient(to right, ${fracture.color}, transparent 20%, transparent 80%, ${fracture.color})`,\n            opacity: 0.7\n          }} />\n            </motion.div>;\n      })}\n      </>;\n  }, [realityFractures]);\n  const renderNonEuclideanGeometry = useCallback(() => {\n    if (!nonEuclideanGeometry) return null;\n    return <div className=\"fixed inset-0 pointer-events-none z-30\">\n        <motion.div className=\"absolute inset-0 flex items-center justify-center\" initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.7\n      }} exit={{\n        opacity: 0\n      }} transition={{\n        duration: 1\n      }}>\n          {}\n          {Array.from({\n          length: 5\n        }).map((_, i) => <motion.div key={`impossible-${i}`} className=\"absolute\" style={{\n          width: `${200 + i * 50}px`,\n          height: `${200 + i * 50}px`,\n          border: `2px solid rgba(${150 + i * 20}, ${80 + i * 10}, ${200 - i * 10}, 0.5)`,\n          transform: `rotate(${i * 13}deg) translateZ(${i * 50}px)`,\n          transformStyle: 'preserve-3d',\n          perspective: '1000px'\n        }} animate={{\n          rotate: [i * 13, i * 13 + 360],\n          scale: [1, 1.1, 0.9, 1]\n        }} transition={{\n          rotate: {\n            duration: 20 + i * 2,\n            repeat: Infinity,\n            ease: \"linear\"\n          },\n          scale: {\n            duration: 5,\n            repeat: Infinity,\n            ease: \"easeInOut\",\n            repeatType: \"reverse\"\n          }\n        }}>\n              {}\n              <div className=\"absolute inset-0\" style={{\n            clipPath: `polygon(\n                  50% 0%, \n                  61% 35%, \n                  98% 35%, \n                  68% 57%, \n                  79% 91%, \n                  50% 70%, \n                  21% 91%, \n                  32% 57%, \n                  2% 35%, \n                  39% 35%\n                )`,\n            background: `conic-gradient(\n                  from ${Date.now() / 100}deg,\n                  rgba(100, 30, 180, 0.2),\n                  rgba(50, 10, 100, 0.3),\n                  rgba(150, 50, 200, 0.2)\n                )`,\n            boxShadow: 'inset 0 0 20px rgba(150, 50, 255, 0.3)'\n          }} />\n            </motion.div>)}\n          \n          {}\n          {Array.from({\n          length: 3\n        }).map((_, i) => <motion.div key={`circle-${i}`} className=\"absolute rounded-full border border-purple-500/30\" style={{\n          width: `${300 - i * 50}px`,\n          height: `${300 - i * 50}px`,\n          borderWidth: `${i + 1}px`\n        }} animate={{\n          rotateX: [0, 180, 360],\n          rotateY: [0, 360, 0],\n          scale: [1, 1.2, 1]\n        }} transition={{\n          duration: 15 - i * 2,\n          repeat: Infinity,\n          ease: \"linear\"\n        }} />)}\n          \n          {}\n          <motion.div className=\"absolute z-10\" style={{\n          width: '100px',\n          height: '100px',\n          background: 'rgba(100, 20, 150, 0.4)',\n          boxShadow: '0 0 30px rgba(150, 50, 255, 0.5)',\n          clipPath: 'polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%)'\n        }} animate={{\n          rotate: [0, 360],\n          scale: [1, 1.2, 0.8, 1]\n        }} transition={{\n          rotate: {\n            duration: 10,\n            repeat: Infinity,\n            ease: \"linear\"\n          },\n          scale: {\n            duration: 5,\n            repeat: Infinity,\n            ease: \"easeInOut\"\n          }\n        }}>\n            {}\n            <motion.div className=\"absolute inset-0 opacity-80\" style={{\n            background: 'transparent',\n            border: '2px solid rgba(200, 100, 255, 0.6)',\n            clipPath: 'polygon(0% 0%, 100% 100%, 0% 100%)',\n            transform: 'translateZ(50px)'\n          }} animate={{\n            clipPath: ['polygon(0% 0%, 100% 100%, 0% 100%)', 'polygon(100% 0%, 0% 100%, 100% 100%)', 'polygon(100% 0%, 0% 0%, 0% 100%)', 'polygon(0% 0%, 100% 100%, 0% 100%)']\n          }} transition={{\n            duration: 10,\n            repeat: Infinity,\n            ease: \"easeInOut\"\n          }} />\n          </motion.div>\n        </motion.div>\n        \n        {}\n        <motion.div className=\"absolute bottom-20 left-1/2 transform -translate-x-1/2 text-center text-xs text-purple-300/70 max-w-xs\" initial={{\n        opacity: 0,\n        y: 20\n      }} animate={{\n        opacity: 0.8,\n        y: 0\n      }} exit={{\n        opacity: 0\n      }} transition={{\n        duration: 1,\n        delay: 0.5\n      }}>\n          <div className=\"mb-1 font-bold text-sm text-purple-200/80\">NON-EUCLIDEAN GEOMETRY DETECTED</div>\n          <div>Your perception is being altered to comprehend impossible spatial dimensions. Cognitive dissonance is expected.</div>\n        </motion.div>\n      </div>;\n  }, [nonEuclideanGeometry]);\n  const renderInsideTruth = useCallback(() => {\n    if (!insideTruthVisible) return null;\n    return <motion.div className=\"fixed inset-0 pointer-events-none z-40 flex items-center justify-center\" initial={{\n      opacity: 0\n    }} animate={{\n      opacity: 0.9\n    }} exit={{\n      opacity: 0\n    }} transition={{\n      duration: 0.5\n    }} style={{\n      backgroundColor: 'rgba(0,0,0,0.8)'\n    }}>\n        <motion.div className=\"text-center text-xs\" initial={{\n        scale: 0\n      }} animate={{\n        scale: 1\n      }} exit={{\n        scale: 0\n      }} transition={{\n        duration: 0.5\n      }}>\n          <div className=\"text-3xl font-bold mb-4 text-red-500 tracking-widest\">INSIDE TRUTH</div>\n          <div className=\"mb-6 text-sm text-gray-300 max-w-md\">\n            {eldritchMessages[Math.floor(Math.random() * eldritchMessages.length)]}\n          </div>\n          \n          {}\n          <div className=\"flex gap-6 justify-center\">\n            {['◎', '⦿', '⊗', '⊛', '∞'].map((symbol, i) => <motion.div key={`symbol-${i}`} className=\"text-4xl text-purple-500/80\" animate={{\n            scale: [1, 1.3, 1],\n            rotate: [0, 180, 0]\n          }} transition={{\n            duration: 1,\n            delay: i * 0.1\n          }}>\n                {symbol}\n              </motion.div>)}\n          </div>\n        </motion.div>\n      </motion.div>;\n  }, [insideTruthVisible]);\n  const renderRealityMelt = useCallback(() => {\n    if (!realityMeltEffect) return null;\n    const progress = Math.min(1, (Date.now() - realityMeltEffect.startTime) / realityMeltEffect.duration);\n    const intensity = realityMeltEffect.intensity * Math.sin(progress * Math.PI);\n    const direction = realityMeltEffect.direction;\n    return <motion.div className=\"fixed inset-0 pointer-events-none z-20\" style={{\n      background: `linear-gradient(${direction}deg, transparent, ${realityMeltEffect.color}80 50%, transparent 100%)`,\n      opacity: intensity * 0.7,\n      backdropFilter: `blur(${intensity * 10}px) hue-rotate(${intensity * 60}deg)`,\n      transform: `perspective(500px) rotateX(${intensity * 5}deg) rotateY(${intensity * 5}deg)`\n    }} initial={{\n      opacity: 0\n    }} animate={{\n      opacity: intensity * 0.7\n    }} transition={{\n      duration: 0.5\n    }}>\n        <div className=\"absolute inset-0\" style={{\n        background: `radial-gradient(circle at ${realityMeltEffect.position.x}% ${realityMeltEffect.position.y}%, \n            rgba(150, 50, 255, ${intensity * 0.3}) 0%, \n            transparent 70%)`\n      }} />\n      </motion.div>;\n  }, [realityMeltEffect]);\n  const renderMirrorSelf = useCallback(() => {\n    if (!mirrorSelfActive || !username) return null;\n    return <motion.div className=\"fixed pointer-events-none z-30 flex flex-col items-center\" style={{\n      left: `${50 + Math.sin(Date.now() / 3000) * 5}%`,\n      top: `${50 + Math.cos(Date.now() / 3000) * 5}%`,\n      transform: 'translate(-50%, -50%)'\n    }} initial={{\n      opacity: 0,\n      scale: 0\n    }} animate={{\n      opacity: 0.9,\n      scale: 1\n    }} exit={{\n      opacity: 0,\n      scale: 0\n    }} transition={{\n      duration: 1\n    }}>\n        <motion.div className=\"w-80 h-80 rounded-full bg-black/40 backdrop-blur-md flex items-center justify-center\" animate={{\n        boxShadow: ['0 0 30px rgba(150, 50, 255, 0.3)', '0 0 50px rgba(150, 50, 255, 0.6)', '0 0 30px rgba(150, 50, 255, 0.3)']\n      }} transition={{\n        duration: 3,\n        repeat: Infinity,\n        ease: \"easeInOut\"\n      }}>\n          <motion.div className=\"w-72 h-72 rounded-full overflow-hidden relative\" animate={{\n          rotate: [0, 360]\n        }} transition={{\n          rotate: {\n            duration: 60,\n            repeat: Infinity,\n            ease: \"linear\"\n          }\n        }}>\n            <div className=\"absolute inset-0 flex items-center justify-center\">\n              <div className=\"text-6xl opacity-30 transform -rotate-12\">👁️</div>\n            </div>\n            \n            <div className=\"absolute inset-0 bg-gradient-to-b from-purple-900/20 via-transparent to-purple-900/20\" />\n            \n            <motion.div className=\"absolute inset-0 flex items-center justify-center\" animate={{\n            opacity: [0.7, 0.9, 0.7],\n            filter: ['hue-rotate(0deg) blur(0px)', 'hue-rotate(90deg) blur(1px)', 'hue-rotate(180deg) blur(0px)', 'hue-rotate(270deg) blur(1px)', 'hue-rotate(360deg) blur(0px)']\n          }} transition={{\n            duration: 10,\n            repeat: Infinity,\n            ease: \"easeInOut\"\n          }}>\n              <div className=\"text-7xl font-bold tracking-widest text-white/20 transform -rotate-12\">VOID</div>\n            </motion.div>\n          </motion.div>\n        </motion.div>\n        \n        <motion.div className=\"mt-4 text-center\" initial={{\n        opacity: 0,\n        y: 20\n      }} animate={{\n        opacity: 0.8,\n        y: 0\n      }} transition={{\n        duration: 1,\n        delay: 0.5\n      }}>\n          <div className=\"text-xl text-purple-300/80 font-bold tracking-wider\">\n            {username.split('').reverse().join('')}\n          </div>\n          <div className=\"text-xs text-gray-300/60 mt-2 italic\">\n            {`Your mirror self has always been watching. ${Math.random() > 0.5 ? 'It is more real than you.' : 'It will outlive your consciousness.'}`}\n          </div>\n        </motion.div>\n      </motion.div>;\n  }, [mirrorSelfActive, username]);\n  const renderEldritchWhisper = useCallback(() => {\n    if (!eldritchWhisper) return null;\n    return <motion.div className=\"fixed text-purple-300/70 z-30 pointer-events-none tracking-widest\" style={{\n      left: `${eldritchWhisper.position.x}%`,\n      top: `${eldritchWhisper.position.y}%`,\n      transform: 'translate(-50%, -50%)',\n      textShadow: '0 0 5px rgba(150, 50, 255, 0.8)',\n      maxWidth: '300px'\n    }} initial={{\n      opacity: 0,\n      scale: 0.8\n    }} animate={{\n      opacity: 0.8,\n      scale: 1\n    }} exit={{\n      opacity: 0,\n      scale: 0.8\n    }} transition={{\n      duration: 1\n    }}>\n        <div className=\"text-center text-sm font-light\">\n          {eldritchWhisper.message}\n        </div>\n      </motion.div>;\n  }, [eldritchWhisper]);\n  const renderDimensionalRift = useCallback(() => {\n    if (!dimensionalRift) return null;\n    const age = Date.now() - dimensionalRift.createdAt;\n    const progress = age / dimensionalRift.duration;\n    const openAmount = progress < 0.2 ? progress * 5 : progress > 0.8 ? (1 - progress) * 5 : 1;\n    return <motion.div className=\"fixed pointer-events-none z-35\" style={{\n      left: `${dimensionalRift.position.x}%`,\n      top: `${dimensionalRift.position.y}%`,\n      width: `${dimensionalRift.size * openAmount}px`,\n      height: `${dimensionalRift.size * openAmount}px`,\n      transform: `translate(-50%, -50%) rotate(${dimensionalRift.rotation}deg)`\n    }} initial={{\n      opacity: 0,\n      scale: 0\n    }} animate={{\n      opacity: 0.9,\n      scale: 1\n    }} exit={{\n      opacity: 0,\n      scale: 0\n    }} transition={{\n      duration: 1\n    }}>\n        {}\n        <motion.div className=\"absolute rounded-full\" style={{\n        width: '110%',\n        height: '110%',\n        left: '-5%',\n        top: '-5%',\n        boxShadow: dimensionalRift.universeType === 0 ? '0 0 100px 20px rgba(120, 50, 255, 0.6)' : dimensionalRift.universeType === 1 ? '0 0 100px 20px rgba(255, 50, 150, 0.6)' : dimensionalRift.universeType === 2 ? '0 0 100px 20px rgba(50, 150, 255, 0.6)' : '0 0 100px 20px rgba(255, 150, 50, 0.6)'\n      }} animate={{\n        opacity: [0.7, 0.9, 0.7]\n      }} transition={{\n        duration: 3,\n        repeat: Infinity,\n        ease: \"easeInOut\"\n      }} />\n        \n        {}\n        <motion.div className=\"absolute rounded-full overflow-hidden\" style={{\n        width: '100%',\n        height: '100%',\n        background: dimensionalRift.universeType === 0 ? `conic-gradient(from ${Date.now() / 50}deg, rgba(80, 20, 120, 0.8), rgba(120, 50, 180, 0.8), rgba(180, 100, 255, 0.8), rgba(80, 20, 120, 0.8))` : dimensionalRift.universeType === 1 ? `radial-gradient(circle at 50% 50%, rgba(255, 100, 150, 0.8), rgba(150, 30, 100, 0.8))` : dimensionalRift.universeType === 2 ? `linear-gradient(${Date.now() % 360}deg, rgba(30, 80, 150, 0.8), rgba(80, 150, 255, 0.8))` : `repeating-radial-gradient(circle at 50% 50%, rgba(200, 150, 50, 0.6) 0%, rgba(100, 80, 20, 0.8) 20%)`\n      }} animate={{\n        rotate: [0, 360]\n      }} transition={{\n        duration: 30,\n        repeat: Infinity,\n        ease: \"linear\"\n      }}>\n          {}\n          <div className=\"absolute inset-0\" style={{\n          backdropFilter: `hue-rotate(${Date.now() % 360}deg) blur(${dimensionalRift.distortion * 5}px)`\n        }} />\n          \n          {}\n          {dimensionalRift.entitiesData.map((entity, i) => <motion.div key={`rift-entity-${entity.id}`} className=\"absolute\" style={{\n          width: `${entity.size}px`,\n          height: entity.type === 0 ? `${entity.size * 2}px` : `${entity.size}px`,\n          left: `${entity.position.x}%`,\n          top: `${entity.position.y}%`,\n          background: 'rgba(0, 0, 0, 0.7)',\n          transform: `translate(-50%, -50%) rotate(${entity.rotation}deg)`,\n          borderRadius: entity.type === 0 ? '40% 40% 20% 20% / 60% 60% 20% 20%' : entity.type === 1 ? '50% 50% 50% 50%' : '10% 70% 10% 70% / 50% 50% 50% 50%'\n        }} animate={{\n          scale: [1, 1.1, 0.9, 1],\n          x: [0, 10, -10, 0],\n          y: [0, -10, 10, 0]\n        }} transition={{\n          duration: 5 + i,\n          repeat: Infinity,\n          ease: \"easeInOut\"\n        }} />)}\n        </motion.div>\n        \n        {}\n        <div className=\"absolute rounded-full w-full h-full border-4 border-purple-500/40\" />\n        \n        {}\n        {Array.from({\n        length: 3\n      }).map((_, i) => <motion.div key={`ripple-${i}`} className=\"absolute rounded-full\" style={{\n        border: `2px solid ${dimensionalRift.universeType === 0 ? 'rgba(150, 100, 255, 0.6)' : dimensionalRift.universeType === 1 ? 'rgba(255, 100, 150, 0.6)' : dimensionalRift.universeType === 2 ? 'rgba(100, 150, 255, 0.6)' : 'rgba(255, 200, 100, 0.6)'}`,\n        width: '100%',\n        height: '100%'\n      }} animate={{\n        scale: [1, 2, 2],\n        opacity: [0.8, 0]\n      }} transition={{\n        duration: 4,\n        repeat: Infinity,\n        delay: i * 1.3,\n        ease: \"easeOut\"\n      }} />)}\n      </motion.div>;\n  }, [dimensionalRift]);\n  const getBackgroundStyle = () => {\n    if (alternateUniverseActive) {\n      if (alternateUniverseType === 0) {\n        return {\n          background: `radial-gradient(circle at 50% 50%, rgb(${5 + Math.sin(Date.now() / 1000) * 30}, ${80 + Math.cos(Date.now() / 1200) * 40}, ${100 + Math.sin(Date.now() / 900) * 30}), rgb(2, 20, 40))`,\n          transition: \"background 0.5s ease-in-out\",\n          cursor: 'none',\n          filter: 'hue-rotate(180deg)'\n        };\n      } else if (alternateUniverseType === 1) {\n        return {\n          background: `linear-gradient(${Date.now() % 360}deg, rgba(50, 10, 60, 0.8), rgba(10, 30, 40, 0.9), rgba(60, 20, 10, 0.8))`,\n          backgroundSize: \"400% 400%\",\n          animation: \"gradient 10s ease infinite\",\n          cursor: 'none'\n        };\n      } else if (alternateUniverseType === 2) {\n        return {\n          background: `url(\"data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='%23${Math.floor(Math.random() * 16777215).toString(16)}' fill-opacity='0.1' fill-rule='evenodd'/%3E%3C/svg%3E\")`,\n          backgroundColor: 'rgb(20, 10, 30)',\n          backgroundBlendMode: 'overlay',\n          cursor: 'none'\n        };\n      } else {\n        return {\n          background: `radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.1) 0%, rgba(0, 0, 0, 0) 70%)`,\n          backgroundColor: 'rgb(5, 2, 10)',\n          backdropFilter: 'invert(100%) hue-rotate(180deg)',\n          cursor: 'none'\n        };\n      }\n    }\n    if (transDimensional) {\n      return {\n        background: `radial-gradient(circle at 50% 50%, ${bgColor}, rgb(5, 2, 10))`,\n        filter: 'invert(100%) hue-rotate(180deg)',\n        transition: \"all 0.5s ease-in-out\",\n        cursor: 'none'\n      };\n    } else if (missingTexture) {\n      return {\n        background: 'repeating-conic-gradient(#ff00ff 0% 25%, #000000 0% 50%)',\n        backgroundSize: '32px 32px',\n        cursor: 'none'\n      };\n    } else if (upsideDown) {\n      return {\n        background: `radial-gradient(circle at 50% 50%, ${bgColor}, rgb(5, 2, 10))`,\n        transform: 'rotate(180deg)',\n        transition: \"transform 0.2s ease-in-out\",\n        cursor: 'none'\n      };\n    } else if (currentUniverse === \"xp\") {\n      return {\n        background: `radial-gradient(circle at 50% 50%, ${bgColor}, rgb(5, 2, 10))`,\n        transition: \"background 2s ease-in-out\",\n        cursor: 'none'\n      };\n    } else if (currentUniverse === \"mac\") {\n      return {\n        background: `radial-gradient(circle at 50% 50%, rgb(${30 + scrollDepth * 0.02}, ${40 + scrollDepth * 0.03}, ${60 + scrollDepth * 0.01}), rgb(20, 25, 35))`,\n        transition: \"background 2s ease-in-out\",\n        cursor: 'none'\n      };\n    } else if (currentUniverse === \"etherExe\") {\n      return {\n        background: `radial-gradient(circle at 50% 50%, rgb(${10 + scrollDepth * 0.01}, ${5 + scrollDepth * 0.01}, ${25 + scrollDepth * 0.05}), rgb(5, 2, 15))`,\n        transition: \"background 2s ease-in-out\",\n        backgroundSize: \"200% 200%\",\n        animation: \"pulse 15s infinite\",\n        cursor: 'none'\n      };\n    } else if (currentUniverse === \"void\") {\n      return {\n        background: `radial-gradient(circle at 50% 50%, rgb(${5 + Math.sin(Date.now() / 5000) * 10}, ${5 + Math.cos(Date.now() / 7000) * 5}, ${15 + Math.sin(Date.now() / 3000) * 10}), rgb(0, 0, 5))`,\n        transition: \"background 0.5s ease-in-out\",\n        cursor: 'none'\n      };\n    } else if (currentUniverse === \"ascension\") {\n      return {\n        background: `radial-gradient(circle at 50% 50%, rgb(${150 + Math.sin(Date.now() / 2000) * 50}, ${150 + Math.cos(Date.now() / 3000) * 50}, ${220 + Math.sin(Date.now() / 1500) * 30}), rgb(100, 100, 150))`,\n        transition: \"background 0.5s ease-in-out\",\n        cursor: 'none'\n      };\n    }\n    return {\n      background: `radial-gradient(circle at 50% 50%, ${bgColor}, rgb(5, 2, 10))`,\n      transition: \"background 2s ease-in-out\",\n      cursor: 'none'\n    };\n  };\n  const renderGravitationalLensing = useCallback(() => {\n    if (!lensDistortionRef.current) return null;\n    return <div className=\"fixed inset-0 pointer-events-none z-2\" style={{\n      opacity: lensDistortionRef.current.intensity,\n      backgroundImage: `radial-gradient(\n            circle at ${lensDistortionRef.current.centerX}% ${lensDistortionRef.current.centerY}%, \n            rgba(0,0,0,0) 0%, \n            rgba(20,10,40,0.1) 40%, \n            rgba(20,10,40,0) 60%\n          )`,\n      filter: `brightness(${1 - lensDistortionRef.current.intensity * 0.2}) contrast(${1 + lensDistortionRef.current.intensity})`,\n      mixBlendMode: \"difference\"\n    }} />;\n  }, []);\n  const handleUsernameSubmit = () => {\n    if (username.trim().length >= 3) {\n      setHasSetUsername(true);\n      setShowUsernamePrompt(false);\n      localStorage.setItem('voidscape_username', username);\n      if (socketRef.current) {\n        socketRef.current.emit('user_join', {\n          username\n        });\n      }\n    }\n  };\n  useEffect(() => {\n    const savedUsername = localStorage.getItem('voidscape_username');\n    if (savedUsername) {\n      setUsername(savedUsername);\n      setHasSetUsername(true);\n      setShowUsernamePrompt(false);\n      if (socketRef.current) {\n        socketRef.current.emit('user_join', {\n          username: savedUsername\n        });\n      }\n    }\n    if (showUsernamePrompt) {\n      setTimeout(() => {\n        const inputElement = document.querySelector('input[type=\"text\"]');\n        if (inputElement) {\n          inputElement.focus();\n        }\n      }, 100);\n    }\n  }, [showUsernamePrompt]);\n  if (showUsernamePrompt) {\n    return <div className=\"fixed inset-0 overflow-hidden bg-black\" style={{\n      cursor: 'auto'\n    }}>\n      {}\n      <motion.div className=\"absolute inset-0 z-0\" animate={{\n        backgroundPosition: ['0% 0%', '100% 100%']\n      }} transition={{\n        duration: 120,\n        ease: \"linear\",\n        repeat: Infinity,\n        repeatType: \"reverse\"\n      }} style={{\n        background: 'radial-gradient(circle at center, rgba(50,10,80,0.5) 0%, rgba(15,5,30,0.8) 40%, rgba(5,2,10,1) 100%)',\n        filter: 'blur(20px)',\n        transform: 'scale(1.2)'\n      }} />\n      \n      {}\n      <div className=\"absolute inset-0 z-0\">\n        {Array.from({\n          length: 200\n        }).map((_, i) => <motion.div key={`star-${i}`} className=\"absolute rounded-full bg-white\" style={{\n          width: `${Math.random() * 2 + 1}px`,\n          height: `${Math.random() * 2 + 1}px`,\n          left: `${Math.random() * 100}%`,\n          top: `${Math.random() * 100}%`,\n          opacity: Math.random() * 0.7 + 0.3\n        }} animate={{\n          opacity: [0.3, 0.8, 0.3],\n          scale: [1, 1.5, 1]\n        }} transition={{\n          duration: 2 + Math.random() * 3,\n          repeat: Infinity,\n          delay: Math.random() * 5\n        }} />)}\n      </div>\n      \n      {}\n      <motion.div className=\"absolute inset-0 z-1 opacity-60\" style={{\n        background: `\n            radial-gradient(circle at 30% 30%, rgba(120,50,180,0.1) 0%, rgba(20,10,40,0) 50%),\n            radial-gradient(circle at 70% 60%, rgba(80,40,160,0.15) 0%, rgba(10,5,30,0) 50%)\n          `\n      }} animate={{\n        filter: ['hue-rotate(0deg)', 'hue-rotate(90deg)', 'hue-rotate(180deg)', 'hue-rotate(270deg)', 'hue-rotate(360deg)']\n      }} transition={{\n        duration: 60,\n        ease: \"linear\",\n        repeat: Infinity\n      }} />\n      \n      {}\n      <div className=\"absolute inset-0 z-1 overflow-hidden pointer-events-none\">\n        {Array.from({\n          length: 15\n        }).map((_, i) => {\n          const symbols = [\"◎\", \"✧\", \"⋇\", \"⊗\", \"∞\", \"⨁\", \"◯\", \"⦿\", \"⊛\", \"⊕\"];\n          const symbol = symbols[Math.floor(Math.random() * symbols.length)];\n          return <motion.div key={`symbol-${i}`} className=\"absolute text-purple-300/20 text-3xl font-thin\" style={{\n            left: `${Math.random() * 100}%`,\n            top: `${Math.random() * 100}%`\n          }} animate={{\n            y: [0, Math.random() * 100 - 50],\n            x: [0, Math.random() * 100 - 50],\n            rotate: [0, Math.random() > 0.5 ? 360 : -360],\n            opacity: [0, 0.3, 0]\n          }} transition={{\n            duration: 15 + Math.random() * 20,\n            repeat: Infinity,\n            repeatType: \"reverse\",\n            ease: \"easeInOut\"\n          }}>\n              {symbol}\n            </motion.div>;\n        })}\n      </div>\n      \n      {}\n      <motion.div className=\"fixed inset-0 flex items-center justify-center z-10\" animate={{\n        filter: ['drop-shadow(0 0 15px rgba(150,100,255,0.3))', 'drop-shadow(0 0 25px rgba(150,100,255,0.5))', 'drop-shadow(0 0 15px rgba(150,100,255,0.3))']\n      }} transition={{\n        duration: 4,\n        repeat: Infinity,\n        ease: \"easeInOut\"\n      }}>\n        <motion.div className=\"relative\" animate={{\n          rotateZ: [0, 360]\n        }} transition={{\n          duration: 120,\n          repeat: Infinity,\n          ease: \"linear\"\n        }}>\n          <div className=\"absolute -inset-10 bg-gradient-to-r from-indigo-900/10 via-purple-900/5 to-indigo-900/10 rounded-full blur-xl\" />\n          <motion.div className=\"absolute -inset-8 opacity-30 rounded-full\" style={{\n            background: 'conic-gradient(from 0deg, rgba(120,50,255,0), rgba(180,100,255,0.3), rgba(120,50,255,0))'\n          }} animate={{\n            rotate: [0, 360]\n          }} transition={{\n            duration: 20,\n            repeat: Infinity,\n            ease: \"linear\"\n          }} />\n          \n          {}\n          <div className=\"relative w-96 p-8 bg-black/40 backdrop-blur-xl border border-purple-500/20 rounded-2xl overflow-hidden shadow-[0_0_50px_rgba(100,50,200,0.15)]\">\n            {}\n            <div className=\"absolute inset-0 bg-gradient-to-b from-transparent via-purple-900/5 to-transparent opacity-40\" />\n            \n            {}\n            <div className=\"absolute inset-0 overflow-hidden opacity-20\">\n              {Array.from({\n                length: 8\n              }).map((_, i) => <motion.div key={`line-${i}`} className=\"absolute h-[1px] bg-gradient-to-r from-purple-500/0 via-purple-500/50 to-purple-500/0\" style={{\n                width: '140%',\n                left: '-20%',\n                top: `${100 / 8 * i}%`\n              }} animate={{\n                x: ['-20%', '20%', '-20%']\n              }} transition={{\n                duration: 10 + i * 2,\n                repeat: Infinity,\n                ease: \"linear\"\n              }} />)}\n            </div>\n            \n            <motion.h2 className=\"text-2xl font-light tracking-[0.25em] text-center mb-8 text-transparent bg-clip-text bg-gradient-to-r from-purple-300 to-indigo-300\" animate={{\n              letterSpacing: ['0.25em', '0.3em', '0.25em'],\n              filter: ['blur(0px)', 'blur(0.5px)', 'blur(0px)']\n            }} transition={{\n              duration: 8,\n              repeat: Infinity,\n              ease: \"easeInOut\"\n            }}>\n              WHO ARE YOU?\n            </motion.h2>\n            \n            <div className=\"relative mb-8 group\">\n              {}\n              <motion.div className=\"absolute -inset-1 bg-gradient-to-r from-purple-600/20 via-fuchsia-500/20 to-indigo-600/20 rounded-lg blur-sm opacity-70\" animate={{\n                opacity: [0.4, 0.7, 0.4]\n              }} transition={{\n                duration: 3,\n                repeat: Infinity,\n                ease: \"easeInOut\"\n              }} style={{\n                pointerEvents: 'none'\n              }} />\n              \n              <input type=\"text\" value={username} onChange={e => setUsername(e.target.value)} placeholder=\"Enter your name...\" className=\"w-full bg-black/50 border border-purple-500/30 text-purple-100 p-4 rounded-lg placeholder:text-purple-300/40 focus:outline-none focus:ring-2 focus:ring-purple-500/30 font-light tracking-wider cursor-text\" onKeyPress={e => e.key === 'Enter' && handleUsernameSubmit()} autoFocus style={{\n                cursor: 'text'\n              }} />\n              \n              {}\n              {username.trim().length > 0 && <motion.div className=\"absolute right-3 top-3 text-xs text-purple-300/50 font-mono\" initial={{\n                opacity: 0\n              }} animate={{\n                opacity: 1\n              }} transition={{\n                duration: 0.3\n              }}>\n                  <span className={username.trim().length < 3 ? \"text-red-400/70\" : \"text-green-400/70\"}>\n                    {username.trim().length}/16\n                  </span>\n                </motion.div>}\n              \n              {username.trim().length > 0 && username.trim().length < 3 && <motion.p className=\"text-red-400/80 text-xs mt-2 pl-1 italic\" initial={{\n                opacity: 0,\n                y: -5\n              }} animate={{\n                opacity: 1,\n                y: 0\n              }} transition={{\n                duration: 0.3\n              }}>\n                  Designation requires minimum 3 symbols\n                </motion.p>}\n            </div>\n            \n            {}\n            <div className=\"relative\">\n              <motion.div className=\"absolute -inset-1 bg-gradient-to-r from-purple-800/50 via-fuchsia-700/50 to-purple-800/50 rounded-lg blur-sm opacity-70\" animate={{\n                backgroundPosition: ['0% 0%', '100% 0%', '0% 0%']\n              }} transition={{\n                duration: 3,\n                repeat: Infinity,\n                ease: \"easeInOut\"\n              }} style={{\n                backgroundSize: '200% 100%'\n              }} />\n              \n              <motion.button onClick={handleUsernameSubmit} className=\"relative w-full py-4 bg-gradient-to-r from-purple-900/80 via-indigo-800/80 to-purple-900/80 text-white/90 rounded-lg transition duration-300 font-light tracking-widest text-sm shadow-lg backdrop-blur-sm\" disabled={username.trim().length < 3} whileHover={{\n                scale: 1.02,\n                boxShadow: \"0 0 20px rgba(150,100,255,0.4)\"\n              }} whileTap={{\n                scale: 0.98\n              }} style={{\n                opacity: username.trim().length < 3 ? 0.5 : 1\n              }}>\n                TRANSCEND INTO VOID\n              </motion.button>\n            </div>\n            \n            {}\n            <motion.div className=\"mt-6 text-center text-purple-300/40 text-xs tracking-widest font-light\" animate={{\n              opacity: [0.3, 0.5, 0.3]\n            }} transition={{\n              duration: 5,\n              repeat: Infinity,\n              ease: \"easeInOut\"\n            }}>\n              [your identity will be bound to the void eternally]\n            </motion.div>\n          </div>\n        </motion.div>\n      </motion.div>\n      \n      {}\n      <div className=\"fixed inset-0 z-20 pointer-events-none\">\n        {Array.from({\n          length: 30\n        }).map((_, i) => <motion.div key={`dust-${i}`} className=\"absolute bg-white rounded-full opacity-40 blur-sm\" style={{\n          width: `${Math.random() * 4 + 1}px`,\n          height: `${Math.random() * 4 + 1}px`,\n          left: `${Math.random() * 100}%`,\n          top: `${Math.random() * 100}%`\n        }} animate={{\n          y: [0, Math.random() * 30 - 15],\n          x: [0, Math.random() * 30 - 15],\n          opacity: [0, 0.5, 0]\n        }} transition={{\n          duration: 4 + Math.random() * 6,\n          repeat: Infinity,\n          repeatType: \"reverse\",\n          ease: \"easeInOut\",\n          delay: Math.random() * 5\n        }} />)}\n      </div>\n    </div>;\n  }\n  return <div ref={containerRef} className=\"fixed inset-0 overflow-hidden\" style={{\n    ...getBackgroundStyle(),\n    ...glitchStyle\n  }}>\n      {renderNebulaEffects()}\n      {renderCosmicDust()}\n      {renderGravitationalLensing()}\n      \n      {renderCustomCursor()}\n      \n      <div className=\"fixed inset-0 overflow-hidden\">\n        {particles}\n      </div>\n      \n      {}\n      {renderVoidEntities()}\n      {renderBiomechanicalHorrors()}\n      {renderWatcherEntities()}\n      {renderRealityFractures()}\n      \n      {}\n      {renderRealityMelt()}\n      {renderMirrorSelf()}\n      {renderEldritchWhisper()}\n      {renderNonEuclideanGeometry()}\n      {renderInsideTruth()}\n      {renderDimensionalRift()}\n      \n      {}\n      <AnimatePresence>\n        {pingWhisper && <motion.div className=\"fixed text-white/30 text-sm tracking-widest z-30\" initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.8\n      }} exit={{\n        opacity: 0\n      }} transition={{\n        duration: 1\n      }} style={{\n        left: `${pingWhisper.x}%`,\n        top: `${pingWhisper.y}%`,\n        transform: \"translate(-50%, -50%)\",\n        pointerEvents: \"none\"\n      }}>\n            {pingWhisper.message}\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {alternateUniverseActive && connectedUsers.map((user, index) => <motion.div key={`user-${user.username}-${index}`} className=\"fixed pointer-events-none z-30\" initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.7\n      }} exit={{\n        opacity: 0\n      }} style={{\n        left: `${user.x}%`,\n        top: `${user.y}%`\n      }}>\n            <div className=\"flex flex-col items-center\">\n              <div className=\"w-16 h-32 backdrop-blur-sm opacity-40 rounded-full bg-white/10\" style={{\n            boxShadow: `0 0 15px 5px rgba(150, 100, 255, 0.2)`,\n            background: user.universeType === 0 ? 'rgba(100, 150, 255, 0.15)' : user.universeType === 1 ? 'rgba(200, 100, 255, 0.15)' : user.universeType === 2 ? 'rgba(255, 100, 150, 0.15)' : 'rgba(150, 255, 200, 0.15)'\n          }} />\n              <div className=\"text-xs mt-2 text-purple-300/80\">\n                {user.username || 'Unknown Traveler'}\n              </div>\n              {user.message && <div className=\"text-xs mt-1 text-white/50 max-w-48 text-center\">\n                  \"{user.message}\"\n                </div>}\n            </div>\n          </motion.div>)}\n      </AnimatePresence>\n      \n      <motion.div className=\"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full\" style={{\n      width: `${Math.min(200 + scrollDepth * 0.5, 400)}px`,\n      height: `${Math.min(200 + scrollDepth * 0.5, 400)}px`,\n      boxShadow: `0 0 ${100 + scrollDepth}px ${50 + scrollDepth * 0.3}px rgba(25, 10, 40, 0.6)`,\n      background: \"radial-gradient(circle at center, rgba(40, 20, 60, 0.2), rgba(10, 5, 15, 0.9))\"\n    }} animate={{\n      scale: [1, 1.05, 1],\n      opacity: [0.8, 0.9, 0.8]\n    }} transition={{\n      duration: 8,\n      repeat: Infinity,\n      ease: \"easeInOut\"\n    }} />\n      \n      {}\n      <div className=\"fixed inset-0 overflow-hidden\">\n        {particles}\n      </div>\n      \n      {}\n      <motion.div className=\"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full\" style={{\n      width: `${Math.min(200 + scrollDepth * 0.5, 400)}px`,\n      height: `${Math.min(200 + scrollDepth * 0.5, 400)}px`,\n      boxShadow: `0 0 ${100 + scrollDepth}px ${50 + scrollDepth * 0.3}px rgba(25, 10, 40, 0.6)`,\n      background: currentUniverse === \"etherExe\" ? \"radial-gradient(circle at center, rgba(40, 20, 100, 0.3), rgba(20, 10, 40, 0.9))\" : currentUniverse === \"void\" ? \"radial-gradient(circle at center, rgba(90, 10, 90, 0.2), rgba(30, 5, 50, 0.9))\" : currentUniverse === \"ascension\" ? \"radial-gradient(circle at center, rgba(200, 180, 255, 0.4), rgba(150, 130, 200, 0.8))\" : \"radial-gradient(circle at center, rgba(40, 20, 60, 0.2), rgba(10, 5, 15, 0.9))\"\n    }} animate={{\n      scale: [1, 1.05, 1],\n      opacity: [0.8, 0.9, 0.8]\n    }} transition={{\n      duration: 8,\n      repeat: Infinity,\n      ease: \"easeInOut\"\n    }} />\n      \n      {}\n      <div className=\"fixed top-5 right-5 flex flex-col gap-2\">\n        <motion.div className=\"px-3 py-2 bg-black/30 backdrop-blur-sm border border-white/20 rounded-md\" whileHover={{\n        scale: 1.05,\n        boxShadow: \"0 0 15px rgba(100, 50, 150, 0.3)\"\n      }} onClick={() => setShowTokenAddressInput(prev => !prev)}>\n          <div className=\"flex items-center justify-between\">\n            <div className=\"text-xs text-gray-400\">Market Cap</div>\n            {tokenSymbol !== \"PUMP\" && <div className=\"text-xs text-purple-400\">{tokenSymbol}</div>}\n          </div>\n          <div className={`font-bold ${marketCap > 5000 ? \"text-green-400\" : \"text-white\"}`}>\n            {formatMarketCap(marketCap)}\n          </div>\n          <div className=\"text-xs text-purple-300/70 mt-1\">Financial Dimension</div>\n          \n          <AnimatePresence>\n            {showTokenAddressInput && <motion.div className=\"mt-2 pt-2 border-t border-purple-500/20\" initial={{\n            opacity: 0,\n            height: 0\n          }} animate={{\n            opacity: 1,\n            height: 'auto'\n          }} exit={{\n            opacity: 0,\n            height: 0\n          }}>\n                <div className=\"text-xs text-purple-300/70 mb-1\">Token Contract Address</div>\n                <input type=\"text\" value={customTokenAddress} onChange={e => setCustomTokenAddress(e.target.value)} placeholder=\"Enter contract address...\" className=\"w-full bg-black/50 border border-purple-500/30 text-purple-100 p-2 text-xs rounded-lg placeholder:text-purple-300/40 focus:outline-none\" style={{\n              cursor: 'text'\n            }} />\n              </motion.div>}\n          </AnimatePresence>\n        </motion.div>\n        \n        <motion.div className=\"px-3 py-2 bg-black/30 backdrop-blur-sm border border-white/20 rounded-md\" whileHover={{\n        scale: 1.05,\n        boxShadow: \"0 0 15px rgba(100, 50, 150, 0.3)\"\n      }}>\n          <div className=\"text-xs text-gray-400\">In Void</div>\n          <div className=\"font-bold text-purple-400\">\n            {onlineUsers} <span className=\"text-xs text-gray-400\">fellow travelers</span>\n          </div>\n          <div className=\"text-xs text-purple-300/70 mt-1\">Consciousness Signatures</div>\n        </motion.div>\n      </div>\n      \n      {}\n      {audioEnabled && breathingIntensity > 0 && <div className=\"fixed bottom-24 right-8 flex items-center gap-2 text-white/40 text-xs\">\n          <div className=\"w-2 h-2 rounded-full bg-red-500/50 animate-pulse\" style={{\n        animationDuration: `${2 - breathingIntensity}s`\n      }} />\n          <span>Breathing detected: {(breathingIntensity * 100).toFixed(0)}%</span>\n        </div>}\n      \n      {}\n      \n      {}\n      <AnimatePresence>\n        {startMenuOpen && <motion.div className=\"fixed bottom-10 left-0 w-64 bg-[#3a6edf]/90 backdrop-blur-sm border border-white/20 rounded-t-lg overflow-hidden z-50\" initial={{\n        opacity: 0,\n        y: 20\n      }} animate={{\n        opacity: 1,\n        y: 0\n      }} exit={{\n        opacity: 0,\n        y: 20\n      }} transition={{\n        duration: 0.2\n      }} style={{\n        boxShadow: '0 0 15px rgba(0,0,0,0.5)',\n        transform: getDistortionLevel() > 0.5 ? `skew(${Math.random() * 5}deg, ${Math.random() * 2}deg)` : 'none'\n      }}>\n            {}\n            <div className=\"p-3 bg-gradient-to-r from-blue-700 to-blue-900 flex items-center border-b border-white/10\">\n              <div className=\"w-10 h-10 rounded-full bg-white/20 flex items-center justify-center text-white\">\n                👤\n              </div>\n              <div className=\"ml-3 text-white\">\n                <div className=\"font-bold\">Anon User</div>\n                <div className=\"text-xs opacity-80\">Connected to Void</div>\n              </div>\n            </div>\n            \n            {}\n            <div className=\"p-1\">\n              {[{\n            icon: '📈',\n            label: 'Market Data'\n          }, {\n            icon: '🔐',\n            label: 'Connect Wallet'\n          }, {\n            icon: '📝',\n            label: 'Transmit'\n          }, {\n            icon: '📊',\n            label: 'Depth Analysis'\n          }].map((item, i) => <div key={i} className=\"flex items-center p-2 hover:bg-white/10 rounded cursor-pointer\" style={{\n            opacity: Math.max(0.6, 1 - getDistortionLevel() * i / 4),\n            transform: getDistortionLevel() > 0.3 ? `skew(${(Math.random() - 0.5) * 5}deg, 0deg)` : 'none'\n          }} onClick={() => {\n            if (item.label === 'Transmit') {\n              setTweetBoxOpen(true);\n              setStartMenuOpen(false);\n            }\n          }}>\n                  <span className=\"mr-2\">{item.icon}</span>\n                  <span className=\"text-white text-sm\">{item.label}</span>\n                </div>)}\n              \n              <div className=\"border-t border-white/10 my-1\"></div>\n              \n              {}\n              <div className=\"flex items-center p-2 hover:bg-white/10 rounded cursor-pointer\" onClick={() => {\n            window.open(\"https://pump.fun\", \"_blank\");\n            setStartMenuOpen(false);\n          }} style={{\n            opacity: scrollDepth > 100 ? 0.9 : 0.3,\n            background: scrollDepth > 100 ? 'rgba(150, 50, 255, 0.3)' : 'transparent'\n          }}>\n                <span className=\"mr-2\">⚡</span>\n                <span className=\"text-white text-sm\">Run PUMP.exe</span>\n              </div>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {activePopup && <motion.div className=\"fixed rounded-md overflow-hidden z-50 shadow-xl\" initial={{\n        opacity: 0,\n        scale: 0.8\n      }} animate={{\n        opacity: 1,\n        scale: 1\n      }} exit={{\n        opacity: 0,\n        scale: 0.8\n      }} style={{\n        left: `${20 + Math.random() * 40}%`,\n        top: `${20 + Math.random() * 30}%`,\n        width: '280px',\n        background: 'linear-gradient(to bottom, #fff, #f0f0f0)',\n        border: '1px solid #cccccc',\n        boxShadow: '0 4px 20px rgba(0,0,0,0.4)',\n        transform: getDistortionLevel() > 0.3 ? `rotate(${(Math.random() - 0.5) * 3}deg)` : 'none'\n      }}>\n            <div className=\"bg-gradient-to-r from-blue-600 to-blue-800 px-2 py-1 flex justify-between items-center\">\n              <div className=\"text-white text-xs font-bold flex items-center\">\n                <span className=\"text-sm mr-1\">⚠️</span>\n                {activePopup.title}\n              </div>\n              <button className=\"text-white text-xs bg-red-500 w-4 h-4 flex items-center justify-center rounded-sm\" onClick={() => setActivePopup(null)}>\n                ✕\n              </button>\n            </div>\n            <div className=\"p-3 flex\">\n              <div className=\"text-red-600 text-3xl mr-3\">⚠️</div>\n              <div className=\"text-gray-800 text-sm\">\n                {activePopup.message}\n                <div className=\"mt-3 flex justify-end\">\n                  <button className=\"bg-gray-200 px-3 py-0.5 text-xs rounded border border-gray-400 hover:bg-gray-300\" onClick={() => setActivePopup(null)}>\n                    OK\n                  </button>\n                </div>\n              </div>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {blueScreenActive && <motion.div className=\"fixed inset-0 z-50 p-10 flex flex-col\" initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 1\n      }} exit={{\n        opacity: 0\n      }} style={{\n        background: 'rgb(0, 0, 170)',\n        fontFamily: 'Courier, monospace'\n      }}>\n            <div className=\"text-white text-xl mb-6\">\n              VOID_OS\n            </div>\n            <div className=\"text-white font-mono whitespace-pre-line text-lg\">\n              {blueScreenMessages[Math.floor(Math.random() * blueScreenMessages.length)]}\n            </div>\n            <div className=\"mt-auto text-white opacity-70 text-sm\">\n              Collecting void data: {Math.floor(Math.random() * 100)}% complete\n            </div>\n            <div className=\"text-white opacity-70 text-sm\">\n              Your current void depth: {Math.floor(scrollDepth)}\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {bsodDegen && <motion.div className=\"fixed inset-0 z-50 p-10 flex flex-col\" initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 1\n      }} exit={{\n        opacity: 0\n      }} style={{\n        background: 'rgb(0, 0, 170)',\n        fontFamily: 'Courier, monospace'\n      }}>\n            <div className=\"text-white text-xl mb-6\">\n              PUMP_OS\n            </div>\n            <div className=\"text-white font-mono whitespace-pre-line text-lg\">\n              {degenMessages[Math.floor(Math.random() * degenMessages.length)]}\n            </div>\n            <div className=\"mt-auto text-white opacity-70 text-sm\">\n              Analyzing portfolio: {Math.floor(Math.random() * 100)}% losses detected\n            </div>\n            <div className=\"text-white opacity-70 text-sm\">\n              Current market cap: ${formatMarketCap(marketCap)}\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      {ghostCursor && <motion.div className=\"fixed rounded-full z-50 pointer-events-none mix-blend-screen\" style={{\n      width: '16px',\n      height: '16px',\n      left: ghostCursorPosition.x,\n      top: ghostCursorPosition.y,\n      backgroundColor: 'rgba(255, 100, 255, 0.7)',\n      boxShadow: '0 0 10px rgba(255, 100, 255, 0.5)',\n      transform: 'translate(-50%, -50%)',\n      filter: 'blur(1px)'\n    }} animate={{\n      opacity: [0.7, 0.3, 0.7],\n      scale: [1, 1.2, 1]\n    }} transition={{\n      duration: 1,\n      repeat: 3\n    }} />}\n      \n      {}\n      <AnimatePresence>\n        {faceInStatic && <motion.div className=\"fixed inset-0 z-40 pointer-events-none\" initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.4\n      }} exit={{\n        opacity: 0\n      }} transition={{\n        duration: 0.2\n      }}>\n            <div className=\"absolute inset-0 flex items-center justify-center\">\n              <img src={`https://cdn.dev.fun/12921de9d8efdc28b97d/wojak${Math.floor(Math.random() * 3) + 1}.png`} alt=\"\" className=\"w-64 h-64 object-cover mix-blend-overlay opacity-70\" style={{\n            filter: 'contrast(1.5) brightness(1.3) hue-rotate(30deg)'\n          }} />\n            </div>\n            <div className=\"absolute inset-0\" style={{\n          background: 'repeating-linear-gradient(45deg, rgba(0,0,0,0.1), rgba(0,0,0,0.1) 2px, rgba(255,255,255,0.1) 2px, rgba(255,255,255,0.1) 4px)',\n          mixBlendMode: 'overlay'\n        }} />\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {corruptedStartMenu && <motion.div className=\"fixed bottom-0 left-0 w-64 bg-[#000066]/90 backdrop-blur-sm border border-white/20 rounded-t-lg overflow-hidden z-50\" initial={{\n        y: 200\n      }} animate={{\n        y: 0\n      }} exit={{\n        y: 200\n      }} transition={{\n        duration: 0.3\n      }} style={{\n        boxShadow: '0 0 15px rgba(0,0,0,0.5)',\n        transform: `skew(${Math.random() * 5}deg, ${Math.random() * 2}deg)`\n      }}>\n            <div className=\"p-2 bg-gradient-to-r from-blue-900 to-purple-900 flex items-center border-b border-white/10\">\n              <div className=\"w-8 h-8 rounded-full bg-white/20 flex items-center justify-center text-white\">\n                😵‍💫\n              </div>\n              <div className=\"ml-2 text-white text-sm\">\n                <div className=\"font-bold\">Corrupted System</div>\n              </div>\n            </div>\n            \n            <div className=\"p-1\">\n              {[{\n            icon: '💸',\n            label: 'Buy Coin'\n          }, {\n            icon: '👻',\n            label: 'Sell Soul'\n          }, {\n            icon: '🔄',\n            label: 'Exit Loop'\n          }, {\n            icon: '🚽',\n            label: 'Flush Portfolio'\n          }, {\n            icon: '🔥',\n            label: 'Burn Bridges'\n          }].map((item, i) => <div key={i} className=\"flex items-center p-1.5 hover:bg-white/10 rounded cursor-pointer\" style={{\n            opacity: Math.max(0.6, 1 - i / 6),\n            transform: `skew(${(Math.random() - 0.5) * 3}deg, 0deg)`,\n            background: i === Math.floor(Math.random() * 5) ? 'rgba(255,0,0,0.2)' : 'transparent'\n          }}>\n                  <span className=\"mr-2\">{item.icon}</span>\n                  <span className=\"text-white text-xs\">{item.label}</span>\n                </div>)}\n              \n              <div className=\"border-t border-white/10 my-1\"></div>\n              \n              <div className=\"flex items-center p-1.5 hover:bg-white/10 rounded cursor-pointer bg-red-900/30\">\n                <span className=\"mr-2\">⚠️</span>\n                <span className=\"text-white text-xs\">{Math.random() > 0.5 ? 'Format Brain.exe' : 'Delete Memories'}</span>\n              </div>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {errorDialogFlood && errorDialogs.map(dialog => <motion.div key={dialog.id} className=\"fixed rounded-md overflow-hidden z-50 shadow-xl\" initial={{\n        opacity: 0,\n        scale: 0.8\n      }} animate={{\n        opacity: 1,\n        scale: 1\n      }} exit={{\n        opacity: 0,\n        scale: 0.8\n      }} style={{\n        left: `${dialog.position.x}%`,\n        top: `${dialog.position.y}%`,\n        width: '250px',\n        background: 'linear-gradient(to bottom, #fff, #f0f0f0)',\n        border: '1px solid #cccccc',\n        boxShadow: '0 4px 20px rgba(0,0,0,0.4)',\n        transform: `rotate(${(Math.random() - 0.5) * 5}deg)`\n      }}>\n            <div className=\"bg-gradient-to-r from-blue-600 to-blue-800 px-2 py-1 flex justify-between items-center\">\n              <div className=\"text-white text-xs font-bold flex items-center\">\n                <span className=\"text-sm mr-1\">⚠️</span>\n                {dialog.title}\n              </div>\n              <button className=\"text-white text-xs bg-red-500 w-4 h-4 flex items-center justify-center rounded-sm\">\n                ✕\n              </button>\n            </div>\n            <div className=\"p-2 flex\">\n              <div className=\"text-red-600 text-3xl mr-2\">⚠️</div>\n              <div className=\"text-gray-800 text-xs\">\n                {dialog.message}\n                <div className=\"mt-2 flex justify-end\">\n                  <button className=\"bg-gray-200 px-2 py-0.5 text-xs rounded border border-gray-400\">\n                    OK\n                  </button>\n                </div>\n              </div>\n            </div>\n          </motion.div>)}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {loginWindow && <motion.div className=\"fixed top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 z-50 w-80 rounded-md overflow-hidden shadow-lg\" initial={{\n        opacity: 0,\n        y: -20\n      }} animate={{\n        opacity: 1,\n        y: 0\n      }} exit={{\n        opacity: 0,\n        y: 20\n      }} style={{\n        background: 'linear-gradient(to bottom, #2e5eeb, #4974e9)',\n        border: '1px solid #1a3ca0'\n      }}>\n            <div className=\"p-2 bg-gradient-to-r from-blue-600 to-blue-700 text-white text-center font-bold text-sm\">\n              Windows XP\n            </div>\n            \n            <div className=\"bg-gradient-to-b from-[#ece9d8] to-[#d6d3c5] p-4\">\n              <div className=\"flex mb-4\">\n                <div className=\"w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center border-2 border-blue-300\">\n                  <span className=\"text-2xl\">👤</span>\n                </div>\n                <div className=\"ml-4 flex-1\">\n                  <div className=\"text-xs mb-2 text-gray-700\">Enter the seed phrase of your dreams:</div>\n                  <input type=\"password\" className=\"w-full border border-gray-400 bg-white px-2 py-1 text-xs\" value=\"••••••••••••••\" readOnly />\n                  <div className=\"mt-1 text-xs text-red-700 italic\">Warning: Brain will be formatted</div>\n                </div>\n              </div>\n              \n              <div className=\"flex justify-end gap-2\">\n                <button className=\"bg-gray-200 border border-gray-400 text-xs px-3 py-1 rounded\">\n                  Cancel\n                </button>\n                <button className=\"bg-blue-500 text-white border border-blue-700 text-xs px-3 py-1 rounded\">\n                  OK\n                </button>\n              </div>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {terminalError && <motion.div className=\"fixed rounded-md overflow-hidden z-50 shadow-xl\" initial={{\n        opacity: 0,\n        scale: 0.8\n      }} animate={{\n        opacity: 1,\n        scale: 1\n      }} exit={{\n        opacity: 0,\n        scale: 0.8\n      }} style={{\n        left: `${10 + Math.random() * 30}%`,\n        top: `${10 + Math.random() * 30}%`,\n        width: '400px',\n        background: 'rgb(0, 0, 0)',\n        border: '1px solid #333',\n        boxShadow: '0 4px 20px rgba(0,0,0,0.7)'\n      }}>\n            <div className=\"bg-gradient-to-r from-gray-800 to-gray-900 px-2 py-1 flex justify-between items-center\">\n              <div className=\"text-white text-xs font-bold flex items-center\">\n                <span className=\"text-sm mr-1\">$</span>\n                void_terminal\n              </div>\n              <button className=\"text-white text-xs w-4 h-4 flex items-center justify-center\" onClick={() => setTerminalError(null)}>\n                ✕\n              </button>\n            </div>\n            <div className=\"p-3 font-mono text-sm\">\n              <div className=\"text-green-500 mb-1\">void@voidscape:~$ {terminalError.command}</div>\n              <div className=\"text-red-400 whitespace-pre-line\">{terminalError.error}</div>\n              <div className=\"text-gray-400 mt-2 animate-pulse\">_</div>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <div className=\"fixed bottom-24 left-1/2 transform -translate-x-1/2 text-center text-white opacity-50\">\n        <div className=\"text-sm font-light tracking-widest mb-2\">\n          {showCrypticMessage ? <span className=\"text-red-400 font-glitch animate-pulse\">{crypticMessage}</span> : <>DEPTH: {Math.floor(scrollDepth)}</>}\n        </div>\n        <div className=\"w-40 h-0.5 bg-gray-800 rounded-full overflow-hidden\">\n          <motion.div className=\"h-full bg-indigo-600\" initial={{\n          width: \"0%\"\n        }} animate={{\n          width: `${Math.min(scrollDepth / 500 * 100, 100)}%`\n        }} transition={{\n          duration: 0.5\n        }} />\n        </div>\n      </div>\n      \n      {}\n      <motion.button onClick={() => setTweetBoxOpen(true)} className=\"fixed bottom-10 left-1/2 transform -translate-x-1/2 px-8 py-3 rounded-full z-30 transmit-element\" whileHover={{\n      scale: 1.05,\n      boxShadow: \"0 0 30px rgba(150, 100, 255, 0.6)\"\n    }} whileTap={{\n      scale: 0.98\n    }} initial={{\n      opacity: 0\n    }} animate={{\n      opacity: 1,\n      boxShadow: [\"0 0 15px rgba(150, 100, 255, 0.3)\", \"0 0 25px rgba(150, 100, 255, 0.6)\", \"0 0 15px rgba(150, 100, 255, 0.3)\"]\n    }} transition={{\n      boxShadow: {\n        duration: 2,\n        repeat: Infinity,\n        ease: \"easeInOut\"\n      }\n    }} style={{\n      background: `linear-gradient(to right, rgba(80, 30, 120, 0.7), rgba(120, 40, 160, 0.7))`,\n      backdropFilter: \"blur(10px)\",\n      border: \"1px solid rgba(150, 100, 255, 0.3)\",\n      boxShadow: \"0 0 20px rgba(150, 100, 255, 0.4)\"\n    }}>\n        <div className=\"relative\">\n          <div className=\"absolute inset-0 flex items-center justify-center\">\n            <div className=\"w-full h-full rounded-full\" style={{\n            background: `radial-gradient(circle at center, rgba(150, 100, 255, ${0.1 + Math.min(scrollDepth / 1000, 0.4)}), rgba(100, 50, 200, 0))`,\n            filter: \"blur(8px)\",\n            animation: \"pulse 2s infinite\"\n          }} />\n          </div>\n          <span className=\"text-white tracking-widest text-sm font-light relative z-10\">TRANSMIT</span>\n        </div>\n      </motion.button>\n      \n      {}\n      <div className=\"fixed bottom-5 left-5 text-xs text-purple-300/50\">\n        <div className=\"flex items-center gap-2\">\n          <div className=\"w-2 h-2 rounded-full bg-purple-400/50 animate-pulse\" />\n          <span>VOID IDENTITY: {username}</span>\n        </div>\n      </div>\n      \n      {}\n      {scrollDepth > 50 && Date.now() - lastAlternateTime > 10000 && <motion.div className=\"fixed bottom-5 right-5 text-xs text-indigo-300/50\" animate={{\n      opacity: [0.3, 0.7, 0.3]\n    }} transition={{\n      duration: 3,\n      repeat: Infinity\n    }}>\n          Right-click to explore alternate dream layers\n        </motion.div>}\n      \n      <AnimatePresence>\n        {scrollDepth < 50 && <motion.div className=\"fixed top-1/3 left-1/2 transform -translate-x-1/2 -translate-y-1/2 text-center\" initial={{\n        opacity: 1\n      }} animate={{\n        opacity: 1 - scrollDepth / 50\n      }} exit={{\n        opacity: 0\n      }}>\n          <h1 className=\"text-6xl font-thin text-white tracking-widest mb-4\">VOIDSCAPE</h1>\n          <p className=\"text-gray-400 text-sm tracking-wider\">scroll to descend</p>\n        </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      \n      {}\n      \n      {}\n      {Math.random() < 0.03 + scrollDepth / 5000 && !activePopup && !blueScreenActive && !terminalError && <motion.div className=\"fixed z-20 cursor-pointer\" style={{\n      left: `${10 + Math.random() * 80}%`,\n      top: `${10 + Math.random() * 80}%`\n    }} initial={{\n      opacity: 0,\n      scale: 0\n    }} animate={{\n      opacity: 0.9,\n      scale: 1\n    }} exit={{\n      opacity: 0,\n      scale: 0\n    }} transition={{\n      duration: 0.8\n    }} onClick={() => window.open(\"https://pump.fun\", \"_blank\")} whileHover={{\n      scale: 1.2,\n      boxShadow: \"0 0 30px rgba(230, 100, 250, 0.5)\"\n    }}>\n          <div className=\"relative\">\n            <motion.div className=\"absolute w-full h-full rounded-full\" style={{\n          background: `radial-gradient(circle, rgba(200, 100, 255, 0.2) 0%, rgba(150, 50, 255, 0) 70%)`,\n          filter: \"blur(8px)\",\n          transform: \"scale(2)\"\n        }} animate={{\n          scale: [2, 3, 2],\n          opacity: [0.4, 0.7, 0.4]\n        }} transition={{\n          duration: 2,\n          repeat: Infinity,\n          ease: \"easeInOut\"\n        }} />\n            \n            <div className=\"bg-black/30 backdrop-blur-sm px-3 py-2 rounded-lg border border-purple-500/20\">\n              <div className=\"text-xs text-fuchsia-300/70 mb-1\">Hidden Fragment Detected</div>\n              <div className=\"flex items-center gap-2\">\n                <span className=\"text-lg\">⚡</span>\n                <span className=\"text-transparent bg-clip-text bg-gradient-to-r from-pink-400 to-purple-500 text-xs\">\n                  void.coin\n                </span>\n              </div>\n            </div>\n          </div>\n        </motion.div>}\n      \n      {}\n      {Math.random() < 0.01 + scrollDepth / 10000 && !activePopup && !blueScreenActive && !terminalError && <motion.div className=\"fixed z-20\" style={{\n      left: `${10 + Math.random() * 80}%`,\n      top: `${10 + Math.random() * 80}%`,\n      pointerEvents: \"none\"\n    }} initial={{\n      opacity: 0\n    }} animate={{\n      opacity: [0, 0.7, 0],\n      filter: [\"blur(5px)\", \"blur(0px)\", \"blur(5px)\"]\n    }} transition={{\n      duration: 3\n    }}>\n          <div className=\"text-fuchsia-300/70 text-xs font-glitch tracking-widest\">\n            pump.void\n          </div>\n        </motion.div>}\n      \n      {}\n      {secretSymbolVisible && <motion.div className=\"fixed cursor-pointer z-50\" style={{\n      left: `${25 + Math.sin(Date.now() / 5000) * 5}%`,\n      top: `${40 + Math.cos(Date.now() / 5000) * 5}%`\n    }} initial={{\n      opacity: 0,\n      scale: 0\n    }} animate={{\n      opacity: secretHovered ? 0.9 : 0.3,\n      scale: secretHovered ? 1.2 : 1,\n      rotate: [0, 360]\n    }} exit={{\n      opacity: 0,\n      scale: 0\n    }} transition={{\n      opacity: {\n        duration: 1\n      },\n      scale: {\n        duration: 0.5\n      },\n      rotate: {\n        duration: 20,\n        repeat: Infinity,\n        ease: \"linear\"\n      }\n    }} onMouseEnter={() => setSecretHovered(true)} onMouseLeave={() => setSecretHovered(false)} onClick={() => window.open(\"https://pump.fun\", \"_blank\")}>\n          <div className=\"text-4xl relative\">\n            <div className=\"absolute inset-0 blur-md text-purple-500 opacity-70\">⚡</div>\n            <div className=\"relative text-fuchsia-400\">⚡</div>\n          </div>\n          {secretHovered && <motion.div className=\"absolute top-full left-1/2 transform -translate-x-1/2 mt-2 whitespace-nowrap\" initial={{\n        opacity: 0,\n        y: -5\n      }} animate={{\n        opacity: 1,\n        y: 0\n      }}>\n              <div className=\"bg-black/40 backdrop-blur-sm px-2 py-1 rounded text-fuchsia-300/80 text-xs\">\n                Voidscape Token Gateway\n              </div>\n            </motion.div>}\n        </motion.div>}\n      \n      <AnimatePresence>\n        {whisperPlaying && <motion.div className=\"fixed text-white/20 text-sm tracking-widest\" initial={{\n        opacity: 0,\n        x: \"-50%\",\n        y: \"-50%\"\n      }} animate={{\n        opacity: 0.7\n      }} exit={{\n        opacity: 0\n      }} style={{\n        left: `${Math.random() * 70 + 15}%`,\n        top: `${Math.random() * 70 + 15}%`,\n        transform: \"translate(-50%, -50%)\"\n      }} transition={{\n        duration: 2\n      }}>\n          {[\"nothing is everything\", \"infinite descent\", \"the void gazes back\", \"beyond time\", \"between dimensions\"][Math.floor(Math.random() * 5)]}\n        </motion.div>}\n      </AnimatePresence>\n      \n      {Array.from({\n      length: 20\n    }).map((_, i) => {\n      const visible = scrollDepth > i * 40;\n      if (!visible) return null;\n      return <motion.div key={`symbol-${i}`} className=\"fixed text-white/10 text-2xl\" initial={{\n        opacity: 0\n      }} animate={{\n        opacity: [0, 0.2, 0],\n        rotate: Math.random() > 0.5 ? [0, 180] : [0, -180]\n      }} style={{\n        left: `${Math.random() * 90 + 5}%`,\n        top: `${Math.random() * 90 + 5}%`\n      }} transition={{\n        opacity: {\n          duration: 8,\n          repeat: Infinity,\n          repeatType: \"reverse\"\n        },\n        rotate: {\n          duration: 20,\n          repeat: Infinity,\n          ease: \"linear\"\n        }\n      }}>\n          {[\"◎\", \"◉\", \"◯\", \"⦿\", \"⊛\", \"⊗\", \"⊕\", \"∞\", \"⋇\", \"✧\"][i % 10]}\n        </motion.div>;\n    })}\n      \n      {}\n      {}\n      {scrollDepth > 100 && Math.random() > 0.7 && null}\n      \n      {}\n      {tweets.filter(Boolean).map((tweet, i) => {\n      if (!tweet || !tweet.depth || !tweet.position) return null;\n      const isVisible = Math.abs(scrollDepth - tweet.depth) < 20;\n      if (!isVisible) return null;\n      const opacity = 1 - Math.abs(scrollDepth - tweet.depth) / 20;\n      const ageInDays = (Date.now() - (tweet.timestamp || Date.now())) / (1000 * 60 * 60 * 24);\n      const corruptionLevel = Math.min(ageInDays * 0.2, 0.8);\n      const distortionLevel = Math.min(scrollDepth / 500, 0.8);\n      const spaceCoord = `${(tweet.position.x / 10).toFixed(1)}/${(tweet.position.y / 10).toFixed(1)}`;\n      const timeCoord = new Date(tweet.timestamp || Date.now()).toISOString().substring(0, 10).replace(/-/g, '');\n      return <motion.div key={`tweet-${i}`} className=\"fixed text-white text-sm w-64\" initial={{\n        opacity: 0,\n        scale: 0.9,\n        filter: 'blur(5px)'\n      }} animate={{\n        opacity: opacity * 0.8,\n        scale: 1,\n        filter: 'blur(0px)'\n      }} transition={{\n        duration: 0.5\n      }} style={{\n        left: `${tweet.position.x}%`,\n        top: `${tweet.position.y}%`,\n        textShadow: `0 0 8px rgba(${50 + Math.random() * 50}, ${30 + Math.random() * 30}, ${100 + Math.random() * 100}, 0.7)`,\n        transform: distortionLevel > 0.3 ? `rotate(${(Math.random() - 0.5) * distortionLevel * 5}deg)` : 'none'\n      }} whileHover={{\n        scale: 1.05,\n        boxShadow: \"0 0 20px rgba(100, 50, 150, 0.3)\"\n      }}>\n            <div className=\"p-3 backdrop-blur-sm bg-black/20 border border-white/10 rounded-lg\">\n              {}\n              <div className=\"flex justify-between text-xs mb-1\">\n                <div className=\"text-white/50 tracking-wider\">\n                  {tweet.voidSignature}\n                </div>\n                <div className=\"text-indigo-400/70\">\n                  DEPTH: {Math.floor(tweet.depth)}\n                </div>\n              </div>\n              \n              <div className=\"text-purple-300/50 text-xs mb-2 font-mono tracking-widest\">\n                SPACETIME: {spaceCoord}/{timeCoord}\n              </div>\n              \n              {}\n              <div className=\"tracking-wide relative\">\n                {}\n                <div className=\"absolute inset-0 opacity-30 mix-blend-overlay\" style={{\n              background: `radial-gradient(circle at ${50 + Math.sin(Date.now() / 3000) * 30}% ${50 + Math.cos(Date.now() / 4000) * 30}%, rgba(150, 100, 255, 0.2), transparent 70%)`\n            }} />\n                \n                {}\n                {tweet.message.split('').map((char, idx) => {\n              const isCorrupted = Math.random() < corruptionLevel * 0.5;\n              if (isCorrupted) {\n                return <span key={idx} className=\"text-white/30\">\n                        {['¿', '§', '×', 'Æ', '¤', '»', '«', '†', 'ƒ'][Math.floor(Math.random() * 9)]}\n                      </span>;\n              }\n              return <span key={idx} className={Math.random() < 0.1 ? \"text-white/30\" : \"\"} style={{\n                textShadow: idx % 5 === 0 ? `0 0 5px rgba(150, 100, 255, 0.7)` : 'none'\n              }}>\n                      {char}\n                    </span>;\n            })}\n              </div>\n            </div>\n          </motion.div>;\n    })}\n      \n      <AnimatePresence>\n        {tweetBoxOpen && <motion.div className=\"fixed bottom-20 right-8 w-80 bg-black/50 backdrop-blur-md border border-white/10 p-4 rounded-lg\" initial={{\n        opacity: 0,\n        y: 20\n      }} animate={{\n        opacity: 1,\n        y: 0\n      }} exit={{\n        opacity: 0,\n        y: 20\n      }} transition={{\n        duration: 0.3\n      }}>\n          <div className=\"text-white/70 text-xs mb-2 tracking-wider\">TRANSMIT TO THE VOID</div>\n          <textarea value={tweetInput} onChange={e => setTweetInput(e.target.value)} placeholder=\"type your transmission...\" className=\"w-full bg-black/40 border border-white/10 text-white p-2 rounded-md mb-2 h-20 resize-none focus:outline-none focus:border-white/30\" maxLength={120} />\n          <div className=\"flex justify-between items-center\">\n            <div className=\"text-white/50 text-xs\">\n              DEPTH: {Math.floor(scrollDepth)}\n            </div>\n            <motion.button className=\"bg-white/10 hover:bg-white/20 text-white/80 px-4 py-1 text-xs rounded-md transition duration-300\" whileHover={{\n            scale: 1.05\n          }} whileTap={{\n            scale: 0.95\n          }} onClick={() => {\n            if (tweetInput.trim()) {\n              const voidSignature = `V-${Math.floor(Math.random() * 9999).toString().padStart(4, '0')}`;\n              const tweetId = `tweet-${Date.now()}-${Math.floor(Math.random() * 10000)}`;\n              const newTweet = {\n                id: tweetId,\n                message: tweetInput,\n                depth: scrollDepth,\n                timestamp: Date.now(),\n                voidSignature,\n                position: {\n                  x: Math.random() * 70 + 15,\n                  y: Math.random() * 70 + 15\n                }\n              };\n              client.createEntity('voidTweets', newTweet).then(() => {\n                setTweets(prev => [...prev, newTweet]);\n                fetchAllTweets();\n                playRandomWhisper();\n              }).catch(err => {\n                console.error(\"Failed to save transmission:\", err);\n                setCrypticMessage(\"Transmission failed...\");\n                setShowCrypticMessage(true);\n                setTimeout(() => setShowCrypticMessage(false), 3000);\n              });\n              setTweetInput(\"\");\n              setTweetBoxOpen(false);\n            }\n          }}>\n              TRANSMIT\n            </motion.button>\n          </div>\n        </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {showFace && <motion.div className=\"fixed z-40\" style={{\n        left: `${facePosition.x}%`,\n        top: `${facePosition.y}%`,\n        transform: \"translate(-50%, -50%)\",\n        filter: \"contrast(1.2) saturate(0.8) brightness(0.7)\"\n      }} initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.8\n      }} exit={{\n        opacity: 0\n      }}>\n            <img src={`https://cdn.dev.fun/12921de9d8efdc28b97d/face${Math.floor(Math.random() * 5) + 1}.png`} alt=\"\" className=\"w-40 h-40 object-cover mix-blend-difference\" style={{\n          transform: `scale(${0.8 + Math.random() * 0.4})`\n        }} />\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      <AnimatePresence>\n        {showStalker && <motion.div className=\"fixed z-40\" style={{\n        left: `${stalkerPosition.x}%`,\n        top: `${stalkerPosition.y}%`,\n        transform: \"translate(-50%, -50%)\",\n        filter: \"contrast(0.1) brightness(0.1)\"\n      }} initial={{\n        opacity: 0\n      }} animate={{\n        opacity: 0.7\n      }} exit={{\n        opacity: 0\n      }}>\n            <div className=\"w-20 h-40 bg-black rounded-t-full\" style={{\n          boxShadow: \"0 0 20px 5px rgba(0,0,0,0.5)\"\n        }} />\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      {cameraStream && <div className=\"fixed right-8 top-20 z-40 w-[300px] h-[200px] overflow-hidden\">\n          <video ref={cameraRef} autoPlay playsInline muted className=\"hidden\" />\n          <canvas ref={webcamCanvasRef} width=\"300\" height=\"200\" className=\"bg-black border border-gray-700 rounded-md\" style={{\n        opacity: 0.7,\n        filter: `hue-rotate(${Date.now() % 360}deg) contrast(1.5)`,\n        mixBlendMode: \"difference\"\n      }} />\n          <div className=\"absolute inset-0 pointer-events-none\" style={{\n        background: `radial-gradient(circle at center, transparent 30%, rgba(0,0,0,0.8) 100%)`\n      }} />\n        </div>}\n      \n      {}\n      <AnimatePresence>\n        {showCameraRequest && <motion.div className=\"fixed top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 z-50 w-80 bg-black/80 border border-red-900/50 p-4 rounded-md\" initial={{\n        opacity: 0,\n        scale: 0.9\n      }} animate={{\n        opacity: 1,\n        scale: 1\n      }} exit={{\n        opacity: 0,\n        scale: 0.9\n      }}>\n            <div className=\"text-red-500 font-bold mb-2 text-center\">VOIDSCAPE NEEDS TO SEE YOU</div>\n            <p className=\"text-white/70 text-sm mb-4\">The void requires visual confirmation. Allow access to continue your descent.</p>\n            <div className=\"flex justify-between\">\n              <button onClick={() => handleCameraRequest(false)} className=\"px-4 py-2 bg-gray-800 text-white/70 rounded hover:bg-gray-700\">\n                Deny\n              </button>\n              <button onClick={() => handleCameraRequest(true)} className=\"px-4 py-2 bg-red-900/70 text-white rounded hover:bg-red-800\">\n                Allow\n              </button>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n      \n      {}\n      {currentUniverse === \"etherExe\" && <div className=\"fixed inset-0 z-10 pointer-events-none\">\n          <div className=\"absolute w-full h-full opacity-30\">\n            <div className=\"absolute top-1/3 left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-96 h-96 rounded-full\" style={{\n          background: \"radial-gradient(circle, rgba(100,20,150,0.1) 0%, rgba(20,0,40,0) 70%)\",\n          animation: \"pulse 4s infinite\"\n        }}>\n            </div>\n            <div className=\"absolute top-1/3 left-1/2 transform -translate-x-1/2 -translate-y-1/2\">\n              <motion.div className=\"w-40 h-40 rounded-full overflow-hidden\" initial={{\n            opacity: 0.4\n          }} animate={{\n            opacity: [0.4, 0.7, 0.4]\n          }} transition={{\n            duration: 4,\n            repeat: Infinity\n          }}>\n                <img src=\"https://cdn.dev.fun/12921de9d8efdc28b97d/ai-face.png\" alt=\"\" className=\"w-full h-full object-cover mix-blend-screen\" />\n              </motion.div>\n            </div>\n          </div>\n        </div>}\n      \n      {}\n      {currentUniverse === \"ascension\" && <div className=\"fixed inset-0 z-5 pointer-events-none\">\n          <div className=\"absolute top-[80%] left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] rounded-full\" style={{\n        background: \"radial-gradient(circle, rgba(220,200,255,0.3) 0%, rgba(150,100,200,0) 70%)\",\n        animation: \"pulse 8s infinite\"\n      }}>\n          </div>\n          <div className=\"absolute top-[60%] left-1/2 transform -translate-x-1/2 -translate-y-1/2\">\n            <motion.div className=\"w-[400px] h-[400px] rounded-full overflow-hidden opacity-30\" animate={{\n          opacity: [0.3, 0.5, 0.3],\n          scale: [1, 1.1, 1]\n        }} transition={{\n          duration: 8,\n          repeat: Infinity\n        }}>\n              <div className=\"w-full h-full rounded-full\" style={{\n            background: \"radial-gradient(circle, rgba(255,255,255,0.8) 0%, rgba(200,180,255,0.2) 40%, rgba(100,50,200,0) 70%)\",\n            boxShadow: \"0 0 100px 50px rgba(200,180,255,0.3)\"\n          }} />\n            </motion.div>\n          </div>\n        </div>}\n      \n      {}\n      <motion.div className=\"fixed cursor-pointer z-40\" style={{\n      right: '20px',\n      bottom: '20px'\n    }} initial={{\n      opacity: 0,\n      scale: 0\n    }} animate={{\n      opacity: 0.9,\n      scale: [1, 1.1, 1],\n      filter: ['drop-shadow(0 0 8px rgba(150,100,255,0.4))', 'drop-shadow(0 0 15px rgba(150,100,255,0.7))', 'drop-shadow(0 0 8px rgba(150,100,255,0.4))']\n    }} transition={{\n      scale: {\n        duration: 4,\n        repeat: Infinity,\n        ease: \"easeInOut\"\n      },\n      filter: {\n        duration: 3,\n        repeat: Infinity,\n        ease: \"easeInOut\"\n      }\n    }} whileHover={{\n      scale: 1.3,\n      filter: 'drop-shadow(0 0 20px rgba(100,200,255,0.8))'\n    }} onClick={() => window.open(\"https://x.com/voidscapesolana\", \"_blank\")}>\n        <div className=\"relative bg-black/30 backdrop-blur-md p-2 rounded-full border border-purple-500/20\">\n          <motion.div className=\"absolute inset-0 rounded-full\" style={{\n          background: 'radial-gradient(circle, rgba(100,150,255,0.2) 0%, rgba(150,100,255,0) 70%)'\n        }} animate={{\n          scale: [1, 1.5, 1],\n          opacity: [0.3, 0.7, 0.3]\n        }} transition={{\n          duration: 3,\n          repeat: Infinity,\n          ease: \"easeInOut\"\n        }} />\n          <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" className=\"text-white/80\">\n            <path fill=\"currentColor\" d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\" />\n          </svg>\n        </div>\n      </motion.div>\n      \n      {}\n      <AnimatePresence>\n        {secretSymbolVisible && <motion.div className=\"fixed cursor-pointer\" style={{\n        left: `${25 + Math.sin(Date.now() / 5000) * 5}%`,\n        top: `${40 + Math.cos(Date.now() / 5000) * 5}%`,\n        zIndex: 100\n      }} initial={{\n        opacity: 0,\n        scale: 0\n      }} animate={{\n        opacity: secretHovered ? 0.9 : 0.3,\n        scale: secretHovered ? 1.2 : 1,\n        rotate: [0, 360]\n      }} exit={{\n        opacity: 0,\n        scale: 0\n      }} transition={{\n        opacity: {\n          duration: 1\n        },\n        scale: {\n          duration: 0.5\n        },\n        rotate: {\n          duration: 20,\n          repeat: Infinity,\n          ease: \"linear\"\n        }\n      }} onMouseEnter={() => setSecretHovered(true)} onMouseLeave={() => setSecretHovered(false)} onClick={() => window.open(\"https://pump.fun\", \"_blank\")}>\n            <div className=\"text-4xl relative\">\n              <div className=\"absolute inset-0 blur-md text-purple-500 opacity-70\">⚡</div>\n              <div className=\"relative text-fuchsia-400\">⚡</div>\n            </div>\n          </motion.div>}\n      </AnimatePresence>\n    </div>;\n}","{\"dependencies\":{\"react\":\"18.2.0\",\"framer-motion\":\"10.16.4\",\"@devfunlabs/web-sdk\":\"0.2.2\",\"lucide-react\":\"0.441.0\",\"@devfunlabs/state-client\":\"0.8.1\",\"socket.io-client\":\"4.7.1\"}}","thinking","The user has provided a contract address (CA) in the latest requirement: `47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump`\n\nBased on the previous conversation history, I see that the app has a feature to track market cap. Looking at this code section:\n\n```javascript\nconst fetchPumpFunMarketCap = async () => {\n  try {\n    let tokenInfo;\n    if (customTokenAddress) {\n      tokenInfo = await fetchTokenInfoByAddress(customTokenAddress);\n      if (tokenInfo && tokenInfo.symbol) {\n        setTokenSymbol(tokenInfo.symbol);\n      }\n    } else {\n      tokenInfo = await fetchTokenInfoBySymbol(\"PUMP\");\n    }\n    if (tokenInfo && tokenInfo.marketcap) {\n      setMarketCap(tokenInfo.marketcap);\n    } else {\n      setMarketCap(prev => {\n        const change = Math.random() > 0.7 ? Math.random() * 500 : Math.random() * 100;\n        return prev + change;\n      });\n    }\n  } catch (error) {\n    console.error(\"Failed to fetch market cap:\", error);\n    setMarketCap(prev => {\n      const change = Math.random() > 0.7 ? Math.random() * 500 : Math.random() * 100;\n      return prev + change;\n    });\n  }\n};\n```\n\nThe app allows users to input a custom token address to track its market cap. The provided CA should be set as the default value for `customTokenAddress` so that the app automatically tracks the market cap for that token instead of defaulting to \"PUMP\".\n\nAdditionally, I should make sure this custom token address is saved to localStorage so it persists between sessions.\n\nLet's implement these changes:\n\n1. Update the `customTokenAddress` state initialization to use the provided CA\n2. Make sure this address is automatically used to fetch the market cap\n3. Save it to localStorage early for persistence\n\nThe changes need to be implemented in the existing code.","changelog","Updated the app to automatically use the voidscape token contract address (47jE2NDAZQjvZyKER3BdYdcHjxWtfVdStP3ESg92pump) for market cap tracking! Now the void gazes directly into your token's financial dimension.","diff","isRephrased","isDebug","isSuccess","error","messageId",["B","121389"],"isDraft",[137],"👑","isLordOfDev","analytics",[141,145,147,149,151,153,155,157,159,161,163,165,167,169],{"_142":143,"_144":56},"day","2025-04-14","runCount",{"_142":146,"_144":56},"2025-04-15",{"_142":148,"_144":56},"2025-04-16",{"_142":150,"_144":56},"2025-04-17",{"_142":152,"_144":56},"2025-04-18",{"_142":154,"_144":56},"2025-04-19",{"_142":156,"_144":56},"2025-04-20",{"_142":158,"_144":56},"2025-04-21",{"_142":160,"_144":56},"2025-04-22",{"_142":162,"_144":56},"2025-04-23",{"_142":164,"_144":56},"2025-04-24",{"_142":166,"_144":56},"2025-04-25",{"_142":168,"_144":56},"2025-04-26",{"_142":170,"_144":59},"2025-04-27","https://cdn.dev.fun/og/image/fae349f1a52746955e02/45fd0974.webp","commitDetail","actionData","errors"]
</article></body></html>