blocks - one for each file in the project structure.

Given the complexity, I'll create a comprehensive project structure with:
1. Package.json and config files
2. App router structure (Next.js 13+)
3. Components for each section
4. Pages for each route
5. Mock API endpoints
6. Styling with Tailwind
7. Animations with Framer Motion

Let me start with the core files and build out the complete project. I'll need to output multiple WEBSITE_PREVIEW blocks.

Since this is a Next.js a large project, I'll organize it into multiple files and output them as separate WEBSITE_PREVIEW blocks with filenames.

Let me plan the file structure:
- package.json
- tsconfig.json
- next.config.js
- tailwind.config.ts
- postcss.config.js
- .eslintrc.json
- src/app/layout.tsx
- src/app/page.tsx (Home)
- src/app/store/page.tsx
- src/app/vote/page.tsx
- src/app/staff/page.tsx
- src/app/news/page.tsx
- src/app/gamemodes/page.tsx
- src/app/api/status/route.ts
- src/app/api/players/route.ts
- src/app/api/store/route.ts
- src/app/api/news/route.ts
- src/components/Hero.tsx
- src/components/Features.tsx
- src/components/GameModes.tsx
- src/components/Statistics.tsx
- src/components/Store.tsx
- src/components/Vote.tsx
- src/components/Staff.tsx
- src/components/News.tsx
- src/components/Footer.tsx
- src/components/Navbar.tsx
- src/components/AnimatedBackground.tsx
- src/components/AnimatedCounter.tsx
- src/components/FeatureCard.tsx
- src/components/GameModeCard.tsx
- src/components/ProductCard.tsx
- src/components/StaffCard.tsx
- src/components/NewsCard.tsx
- src/lib/api.ts
- src/lib/utils.ts
- src/types/index.ts
- public/ (placeholder for images)

This is a lot of files. I'll output them in batches. Let me start with the configuration files and core app files.</think>[WEBSITE_PREVIEW]

{
  "name": "idk-dawg-mc",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "next": "14.2.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "framer-motion": "^11.0.0",
    "lucide-react": "^0.370.0",
    "clsx": "^2.1.0",
    "tailwind-merge": "^2.2.0"
  },
  "devDependencies": {
    "@types/node": "^20.0.0",
    "@types/react": "^18.2.0",
    "@types/react-dom": "^18.2.0",
    "typescript": "^5.0.0",
    "tailwindcss": "^3.4.0",
    "postcss": "^8.4.0",
    "autoprefixer": "^10.4.0",
    "eslint": "^8.0.0",
    "eslint-config-next": "14.2.0"
  }
}
{
  "compilerOptions": {
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules"]
}
/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  images: {
    remotePatterns: [
      {
        protocol: 'https',
        hostname: 'images.unsplash.com',
      },
      {
        protocol: 'https',
        hostname: 'via.placeholder.com',
      },
      {
        protocol: 'https',
        hostname: 'picsum.photos',
      },
    ],
  },
};

module.exports = nextConfig;
import type { Config } from 'tailwindcss';

const config: Config = {
  content: [
    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    extend: {
      colors: {
        primary: {
          50: '#f0f9ff',
          100: '#e0f2fe',
          200: '#bae6fd',
          300: '#7dd3fc',
          400: '#38bdf8',
          500: '#0ea5e9',
          600: '#0284c7',
          700: '#0369a1',
          800: '#075985',
          900: '#0c4a6e',
        },
        minecraft: {
          dark: '#1a1a2e',
          darker: '#16213e',
          card: '#1f1f3a',
          border: '#2a2a4a',
          gold: '#ffd700',
          emerald: '#50c878',
          diamond: '#b9f2ff',
          redstone: '#ff4444',
        },
      },
      fontFamily: {
        sans: ['Inter', 'system-ui', 'sans-serif'],
        minecraft: ['Minecraft', 'cursive'],
      },
      animation: {
        'float': 'float 6s ease-in-out infinite',
        'pulse-slow': 'pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite',
        'slide-up': 'slideUp 0.6s ease-out',
        'slide-down': 'slideDown 0.6s ease-out',
        'fade-in': 'fadeIn 0.5s ease-out',
        'spin-slow': 'spin 8s linear infinite',
      },
      keyframes: {
        float: {
          '0%, 100%': { transform: 'translateY(0px)' },
          '50%': { transform: 'translateY(-20px)' },
        },
        slideUp: {
          '0%': { transform: 'translateY(30px)', opacity: '0' },
          '100%': { transform: 'translateY(0)', opacity: '1' },
        },
        slideDown: {
          '0%': { transform: 'translateY(-30px)', opacity: '0' },
          '100%': { transform: 'translateY(0)', opacity: '1' },
        },
        fadeIn: {
          '0%': { opacity: '0' },
          '100%': { opacity: '1' },
        },
      },
      backgroundImage: {
        'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
        'gradient-conic': 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
        'mesh-gradient': 'linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f0f23 100%)',
      },
    },
  },
  plugins: [],
};

