diff --git a/style.css b/style.css
index 30e929b..7d66a9b 100644
--- a/style.css
+++ b/style.css
@@ -1,12 +1,10 @@
 body {
   background: #0d0a14;
-  padding: 20px;
+  padding: 20px 20px 80px 20px;
   font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;
   color: #9d9aa4;
-  display: flex;
-  flex-direction: column;
-  height: 100vh;
-  overflow: hidden;
+  position: relative;
+  min-height: 100vh;
 }
 
 .bard {
@@ -14,7 +12,7 @@ body {
   /* Remove fixed width in pixels */
   width: 100%;
   max-width: 65em; /* Keep the same max size for desktop */
-  flex-shrink: 1;
+  height: auto;
   aspect-ratio: 1 / 0.95; /* Maintains the proportion of the artwork */
   font-size: 2px;
 }
@@ -158,7 +156,6 @@ p {
   text-align: center;
   line-height: 1.3;
   font-size: 0.875rem;
-  flex-shrink: 0;
 }
 
 .announcement {
@@ -168,7 +165,6 @@ p {
   text-align: center;
   line-height: 1.3;
   font-size: 0.875rem;
-  flex-shrink: 0;
 }
 
 .announcement a {
@@ -184,21 +180,28 @@ p {
 }
 
 .debug {
-  flex: 1;
+  margin: 40px auto 0;
+  position: relative;
+  max-width: 800px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  max-width: 100%;
 }
 
 .links-bottom {
-  margin-top: auto;
-  padding-top: 10px;
-  position: relative;
-  max-width: 400px;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 20px;
   text-align: center;
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   justify-content: center;
-  align-self: center;
-  flex-shrink: 0;
+  background: linear-gradient(to top, rgba(13, 10, 20, 0.95), rgba(13, 10, 20, 0.8));
+  backdrop-filter: blur(4px);
 }
 
 .links-bottom a {