fixed mobile counter docking; docked header;

src/lib/components/ThemeToggle.svelte

@@ -37,6 +37,7 @@
       aspect-ratio: 1;
       align-items: center;
       justify-content: center;
+      background: none;
     }
     .theme-toggle:hover, .theme-toggle:active, .theme-toggle:focus {
       background: none;

src/routes/+page.svelte

@@ -68,6 +68,8 @@
 
 <style lang="scss">
     .today__list {
+
+        margin-bottom: 25vh;;
         ul {
             display: flex;
             flex-direction: column;

src/styles/app.css

@@ -21,18 +21,22 @@
 }
 /* d00000 ff7d00 */
 
+body {
+  background-color: var(--c-bkg);
+}
+
 html[data-theme='light'] body {
-  background-color: #f2f0ef;
   --c-border: #e9e9e9;
   --c-toggle: #00464b;
   --c-zebra: #ececec;
+  --c-bkg: #f2f0ef;
 }
 
 html[data-theme='dark'] body {
-    background-color: #181818;
     --c-border: #2b2b2b;
     --c-toggle: #ffe600;
     --c-zebra: #ececec11;
+    --c-bkg: #181818;
   }
 
 
@@ -80,7 +84,13 @@ nav ul li {
 }
 
 header {
-	padding-top: 2rem;
+
+  position: sticky;
+    top: 0;
+    background: var(--c-bkg);
+    z-index: 1;
+    margin: 0 -2rem;
+    padding: 2rem 2rem 0 2rem;
 }
 
 /* aside {
@@ -145,7 +155,7 @@ section {
   }
 }
 
-@media screen and (max-width: 400px) {
+@media screen and (max-width: 500px) {
   .counters {
     margin-right: -2rem;
     border-radius: 2rem 0 0 2rem;