[V0_FILE]typescriptreact:file="app/page.tsx" isMerged="true" import { Navigation } from "@/components/navigation" import { HeroSection } from "@/components/hero-section" import { TokenInfo } from "@/components/token-info" import { Timeline } from "@/components/timeline" import { SubscriptionTiers } from "@/components/subscription-tiers" import { Tokenomics } from "@/components/tokenomics" import { Highlights } from "@/components/highlights" import { Roadmap } from "@/components/roadmap" import { ParticipationSteps } from "@/components/participation-steps" import { RiskWarning } from "@/components/risk-warning" import { Faq } from "@/components/faq" import { Footer } from "@/components/footer" import { FloatingElements } from "@/components/floating-elements" import { ParticleBackground } from "@/components/particle-background" export default function Home() { return (

) } [V0_FILE]typescriptreact:file="components/navigation.tsx" isMerged="true" "use client" import { useState } from "react" import Image from "next/image" import Link from "next/link" import { Menu, X } from "lucide-react" import { WalletConnect } from "./wallet-connect" import { motion } from "framer-motion" export function Navigation() { const [isOpen, setIsOpen] = useState(false) const navItems = [ { name: "About", href: "#about" }, { name: "Token", href: "#token-info" }, { name: "Timeline", href: "#timeline" }, { name: "Subscription", href: "#subscription" }, { name: "Tokenomics", href: "#tokenomics" }, { name: "Roadmap", href: "#roadmap" }, { name: "FAQ", href: "#faq" }, ] return (

{/* Desktop Navigation */}

{navItems.map((item) => ( {item.name} ))}

{/* Mobile Navigation Toggle */}

{/* Mobile Navigation Menu */} {isOpen && (

{navItems.map((item) => ( setIsOpen(false)} className="text-gray-300 hover:text-[#00FF9D] py-2 transition-colors" > {item.name} ))}

)}

) } [V0_FILE]typescriptreact:file="components/wallet-connect.tsx" isMerged="true" "use client" import { useState } from "react" import { Button } from "@/components/ui/button" import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog" import { motion } from "framer-motion" import { Wallet } from "lucide-react" interface WalletConnectProps { isMobile?: boolean } export function WalletConnect({ isMobile = false }: WalletConnectProps) { const [isOpen, setIsOpen] = useState(false) const [isConnected, setIsConnected] = useState(false) const [walletAddress, setWalletAddress] = useState("") const wallets = [ { name: "MetaMask", icon: "/placeholder.svg?height=40&width=40" }, { name: "WalletConnect", icon: "/placeholder.svg?height=40&width=40" }, { name: "Coinbase Wallet", icon: "/placeholder.svg?height=40&width=40" }, { name: "Trust Wallet", icon: "/placeholder.svg?height=40&width=40" }, ] const handleConnect = (walletName: string) => { // Simulate wallet connection setTimeout(() => { setWalletAddress("0x1234...5678") setIsConnected(true) setIsOpen(false) }, 1000) } const handleDisconnect = () => { setIsConnected(false) setWalletAddress("") } return ( <> ) } [V0_FILE]typescriptreact:file="components/hero-section.tsx" isEdit="true" isMerged="true" "use client" import { useEffect, useRef } from "react" import Image from "next/image" import { motion } from "framer-motion" import { Button } from "@/components/ui/button" import { ChevronRight } from "lucide-react" export function HeroSection() { const canvasRef = useRef(null) useEffect(() => { const canvas = canvasRef.current if (!canvas) return const ctx = canvas.getContext("2d") if (!ctx) return canvas.width = canvas.offsetWidth canvas.height = canvas.offsetHeight // Create anime-style speed lines const lines: { x: number; y: number; length: number; speed: number; width: number; color: string }[] = [] for (let i = 0; i < 50; i++) { lines.push({ x: Math.random() * canvas.width, y: Math.random() * canvas.height, length: Math.random() * 100 + 50, speed: Math.random() * 5 + 1, width: Math.random() * 2 + 0.5, color: `rgba(${Math.random() * 100 + 155}, ${Math.random() * 100 + 155}, 255, ${Math.random() * 0.5 + 0.1})`, }) } const animate = () => { ctx.clearRect(0, 0, canvas.width, canvas.height) lines.forEach((line) => { ctx.beginPath() ctx.moveTo(line.x, line.y) ctx.lineTo(line.x - line.length, line.y) ctx.lineWidth = line.width ctx.strokeStyle = line.color ctx.stroke() line.x += line.speed if (line.x > canvas.width + line.length) { line.x = -line.length line.y = Math.random() * canvas.height } }) requestAnimationFrame(animate) } animate() const handleResize = () => { canvas.width = canvas.offsetWidth canvas.height = canvas.offsetHeight } window.addEventListener("resize", handleResize) return () => { window.removeEventListener("resize", handleResize) } }, []) return (

