diff --git a/.github/diy/patches/argon.patch b/.github/diy/patches/argon.patch
index 2a5b7d393..77ef5f517 100644
--- a/.github/diy/patches/argon.patch
+++ b/.github/diy/patches/argon.patch
@@ -33,38 +33,15 @@
 
 --- a/luci-theme-argon/ucode/template/themes/argon/header_login.ut
 +++ b/luci-theme-argon/ucode/template/themes/argon/header_login.ut
-@@ -46,7 +46,7 @@
+@@ -60,7 +60,7 @@
  
  -%}
  <!DOCTYPE html>
 -<html lang="{{ dispatcher.lang }}">
-+<html lang="{{ dispatcher.lang }}"{% if (mode == 'light'): %} data-darkmode="false"{% else %} data-darkmode="true"{% endif %}>
++<html lang="{{ dispatcher.lang }}"{% if (mode == 'dark'): %} data-darkmode="true"{% elif (mode == 'light'): %} data-darkmode="false"{% endif %}>
  
  <head>
  	{% include("themes/" + theme + "/head_meta", { hostname: hostname, node: node, bar_color: bar_color, media: media }) %}
-@@ -54,9 +54,7 @@
- 	<link rel="stylesheet" href="{{ media }}/css/cascade.css{# ?v=PKG_VERSION #}">
- 	<style title="text/css">
- 		{% if (mode == 'normal'): %}
--			@media (prefers-color-scheme: dark) {
- 				{{ dark_css }}
--			}
- 		{% endif %}
- 		{% if (mode == 'dark'): %}
- 			{{ dark_css }}
-
---- a/luci-theme-argon/ucode/template/themes/argon/header.ut
-+++ b/luci-theme-argon/ucode/template/themes/argon/header.ut
-@@ -55,9 +55,7 @@
- 	<link rel="stylesheet" href="{{ media }}/css/cascade.css{# ?v=PKG_VERSION #}">
- 	<style title="text/css">
- 		{% if (mode == 'normal'): %}
--			@media (prefers-color-scheme: dark) {
- 				{{ dark_css }}
--			}
- 		{% endif %}
- 		{% if (mode == 'dark'): %}
- 			{{ dark_css }}
 
 --- a/luci-theme-argon/ucode/template/themes/argon/header.ut
 +++ b/luci-theme-argon/ucode/template/themes/argon/header.ut
@@ -73,20 +50,20 @@
  -%}
  <!DOCTYPE html>
 -<html lang="{{ dispatcher.lang }}">
-+<html lang="{{ dispatcher.lang }}"{% if (mode == 'light'): %} data-darkmode="false"{% else %} data-darkmode="true"{% endif %}>
++<html lang="{{ dispatcher.lang }}"{% if (mode == 'dark'): %} data-darkmode="true"{% elif (mode == 'light'): %} data-darkmode="false"{% endif %}>
  
  <head>
  	{% include("themes/" + theme + "/head_meta", { hostname: hostname, node: node, bar_color: bar_color, media: media }) %}
 
 --- a/luci-theme-argon/ucode/template/themes/argon/sysauth.ut
 +++ b/luci-theme-argon/ucode/template/themes/argon/sysauth.ut
-@@ -115,11 +115,12 @@
+@@ -136,11 +136,13 @@
  	<!-- Video Player End -->
  	{% else %}
  	<!-- Image Background Start -->
--	<div class="main-bg" id="main-bg" style="background-image:url({{ bgArry.bgUrl }})"></div>
 +	{% online_wallpaper = cfg.get_first('argon', 'global', 'online_wallpaper') ?? 'default' %}
-+	<div class="main-bg" id="main-bg" {% if (online_wallpaper != 'default'): %}style="background-image:url({{ bgArry.bgUrl }})"{% endif %}></div>
+ 	<div class="main-bg" id="main-bg"><img src="{{ entityencode(bgArry.bgUrl, true) }}" data-fallback="{{ media }}/img/bg1.jpg" onerror="this.onerror=null;this.src=this.dataset.fallback" alt=""></div>
++	<div class="main-bg" id="main-bg">{% if (online_wallpaper != 'default'): %}<img src="{{ entityencode(bgArry.bgUrl, true) }}" data-fallback="{{ media }}/img/bg1.jpg" onerror="this.onerror=null;this.src=this.dataset.fallback" alt="">{% endif %}</div>
  	<!-- Image Background End -->
  	{% endif %}
  	<!-- Login Container Start -->
@@ -149,17 +126,17 @@
  		<a class="luci-link" href="{{ version.disturl }}" target="_blank">{{ version.distname }} {{ version.distversion }}-{{ version.distrevision }}</a>
  	</div>
  </footer>
-@@ -42,6 +40,12 @@
- 			}
- 		}
- 	});
+@@ -30,6 +28,12 @@
+ 	<script>
+ 		// thanks for Jo-Philipp Wich <jow@openwrt.org>
+ 		var luciLocation = {{ ctx.path }};
 +  	const loginContainer = document.querySelector(
 +  	  'div[class="login-container"][style*="backdrop-filter: blur(0px)"]'
 +  	);
 +  	if (loginContainer) {
 +  	  loginContainer.style.margin = '0 auto';
 +  	}
- </script>
+ 	</script>
  </body>
  </html>
 diff --git a/luci-theme-argon/htdocs/luci-static/argon/img/pattern.svg b/luci-theme-argon/htdocs/luci-static/argon/img/pattern.svg