export default config;
module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
};
{
  "extends": ["next/core-web-vitals"],
  "rules": {
    "@typescript-eslint/no-unused-vars": "warn",
    "react/no-unescaped-entities": "off"
  }
}
export interface ServerStatus {
  online: boolean;
  players: {
    online: number;
    max: number;
  };
  version: string;
  motd: string;
}

export interface PlayerStats {
  totalPlayers: number;
  discordMembers: number;
  votes: number;
  uptime: string;
}

export interface Feature {
  id: string;
  name: string;
  description: string;
  icon: string;
  color: string;
}

export interface GameMode {
  id: string;
  name: string;
  description: string;
  image: string;
  players: number;
  maxPlayers: number;
  features: string[];
}

export interface StoreCategory {
  id: string;
  name: string;
  description: string;
  icon: string;
  color: string;
}

export interface StoreProduct {
  id: string;
  name: string;
  description: string;
  price: number;
  originalPrice?: number;
  category: string;
  image: string;
  featured: boolean;
  sale?: boolean;
  perks: string[];
}

export interface VoteSite {
  id: string;
  name: string;
  url: string;
  reward: string;
  votes: number;
}

export interface VoteReward {
  id: string;
  name: string;
  description: string;
  votesRequired: number;
  icon: string;
}

export interface StaffMember {
  id: string;
  name: string;
  role: 'Owner' | 'Admin' | 'Moderator' | 'Helper';
  avatar: string;
  bio: string;
  social?: {
    discord?: string;
    twitter?: string;
    youtube?: string;
  };
}

export interface NewsPost {
  id: string;
  title: string;
  excerpt: string;
  content: string;
  author: string;
  date: string;
  category: 'Announcement' | 'Update' | 'Patch Notes' | 'Event';
  image: string;
  featured: boolean;
}

export interface NavLink {
  href: string;
  label: string;
}
import { clsx, type ClassValue } from 'clsx';
import { twMerge } from 'tailwind-merge';

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs));
}

export function formatNumber(num: number): string {
  if (num >= 1000000) {
    return (num / 1000000).toFixed(1) + 'M';
  }
  if (num >= 1000) {
    return (num / 1000).toFixed(1) + 'K';
  }
  return num.toString();
}

export function copyToClipboard(text: string): Promise<void> {
  return navigator.clipboard.writeText(text);
}

export function debounce<T extends (...args: unknown[]) => unknown>(
  func: T,
  wait: number
): (...args: Parameters<T>) => void {
  let timeout: NodeJS.Timeout | null = null;
  return (...args: Parameters<T>) => {
    if (timeout) clearTimeout(timeout);
    timeout = setTimeout(() => func(...args), wait);
  };
}
import { ServerStatus, PlayerStats, StoreProduct, NewsPost, GameMode, VoteSite, VoteReward, StaffMember, Feature } from '@/types';

const MOCK_SERVER_STATUS: ServerStatus = {
  online: true,
  players: { online: 1247, max: 5000 },
  version: '1.20.4',
  motd: 'Welcome to IDK DAWG Network - Play Now!',
};

const MOCK_PLAYER_STATS: PlayerStats = {
  totalPlayers: 245890,
  discordMembers: 45200,
  votes: 128500,
  uptime: '99.9%',
};

const MOCK_FEATURES: Feature[] = [
  { id: 'survival', name: 'Survival', description: 'Enhanced survival with custom biomes, dungeons, and economy', icon: '🌲', color: 'emerald' },
  { id: 'economy', name: 'Economy', description: 'Player-driven economy with shops, auctions, and jobs system', icon: '💰', color: 'gold' },
  { id: 'pvp', name: 'PvP', description: 'Competitive PvP arenas, tournaments, and ranked seasons', icon: '⚔️', color: 'redstone' },
  { id: 'enchants', name: 'Custom Enchants', description: 'Over 50 unique custom enchantments for tools and armor', icon: '✨', color: 'diamond' },
  { id: 'crates', name: 'Crates', description: 'Mystery crates with exclusive rewards and cosmetics', icon: '📦', color: 'purple' },
  { id: 'events', name: 'Events', description: 'Daily events, seasonal festivals, and special competitions', icon: '🎉', color: 'pink' },
];

