404.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="color-scheme" content="dark">
    <meta name="theme-color" content="#0c0d11">
    <title>Page not found · Ming Media</title>
    <meta name="robots" content="noindex">
    <link rel="icon" type="image/svg+xml" href="/assets/favicon.svg">
    <link rel="icon" type="image/png" sizes="192x192" href="/assets/favicon.png">
    <link rel="apple-touch-icon" href="/assets/apple-touch-icon.png">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Lilita+One&family=Inter:wght@400;500;700&display=swap" rel="stylesheet">
    <link href="/css/site.css" rel="stylesheet">
    <script>
        // Brave on iOS resizes the page when its toolbar shows or hides, which makes
        // viewport units jump while scrolling. On touch devices, lock full-screen
        // sections to the height at load and only update when the width changes.
        if (matchMedia("(pointer: coarse)").matches) {
            let width = 0;
            const lock = () => {
                if (innerWidth === width) return;
                width = innerWidth;
                document.documentElement.style.setProperty("--screen-h", innerHeight + "px");
            };
            lock();
            addEventListener("resize", lock);
        }
    </script>
</head>
<body>
    <nav>
        <div class="wrap">
            <a href="/"><img src="/assets/logo.svg" alt="Ming Media"></a>
            <ul>
                <li><a href="/#home">Home</a></li>
                <li><a href="/#games">Games</a></li>
                <li><a href="/#about">About</a></li>
            </ul>
        </div>
    </nav>
    <main class="notfound">
        <div class="wrap">
            <h1>Oof!</h1>
            <p>We couldn't find that page.</p>
            <a class="btn" href="/">Back to home</a>
        </div>
    </main>
</body>
</html>