feat: header and main elements for semantics

src/lib/Header.svelte

@@ -5,6 +5,7 @@
     let navShown = false;
 </script>
 
+<header>
     <nav>
         <a class="brand" href="index.html">Cursed Creations</a>
         <md-outlined-icon-button
@@ -21,9 +22,15 @@
             {/each}
         </ul>
     </nav>
+</header>
 
 <style lang="scss">
     $space: 4ch;
+
+    header {
+        display: contents;
+    }
+    
     nav {
         display: grid;
         align-items: center;

src/routes/+layout.svelte

@@ -3,7 +3,7 @@
 </script>
 
 <Header />
-<slot />
+<main><slot /></main>
 
 <style>
     :global(body) {