const MOCK_GAME_MODES: GameMode[] = [
  {
    id: 'smp',
    name: 'SMP',
    description: 'Classic survival multiplayer with a twist. Build, trade, and survive with friends in our enhanced world.',
    image: 'https://images.unsplash.com/photo-1589424242656-6255c3a8d7a8?w=800&q=80',
    players: 847,
    maxPlayers: 2000,
    features: ['Land Claiming', 'Player Shops', 'Jobs System', 'Custom Mobs', 'Seasonal Events'],
  },
  {
    id: 'lifesteal',
    name: 'Lifesteal',
    description: 'High-stakes PvP where every kill steals a heart. Lose all hearts and you\'re banned temporarily.',
    image: 'https://images.unsplash.com/photo-1518709268805-4e9042af2176?w=800&q=80',
    players: 423,
    maxPlayers: 1000,
    features: ['Heart System', 'Bounty Hunters', 'Team Battles', 'Leaderboards', 'Custom Crafting'],
  },
  {
    id: 'skyblock',
    name: 'Skyblock',
    description: 'Start on a floating island and expand your empire. Custom islands, minions, and challenges.',
    image: 'https://images.unsplash.com/photo-1493711662062-fa541adb3fc8?w=800&q=80',
    players: 1156,
    maxPlayers: 3000,
    features: ['Custom Islands', 'Minion System', 'Auction House', 'Skill Trees', 'Co-op Islands'],
  },
  {
    id: 'kitpvp',
    name: 'KitPvP',
    description: 'Fast-paced PvP with balanced kits. Rank up, unlock cosmetics, and dominate the arena.',
    image: 'https://images.unsplash.com/photo-1542751371-adc38448a05e?w=800&q=80',
    players: 567,
    maxPlayers: 1500,
    features: ['20+ Kits', 'Ranked Matches', 'Kill Effects', 'Leaderboards', 'Tournaments'],
  },
];

const MOCK_STORE_CATEGORIES = [
  { id: 'ranks', name: 'Ranks', description: 'Permanent server ranks with exclusive perks', icon: '👑', color: 'gold' },
  { id: 'crates', name: 'Crate Keys', description: 'Unlock mysterious crates for rare rewards', icon: '🔑', color: 'purple' },
  { id: 'cosmetics', name: 'Cosmetics', description: 'Pets, particles, trails, and more', icon: '✨', color: 'pink' },
  { id: 'bundles', name: 'Bundles', description: 'Save with curated bundles', icon: '📦', color: 'blue' },
];

