From 6aab722e79cce918c3bc2cfaae7731dae86f4167 Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Thu, 16 Apr 2026 21:06:01 -0700
Subject: type: general styling changes to BGA and hud

---
 src/app/game/page.styles.ts | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

(limited to 'src/app/game/page.styles.ts')

diff --git a/src/app/game/page.styles.ts b/src/app/game/page.styles.ts
index fce88be..9b10d3b 100644
--- a/src/app/game/page.styles.ts
+++ b/src/app/game/page.styles.ts
@@ -97,8 +97,10 @@ export const HUD = styled.div`
   justify-content: space-between;
   gap: 24px;
   padding: 10px 24px;
-  background: rgba(255, 255, 255, 0.04);
-  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+  background: rgba(13, 13, 20, 0.75);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
   position: relative;
   z-index: 2;
 `;
@@ -134,6 +136,7 @@ export const ComboValue = styled(HudValue)<{ $animate: boolean }>`
 /* ----- MAIN GAME AREA ----- */
 
 export const GameArea = styled.div`
+  position: relative;
   flex: 1;
   display: flex;
   flex-direction: column;
@@ -142,6 +145,11 @@ export const GameArea = styled.div`
   padding: 24px 32px;
   gap: 24px;
   overflow: hidden;
+
+  & > * {
+    position: relative;
+    z-index: 1;
+  }
 `;
 
 export const UpcomingWrap = styled.div`
-- 
cgit v1.2.3