separate header from App and add base styling

src/assets/scss/abstracts/_variables.scss

@@ -81,7 +81,7 @@ $font-family-sans-serif: 'Noto Sans';
 $font-family-text: 'Redaction'; // custom
 
 $font-size-base: 1rem;
-$font-size-sm: $font-size-base * .78125;
+$font-size-sm: $font-size-base * .9;
 
 $line-height-base: 1.5;
 $line-height-lg: $line-height-base;
@@ -119,9 +119,17 @@ $card-border-width: 0;
 // SPINNER
 $spinner-width: 50px;
 
-// CUSTOM
-$btn-size: 26px;
 
+// ╭─╴╷ ╷╭─╴╶┬╴╭─╮╭╮╮
+// │  │ │╰─╮ │ │ ││││
+// ╰─╴╰─╯╶─╯ ╵ ╰─╯╵╵╵
+
+// HEADER
+$header-spacer-sm: 18px;
+$header-spacer: 35px;
+$header-height: 86px;
+
+// NODEVIEW
 $node-view-spacer-sm-x: 18px;
 $node-view-spacer-sm-y: 18px;
 $node-view-spacer-x: 30px;
@@ -134,6 +142,8 @@ $node-card-spacer-y: 10px;
 $node-card-width: 560px;
 $node-card-height: 330px;
 
+// MISC
+$btn-size: 26px;
 $line: $border-width solid $black;
 
 @import '~bootstrap/scss/variables';