<script setup lang="ts">
import type { NuxtError } from '#app'

defineProps<{ error: NuxtError }>()
</script>

<template>
  <UApp>
    <div class="min-h-screen flex items-center justify-center">
      <div class="text-center space-y-2">
        <p class="text-8xl font-black tracking-tight">404</p>
        <p class="text-lg font-medium">This link doesn't exist.</p>
        <p class="text-muted text-sm">
          Maybe check out
          <a
            href="https://pihkaal.me"
            class="underline underline-offset-2 hover:text-default transition-colors"
          >pihkaal.me</a>
          instead?
        </p>
      </div>
    </div>
  </UApp>
</template>
