Project: https://playblackout.xyz

Redesign the BLACKOUT website (repo identity-md-launches/launch-1263-build-pre-launch-website-blackout, current live version) into a premium, atmospheric pixel-art game site. Keep every existing feature, route and contract call working exactly as now (packs, buy with ETH, reveal, farm placement, rewards claim, starter claim, free packs). This is a visual and UX upgrade plus one reliability fix, not a logic rewrite.

VISUAL DIRECTION

• Reference mood: dark fantasy pixel-art game landing pages (one full-screen illustration, one accent color, huge pixel logo, lots of air, minimal nav).
• Hero art: download https://i.postimg.cc/bq6SbGFD/a5a23cb0-247c-4dcc-8bb1-f9615571b741.jpg and commit it into the repo assets (do not hotlink). Night cyberpunk city in a blackout, hooded Dispatcher on a rooftop next to a glowing server rack. Use it full-bleed on Home, 100vh, object-fit cover, focal point on the right (Dispatcher and server rack must stay visible on mobile), image-rendering: pixelated. Dark gradient on the left third for text.
• Hero text on the left: big pixel logo "BLACKOUT", tagline "The city went dark. Your farm didn't.", one primary button "Buy a pack" (yellow #FFE600, black text, hard pixel shadow) and one ghost button "Claim free pack".
• Palette: background #070A14, panels #0E1324 with 1px #1E2A4A borders, accent yellow #FFE600 for primary actions only, cyan #39E6FF for live data and glows, magenta #FF3DF2 for rarity and rare highlights. Pixel display font for headings, clean mono for numbers.
• Subtle life, all CSS/canvas, cheap: random window flicker over the hero (absolutely positioned glowing pixels), occasional spark burst at the transformer on the power pole, slow drifting smog, faint CRT scanline overlay at 4% opacity. Respect prefers-reduced-motion.

PUBLIC DATA BEFORE WALLET CONNECT (most important)

Every page must look alive without a wallet. Read-only from chain, shown on Home under the hero and on Rewards:

• Reward pool size (tokens and approx ETH value if already computed in the app).
• Current epoch number and a live countdown to epoch end.
• Current pack price in ETH.
• Live feed of the latest pack purchases and reveals (address shortened, rarity colored), from PackSale events, newest first, last 20.
• Top 10 farms by hashrate.
• Total farms, total packs opened. Large numbers as neon cyan stat tiles, feed as a scrolling terminal-style list.

Connect wallet only unlocks personal panels (my farm, my items, claim).

PACK OPENING

• Pack card with idle hover tilt and glow.
• On reveal: screen shake, white flash, 3 item cards fly out and flip one by one; card border and glow by rarity (Common gray, Rare cyan, Epic magenta, Legendary yellow, Mythic animated rainbow). Sound off by default with a toggle.

LAYOUT

• Top nav: logo left, Home, Packs, Farm, Rewards, Docs, Connect button right. Transparent over hero, solid on scroll. Mobile: burger menu.
• Remove the "City connection" bar and the "Start mining 0 of 3" bar from the top of every page. Show onboarding steps only inside the Farm page for connected users with an empty farm. Show connection status as a small dot in the footer.
• Farm page: rooms drawn as a pixel cross-section of a building floor, items placed as sprites in slots, fans spinning when the farm is mining.
• Mobile first: 16px gutter, no horizontal scroll, hero text readable on 375px.

RELIABILITY FIX

• The status currently hangs on "Connecting…". Read calls must race all configured RPCs (rpc.mainnet.chain.robinhood.com, robinhood.drpc.org, robinhood-rpc.publicnode.com) with a 4s timeout each, use the first good answer, cache the last good data and render it immediately on load, then refresh every 15s. Never block the UI on RPC.

ACCEPTANCE

• Lighthouse performance 80+ on mobile; hero image optimized (WebP plus JPG fallback) with a dark placeholder.
• All existing flows tested on the live contracts in read mode; write flows unchanged.
• Screenshots of Home, Packs, Farm and Rewards at 375px and 1440px in the PR.