disambiguate global styles

ui/src/App.vue

@@ -1,12 +1,12 @@
 <template>
   <div id="root" :class="{ 'sl-theme-dark': prefersDark }">
-    <header>
+    <header id="header">
       <Header />
     </header>
-    <main>
+    <main id="main">
       <router-view />
     </main>
-    <footer>
+    <footer id="footer">
       <Jobs />
     </footer>
   </div>
@@ -82,17 +82,17 @@ body,
     monospace;
 }
 
-main {
+#main {
   display: flex;
   flex-grow: 1;
 }
 
-main,
-header {
+#main,
+#header {
   margin: 0 2rem;
 }
 
-footer {
+#footer {
   position: fixed;
   bottom: 0;
 
@@ -104,7 +104,7 @@ footer {
   background: var(--background);
 }
 
-footer > * {
+#footer > * {
   margin: 1rem;
 }