New: Allowed clear logos to be visible on older browsers

Fix: Frosted effect on page backdrops had stopped working on mobile

Theme/ElegantFin-theme-nightly.css

@@ -124,6 +124,10 @@
     /* use 5em to enable the fading app bar (seamless); 
        use 4.6em to get the solid app bar (cleaner with border) */
     --appBarHeight: 5em;
+
+    /* use 50% to crop the top of the backdrop image slightly (recommended) [default]; 
+       use 0% to prevent the cropping from top, or choose between 0% and 100% according to your preference */
+    --backdropPositionY: 50%;
 }
 
 html {
@@ -1073,27 +1077,14 @@ html {
 }
 
 .detailLogo {
-    /* this hides the detail logo by default to make it only show up on modern browsers */
-    display: none;
-}
-
-@supports (aspect-ratio: 1 / 1) {
-    /* this shows the detail logo on modern browsers */
-
-    .detailLogo {
-        display: block;
-        top: calc(100vh - 10em - var(--primaryItemPageNegativeSpace));
-        left: 0;
-        width: 40%;
-        transform: translateY(-100%);
-        margin: auto 30%;
-        height: 25vh;
-        background-position: bottom;
-    }
-
-    .layout-tv .detailLogo {
-        display: block;
-    }
+    display: block;
+    top: calc(100vh - 10em - var(--primaryItemPageNegativeSpace));
+    left: 0;
+    width: 40%;
+    transform: translateY(-100%);
+    margin: auto 30%;
+    height: 25vh;
+    background-position: bottom;
 }
 
 .layout-mobile .detailLogo {
@@ -1149,6 +1140,7 @@ html {
 }
 
 .layout-tv .detailLogo {
+    display: block;
     height: 20vh;
     top: 39vh;
     left: 30vw;
@@ -1359,8 +1351,12 @@ html,
     background: var(--backgroundGradient);
 }
 
-.layout-desktop .backdropImage:after,
-.layout-desktop .backdropImage:before {
+.backdropImage {
+    background-position-y: var(--backdropPositionY);
+}
+
+.backdropImage:after,
+.backdropImage:before {
     content: "";
     position: absolute;
     top: 0;