stenodojo

commit 79b4510b1c7fb16d036dedbb7941febc66d3fe14
parent 6ecf86cc0eac3d358098db13d89a778aa4bcad74
Author: Zach Rice <bynxmusic@gmail.com>
Date:   Thu, 28 May 2026 17:49:26 -0400

Tightened neumorphism blur and ensured table headers don't mess up the look

Diffstat:
M
static/css/style.css
 | 
39
++++++++++++++++++++++++++++++---------

1 file changed, 30 insertions(+), 9 deletions(-)
diff --git a/static/css/style.css b/static/css/style.css
@@ -22,11 +22,11 @@
     --border-light: #3b4261;
     --shadow-dark: rgba(0, 0, 0, 0.55);
     --shadow-light: rgba(255, 255, 255, 0.06);
-    --neu-raised: 8px 8px 18px var(--shadow-dark), -8px -8px 18px var(--shadow-light);
-    --neu-raised-sm: 5px 5px 12px var(--shadow-dark), -5px -5px 12px var(--shadow-light);
-    --neu-raised-lg: 12px 12px 28px var(--shadow-dark), -12px -12px 28px var(--shadow-light);
-    --neu-pressed: inset 4px 4px 10px var(--shadow-dark), inset -4px -4px 10px var(--shadow-light);
-    --neu-pressed-deep: inset 6px 6px 16px var(--shadow-dark), inset -6px -6px 16px var(--shadow-light);
+    --neu-raised: 4px 4px 10px var(--shadow-dark), -4px -4px 10px var(--shadow-light);
+    --neu-raised-sm: 3px 3px 7px var(--shadow-dark), -3px -3px 7px var(--shadow-light);
+    --neu-raised-lg: 6px 6px 14px var(--shadow-dark), -6px -6px 14px var(--shadow-light);
+    --neu-pressed: inset 3px 3px 7px var(--shadow-dark), inset -3px -3px 7px var(--shadow-light);
+    --neu-pressed-deep: inset 4px 4px 10px var(--shadow-dark), inset -4px -4px 10px var(--shadow-light);
     --neu-flat: 0 0 0 transparent;
 
     --text-primary: #c0caf5;
@@ -234,6 +234,8 @@ a:hover { color: var(--text-primary); }
 .stat-card:hover {
     box-shadow: var(--neu-raised-lg);
     transform: translateY(-2px);
+    position: relative;
+    z-index: 1;
 }
 
 .stat-card--streak {
@@ -427,21 +429,34 @@ a:hover { color: var(--text-primary); }
 
 .table {
     width: 100%;
-    border-collapse: collapse;
+    border-collapse: separate;
+    border-spacing: 0;
     font-size: 0.875rem;
 }
 
+.table thead {
+    position: relative;
+}
+
+.table thead tr {
+    position: relative;
+}
+
 .table th {
     text-align: left;
     padding: 0.75rem 1rem;
-    background: var(--base-dark);
+    background: var(--base);
     color: var(--text-secondary);
     font-weight: 700;
     font-size: 0.75rem;
     text-transform: uppercase;
     letter-spacing: 0.08em;
+    box-shadow: var(--neu-raised-sm);
 }
 
+.table th:first-child { border-radius: var(--radius-sm) 0 0 0; }
+.table th:last-child { border-radius: 0 var(--radius-sm) 0 0; }
+
 .table td {
     padding: 0.625rem 1rem;
     border-bottom: 1px solid rgba(128,128,160,0.06);
@@ -521,6 +536,8 @@ a:hover { color: var(--text-primary); }
     box-shadow: var(--neu-raised);
     transform: translateY(-1px);
     color: var(--text-primary);
+    position: relative;
+    z-index: 1;
 }
 .lesson-card:active {
     box-shadow: var(--neu-pressed);
@@ -607,6 +624,8 @@ a:hover { color: var(--text-primary); }
     box-shadow: var(--neu-raised);
     transform: translateY(-2px);
     color: var(--text-primary);
+    position: relative;
+    z-index: 1;
 }
 .mode-card:active {
     box-shadow: var(--neu-pressed);
@@ -1018,6 +1037,8 @@ a:hover { color: var(--text-primary); }
 .hint-item:hover {
     box-shadow: var(--neu-raised);
     transform: translateY(-1px);
+    position: relative;
+    z-index: 1;
 }
 .hint-item:active {
     box-shadow: var(--neu-pressed);
@@ -1709,8 +1730,8 @@ a:hover { color: var(--text-primary); }
     margin-bottom: 1.5rem;
 }
 .btn--google:hover {
-    box-shadow: var(--neu-raised-lg);
-    transform: translateY(-2px);
+    box-shadow: var(--neu-raised);
+    transform: translateY(-1px);
 }
 
 .google-icon {