新一代去中心化金融基础设施

Hopper IDO:
革新DeFi生态

通过创新的混合做市机制和先进的MPC钱包技术，为用户提供一站式的跨链资产管理解决方案。

{[1, 2, 3, 4].map((i) => (

))}

2,500+ 用户已加入

{/* Glow effects */}

{/* Floating geometric shapes */}

) } [V0_FILE]typescriptreact:file="components/token-info.tsx" isEdit="true" isMerged="true" "use client" import { motion } from "framer-motion" import { Card, CardContent } from "@/components/ui/card" import { Coins, Clock, Users, BarChart3, Zap, Globe } from "lucide-react" export function TokenInfo() { const tokenDetails = [ { icon: , title: "代币名称", value: "Hopper Token (HPR)", }, { icon: , title: "发行价格", value: "0.1 USDT", }, { icon: , title: "总供应量", value: "10亿 HPR", }, { icon: , title: "IDO额度", value: "5000万 HPR (5%)", }, { icon: , title: "代币标准", value: "Solana SPL Token", }, { icon: , title: "初始市值", value: "860万 USDT", }, ] return (

代币信息

关于Hopper代币和即将到来的IDO的所有信息

{tokenDetails.map((detail, index) => (

{detail.icon}

{detail.title}

{detail.value}

{/* Anime-style glow effect on hover */}

))}

初始流通量构成

初始流通量

8600万 HPR

总供应量的8.6%

IDO解锁

2500万 HPR

IDO总量50% TGE释放

初始流动性

3000万 HPR

流动性储备20%，第一季度释放

) } [V0_FILE]typescriptreact:file="components/timeline.tsx" isEdit="true" isMerged="true" "use client" import { useEffect, useRef } from "react" import { motion, useAnimation } from "framer-motion" import { useInView } from "react-intersection-observer" import { CheckCircle, Clock } from "lucide-react" export function Timeline() { const controls = useAnimation() const [ref, inView] = useInView({ threshold: 0.2, triggerOnce: true }) const canvasRef = useRef(null) useEffect(() => { if (inView) { controls.start("visible") } }, [controls, inView]) useEffect(() => { const canvas = canvasRef.current if (!canvas) return const ctx = canvas.getContext("2d") if (!ctx) return canvas.width = canvas.offsetWidth canvas.height = canvas.offsetHeight // Create energy flow effect const particles: { x: number; y: number; size: number; speed: number; color: string }[] = [] for (let i = 0; i < 100; i++) { particles.push({ x: Math.random() * canvas.width, y: Math.random() * canvas.height, size: Math.random() * 3 + 1, speed: Math.random() * 2 + 0.5, color: `rgba(${Math.random() * 100 + 155}, ${Math.random() * 255}, 157, ${Math.random() * 0.5 + 0.2})`, }) } const animate = () => { ctx.clearRect(0, 0, canvas.width, canvas.height) particles.forEach((particle) => { ctx.beginPath() ctx.arc(particle.x, particle.y, particle.size, 0, Math.PI * 2) ctx.fillStyle = particle.color ctx.fill() particle.y -= particle.speed if (particle.y < 0) { particle.y = canvas.height particle.x = Math.random() * canvas.width } }) requestAnimationFrame(animate) } animate() const handleResize = () => { canvas.width = canvas.offsetWidth canvas.height = canvas.offsetHeight } window.addEventListener("resize", handleResize) return () => { window.removeEventListener("resize", handleResize) } }, []) const timelineEvents = [ { date: "2025年3月1日", title: "白名单注册开始", description: "早期支持者可以注册白名单以确保在IDO中的位置。", status: "completed", }, { date: "2025年3月7日", title: "白名单注册结束", description: "IDO开始前注册白名单的最后机会。", status: "completed", }, { date: "2025年3月10日", title: "白名单公布", description: "成功入选白名单的参与者将通过电子邮件得到通知。", status: "current", }, { date: "2025年3月14日", title: "IDO前AMA会议", description: "Hopper团队将举行直播AMA，回答IDO前的所有问题。", status: "upcoming", }, { date: "2025年3月15日", title: "IDO启动", description: "Hopper代币IDO在多个发射台正式启动。", status: "upcoming", }, { date: "2025年3月16日", title: "DEX上线", description: "Hopper代币将在主要去中心化交易所上线交易。", status: "upcoming", }, ] const containerVariants = { hidden: { opacity: 0 }, visible: { opacity: 1, transition: { staggerChildren: 0.3, }, }, } const itemVariants = { hidden: { opacity: 0, y: 20 }, visible: { opacity: 1, y: 0, transition: { duration: 0.5 }, }, } return (

IDO时间表

Hopper代币发行的关键日期和里程碑

{/* Timeline line */}

{timelineEvents.map((event, index) => ( {/* Timeline dot */}

{event.status === "completed" ? (

) : event.status === "current" ? (

) : (

)}

{/* Content */}

{event.date}

{event.title}

{event.description}

))}

) } [V0_FILE]typescriptreact:file="components/subscription-tiers.tsx" isEdit="true" isMerged="true" "use client" import { motion } from "framer-motion" import { Card, CardContent, CardHeader } from "@/components/ui/card" import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table" import { Shield, Zap, Crown } from "lucide-react" export function SubscriptionTiers() { const tiers = [ { name: "铜牌", icon: , color: "#CD7F32", requirements: "质押 1,000 SOL", allocation: "$5,000", lockPeriod: "3个月", character: "/placeholder.svg?height=120&width=100", }, { name: "银牌", icon: , color: "#C0C0C0", requirements: "质押 5,000 SOL", allocation: "$20,000", lockPeriod: "2个月", character: "/placeholder.svg?height=120&width=100", }, { name: "金牌", icon: , color: "#FFD700", requirements: "质押 10,000 SOL", allocation: "$50,000", lockPeriod: "1个月", character: "/placeholder.svg?height=120&width=100", }, ] return (

认购层级

选择您的层级，确保在Hopper IDO中的分配

{tiers.map((tier, index) => (

{tier.icon}

{tier.name}

质押要求

{tier.requirements}

认购上限

{tier.allocation}

锁定期

{tier.lockPeriod}

))}

代币解锁机制

解锁阶段解锁比例解锁时间首次解锁 50% TGE时释放剩余解锁 50% 6个月线性释放解锁频率每月解锁一次

) } [V0_FILE]typescriptreact:file="components/tokenomics.tsx" isEdit="true" isMerged="true" "use client" import { useState } from "react" import { motion } from "framer-motion" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { PieChart, Pie, Cell, ResponsiveContainer, Tooltip } from "@/components/ui/chart" export function Tokenomics() { const [activeTab, setActiveTab] = useState("distribution") const distributionData = [ { name: "DID流动性挖矿", value: 30, color: "#00FF9D" }, { name: "生态建设", value: 20, color: "#6B46C1" }, { name: "团队", value: 20, color: "#3182CE" }, { name: "流动性", value: 15, color: "#805AD5" }, { name: "融资", value: 10, color: "#4FD1C5" }, { name: "空投", value: 5, color: "#F6AD55" }, ] const lockupData = [ { category: "团队份额", details: "TGE后锁定1年，之后48个月线性释放", }, { category: "生态基金", details: "按里程碑释放，由社区治理决定", }, { category: "DID挖矿", details: "36个月线性释放，每月释放一次", }, { category: "流动性", details: "按季度动态释放，根据市场需求调整", }, { category: "空投", details: "第一阶段（2%）：TGE时一次性释放，吸引早期用户。第二阶段（3%）：根据用户活跃度和贡献度，分12个月线性释放", }, { category: "融资", details: [ "IDO 5%：TGE时释放50%，剩余50%分6个月线性释放", "种子轮2%：TGE时释放25%，剩余75%锁定1年后分12个月线性释放", "机构轮3%：TGE时释放20%，剩余80%锁定1年后分24个月线性释放", ], }, ] const CustomTooltip = ({ active, payload }: any) => { if (active && payload && payload.length) { return (

{`${payload[0].name}: ${payload[0].value}%`}

) } return null } return (

代币经济

Hopper代币分配和锁仓计划的详细信息

代币分配锁仓计划

{distributionData.map((entry, index) => ( ))} } /> {/* Anime-style glow effect */}

{distributionData.map((item) => (

{item.name}

{item.value}%

))}

{lockupData.map((item, index) => (

{item.category}

{Array.isArray(item.details) ? (

{detail}

) : (

{item.details}

)}

))}

) } [V0_FILE]typescriptreact:file="components/highlights.tsx" isEdit="true" isMerged="true" "use client" import { motion } from "framer-motion" import { Card, CardContent } from "@/components/ui/card" import { Cpu, Shield, Zap, Globe, BarChart3, Users } from "lucide-react" export function Highlights() { const highlights = [ { icon: , title: "创新混合做市机制", description: "结合AMM和CLMM，优化流动性效率和交易体验。", }, { icon: , title: "MPC钱包安全架构", description: "采用多方计算技术，提供高安全性的资产管理解决方案。", }, { icon: , title: "多链资产聚合交易", description: "支持跨多个区块链的资产交易和管理。", }, { icon: , title: "全链生态布局", description: "构建覆盖主流公链的DeFi生态系统。", }, { icon: , title: "AI驱动的风控系统", description: "利用人工智能技术优化风险管理和决策过程。", }, { icon: , title: "专业运营团队", description: "由经验丰富的区块链和金融专家组成的核心团队。", }, ] const roadmap = [ { quarter: "Q1 2025", items: ["Hopper DEX主网上线", "跨链桥接功能发布", "MPC钱包测试版"], }, { quarter: "Q2 2025", items: ["机构API服务", "全球市场扩张", "生态基金启动"], }, { quarter: "Q3 2025", items: ["DAO治理上线", "创新DeFi产品", "全球社区建设"], }, { quarter: "Q4 2025", items: ["生态应用孵化", "机构服务升级", "创新产品矩阵"], }, ] const containerVariants = { hidden: { opacity: 0 }, visible: { opacity: 1, transition: { staggerChildren: 0.1, }, }, } const itemVariants = { hidden: { opacity: 0, y: 20 }, visible: { opacity: 1, y: 0, transition: { duration: 0.5 }, }, } return (

项目亮点

探索Hopper在DeFi领域的革命性创新

{highlights.map((highlight, index) => (

{highlight.icon}

{highlight.title}

{highlight.description}

{/* Anime-style speed lines on hover */}

{[...Array(10)].map((_, i) => (

))}

发展路线

{roadmap.map((quarter, index) => (

{quarter.quarter}

{item}

))}

) } [V0_FILE]typescriptreact:file="components/roadmap.tsx" isEdit="true" isMerged="true" "use client" import { motion } from "framer-motion" import { Card, CardContent } from "@/components/ui/card" export function Roadmap() { const roadmapItems = [ { quarter: "2025年第一季度", title: "基础阶段", items: ["Hopper DEX主网上线", "跨链桥接功能发布", "MPC钱包测试版"], status: "upcoming", }, { quarter: "2025年第二季度", title: "扩展阶段", items: ["机构API服务", "全球市场扩张", "生态基金启动"], status: "upcoming", }, { quarter: "2025年第三季度", title: "创新阶段", items: ["DAO治理上线", "创新DeFi产品", "全球社区建设"], status: "upcoming", }, { quarter: "2025年第四季度", title: "生态系统阶段", items: ["生态应用孵化", "机构服务升级", "创新产品矩阵"], status: "upcoming", }, ] const containerVariants = { hidden: { opacity: 0 }, visible: { opacity: 1, transition: { staggerChildren: 0.2, }, }, } const itemVariants = { hidden: { opacity: 0, y: 20 }, visible: { opacity: 1, y: 0, transition: { duration: 0.5 }, }, } return (

发展路线图

我们的发展和增长战略计划

{roadmapItems.map((item, index) => (

{item.quarter}

{item.title}

{listItem}

{/* Manga panel style border */}

))} {/* Energy flow connection */}

) } [V0_FILE]typescriptreact:file="components/risk-warning.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import { AlertTriangle } from "lucide-react" export function RiskWarning() { return (

Risk Warning

Cryptocurrency investments are subject to high market risk. Please make your investments cautiously. Hopper will make best efforts to select high-quality tokens, but will not be responsible for any trading losses.

The information provided on this website does not constitute investment advice, financial advice, trading advice, or any other sort of advice. You should not treat any of the website's content as such.

Conduct your own due diligence and consult your financial advisor before making any investment decisions. By participating in the IDO, you acknowledge that you have read and understood this disclaimer.

) } [V0_FILE]typescriptreact:file="components/faq.tsx" isMerged="true" "use client" import { motion } from "framer-motion" import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion" export function Faq() { const faqs = [ { question: "What is Hopper?", answer: "Hopper is a next-generation DeFi infrastructure project that provides seamless cross-chain transactions, AI-powered yield optimization, and advanced security protocols. It aims to revolutionize the DeFi space by making it more accessible, efficient, and secure.", }, { question: "When is the Hopper IDO?", answer: "The Hopper IDO is scheduled to take place on June 15, 2025. Make sure to register for the whitelist before June 1, 2025, to secure your spot.", }, { question: "How can I participate in the IDO?", answer: "To participate in the Hopper IDO, you need to connect your wallet to our platform, complete the KYC process, stake HPR tokens to qualify for your desired tier, and then contribute your funds when the IDO launches.", }, { question: "What are the different subscription tiers?", answer: "Hopper offers four subscription tiers: Bronze, Silver, Gold, and Platinum. Each tier has different requirements and benefits, including allocation size and vesting schedules. Check the Subscription Tiers section for detailed information.", }, { question: "How are tokens distributed after the IDO?", answer: "After the IDO, tokens will be distributed according to the vesting schedule of your tier. A portion will be released at the Token Generation Event (TGE), with the remaining tokens vesting over time. Check the Tokenomics section for detailed information.", }, { question: "Which blockchains does Hopper support?", answer: "Hopper supports multiple blockchains including Ethereum, Binance Smart Chain, Solana, and Polkadot. Our cross-chain infrastructure allows for seamless transactions and interoperability between these networks.", }, { question: "Is there a lock-up period for IDO participants?", answer: "Yes, there is a lock-up period for IDO participants that varies depending on your subscription tier. Bronze tier has a 1-month lock, Silver has 2 months, Gold has 3 months, and Platinum has 6 months.", }, { question: "How can I contact the Hopper team?", answer: "You can contact the Hopper team through our official channels including Discord, Telegram, and email. Visit our website for the most up-to-date contact information.", }, ] return (

Frequently Asked Questions

Find answers to common questions about the Hopper IDO

{faqs.map((faq, index) => ( {faq.question} {faq.answer} ))}

) } [V0_FILE]typescriptreact:file="components/footer.tsx" isFixed="true" isQuickEdit="true" isMerged="true" "use client" import { motion } from "framer-motion" import Link from "next/link" import { Twitter, Github, DiscIcon as Discord, TextIcon as Telegram, Mail } from "lucide-react" export function Footer() { const socialLinks = [ { icon: , href: "#", label: "Twitter" }, { icon: , href: "#", label: "Discord" }, { icon: , href: "#", label: "Telegram" }, { icon: , href: "#", label: "Github" }, { icon: , href: "#", label: "Email" }, ] const footerLinks = [ { name: "About", href: "#about" }, { name: "Tokenomics", href: "#tokenomics" }, { name: "Roadmap", href: "#roadmap" }, { name: "FAQ", href: "#faq" }, { name: "Terms", href: "#" }, { name: "Privacy", href: "#" }, { name: "Contact", href: "#" }, ] return ( ) } [V0_FILE]typescriptreact:file="components/floating-elements.tsx" isMerged="true" "use client" import { useEffect, useState } from "react" import { motion } from "framer-motion" interface FloatingElement { id: number x: number y: number size: number duration: number delay: number type: "square" | "circle" | "triangle" color: string } export function FloatingElements() { const [elements, setElements] = useState([]) useEffect(() => { // Generate random floating elements const shapes = ["square", "circle", "triangle"] const colors = ["#6B46C1", "#3182CE", "#00FF9D"] const newElements: FloatingElement[] = [] for (let i = 0; i < 15; i++) { newElements.push({ id: i, x: Math.random() * 100, y: Math.random() * 100, size: Math.random() * 30 + 10, duration: Math.random() * 15 + 10, delay: Math.random() * 5, type: shapes[Math.floor(Math.random() * shapes.length)] as "square" | "circle" | "triangle", color: colors[Math.floor(Math.random() * colors.length)], }) } setElements(newElements) }, []) return (

{elements.map((element) => ( {element.type === "square" && (

)} {element.type === "circle" && (

)} {element.type === "triangle" && (

)} ))}

) } [V0_FILE]typescriptreact:file="components/particle-background.tsx" isMerged="true" "use client" import { useEffect, useRef } from "react" interface Particle { x: number y: number size: number speedX: number speedY: number color: string alpha: number } export function ParticleBackground() { const canvasRef = useRef(null) useEffect(() => { const canvas = canvasRef.current if (!canvas) return const ctx = canvas.getContext("2d") if (!ctx) return // Set canvas dimensions const handleResize = () => { canvas.width = window.innerWidth canvas.height = window.innerHeight } handleResize() window.addEventListener("resize", handleResize) // Create particles const particles: Particle[] = [] const particleCount = 100 for (let i = 0; i < particleCount; i++) { particles.push({ x: Math.random() * canvas.width, y: Math.random() * canvas.height, size: Math.random() * 2 + 0.5, speedX: (Math.random() - 0.5) * 0.5, speedY: (Math.random() - 0.5) * 0.5, color: getRandomColor(), alpha: Math.random() * 0.5 + 0.1, }) } function getRandomColor() { const colors = [ "107, 70, 193", // Purple #6B46C1 "49, 130, 206", // Blue #3182CE "0, 255, 157", // Neon Green #00FF9D ] return colors[Math.floor(Math.random() * colors.length)] } // Animation loop function animate() { ctx.clearRect(0, 0, canvas.width, canvas.height) for (let i = 0; i < particles.length; i++) { const p = particles[i] ctx.beginPath() ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2) ctx.fillStyle = `rgba(${p.color}, ${p.alpha})` ctx.fill() // Update position p.x += p.speedX p.y += p.speedY // Wrap around edges if (p.x < 0) p.x = canvas.width if (p.x > canvas.width) p.x = 0 if (p.y < 0) p.y = canvas.height if (p.y > canvas.height) p.y = 0 // Connect particles with lines if they're close enough connectParticles(p, particles) } requestAnimationFrame(animate) } function connectParticles(p1: Particle, particles: Particle[]) { const maxDistance = 100 for (let i = 0; i < particles.length; i++) { const p2 = particles[i] const dx = p1.x - p2.x const dy = p1.y - p2.y const distance = Math.sqrt(dx * dx + dy * dy) if (distance < maxDistance) { const opacity = 1 - distance / maxDistance ctx.beginPath() ctx.strokeStyle = `rgba(${p1.color}, ${opacity * 0.2})` ctx.lineWidth = 0.5 ctx.moveTo(p1.x, p1.y) ctx.lineTo(p2.x, p2.y) ctx.stroke() } } } animate() return () => { window.removeEventListener("resize", handleResize) } }, []) return

Hopper IDO:
革新DeFi生态

代币信息

{detail.title}

初始流通量构成

IDO时间表

{event.title}

认购层级

{tier.name}

代币解锁机制

代币经济

{item.category}

项目亮点

{highlight.title}

发展路线

{quarter.quarter}

发展路线图

{item.title}

Risk Warning

Frequently Asked Questions

参与方式

{step.title}

Hopper IDO: 革新DeFi生态

代币信息

{detail.title}

初始流通量构成

IDO时间表

{event.title}

认购层级

{tier.name}

代币解锁机制

代币经济

{item.category}

项目亮点

{highlight.title}

发展路线

{quarter.quarter}

发展路线图

{item.title}

Risk Warning

Frequently Asked Questions

参与方式

{step.title}

Hopper IDO:
革新DeFi生态