From 46d1beb78ce4a5fffa7719aa729b38bf981565ff Mon Sep 17 00:00:00 2001
From: MattTheTekie <Mattmason2211@gmail.com>
Date: Sat, 28 Mar 2026 16:59:44 -0400
Subject: [PATCH] chore: fixes

---
 css/global.css | 32 +++++++++++++++-----------------
 1 file changed, 15 insertions(+), 17 deletions(-)

diff --git a/css/global.css b/css/global.css
index 5438667..26237df 100644
--- a/css/global.css
+++ b/css/global.css
@@ -827,25 +827,21 @@ position: relative;
 }
 
 /* =========================
- *  2. SCALE SYSTEM (1920 LOCKED)
- *  - 1920 = 1
- *  - smaller screens = <1
- *  - larger screens = >1
+ *  2. SCALE (1920 baseline)
  = *======================== */
 :root {
-  --scale: clamp(0.6, calc(100vw / 1920), 1.4);
+  --scale: clamp(0.65, calc(100vw / 1920), 1.25);
 }
 
 /* =========================
- *  3. Base banners
+ *  3. BASE BANNER STYLE
+ *  (IMPORTANT: split transforms properly)
  = *======================== */
 .left_banner,
 .right_banner {
   position: fixed;
   top: 50%;
-  transform: translateY(-50%);
 
-  /* IMPORTANT: base size = your original design */
   width: calc(320px * var(--scale));
   aspect-ratio: 383 / 626;
 
@@ -853,28 +849,30 @@ position: relative;
   background-position: center;
   background-repeat: no-repeat;
 
-  animation: float 6s ease-in-out infinite;
   z-index: 94;
-
   pointer-events: none;
+
+  /* ONLY vertical centering here */
+  transform: translateY(-50%);
+
+  animation: float 6s ease-in-out infinite;
 }
 
 /* =========================
- *  4. Positioning (NO scaling math here)
- *  This keeps them EXACTLY where they “started”
+ *  4. SAFE POSITIONING (NO NEGATIVE PUSHING)
  = *======================== */
 .left_banner {
-  left: calc((100vw - 980px) / 2 - 360px);
+  left: max(10px, calc((100vw - 980px) / 2 - 260px));
   background-image: url("https://www.veltron.net/images/dragon.png");
 }
 
 .right_banner {
-  right: calc((100vw - 980px) / 2 - 360px);
+  right: max(10px, calc((100vw - 980px) / 2 - 260px));
   background-image: url("https://www.veltron.net/images/digimon.png");
 }
 
 /* =========================
- *  5. Float animation (FIXED transform layering)
+ *  5. FLOAT (DO NOT overwrite main transform)
  = *======================== */
 @keyframes float {
   0% {
@@ -889,7 +887,7 @@ position: relative;
 }
 
 /* =========================
- *  6. Tablet safety
+ *  6. TABLET FIX
  = *======================== */
 @media (max-width: 1100px) {
   .left_banner,
@@ -908,7 +906,7 @@ position: relative;
 }
 
 /* =========================
- *  7. Mobile hide
+ *  7. MOBILE HIDE
  = *======================== */
 @media (max-width: 900px) {
   .decor.left_banner,