Build a 404 "Page Not Found" hero page as a single full-viewport (100vh, no scroll) React + Vite + Tailwind CSS application using the DM Sans font and Google Material Symbols Rounded icons. The page must match the following specification exactly: --- ## Fonts & External Resources - **Google Font:** DM Sans (all weights, variable: `opsz 9..40, wght 100..1000`) - **Google Material Symbols Rounded:** `opsz,wght,FILL,GRAD@24,400,1,0` - **Logo image:** `https://pub-f170a2592d2c4a1485466404c36807be.r2.dev/Tests/logoipsum-415.svg` (rendered with `filter: brightness(0)` to make it black, height 28px) - **Background spaceship image:** `https://pub-e68758f43067417dba612b2371819aa1.r2.dev/viktor-components/alien-spaceship.png` --- ## Layout The entire page is exactly `100vh` with `overflow: hidden` on html, body, and `#root`. No scrolling. The body uses `display: flex; flex-direction: column`. The `#root` div also uses `height: 100vh; display: flex; flex-direction: column; overflow: hidden`. --- ## Background Body has a layered background: 1. The spaceship PNG centered at `center 40%`, sized with `background-size: contain` 2. A `linear-gradient(to top left, #F5F5F5, #F7F7F7)` covering the full page Both are `background-attachment: fixed` and `no-repeat`. --- ## Color Variables (CSS custom properties) ``` --text-main: #1a1a1a --text-secondary: #888888 --bg-page: #F5F5F5 --card-bg: #ffffff ``` --- ## Navbar - Max-width `1100px`, centered, padding `28px 40px` - Has a dashed bottom border m
……（完整源码请在站内查看）