const MOCK_STORE_PRODUCTS: StoreProduct[] = [
  { id: 'vip', name: 'VIP Rank', description: 'Entry-level rank with basic perks', price: 9.99, category: 'ranks', image: 'https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?w=400&q=80', featured: false, perks: ['VIP Chat Prefix', '/fly in SMP', '2 Homes', 'VIP Crate Key Monthly'] },
  { id: 'mvp', name: 'MVP Rank', description: 'Popular rank with great value', price: 24.99, originalPrice: 29.99, category: 'ranks', image: 'https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?w=400&q=80', featured: true, sale: true, perks: ['MVP Chat Prefix', '/fly in all modes', '5 Homes', 'MVP Crate Key Weekly', 'Nickname Command', 'Pet Slot'] },
  { id: 'elite', name: 'ELITE Rank', description: 'Premium rank for dedicated players', price: 49.99, category: 'ranks', image: 'https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?w=400&q=80', featured: true, perks: ['ELITE Chat Prefix', 'Unlimited Homes', 'ELITE Crate Key Daily', 'All Pets Unlocked', 'Custom Join Message', 'Priority Queue'] },
  { id: 'legend', name: 'LEGEND Rank', description: 'Ultimate rank with all perks', price: 99.99, originalPrice: 129.99, category: 'ranks', image: 'https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?w=400&q=80', featured: true, sale: true, perks: ['LEGEND Chat Prefix', 'All Previous perms Commands', 'Legend Crate Key Hourly', 'All Cosmetics', 'Custom Title', 'Dedicated Support'] },
  { id: 'vote-key', name: 'Vote Crate Key', description: 'Chance to win rare items', price: 1.99, category: 'crates', image: 'https://images.unsplash.com/photo-1589424242656-6255c3a8d7a8?w=400&q=80', featured: false, perks: ['Rare Items', 'Cosmetics', 'In-Game Currency', 'Custom Enchants'] },
  { id: 'mystery-key', name: 'Mystery Crate Key', description: 'Better rewards than vote crates', price: 4.99, category: 'crates', image: 'https://images.unsplash.com/photo-1589424242656-6255c3a8d7a8?w=400&q=80', featured: true, perks: ['Epic Items', 'Exclusive Cosmetics', 'High-Tier Enchants', 'Rank Upgrades'] },
  { id: 'legendary-key', name: 'Legendary Crate Key', description: 'Best rewards in the server', price: 14.99, category: 'crates', image: 'https://images.unsplash.com/photo-1589424242656-6255c3a8d7a8?w=400&q=80', featured: false, perks: ['Legendary Items', 'Unique Cosmetics', 'Max Enchants', 'Exclusive Pets'] },
  { id: 'pet-dragon', name: 'Dragon Pet', description: 'A majestic dragon companion', price: 7.99, category: 'cosmetics', image: 'https://images.unsplash.com/photo-1518709268805-4e9042af2176?w=400&q=80', featured: false, perks: ['Follows You', 'Particle Effects', 'Custom Name', 'Level Up System'] },
  { id: 'trail-fire', name: 'Fire Trail', description: 'Leave a trail of fire behind you', price: 4.99, category: 'cosmetics', image: 'https://images.unsplash.com/photo-1518709268805-4e9042af2176?w=400&q=80', featured: true, perks: ['Animated Trail', 'Color Variants', 'Toggle On/Off', 'Works in All Modes'] },
  { id: 'bundle-starter', name: 'Starter Bundle', description: 'Perfect for new players', price: 14.99, originalPrice: 24.97, category: 'bundles', image: 'https://images.unsplash.com/photo-1493711662062-fa541adb3fc8?w=400&q=80', featured: true, sale: true, perks: ['VIP Rank', '5 Vote Keys', 'Starter Pet', '10K In-Game Money'] },
  { id: 'bundle-pro', name: 'Pro Bundle', description: 'Serious player package', price: 39.99, originalPrice: 69.97, category: 'bundles', image: 'https://images.unsplash.com/photo-1493711662062-fa541adb3fc8?w=400&q=80', featured: true, sale: true, perks: ['MVP Rank', '10 Mystery Keys', 'Exclusive Pet', '50K In-Game Money', 'Custom Trail'] },
  { id: 'bundle-ultimate', name: 'Ultimate Bundle', description: 'Everything you need', price: 79.99, originalPrice: 149.97, category: 'bundles', image: 'https://images.unsplash.com/photo-1493711662062-fa541adb3fc8?w=400&q=80', featured: true, sale: true, perks: ['ELITE Rank', '20 Legendary Keys', 'All Pets', '100K In-Game Money', 'All Cosmetics', 'Custom Title'] },
];

const MOCK_VOTE_SITES: VoteSite[] = [
  { id: 'minecraft-servers', name: 'Minecraft-Servers.net', url: 'https://minecraft-servers.net', reward: '1 Vote Key + $500', votes: 45200 },
  { id: 'planet-minecraft', name: 'Planet Minecraft', url: 'https://planetminecraft.com', reward: '1 Vote Key + $500', votes: 38100 },
  { id: 'minecraft-mp', name: 'Minecraft-MP.com', url: 'https://minecraft-mp.com', reward: '1 Vote Key + $500', votes: 25600 },
  { id: 'topg', name: 'TopG.org', url: 'https://topg.org', reward: '1 Vote Key + $500', votes: 19600 },
];

const MOCK_VOTE_REWARDS: VoteReward[] = [
  { id: 'daily', name: 'Daily Vote Reward', description: 'Vote on all sites daily', votesRequired: 4, icon: '📦', },
  { id: 'weekly', name: 'Weekly Vote Reward', description: 'Vote 20 times in a week', votesRequired: 20, icon: '🔑', },
  { id: 'monthly', name: 'Monthly Top Voter', description: 'Top 3 voters of the month', votesRequired: 80, icon: '👑', },
];

