diff --git a/app/assets/stylesheets/_global.css b/app/assets/stylesheets/_global.css
index 05c92341a..30e5da88a 100644
--- a/app/assets/stylesheets/_global.css
+++ b/app/assets/stylesheets/_global.css
@@ -1,4 +1,4 @@
-@layer reset, base, components, modules, utilities, native, android, ios;
+@layer reset, base, components, modules, utilities, native, platform;
 
 :root {
   /* Spacing */
diff --git a/app/assets/stylesheets/android.css b/app/assets/stylesheets/android.css
index 4707c2cd0..f30158e8e 100644
--- a/app/assets/stylesheets/android.css
+++ b/app/assets/stylesheets/android.css
@@ -1,4 +1,4 @@
-@layer native {
+@layer platform {
   [data-platform~=android] {
     .hide-on-android {
       display: none;
diff --git a/app/assets/stylesheets/ios.css b/app/assets/stylesheets/ios.css
index 93c67022d..3a05e5956 100644
--- a/app/assets/stylesheets/ios.css
+++ b/app/assets/stylesheets/ios.css
@@ -1,4 +1,4 @@
-@layer native {
+@layer platform {
   [data-platform~=ios] {
     .hide-on-ios {
       display: none;
diff --git a/app/assets/stylesheets/native.css b/app/assets/stylesheets/native.css
index 4d8c66795..e797db955 100644
--- a/app/assets/stylesheets/native.css
+++ b/app/assets/stylesheets/native.css
@@ -10,10 +10,6 @@
       display: none;
     }
 
-    .show-on-native {
-      display: unset;
-    }
-
     /* Header
     /* ------------------------------------------------------------------------ */
 
diff --git a/app/assets/stylesheets/utilities.css b/app/assets/stylesheets/utilities.css
index 22e72a9eb..e252d8981 100644
--- a/app/assets/stylesheets/utilities.css
+++ b/app/assets/stylesheets/utilities.css
@@ -270,7 +270,9 @@
   }
 
   .show-on-native {
-    display: none;
+    body:not([data-platform~=native]) & {
+      display: none;
+    }
   }
 
   .hide-scrollbar {