From b9d5d5cc809c6886a6db5caf03ecd0f6de805c78 Mon Sep 17 00:00:00 2001
From: dangrubbb <dangrubb@firemail.cc>
Date: Sat, 28 Feb 2026 09:54:41 -0500
Subject: [PATCH] Fix layout to prevent scrollbar

- Change body height from min-height to height: 100vh with overflow: hidden
- Use flexbox with flex-grow/flex-shrink to keep everything on one screen
- Reduce padding and margins for better fit
- Debug section takes remaining space, links always at bottom
- No scrollbar, works on all screen sizes
---
 style.css | 22 +++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/style.css b/style.css
index 1a18b69..30e929b 100644
--- a/style.css
+++ b/style.css
@@ -1,19 +1,20 @@
 body {
   background: #0d0a14;
-  padding: 40px 20px;
+  padding: 20px;
   font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;
   color: #9d9aa4;
   display: flex;
   flex-direction: column;
-  min-height: 100vh;
+  height: 100vh;
+  overflow: hidden;
 }
 
 .bard {
-  margin: 0 auto 40px;
+  margin: 0 auto 20px;
   /* Remove fixed width in pixels */
   width: 100%;
   max-width: 65em; /* Keep the same max size for desktop */
-  height: auto;
+  flex-shrink: 1;
   aspect-ratio: 1 / 0.95; /* Maintains the proportion of the artwork */
   font-size: 2px;
 }
@@ -151,21 +152,23 @@ body {
   }
 }
 p {
-  margin: 20px auto 0;
+  margin: 10px auto 0;
   position: relative;
   max-width: 400px;
   text-align: center;
   line-height: 1.3;
   font-size: 0.875rem;
+  flex-shrink: 0;
 }
 
 .announcement {
-  margin: 20px auto 0;
+  margin: 10px auto 0;
   position: relative;
   max-width: 400px;
   text-align: center;
   line-height: 1.3;
   font-size: 0.875rem;
+  flex-shrink: 0;
 }
 
 .announcement a {
@@ -180,9 +183,13 @@ p {
   opacity: 0.85;
 }
 
+.debug {
+  flex: 1;
+}
+
 .links-bottom {
   margin-top: auto;
-  padding-top: 40px;
+  padding-top: 10px;
   position: relative;
   max-width: 400px;
   text-align: center;
@@ -191,6 +198,7 @@ p {
   gap: 20px;
   justify-content: center;
   align-self: center;
+  flex-shrink: 0;
 }
 
 .links-bottom a {