const MOCK_STAFF: StaffMember[] = [
  { id: 'owner1', name: 'Notch', role: 'Owner', avatar: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=200&q=80', bio: 'Founder of IDK DAWG Network. Passionate about creating the best Minecraft experience.', social: { discord: 'notch#0001', twitter: '@notch', youtube: '@notch' } },
  { id: 'owner2', name: 'Jeb', role: 'Owner', avatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=200&q=80', bio: 'Co-founder and lead developer. Building the future of Minecraft servers.', social: { discord: 'jeb#0002', twitter: '@jeb_' } },
  { id: 'admin1', name: 'Dinnerbone', role: 'Admin', avatar: 'https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=200&q=80', bio: 'Head of operations and community management.', social: { discord: 'dinnerbone#0003', twitter: '@Dinnerbone' } },
  { id: 'admin2', name: 'Grum', role: 'Admin', avatar: 'https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?w=200&q=80', bio: 'Technical administrator and plugin developer.', social: { discord: 'grum#0004', twitter: '@grum' } },
  { id: 'mod1', name: 'Kappische', role: 'Moderator', avatar: 'https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=200&q=80', bio: 'Community moderator and event coordinator.', social: { discord: 'kappische#0005' } },
  { id: 'mod2', name: 'Marnix', role: 'Moderator', avatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=200&q=80', bio: 'Chat moderator and support specialist.', social: { discord: 'marnix#0006' } },
  { id: 'mod3', name: 'Lydia', role: 'Moderator', avatar: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=200&q=80', bio: 'Forum moderator and bug reporter.', social: { discord: 'lydia#0007' } },
];

const MOCK_NEWS: NewsPost[] = [
  { id: '1', title: 'Season 7 Launch - New Beginnings', excerpt: 'The wait is over! Season 7 brings new features, map reset, and exclusive rewards.', content: 'Full season 7 details...', author: 'Notch', date: '2024-01-15', category: 'Announcement', image: 'https://images.unsplash.com/photo-1589424242656-6255c3a8d7a8?w=800&q=80', featured: true },
  { id: '2', title: 'v3.2.1 Patch Notes', excerpt: 'Bug fixes, performance improvements, and balance changes.', content: 'Patch details...', author: 'Dinnerbone', date: '2024-01-10', category: 'Patch Notes', image: 'https://images.unsplash.com/photo-1518709268805-4e9042af2176?w=800&q=80', featured: false },
  { id: '3', title: 'Winter Festival Event Starts Tomorrow!', excerpt: 'Join us for 2 weeks of winter-themed events, exclusive cosmetics, and prizes.', content: 'Event details...', author: 'Jeb', date: '2024-01-05', category: 'Event', image: 'https://images.unsplash.com/photo-1493711662062-fa541adb3fc8?w=800&q=80', featured: true },
  { id: '4', title: 'New Anti-Cheat System Deployed', excerpt: 'We\'ve upgraded our anti-cheat for better protection against cheaters.', content: 'Technical details...', author: 'Grum', date: '2024-01-01', category: 'Update', image: 'https://images.unsplash.com/photo-1542751371-adc38448a05e?w=800&q=80', featured: false },
  { id: '5', title: 'Discord Server Hits 50k Members!', excerpt: 'Thank you to our amazing community for reaching this milestone.', content: 'Celebration details...', author: 'Kappische', date: '2023-12-28', category: 'Announcement', image: 'https://images.unsplash.com/photo-1589424242656-6255c3a8d7a8?w=800&q=80', featured: false },
];

export async function getServerStatus(): Promise<ServerStatus> {
  await new Promise(resolve => setTimeout(resolve, 100));
  return MOCK_SERVER_STATUS;
}

export async function getPlayerStats(): Promise<PlayerStats> {
  await new Promise(resolve => setTimeout(resolve, 100));
  return MOCK_PLAYER_STATS;
}

export async function getFeatures(): Promise<Feature[]> {
  await new Promise(resolve => setTimeout(resolve, 100));
  return MOCK_FEATURES;
}

export async function getGameModes(): Promise<GameMode[]> {
  await new Promise(resolve => setTimeout(resolve, 100));
  return MOCK_GAME_MODES;
}

export async function getStoreCategories() {
  await new Promise(resolve => setTimeout(resolve, 100));
  return MOCK_STORE_CATEGORIES;
}

export async function getStoreProducts():