Fix transparent blocks: add -webkit-backdrop-filter and adjust opacity

- Add -webkit-backdrop-filter for Safari/Chromium (e.g. Raspberry Pi)
- Use rgba(0,0,0,0.15) so header, section and footer show background through

Co-authored-by: Cursor <cursoragent@cursor.com>

static/css/style.css

@@ -55,7 +55,8 @@ body {
     justify-content: space-between;
     align-items: flex-start;
     margin-bottom: 1rem;
-    background: rgba(0, 0, 0, 0.05);
+    background: rgba(0, 0, 0, 0.15);
+    -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
     padding: 1rem 1.5rem;
     border-radius: 10px;
@@ -150,7 +151,8 @@ body {
 
 /* Sections */
 section {
-    background: rgba(0, 0, 0, 0.05);
+    background: rgba(0, 0, 0, 0.15);
+    -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
     padding: 1rem 1.5rem;
     border-radius: 10px;
@@ -329,7 +331,8 @@ section h3 {
 /* Footer */
 .footer {
     margin-top: 1rem;
-    background: rgba(0, 0, 0, 0.05);
+    background: rgba(0, 0, 0, 0.15);
+    -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
     padding: 0.8rem 1.5rem;
     border-radius: 10px;