From 8b504826217a658c8240467bcbb7f49adc4b4702 Mon Sep 17 00:00:00 2001
From: Tim Bendt <sirtimbly@gmail.com>
Date: Thu, 9 Apr 2026 17:42:14 -0400
Subject: [PATCH] Fix score-card padding in responsive media query

---
 src/styles.css | 43 ++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 42 insertions(+), 1 deletion(-)

diff --git a/src/styles.css b/src/styles.css
index 056baf4..868d888 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -601,6 +601,43 @@ input[type="range"] {
   margin: 0;
 }
 
+.setup-tabs {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 0.5rem;
+  padding: 0 1.5rem 1rem;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+}
+
+.setup-tab {
+  min-height: 3rem;
+  display: grid;
+  place-items: center;
+  gap: 0.15rem;
+  padding: 0.55rem;
+  border-radius: 0.85rem;
+  background: rgba(255, 255, 255, 0.04);
+  color: rgba(231, 238, 247, 0.78);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+}
+
+.setup-tab--active {
+  background: rgba(255, 255, 255, 0.1);
+  color: #f4f7fb;
+  border-color: rgba(255, 255, 255, 0.16);
+}
+
+.setup-tab span:first-child {
+  font-size: 1rem;
+}
+
+.setup-tab span:last-child {
+  font-size: 0.78rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+}
+
 .modal-body {
   flex: 1;
   overflow-y: auto;
@@ -659,6 +696,10 @@ input[type="range"] {
 }
 
 @media (max-width: 600px) {
+  .setup-tabs {
+    grid-template-columns: repeat(2, 1fr);
+  }
+
   .setup-grid,
   .setup-grid--2col,
   .setup-grid--3col {
@@ -888,7 +929,7 @@ input[type="range"] {
   }
   
   .score-card {
-    padding: 0.5rem 0.75rem;
+    padding: 1rem 1.25rem;
   }
   
   .score-card__head h2 {