---
const { title } = Astro.props;
---

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>{title}</title>
    <link rel="icon" href="/src/img/favicon.ico" type="image/x-icon" />
  </head>
  <body>
    <slot />
  </body>
</html>

<style is:global>
  * { box-sizing: border-box; margin: 0; padding: 0; }

  body {
    background: #0d0a14;
    font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;
    color: #9d9aa4;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
  }

  a {
    color: #6be1e9;
    text-decoration: none;
  }
  a:hover, a:visited { opacity: 0.8; }
  a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
</style>
