From e066c033322b85cb646f903c81864b1a91bf4e45 Mon Sep 17 00:00:00 2001
From: Izaak Kuipers <izaak.kuipers@gmail.com>
Date: Thu, 30 Jul 2026 22:50:15 +0200
Subject: [PATCH 1/4] Fix scrollbars + picture-in-picture button in Firefox

---
 src/apps/user/mediaplayer/MediaPlayer.svelte         | 2 +-
 src/css/apps/components/shell/taskbar/openedapps.css | 1 +
 src/css/window.css                                   | 2 ++
 3 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/apps/user/mediaplayer/MediaPlayer.svelte b/src/apps/user/mediaplayer/MediaPlayer.svelte
index 87f113e5f..c3a55560d 100755
--- a/src/apps/user/mediaplayer/MediaPlayer.svelte
+++ b/src/apps/user/mediaplayer/MediaPlayer.svelte
@@ -58,7 +58,7 @@
   {style}
 >
   <div class="video-wrapper" class:show={$isVideo}>
-    <video bind:this={audio}>
+    <video bind:this={audio} disablepictureinpicture>
       <track kind="captions" />
     </video>
   </div>
diff --git a/src/css/apps/components/shell/taskbar/openedapps.css b/src/css/apps/components/shell/taskbar/openedapps.css
index fefb900f5..9cc5f083c 100755
--- a/src/css/apps/components/shell/taskbar/openedapps.css
+++ b/src/css/apps/components/shell/taskbar/openedapps.css
@@ -7,6 +7,7 @@ div.shell div.taskbar div.opened-apps {
   overflow-x: scroll;
   overflow-y: hidden;
   white-space: nowrap;
+  scrollbar-width: none;
 }
 
 div.shell div.taskbar div.opened-apps::-webkit-scrollbar {
diff --git a/src/css/window.css b/src/css/window.css
index 8e63b3ffa..2eb4a3cb5 100755
--- a/src/css/window.css
+++ b/src/css/window.css
@@ -34,6 +34,8 @@ div.window:not(.core) {
   outline: var(--secondary-border) !important;
   display: flex;
   flex-direction: column;
+  scrollbar-color: var(--button-glass-bg) transparent;
+  scrollbar-width: thin;
 }
 
 div.window:not(.core).shell-colored.colored::before {

From 84fd3942220cd5c5003d7da736b3c81756d1957b Mon Sep 17 00:00:00 2001
From: Izaak Kuipers <izaak.kuipers@gmail.com>
Date: Thu, 30 Jul 2026 22:53:20 +0200
Subject: [PATCH 2/4] Apply scrollbar fix to core apps also

---
 src/css/window.css | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/css/window.css b/src/css/window.css
index 2eb4a3cb5..f24930df4 100755
--- a/src/css/window.css
+++ b/src/css/window.css
@@ -34,6 +34,9 @@ div.window:not(.core) {
   outline: var(--secondary-border) !important;
   display: flex;
   flex-direction: column;
+}
+
+div.window {
   scrollbar-color: var(--button-glass-bg) transparent;
   scrollbar-width: thin;
 }
@@ -86,7 +89,7 @@ div.window:not(.core).fullscreen div.titlebar {
   display: none !important;
 }
 
-div.window:not(.core).fullscreen>div.body {
+div.window:not(.core).fullscreen > div.body {
   height: 100vh !important;
   border-top: none !important;
   border-radius: 0 !important;
@@ -96,11 +99,11 @@ div.window:not(.core):not(.glass).focused {
   background-color: var(--glass-bg);
 }
 
-div.window:not(.core):not(.glass).focused>div.titlebar {
+div.window:not(.core):not(.glass).focused > div.titlebar {
   backdrop-filter: blur(var(--blur));
 }
 
-div.window:not(.core):not(.glass)>div.body {
+div.window:not(.core):not(.glass) > div.body {
   background-color: var(--win-bg);
 }
 
@@ -207,4 +210,4 @@ div.window.minimized.no-shell {
   left: unset !important;
   transform: none !important;
   translate: none !important;
-}
\ No newline at end of file
+}

From 0c02a66589c8e3a80e7deb2f07998fb9c8e5224e Mon Sep 17 00:00:00 2001
From: Izaak Kuipers <izaak.kuipers@gmail.com>
Date: Sat, 1 Aug 2026 11:46:35 +0200
Subject: [PATCH 3/4] Make light mode even more readable

---
 .../user/settings/Settings/Page/Shell.svelte  | 13 ++---
 .../admin/adminportal/page/activities.css     |  2 +-
 .../apps/admin/adminportal/page/tokens.css    |  2 +-
 .../apps/admin/adminportal/page/viewshare.css |  2 +-
 src/css/apps/admin/adminportal/sidebar.css    |  2 +-
 src/css/apps/admin/executequery/loadquery.css |  2 +-
 src/css/apps/components/addserver.css         |  2 +-
 src/css/apps/components/arctermcolors.css     |  2 +-
 src/css/apps/components/contextmenu.css       |  5 +-
 src/css/apps/components/firstrun.css          |  2 +-
 .../apps/components/globalloadindicator.css   |  2 +-
 src/css/apps/components/sharelistgui.css      |  2 +-
 src/css/apps/components/sharemgmtgui.css      |  2 +-
 .../shell/actioncenter/quicksettings.css      |  6 +--
 .../components/shell/startmenu/bottom.css     |  2 +-
 src/css/apps/components/shell/taskbar.css     |  4 +-
 .../components/shell/taskbar/calendar.css     |  2 +-
 src/css/apps/components/shell/workspaces.css  |  2 +-
 src/css/apps/core/initialsetup.css            |  2 +-
 src/css/apps/core/switchserver.css            |  2 +-
 src/css/apps/user/camera.css                  | 54 -------------------
 src/css/apps/user/filemanager/addressbar.css  |  6 +--
 src/css/apps/user/filemanager/sidebar.css     |  2 +-
 .../filemanager/virtual/myarcos/userpaths.css |  2 +-
 src/css/apps/user/iconeditor.css              |  2 +-
 src/css/apps/user/logging.css                 |  2 +-
 src/css/apps/user/logging/sidebar.css         |  2 +-
 src/css/apps/user/messages/pagebar.css        |  2 +-
 src/css/apps/user/messages/sidebar.css        |  2 +-
 .../apps/user/settings/overlay/userfont.css   |  4 +-
 src/css/apps/user/settings/section.css        |  2 +-
 .../user/settings/slide/pickpfpbuiltin.css    |  2 +-
 src/css/apps/user/sqeleton/bottompane.css     |  2 +-
 src/css/infoblock.css                         |  2 +-
 src/css/progressbar.css                       |  4 +-
 src/css/themes/dark.css                       |  4 ++
 src/css/themes/light.css                      |  2 +
 src/css/window.css                            | 10 +---
 src/css/window/actionbar.css                  |  9 ++++
 src/css/window/button.css                     | 12 +----
 src/css/window/checkbox/radio.css             |  2 +-
 src/css/window/checkbox/regular.css           |  2 +-
 src/css/window/checkbox/switch.css            |  4 +-
 src/css/window/controls.css                   |  2 +-
 src/lib/AccentedLogo.svelte                   |  4 +-
 src/lib/CircularProgress.svelte               |  2 +-
 src/ts/daemon/contexts/apprenderer.ts         | 35 ++++++++----
 src/ts/images/apps.ts                         |  1 +
 src/ts/util/color.ts                          |  2 +-
 49 files changed, 99 insertions(+), 142 deletions(-)
 delete mode 100755 src/css/apps/user/camera.css

diff --git a/src/apps/user/settings/Settings/Page/Shell.svelte b/src/apps/user/settings/Settings/Page/Shell.svelte
index 6b3aa9313..0d8dc5890 100755
--- a/src/apps/user/settings/Settings/Page/Shell.svelte
+++ b/src/apps/user/settings/Settings/Page/Shell.svelte
@@ -30,14 +30,11 @@
     <Option caption="Show window titles">
       <input type="checkbox" class="switch" bind:checked={$userPreferences.shell.taskbar.labels} />
     </Option>
-    <Option caption="Show battery percentage">
-      <input
-        type="checkbox"
-        class="switch"
-        bind:checked={$userPreferences.shell.taskbar.batteryPercentage}
-        disabled={!battery || !$battery}
-      />
-    </Option>
+    {#if $battery}
+      <Option caption="Show battery percentage">
+        <input type="checkbox" class="switch" bind:checked={$userPreferences.shell.taskbar.batteryPercentage} />
+      </Option>
+    {/if}
     <Option caption="Show clock...">
       <button
         class:suggested={$userPreferences.shell.taskbar.clock12hr}
diff --git a/src/css/apps/admin/adminportal/page/activities.css b/src/css/apps/admin/adminportal/page/activities.css
index 1abede0e8..dd5790dca 100755
--- a/src/css/apps/admin/adminportal/page/activities.css
+++ b/src/css/apps/admin/adminportal/page/activities.css
@@ -41,7 +41,7 @@
 
 #AdminPortal .container.activities div.segment.icon span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #AdminPortal .container.activities div.segment.username {
diff --git a/src/css/apps/admin/adminportal/page/tokens.css b/src/css/apps/admin/adminportal/page/tokens.css
index b68e7baa6..437f30889 100755
--- a/src/css/apps/admin/adminportal/page/tokens.css
+++ b/src/css/apps/admin/adminportal/page/tokens.css
@@ -57,7 +57,7 @@
 
 #AdminPortal .container.tokens div.segment.icon span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #AdminPortal .container.tokens div.segment.author {
diff --git a/src/css/apps/admin/adminportal/page/viewshare.css b/src/css/apps/admin/adminportal/page/viewshare.css
index 8cc4f7c43..a1e57274b 100755
--- a/src/css/apps/admin/adminportal/page/viewshare.css
+++ b/src/css/apps/admin/adminportal/page/viewshare.css
@@ -235,7 +235,7 @@
 }
 
 #AdminPortal div.viewShare div.accessor-row div.segment.icon span.lucide {
-  color: var(--accent-light);
+  color: var(--accent-textual);
   font-weight: normal;
   font-size: 16px;
 }
diff --git a/src/css/apps/admin/adminportal/sidebar.css b/src/css/apps/admin/adminportal/sidebar.css
index 27e119ea1..095cd2f56 100755
--- a/src/css/apps/admin/adminportal/sidebar.css
+++ b/src/css/apps/admin/adminportal/sidebar.css
@@ -31,7 +31,7 @@
 
 #AdminPortal > div.body div.sidebar button span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #AdminPortal > div.body div.sidebar hr {
diff --git a/src/css/apps/admin/executequery/loadquery.css b/src/css/apps/admin/executequery/loadquery.css
index 86e03e68b..1b3241c8a 100644
--- a/src/css/apps/admin/executequery/loadquery.css
+++ b/src/css/apps/admin/executequery/loadquery.css
@@ -33,5 +33,5 @@
 
 #ExecuteQueryApp #LoadQueryOverlay > div.body div.list button span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
diff --git a/src/css/apps/components/addserver.css b/src/css/apps/components/addserver.css
index 35bb1e47b..20bc6b9bc 100644
--- a/src/css/apps/components/addserver.css
+++ b/src/css/apps/components/addserver.css
@@ -64,7 +64,7 @@
 }
 #AddServer > div.body div.input.port div.options button.selected {
   font-weight: bold;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 #AddServer > div.body div.input.port div.options div.sep {
   opacity: 0.2;
diff --git a/src/css/apps/components/arctermcolors.css b/src/css/apps/components/arctermcolors.css
index a146825c0..7b83a79b7 100644
--- a/src/css/apps/components/arctermcolors.css
+++ b/src/css/apps/components/arctermcolors.css
@@ -144,7 +144,7 @@
   outline: none;
   font-size: 16px;
   background-color: transparent;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #ArcTermColors > div.body > div.content.presets div.preset.selected button.lucide.icon-check {
diff --git a/src/css/apps/components/contextmenu.css b/src/css/apps/components/contextmenu.css
index 8dee05149..5770cca9d 100755
--- a/src/css/apps/components/contextmenu.css
+++ b/src/css/apps/components/contextmenu.css
@@ -111,8 +111,9 @@
 }
 
 #contextMenu div.context-menu.colored button.menu-item:not(.subitems):active {
-  background-color: var(--accent-transparent);
-  color: var(--accent-light);
+  background-color: var(--accent-textual);
+  opacity: 1;
+  color: var(--win-bg);
   box-shadow: none;
 }
 
diff --git a/src/css/apps/components/firstrun.css b/src/css/apps/components/firstrun.css
index be2ec81d5..0152b96db 100755
--- a/src/css/apps/components/firstrun.css
+++ b/src/css/apps/components/firstrun.css
@@ -177,7 +177,7 @@
 }
 
 #FirstRun_ChooseProfilePicture > div.body div.profile-picture-grid button.selected {
-  outline: var(--accent-light) 3px solid !important;
+  outline: var(--accent-textual) 3px solid !important;
   /* scale: 1.1; */
   outline-offset: -1px;
 }
diff --git a/src/css/apps/components/globalloadindicator.css b/src/css/apps/components/globalloadindicator.css
index 42e49f3e0..d5bcb8189 100755
--- a/src/css/apps/components/globalloadindicator.css
+++ b/src/css/apps/components/globalloadindicator.css
@@ -39,5 +39,5 @@
   width: var(--value, 0%);
   height: 6px;
   border-radius: 3px;
-  background-color: var(--accent-light);
+  background-color: var(--accent-textual);
 }
diff --git a/src/css/apps/components/sharelistgui.css b/src/css/apps/components/sharelistgui.css
index f26614a86..94786aff5 100755
--- a/src/css/apps/components/sharelistgui.css
+++ b/src/css/apps/components/sharelistgui.css
@@ -75,7 +75,7 @@
 }
 
 #ShareListGui > div.body div.listing button.selected > span.lucide {
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #ShareListGui > div.body button.refresh {
diff --git a/src/css/apps/components/sharemgmtgui.css b/src/css/apps/components/sharemgmtgui.css
index c5e3d1e9f..a2edf9bba 100755
--- a/src/css/apps/components/sharemgmtgui.css
+++ b/src/css/apps/components/sharemgmtgui.css
@@ -98,7 +98,7 @@
 }
 
 #ShareMgmtGui > div.body div.user-list div.user.selected span.lucide {
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #ShareMgmtGui > div.body div.user-list div.user.selected > button {
diff --git a/src/css/apps/components/shell/actioncenter/quicksettings.css b/src/css/apps/components/shell/actioncenter/quicksettings.css
index b4a882d68..ab631abaa 100755
--- a/src/css/apps/components/shell/actioncenter/quicksettings.css
+++ b/src/css/apps/components/shell/actioncenter/quicksettings.css
@@ -51,8 +51,8 @@ div.shell div.actioncenter div.quick-settings div.sep {
 }
 
 div.shell div.actioncenter div.quick-settings button.active {
-  background-color: var(--accent-light);
-  color: var(--accent-suggested-fg);
+  background-color: var(--accent-textual);
+  color: var(--accent-textual-fg  );
 }
 
 div.shell div.actioncenter div.quick-settings button.active:hover {
@@ -62,5 +62,5 @@ div.shell div.actioncenter div.quick-settings button.active:hover {
 div.shell div.actioncenter div.quick-settings button.active:active {
   opacity: 0.5;
   filter: none;
-  background-color: var(--accent-light) !important;
+  background-color: var(--accent-textual) !important;
 }
diff --git a/src/css/apps/components/shell/startmenu/bottom.css b/src/css/apps/components/shell/startmenu/bottom.css
index 8612c19c3..94f69fb6e 100755
--- a/src/css/apps/components/shell/startmenu/bottom.css
+++ b/src/css/apps/components/shell/startmenu/bottom.css
@@ -67,7 +67,7 @@ div.shell div.startmenu div.bottom div.actions button span {
 }
 
 div.shell div.startmenu div.bottom div.actions button:hover {
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 div.shell div.startmenu div.bottom div.actions button:active {
diff --git a/src/css/apps/components/shell/taskbar.css b/src/css/apps/components/shell/taskbar.css
index b25347721..4cca9f2eb 100755
--- a/src/css/apps/components/shell/taskbar.css
+++ b/src/css/apps/components/shell/taskbar.css
@@ -274,14 +274,14 @@ div.shell div.taskbar button.clock-button:active {
 }
 
 div.shell div.taskbar button.clock-button.active {
-  background-color: var(--accent-light) !important;
+  background-color: var(--accent-textual) !important;
   color: var(--win-bg) !important;
 }
 
 div.shell div.shell div.taskbar button.clock-button.active,
 #arcShell div.shell div.taskbar button.workspace-manager-button.active,
 #arcShell div.shell div.taskbar button.action-center-button.active {
-  background-color: var(--accent-light) !important;
+  background-color: var(--accent-textual) !important;
 }
 
 div.shell div.shell div.taskbar button.clock-button.active span,
diff --git a/src/css/apps/components/shell/taskbar/calendar.css b/src/css/apps/components/shell/taskbar/calendar.css
index c8a21a93d..86e725034 100644
--- a/src/css/apps/components/shell/taskbar/calendar.css
+++ b/src/css/apps/components/shell/taskbar/calendar.css
@@ -121,7 +121,7 @@
 }
 
 #arcShell div.taskbar div.calendar-popup div.calendar div.day.today p.day-number {
-  background-color: var(--accent-light);
+  background-color: var(--accent-textual);
   color: var(--win-bg) !important;
 }
 
diff --git a/src/css/apps/components/shell/workspaces.css b/src/css/apps/components/shell/workspaces.css
index 0d9891429..c6423a8f5 100755
--- a/src/css/apps/components/shell/workspaces.css
+++ b/src/css/apps/components/shell/workspaces.css
@@ -53,7 +53,7 @@
 }
 
 #arcShell div.virtual-desktops button.desktop.selected {
-  outline: var(--accent-light) 2px solid !important;
+  outline: var(--accent-textual) 2px solid !important;
   outline-offset: -2px;
 }
 
diff --git a/src/css/apps/core/initialsetup.css b/src/css/apps/core/initialsetup.css
index a374d45be..04bbde83a 100755
--- a/src/css/apps/core/initialsetup.css
+++ b/src/css/apps/core/initialsetup.css
@@ -97,7 +97,7 @@
 #initialSetupWizard div.hero-page > .lucide {
   width: 72px;
   height: 72px;
-  stroke: var(--accent-light);
+  stroke: var(--accent-textual);
   margin-bottom: 20px;
 }
 
diff --git a/src/css/apps/core/switchserver.css b/src/css/apps/core/switchserver.css
index f9f0097d4..bdfd0e494 100644
--- a/src/css/apps/core/switchserver.css
+++ b/src/css/apps/core/switchserver.css
@@ -33,7 +33,7 @@
 }
 
 #SwitchServer > div.body div.selector div.server-option button.selector span.lucide {
-  color: var(--accent-light);
+  color: var(--accent-textual);
   font-size: 48px;
 }
 
diff --git a/src/css/apps/user/camera.css b/src/css/apps/user/camera.css
deleted file mode 100755
index c30d28d41..000000000
--- a/src/css/apps/user/camera.css
+++ /dev/null
@@ -1,54 +0,0 @@
-#CameraApp > div.body {
-  padding: 0;
-  background-color: #000;
-}
-
-#CameraApp > div.body div.viewfinder {
-  width: 100%;
-  height: 100%;
-}
-
-#CameraApp > div.body video {
-  width: 100%;
-  height: 100%;
-  object-fit: contain;
-}
-
-#CameraApp > div.body div.panel {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  height: 61px;
-  border-top: var(--win-border);
-  background-color: var(--glass-bg);
-  backdrop-filter: blur(var(--blur));
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  justify-content: end;
-  padding-right: 15px;
-}
-
-#CameraApp > div.body div.panel > button:not(.capture) {
-  width: 30px;
-  height: 30px;
-  padding: 0;
-  font-size: 16px;
-}
-
-#CameraApp > div.body div.panel button.capture {
-  width: 40px;
-  height: 40px;
-  position: absolute;
-  left: 50%;
-  translate: -20px;
-  top: 10px;
-  border-radius: 50%;
-  background-color: var(--accent-light);
-  color: var(--accent-darkest);
-  padding: 0;
-  font-size: 24px;
-  min-width: unset;
-  font-weight: normal;
-}
diff --git a/src/css/apps/user/filemanager/addressbar.css b/src/css/apps/user/filemanager/addressbar.css
index b45d4a487..0cea9dd71 100755
--- a/src/css/apps/user/filemanager/addressbar.css
+++ b/src/css/apps/user/filemanager/addressbar.css
@@ -72,8 +72,8 @@
 }
 
 #fileManager div.address-bar button.activated {
-  background-color: var(--accent-light) !important;
-  color: var(--accent-darkest);
+  background-color: var(--accent-textual) !important;
+  color: var(--accent-suggested-fg);
 }
 
 #fileManager div.address-bar div.path div.pill {
@@ -114,7 +114,7 @@
 
 #fileManager div.address-bar div.path div.pill span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
   height: 16px;
 }
 
diff --git a/src/css/apps/user/filemanager/sidebar.css b/src/css/apps/user/filemanager/sidebar.css
index 36a2b2aff..581ed85c4 100755
--- a/src/css/apps/user/filemanager/sidebar.css
+++ b/src/css/apps/user/filemanager/sidebar.css
@@ -37,7 +37,7 @@
 
 #fileManager > div.body div.sidebar button span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
   height: 16px;
 }
 
diff --git a/src/css/apps/user/filemanager/virtual/myarcos/userpaths.css b/src/css/apps/user/filemanager/virtual/myarcos/userpaths.css
index da4892b02..306b43851 100644
--- a/src/css/apps/user/filemanager/virtual/myarcos/userpaths.css
+++ b/src/css/apps/user/filemanager/virtual/myarcos/userpaths.css
@@ -47,7 +47,7 @@
 #fileManager > div.body div.my_arcos section.user-paths > div button span.pill span.lucide {
   font-size: 16px;
   height: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #fileManager > div.body div.my_arcos section.user-paths > div button span.path > span.lucide {
diff --git a/src/css/apps/user/iconeditor.css b/src/css/apps/user/iconeditor.css
index 592c7ea20..d2708a2f0 100644
--- a/src/css/apps/user/iconeditor.css
+++ b/src/css/apps/user/iconeditor.css
@@ -31,7 +31,7 @@
 }
 
 #IconEditorApp > div.body div.sidebar button span.lucide {
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #IconEditorApp > div.body div.sidebar button.selected {
diff --git a/src/css/apps/user/logging.css b/src/css/apps/user/logging.css
index 531445b3b..bc9d30799 100755
--- a/src/css/apps/user/logging.css
+++ b/src/css/apps/user/logging.css
@@ -77,7 +77,7 @@
 
 #logging div.options div.current-source div.pill span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #logging div.options.archive div.current-source div.pill,
diff --git a/src/css/apps/user/logging/sidebar.css b/src/css/apps/user/logging/sidebar.css
index 7e8db07c7..0c71a18b8 100755
--- a/src/css/apps/user/logging/sidebar.css
+++ b/src/css/apps/user/logging/sidebar.css
@@ -38,7 +38,7 @@
 
 #logging > div.body div.sidebar button span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #logging > div.body div.sidebar button .circular-progress {
diff --git a/src/css/apps/user/messages/pagebar.css b/src/css/apps/user/messages/pagebar.css
index 0c5ae9ee7..dd974fea0 100644
--- a/src/css/apps/user/messages/pagebar.css
+++ b/src/css/apps/user/messages/pagebar.css
@@ -25,5 +25,5 @@
 
 #Messages > div.body div.pages button.active {
   background-color: var(--accent-transparent);
-  color: var(--accent-lighter);
+  color: var(--accent-textual);
 }
diff --git a/src/css/apps/user/messages/sidebar.css b/src/css/apps/user/messages/sidebar.css
index 79a3987c3..e09137f9f 100644
--- a/src/css/apps/user/messages/sidebar.css
+++ b/src/css/apps/user/messages/sidebar.css
@@ -77,7 +77,7 @@
   width: 2px;
   height: 16px;
   border-radius: 1px;
-  background-color: var(--accent-light);
+  background-color: var(--accent-textual);
   position: absolute;
   top: calc(50% - 8px);
   left: 0;
diff --git a/src/css/apps/user/settings/overlay/userfont.css b/src/css/apps/user/settings/overlay/userfont.css
index 386bebf30..a8bfbcf04 100755
--- a/src/css/apps/user/settings/overlay/userfont.css
+++ b/src/css/apps/user/settings/overlay/userfont.css
@@ -33,7 +33,7 @@
 }
 
 #systemSettings #UserFont div.body button.reset-font span.lucide {
-  color: var(--accent-lighter);
+  color: var(--accent-textual);
   font-size: 32px;
 }
 
@@ -52,7 +52,7 @@
 #systemSettings #UserFont div.body div.options button span.lucide {
   font-size: 16px;
   height: 16px;
-  color: var(--accent-lighter);
+  color: var(--accent-textual);
 }
 
 #systemSettings #UserFont div.body div.options button:hover {
diff --git a/src/css/apps/user/settings/section.css b/src/css/apps/user/settings/section.css
index 693bd6ff7..4f9e105c2 100755
--- a/src/css/apps/user/settings/section.css
+++ b/src/css/apps/user/settings/section.css
@@ -94,7 +94,7 @@
 
 #systemSettings section div.content div.option div.name span.lucide {
   font-size: 16px;
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #systemSettings section div.content div.option div.name img {
diff --git a/src/css/apps/user/settings/slide/pickpfpbuiltin.css b/src/css/apps/user/settings/slide/pickpfpbuiltin.css
index 7ec2033c2..0c92795b4 100755
--- a/src/css/apps/user/settings/slide/pickpfpbuiltin.css
+++ b/src/css/apps/user/settings/slide/pickpfpbuiltin.css
@@ -30,7 +30,7 @@
 }
 
 #systemSettings div.slide.account_pickPfpBuiltin div.profile-picture-grid button.selected {
-  outline: var(--accent-light) 3px solid !important;
+  outline: var(--accent-textual) 3px solid !important;
   /* scale: 1.1; */
   outline-offset: -1px;
 }
diff --git a/src/css/apps/user/sqeleton/bottompane.css b/src/css/apps/user/sqeleton/bottompane.css
index 45f228ef1..9df0eb408 100644
--- a/src/css/apps/user/sqeleton/bottompane.css
+++ b/src/css/apps/user/sqeleton/bottompane.css
@@ -46,7 +46,7 @@
 }
 
 #Sqeleton > div.body div.bottom-pane div.tabs button.active > span:not(.count) {
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 #Sqeleton > div.body div.bottom-pane div.tabs button.active::after {
diff --git a/src/css/infoblock.css b/src/css/infoblock.css
index 6309bb063..69a77ff84 100755
--- a/src/css/infoblock.css
+++ b/src/css/infoblock.css
@@ -69,7 +69,7 @@ div.window:not(.core) div.body div.info-block div.segment p.value {
 }
 
 div.window:not(.core) div.body div.info-block div.segment p.title button.help:hover {
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 div.window:not(.core) div.body div.info-block div.segment.right {
diff --git a/src/css/progressbar.css b/src/css/progressbar.css
index 018b0021d..9fa933204 100755
--- a/src/css/progressbar.css
+++ b/src/css/progressbar.css
@@ -13,7 +13,7 @@ div.progress-bar div.inner {
   --width: 0%;
   height: calc(var(--bar-height) - 2px);
   width: var(--width, 0%);
-  background-color: var(--accent-dark);
+  background-color: var(--accent-textual);
   position: relative;
   overflow: hidden;
 }
@@ -30,7 +30,7 @@ div.progress-bar:not(.indeterminate) div.inner::after {
   left: 0;
   width: 40%;
   height: calc(var(--bar-height) - 2px);
-  background: linear-gradient(to right, #0000 0%, var(--accent-light) 50%, #0000 100%);
+  background: linear-gradient(to right, #0000 0%, var(--accent-lighter) 50%, #0000 100%);
   animation: progress-bar-inner-effect 2s linear infinite;
 }
 
diff --git a/src/css/themes/dark.css b/src/css/themes/dark.css
index 84d702c5b..6f07feef9 100755
--- a/src/css/themes/dark.css
+++ b/src/css/themes/dark.css
@@ -52,6 +52,8 @@
 
 :root {
   --accent: dodgerblue;
+  --accent-dark-medium: rgb(0, 134, 178);
+  --accent-dark-medium-fg: #000;
   --accent-dark: rgb(0, 94, 126);
   --accent-light: #80dfff;
   --accent-darkest: rgb(0, 46, 61);
@@ -59,6 +61,8 @@
   --accent-suggested-start: var(--accent) !important;
   --accent-suggested-end: var(--accent) !important;
   --accent-suggested-fg: #000 !important;
+  --accent-textual: var(--accent-light);
+  --accent-textual-fg: var(--accent-suggested-fg);
 }
 
 :root .theme-dark.noglass {
diff --git a/src/css/themes/light.css b/src/css/themes/light.css
index e2e6b1b97..5a5051835 100755
--- a/src/css/themes/light.css
+++ b/src/css/themes/light.css
@@ -46,6 +46,8 @@
   --accent-darken: brightness(0.7);
   --secondary-border: var(--win-bg) 1px solid;
   --secondary-box-shadow: none !important;
+  --accent-textual: var(--accent-dark-medium);
+  --accent-textual-fg: var(--accent-dark-medium-fg);
 }
 
 :root .theme-light.noglass {
diff --git a/src/css/window.css b/src/css/window.css
index f24930df4..a89102ba1 100755
--- a/src/css/window.css
+++ b/src/css/window.css
@@ -148,16 +148,8 @@ div.window.overlay.glass {
 }
 
 div.window:not(.core) a {
-  color: var(--accent-light);
+  color: var(--accent-textual);
   text-underline-offset: 2px;
-
-  .theme-light & {
-    /*
-       * Uses the calculated result if available,
-       * otherwise, uses uglier dark accent color.
-       */
-    color: var(--accent-suggested-end, var(--accent-dark));
-  }
 }
 
 div.window:not(.core) div.resizer {
diff --git a/src/css/window/actionbar.css b/src/css/window/actionbar.css
index 4b6f457fc..1502802b3 100644
--- a/src/css/window/actionbar.css
+++ b/src/css/window/actionbar.css
@@ -3,6 +3,10 @@ div.window.glass div.window-action-bar {
   border-top-color: var(--button-glass-bg);
 }
 
+.theme-light div.window:not(.glass) div.window-action-bar {
+  background-color: var(--win-bg);
+}
+
 div.window div.window-action-bar {
   height: 51px;
   padding: 10px;
@@ -114,12 +118,17 @@ div.window div.window-action-bar button.action-bar-icon-button {
   align-items: center;
   font-size: 16px;
   min-width: fit-content;
+  border:var(--win-border)
 }
 
 div.window div.window-action-bar button.action-bar-button * {
   color: inherit !important;
 }
 
+div.window div.window-action-bar button.suggested {
+  box-shadow: none !important;
+}
+
 div.window div.window-action-bar div.sep {
   width: 1px;
   height: 20px;
diff --git a/src/css/window/button.css b/src/css/window/button.css
index 2dde914d5..0a281c4b9 100755
--- a/src/css/window/button.css
+++ b/src/css/window/button.css
@@ -30,28 +30,18 @@ div.window div.body button:not(.reset):hover {
 }
 
 button:not(.reset):not(:disabled):active {
-  /* scale: 0.95; */
   opacity: 0.8;
 }
 
 div.window div.body button:not(.reset).link {
   margin: 0;
   padding: 0;
-  color: var(--accent-light);
+  color: var(--accent-textual);
   background-color: transparent !important;
   text-decoration: underline;
   text-underline-offset: 2px;
   width: fit-content;
   border-radius: 0;
-
-  .theme-light & {
-    /*
-     * Uses the calculated result if available,
-     * otherwise, uses uglier dark accent color.
-     */
-    color: var(--accent-suggested-end, var(--accent-dark));
-  }
-
 }
 
 div.window div.body button:not(.reset):disabled {
diff --git a/src/css/window/checkbox/radio.css b/src/css/window/checkbox/radio.css
index 275336f6e..6a9a1457d 100644
--- a/src/css/window/checkbox/radio.css
+++ b/src/css/window/checkbox/radio.css
@@ -44,7 +44,7 @@ div.window > div.body input[type="radio"]:not(.switch):checked::after {
 }
 
 div.window > div.body input[type="radio"]:not(.switch):checked:hover {
-  background-color: var(--accent-light);
+  background-color: var(--accent-textual);
 }
 
 div.window > div.body input[type="radio"]:not(.switch):disabled {
diff --git a/src/css/window/checkbox/regular.css b/src/css/window/checkbox/regular.css
index 359817437..815e46574 100644
--- a/src/css/window/checkbox/regular.css
+++ b/src/css/window/checkbox/regular.css
@@ -48,7 +48,7 @@ div.window > div.body input[type="checkbox"]:not(.switch):checked::after {
 }
 
 div.window > div.body input[type="checkbox"]:not(.switch):checked:hover {
-  background-color: var(--accent-light);
+  background-color: var(--accent-textual);
 }
 
 div.window > div.body input[type="checkbox"]:not(.switch):disabled {
diff --git a/src/css/window/checkbox/switch.css b/src/css/window/checkbox/switch.css
index f73912a72..bdc01af0d 100644
--- a/src/css/window/checkbox/switch.css
+++ b/src/css/window/checkbox/switch.css
@@ -37,7 +37,7 @@ div.window > div.body input[type="checkbox"].switch:hover {
 }
 
 div.window > div.body input[type="checkbox"].switch:checked {
-  background-color: var(--accent-light);
+  background-color: var(--accent-textual);
 }
 
 div.window > div.body input[type="checkbox"].switch:checked::after {
@@ -46,7 +46,7 @@ div.window > div.body input[type="checkbox"].switch:checked::after {
 }
 
 div.window > div.body input[type="checkbox"].switch:checked:hover {
-  background-color: var(--accent-light);
+  background-color: var(--accent-textual);
 }
 
 div.window > div.body input[type="checkbox"].switch:disabled {
diff --git a/src/css/window/controls.css b/src/css/window/controls.css
index 124570527..effdc2184 100755
--- a/src/css/window/controls.css
+++ b/src/css/window/controls.css
@@ -63,7 +63,7 @@ div.window > div.titlebar div.alt-menu button:hover {
 }
 div.window > div.body div.titlebar.custom div.controls button:hover,
 div.window > div.titlebar div.controls button:hover {
-  color: var(--accent-light);
+  color: var(--accent-textual);
 }
 
 div.window > div.body div.titlebar.custom div.controls button:disabled,
diff --git a/src/lib/AccentedLogo.svelte b/src/lib/AccentedLogo.svelte
index d8f007ce2..f300e6bd4 100644
--- a/src/lib/AccentedLogo.svelte
+++ b/src/lib/AccentedLogo.svelte
@@ -4,7 +4,7 @@
 
 <svg {width} {height} viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" class="accented-logo">
   <path
-    opacity="0.5"
+    opacity="0.7"
     d="M47.3722 16.1737C48.8334 15.4359 50.5584 15.435 52.0196 16.1727C52.9151 16.6249 53.6596 17.3293 54.1612 18.1981L81.3917 65.3631C81.9439 66.3197 81.6167 67.5432 80.6602 68.0956C79.8703 68.5512 78.8606 68.2796 78.4058 67.4893L55.9727 28.5067C55.2697 27.2851 54.2252 26.295 52.9679 25.6581C50.9104 24.6159 48.4794 24.6159 46.422 25.6581C45.1646 26.295 44.1201 27.2851 43.4171 28.5067L20.9816 67.4909C20.5276 68.2798 19.5197 68.5506 18.7315 68.0956C17.7751 67.5432 17.4478 66.3197 18.0001 65.3631L45.2315 18.1971C45.733 17.3287 46.477 16.6257 47.3722 16.1737Z"
     fill="white"
     class="part"
@@ -20,6 +20,6 @@
 
 <style scoped>
   svg .part {
-    fill: var(--accent-light);
+    fill: var(--accent-textual);
   }
 </style>
diff --git a/src/lib/CircularProgress.svelte b/src/lib/CircularProgress.svelte
index caef70fc1..053c0d37a 100755
--- a/src/lib/CircularProgress.svelte
+++ b/src/lib/CircularProgress.svelte
@@ -51,7 +51,7 @@
 
   .progress {
     fill: none;
-    stroke: var(--accent-lighter);
+    stroke: var(--accent-textual);
     stroke-linecap: round;
     transition: stroke-dashoffset 0.3s ease;
   }
diff --git a/src/ts/daemon/contexts/apprenderer.ts b/src/ts/daemon/contexts/apprenderer.ts
index 10f9a110a..40a7065f8 100644
--- a/src/ts/daemon/contexts/apprenderer.ts
+++ b/src/ts/daemon/contexts/apprenderer.ts
@@ -21,19 +21,34 @@ export class AppRendererUserContext extends UserContext implements IAppRendererU
   }
 
   getAppRendererStyle(accent: string) {
+    const accentTransparent = `${hex3to6(accent)}44`;
+    const accentLight = lightenColor(accent);
+    const accentLighter = lightenColor(accent, 7.5);
+    const accentDarkMedium = darkenColor(accent, 20);
+    const accentDark = darkenColor(accent, 75);
+    const accentDarkest = darkenColor(accent, 85);
+    const accentLightTransparent = `${lightenColor(accent)}77`;
+    const accentLightInvert = invertColor(lightenColor(accent));
+    const accentSuggestedStart = `#${accent}`
+    const accentSuggestedEnd = darkenColor(accent, 10);
+    const accentSuggestedFg = bestForeground(accent); 
+    const accentDarkMediumFg = bestForeground(accentDarkMedium);
+
     return `
       --blur: ${Daemon!.preferences().shell.visuals.blurRadius}px;
       --accent: ${hex3to6(accent)} !important;
-      --accent-transparent: ${hex3to6(accent)}44 !important;
-      --accent-light: ${lightenColor(accent)} !important;
-      --accent-lighter: ${lightenColor(accent, 7.5)} !important;
-      --accent-dark: ${darkenColor(accent, 75)} !important;
-      --accent-darkest: ${darkenColor(accent, 85)} !important;
-      --accent-light-transparent: ${lightenColor(accent)}77 !important;
-      --accent-light-invert: ${invertColor(lightenColor(accent))} !important;
-      --accent-suggested-start: #${accent} !important;
-      --accent-suggested-end: ${darkenColor(accent, 10)} !important;
-      --accent-suggested-fg: ${bestForeground(accent)} !important;
+      --accent-transparent: ${accentTransparent} !important;
+      --accent-light: ${accentLight} !important;
+      --accent-lighter: ${accentLighter} !important;
+      --accent-dark-medium: ${accentDarkMedium} !important;
+      --accent-dark-medium-fg: ${accentDarkMediumFg} !important;
+      --accent-dark: ${accentDark} !important;
+      --accent-darkest: ${accentDarkest} !important;
+      --accent-light-transparent: ${accentLightTransparent} !important;
+      --accent-light-invert: ${accentLightInvert} !important;
+      --accent-suggested-start: ${accentSuggestedStart} !important;
+      --accent-suggested-end: ${accentSuggestedEnd} !important;
+      --accent-suggested-fg: ${accentSuggestedFg} !important;
       --wallpaper: url('${Daemon!.wallpaper?.Wallpaper()?.url || Wallpapers.img0.url}');
       --user-font: "${Daemon!.preferences().shell.visuals.userFont || ""}";`;
   }
diff --git a/src/ts/images/apps.ts b/src/ts/images/apps.ts
index cbef73dd9..f62129fb7 100755
--- a/src/ts/images/apps.ts
+++ b/src/ts/images/apps.ts
@@ -24,3 +24,4 @@ export { default as MinesweeperIcon } from "$assets/apps/minesweeper.svg";
 export { default as MinesweeperHappyIcon } from "$assets/apps/minesweeper/sweeper-happy.svg";
 export { default as MinesweeperOohIcon } from "$assets/apps/minesweeper/sweeper-ooh.svg";
 export { default as MinesweeperDeadIcon } from "$assets/apps/minesweeper/sweeper-dead.svg";
+ 
\ No newline at end of file
diff --git a/src/ts/util/color.ts b/src/ts/util/color.ts
index 095a312e5..156290654 100644
--- a/src/ts/util/color.ts
+++ b/src/ts/util/color.ts
@@ -49,7 +49,7 @@ export function bestForeground(bgColor: string) {
 
   const difference = color1.deltaE(color2, "CMC");
 
-  return difference > 40 ? "white" : "black";
+  return difference > 30 ? "white" : "black";
 }
 
 export async function getReadableVibrantColor(url: string): Promise<string> {

From ecb62bbff4147454485d2c6b85fb28a03e029896 Mon Sep 17 00:00:00 2001
From: Izaak Kuipers <izaak.kuipers@gmail.com>
Date: Sun, 2 Aug 2026 00:20:26 +0200
Subject: [PATCH 4/4] Move the weather applet to the taskbar

---
 src/apps/components/shell/Shell.svelte        |  49 ++++----
 .../shell/Shell/ActionCenter.svelte           |   4 -
 .../shell/Shell/ActionCenter/CardStack.svelte |  67 -----------
 .../CardStack/Cards/Gallery.svelte            | 106 ------------------
 .../ActionCenter/CardStack/Cards/Notes.svelte |   9 --
 .../CardStack/Cards/Weather.svelte            |  95 ----------------
 .../ActionCenter/CardStack/Indicator.svelte   |   9 --
 .../components/shell/Shell/Taskbar.svelte     |   2 +
 .../Shell/Taskbar/TaskbarWeatherApplet.svelte |  97 ++++++++++++++++
 src/apps/components/shell/runtime.ts          |  32 ------
 .../user/settings/Settings/Page/Shell.svelte  |  16 ++-
 .../Settings/Slides/WeatherLocation.svelte    |  11 +-
 src/css/apps/components/contextmenu.css       |   6 +-
 src/css/apps/components/messagebox.css        |   3 +-
 .../apps/components/shell/actioncenter.css    |   1 -
 .../shell/actioncenter/cardstack.css          |  34 ------
 .../shell/actioncenter/cardstack/gallery.css  |  15 ---
 .../actioncenter/cardstack/indicator.css      |  26 -----
 .../shell/actioncenter/cardstack/notes.css    |  19 ----
 .../shell/actioncenter/cardstack/weather.css  |  85 --------------
 .../shell/actioncenter/notifications.css      |   2 +-
 src/css/apps/components/shell/taskbar.css     |   4 +-
 .../shell/taskbar/weatherapplet.css           |  87 ++++++++++++++
 src/css/apps/components/shell/workspaces.css  |   4 +-
 src/css/apps/user/mediaplayer/player.css      |  16 ++-
 src/css/apps/user/settings/section.css        |  16 +++
 src/css/window.css                            |   7 ++
 src/interfaces/IUserDaemon.ts                 |   3 +-
 src/interfaces/runtimes/IShellRuntime.ts      |   1 -
 src/ts/daemon/contexts/init.ts                |   2 +
 src/ts/daemon/index.ts                        |   1 +
 src/ts/helpers/weather.ts                     |   6 +-
 .../services/MigrationSvc/index.ts            |   8 +-
 .../nodes/WeatherSettingsMigration.ts         |  36 ++++++
 src/ts/user/default.ts                        |  13 ++-
 src/types/user/index.ts                       |  11 +-
 36 files changed, 349 insertions(+), 554 deletions(-)
 delete mode 100755 src/apps/components/shell/Shell/ActionCenter/CardStack.svelte
 delete mode 100755 src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Gallery.svelte
 delete mode 100755 src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Notes.svelte
 delete mode 100755 src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Weather.svelte
 delete mode 100755 src/apps/components/shell/Shell/ActionCenter/CardStack/Indicator.svelte
 create mode 100644 src/apps/components/shell/Shell/Taskbar/TaskbarWeatherApplet.svelte
 delete mode 100755 src/css/apps/components/shell/actioncenter/cardstack.css
 delete mode 100755 src/css/apps/components/shell/actioncenter/cardstack/gallery.css
 delete mode 100755 src/css/apps/components/shell/actioncenter/cardstack/indicator.css
 delete mode 100755 src/css/apps/components/shell/actioncenter/cardstack/notes.css
 delete mode 100755 src/css/apps/components/shell/actioncenter/cardstack/weather.css
 create mode 100644 src/css/apps/components/shell/taskbar/weatherapplet.css
 create mode 100644 src/ts/servicehost/services/MigrationSvc/nodes/WeatherSettingsMigration.ts

diff --git a/src/apps/components/shell/Shell.svelte b/src/apps/components/shell/Shell.svelte
index c148db790..11985c07e 100755
--- a/src/apps/components/shell/Shell.svelte
+++ b/src/apps/components/shell/Shell.svelte
@@ -14,6 +14,7 @@
 
   const { process }: AppComponentProps<IShellRuntime> = $props();
   const { userPreferences, startMenuOpened, actionCenterOpened, username, FullscreenCount } = process;
+  const { InitComplete } = Daemon;
 
   let currentDesktop = $state<string>();
 
@@ -28,27 +29,29 @@
   });
 </script>
 
-<div
-  class="shell taskbar-bounds fullscreen"
-  class:docked={$userPreferences.shell.taskbar.docked}
-  class:has-fullscreen={currentDesktop && $FullscreenCount[currentDesktop]?.size > 0}
->
-  <div class="primary">
-    <VirtualDesktops {process} />
-    <VirtualDesktopIndicator {process} />
-    <StartMenu {userPreferences} {startMenuOpened} {process} {username} />
-    <div></div>
-    <ActionCenter {actionCenterOpened} {userPreferences} {process} />
-    <PushNotification {process} />
-    {#if Daemon.userInfo.isSystem}
-      <div class="desktop-watermark">
-        ArcOS v{ArcOSVersion}-{ArcMode()}_{ArcBuild()}<br />
-        {Daemon.username}@{Server.hostname}<br />
-        THIS IS A SYSTEM ACCOUNT. WATCH OUT.
-      </div>
-    {/if}
+{#if $InitComplete}
+  <div
+    class="shell taskbar-bounds fullscreen"
+    class:docked={$userPreferences.shell.taskbar.docked}
+    class:has-fullscreen={currentDesktop && $FullscreenCount[currentDesktop]?.size > 0}
+  >
+    <div class="primary">
+      <VirtualDesktops {process} />
+      <VirtualDesktopIndicator {process} />
+      <StartMenu {userPreferences} {startMenuOpened} {process} {username} />
+      <div></div>
+      <ActionCenter {actionCenterOpened} {userPreferences} {process} />
+      <PushNotification {process} />
+      {#if Daemon.userInfo.isSystem}
+        <div class="desktop-watermark">
+          ArcOS v{ArcOSVersion}-{ArcMode()}_{ArcBuild()}<br />
+          {Daemon.username}@{Server.hostname}<br />
+          THIS IS A SYSTEM ACCOUNT. WATCH OUT.
+        </div>
+      {/if}
+    </div>
+    <div class="secondary">
+      <Taskbar {process} />
+    </div>
   </div>
-  <div class="secondary">
-    <Taskbar {process} />
-  </div>
-</div>
+{/if}
diff --git a/src/apps/components/shell/Shell/ActionCenter.svelte b/src/apps/components/shell/Shell/ActionCenter.svelte
index 61f288b08..3acd66d19 100755
--- a/src/apps/components/shell/Shell/ActionCenter.svelte
+++ b/src/apps/components/shell/Shell/ActionCenter.svelte
@@ -3,7 +3,6 @@
   import type { BooleanStore } from "$types/shared/writable";
   import type { UserPreferencesStore } from "$types/user";
   import { QuickSettings } from "../store";
-  import CardStack from "./ActionCenter/CardStack.svelte";
   import Clock from "./ActionCenter/Clock.svelte";
   import Notifications from "./ActionCenter/Notifications.svelte";
   import QuickSetting from "./ActionCenter/QuickSetting.svelte";
@@ -22,9 +21,6 @@
 <div class="actioncenter shell-colored" class:colored={$userPreferences.shell.taskbar.colored} class:opened={$actionCenterOpened}>
   <div class="top">
     <Clock />
-    {#if !process.safeMode}
-      <CardStack {userPreferences} {process} />
-    {/if}
   </div>
   <Notifications {process} />
   {#if !process.safeMode}
diff --git a/src/apps/components/shell/Shell/ActionCenter/CardStack.svelte b/src/apps/components/shell/Shell/ActionCenter/CardStack.svelte
deleted file mode 100755
index 27d0a6c74..000000000
--- a/src/apps/components/shell/Shell/ActionCenter/CardStack.svelte
+++ /dev/null
@@ -1,67 +0,0 @@
-<script lang="ts">
-  import type { IShellRuntime } from "$interfaces/runtimes/IShellRuntime";
-  import { Daemon } from "$ts/env";
-  import { Sleep } from "$ts/sleep";
-  import type { UserPreferencesStore } from "$types/user";
-  import Gallery from "./CardStack/Cards/Gallery.svelte";
-  import Notes from "./CardStack/Cards/Notes.svelte";
-  import Weather from "./CardStack/Cards/Weather.svelte";
-  import Indicator from "./CardStack/Indicator.svelte";
-
-  const { userPreferences, process }: { userPreferences: UserPreferencesStore; process: IShellRuntime } = $props();
-  const userDaemon = Daemon;
-
-  let changing = $state(false);
-  const scrollThreshold = 500;
-  let accumulatedScroll = 0;
-
-  async function onwheel(e: WheelEvent) {
-    if (changing) return;
-
-    accumulatedScroll += e.deltaY;
-
-    let { cardIndex } = $userPreferences.shell.actionCenter;
-
-    if (Math.abs(accumulatedScroll) < scrollThreshold) return;
-
-    if (accumulatedScroll > 0) {
-      if (cardIndex >= max - 1) return;
-      cardIndex++;
-    } else {
-      if (cardIndex <= 0) return;
-      cardIndex--;
-    }
-
-    changing = true;
-
-    $userPreferences.shell.actionCenter.cardIndex = cardIndex;
-
-    await Sleep(150);
-
-    changing = false;
-    accumulatedScroll = 0;
-  }
-
-  let max = 3;
-</script>
-
-<div class="card-stack" {onwheel} class:changing>
-  <Indicator {max} index={$userPreferences.shell.actionCenter.cardIndex} />
-  <div class="cards" style="--index: {$userPreferences.shell.actionCenter.cardIndex};">
-    {#if userDaemon}
-      <Weather {process} />
-      <Notes {userPreferences} />
-      <Gallery {userPreferences} {process} />
-    {:else}
-      <div class="card">
-        <span class="error-text">ERR_NO_DAEMON</span>
-      </div>
-      <div class="card">
-        <span class="error-text">ERR_NO_DAEMON</span>
-      </div>
-      <div class="card">
-        <span class="error-text">ERR_NO_DAEMON</span>
-      </div>
-    {/if}
-  </div>
-</div>
diff --git a/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Gallery.svelte b/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Gallery.svelte
deleted file mode 100755
index 08509a383..000000000
--- a/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Gallery.svelte
+++ /dev/null
@@ -1,106 +0,0 @@
-<script lang="ts">
-  import type { IShellRuntime } from "$interfaces/runtimes/IShellRuntime";
-  import Spinner from "$lib/Spinner.svelte";
-  import { Daemon, Fs } from "$ts/env";
-  import { contextMenu } from "$ts/ui/context/actions.svelte";
-  import { UserPaths } from "$ts/user/store";
-  import { arrayBufferToBlob } from "$ts/util/convert";
-  import type { UserPreferencesStore } from "$types/user";
-  import { onMount } from "svelte";
-
-  const { userPreferences, process }: { userPreferences: UserPreferencesStore; process: IShellRuntime } = $props();
-
-  let url = $state("");
-  let errored = $state(false);
-  let noImage = $state(false);
-  let loading = $state(true);
-  let lastValue = "";
-
-  onMount(() => {
-    const unsubscribe = userPreferences.subscribe(async (v) => {
-      try {
-        if (!v.shell.actionCenter.galleryImage) {
-          noImage = true;
-          loading = false;
-
-          return;
-        }
-
-        if (v.shell.actionCenter.galleryImage === lastValue) return;
-
-        lastValue = v.shell.actionCenter.galleryImage;
-        noImage = false;
-        errored = false;
-        loading = true;
-
-        const contents = await Fs.readFile(v.shell.actionCenter.galleryImage);
-
-        loading = false;
-
-        if (!contents) {
-          errored = true;
-          url = "";
-
-          return;
-        }
-
-        const blob = arrayBufferToBlob(contents);
-        url = URL.createObjectURL(blob);
-      } catch {
-        errored = true;
-        loading = false;
-      }
-    });
-
-    return () => unsubscribe();
-  });
-
-  async function chooseImage() {
-    const [path] = await Daemon!.files!.LoadSaveDialog({
-      title: "Choose an image for the gallery",
-      icon: "DesktopIcon",
-      startDir: UserPaths.Pictures,
-      extensions: [".png", ".jpg", ".gif", ".webp", ".jpeg"],
-    });
-
-    if (!path) return;
-
-    $userPreferences.shell.actionCenter.galleryImage = path;
-  }
-</script>
-
-<div
-  class="card gallery"
-  style={!errored && !noImage ? `--src: url('${url}');` : ""}
-  class:no-image={noImage}
-  class:errored
-  class:loading
-  use:contextMenu={[
-    [
-      {
-        caption: "Change image...",
-        action: () => chooseImage(),
-        icon: "pencil",
-      },
-      {
-        caption: "Remove image",
-        action: () => ($userPreferences.shell.actionCenter.galleryImage = ""),
-        icon: "x",
-      },
-    ],
-    process,
-  ]}
->
-  {#if !loading}
-    {#if noImage}
-      <span class="lucide icon-image"></span>
-      <button onclick={chooseImage} class="link">Choose an image</button>
-    {:else if errored}
-      <span class="lucide icon-circle-slash"></span>
-      <p>Image not found!</p>
-      <button onclick={chooseImage} class="link">Change it</button>
-    {/if}
-  {:else}
-    <Spinner height={32} />
-  {/if}
-</div>
diff --git a/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Notes.svelte b/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Notes.svelte
deleted file mode 100755
index 83f1957ac..000000000
--- a/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Notes.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script lang="ts">
-  import type { UserPreferencesStore } from "$types/user";
-
-  const { userPreferences }: { userPreferences: UserPreferencesStore } = $props();
-</script>
-
-<div class="card notes">
-  <textarea name="" id="" bind:value={$userPreferences.shell.actionCenter.noteContent}></textarea>
-</div>
diff --git a/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Weather.svelte b/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Weather.svelte
deleted file mode 100755
index b8f2b317d..000000000
--- a/src/apps/components/shell/Shell/ActionCenter/CardStack/Cards/Weather.svelte
+++ /dev/null
@@ -1,95 +0,0 @@
-<script lang="ts">
-  import type { IShellRuntime } from "$interfaces/runtimes/IShellRuntime";
-  import Spinner from "$lib/Spinner.svelte";
-  import { WeatherHelper } from "$ts/helpers/weather";
-  import { Sleep } from "$ts/sleep";
-  import { contextMenu } from "$ts/ui/context/actions.svelte";
-  import type { WeatherInformation } from "$types/external/weather";
-  import { onMount } from "svelte";
-
-  const { process }: { process: IShellRuntime } = $props();
-  const { userPreferences } = process;
-
-  let data = $state<WeatherInformation>();
-  let loading = $state<boolean>(true);
-
-  onMount(() => {
-    refresh();
-
-    process.dispatch.subscribe("refresh-weather", () => refresh());
-  });
-
-  async function refresh(fromContext = false) {
-    if (fromContext) {
-      await Sleep(1);
-
-      process.actionCenterOpened.set(true);
-    }
-    loading = true;
-    data = await WeatherHelper.getWeather();
-    loading = false;
-  }
-
-  async function changeLocation() {
-    await process.spawnApp("systemSettings", process.pid, "shell", "shell_weatherLocation");
-  }
-</script>
-
-<div
-  class="card weather partly-sunny"
-  style={data && data.gradient ? `--gradient-start: ${data.gradient.start}; --gradient-end: ${data.gradient.end};` : ""}
-  class:loading
-  class:errored={$userPreferences.shell.actionCenter.weatherLocation.name === "unset" || !data}
-  class:night={data && data.isNight}
-  use:contextMenu={[
-    [
-      {
-        caption: "Refresh",
-        action: () => {
-          refresh(true);
-        },
-        icon: "rotate-cw",
-      },
-      {
-        caption: "Change location...",
-        icon: "map-pin",
-        action: () => {
-          changeLocation();
-        },
-      },
-    ],
-    process,
-  ]}
->
-  {#if $userPreferences.shell.actionCenter.weatherLocation.name === "unset"}
-    <p>Set-up weather</p>
-    <button
-      class="retry lucide icon-settings-2"
-      title="Set weather location"
-      aria-label="Set weather location"
-      onclick={() => changeLocation()}
-    ></button>
-  {:else if !loading}
-    {#if data}
-      {#if data.icon && data.iconColor}
-        <span class="condition-icon lucide icon-{data.icon}" style="--color: {data.iconColor};"></span>
-      {/if}
-      <h1>
-        {data.temperature.toFixed(1)} °C
-      </h1>
-      <p>
-        <button class="lucide icon-refresh-cw" title="Refresh" aria-label="Refresh" onclick={() => refresh()}></button>
-        {#if data.condition}
-          <span>
-            {data.condition}
-          </span>
-        {/if}
-      </p>
-    {:else}
-      <p>Failed to get weather info</p>
-      <button class="retry lucide icon-refresh-cw" title="Retry" aria-label="Retry" onclick={() => refresh()}></button>
-    {/if}
-  {:else}
-    <Spinner height={32} />
-  {/if}
-</div>
diff --git a/src/apps/components/shell/Shell/ActionCenter/CardStack/Indicator.svelte b/src/apps/components/shell/Shell/ActionCenter/CardStack/Indicator.svelte
deleted file mode 100755
index a119ce3e2..000000000
--- a/src/apps/components/shell/Shell/ActionCenter/CardStack/Indicator.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script lang="ts">
-  const { max, index } = $props();
-</script>
-
-<div class="indicator">
-  {#each new Array(max).fill(0) as _, i}
-    <div class="dot" class:active={index === i}></div>
-  {/each}
-</div>
diff --git a/src/apps/components/shell/Shell/Taskbar.svelte b/src/apps/components/shell/Shell/Taskbar.svelte
index ec1b118f3..8b10b6a80 100755
--- a/src/apps/components/shell/Shell/Taskbar.svelte
+++ b/src/apps/components/shell/Shell/Taskbar.svelte
@@ -9,6 +9,7 @@
   import StartButton from "./Taskbar/StartButton.svelte";
   import Clock from "./Taskbar/SystemArea/Clock.svelte";
   import SystemTray from "./Taskbar/SystemTray.svelte";
+  import TaskbarWeatherApplet from "./Taskbar/TaskbarWeatherApplet.svelte";
   import WorkspaceManagerButton from "./Taskbar/WorkspaceManagerButton.svelte";
 
   const { process }: { process: IShellRuntime } = $props();
@@ -26,6 +27,7 @@
   <PinnedApps {process} />
   <OpenedApps {process} />
 
+  <TaskbarWeatherApplet {process} />
   <ServiceGate id="TrayHostSvc">
     {#snippet ifActive(service: ITrayHostService)}
       <SystemTray {process} {service} />
diff --git a/src/apps/components/shell/Shell/Taskbar/TaskbarWeatherApplet.svelte b/src/apps/components/shell/Shell/Taskbar/TaskbarWeatherApplet.svelte
new file mode 100644
index 000000000..b1ebc4fbb
--- /dev/null
+++ b/src/apps/components/shell/Shell/Taskbar/TaskbarWeatherApplet.svelte
@@ -0,0 +1,97 @@
+<script lang="ts">
+  import type { IShellRuntime } from "$interfaces/runtimes/IShellRuntime";
+  import { WeatherHelper } from "$ts/helpers/weather";
+  import { Sleep } from "$ts/sleep";
+  import { contextMenu } from "$ts/ui/context/actions.svelte";
+  import type { WeatherInformation } from "$types/external/weather";
+  import { onMount } from "svelte";
+
+  const { process }: { process: IShellRuntime } = $props();
+  const { userPreferences } = process;
+
+  let data = $state<WeatherInformation>();
+  let loading = $state<boolean>(true);
+  let city = $derived($userPreferences.weatherSettings.name?.split(", ")[0]);
+
+  onMount(() => {
+    refresh();
+
+    process.dispatch.subscribe("refresh-weather", () => refresh());
+  });
+
+  async function refresh() {
+    loading = true;
+    data = await WeatherHelper.getWeather();
+    loading = false;
+  }
+
+  async function changeLocation() {
+    await process.spawnApp("systemSettings", process.pid, "shell", "shell_weatherLocation");
+  }
+</script>
+
+{#if $userPreferences.weatherSettings.displayMode !== "disabled"}
+  <div
+    class="weather-applet"
+    style={data && data.gradient ? `--gradient-start: ${data.gradient.start}; --gradient-end: ${data.gradient.end};` : ""}
+    class:loading
+    class:errored={$userPreferences.weatherSettings.name === "unset" || !data}
+    class:night={data && data.isNight}
+    use:contextMenu={[
+      [
+        {
+          caption: "Refresh",
+          action: () => refresh(),
+          icon: "rotate-cw",
+        },
+        {
+          caption: "Change location...",
+          icon: "map-pin",
+          action: () => changeLocation(),
+        },
+      ],
+      process,
+    ]}
+  >
+    {#if $userPreferences.weatherSettings.name === "unset"}
+      <p>Set-up weather</p>
+      <button
+        class="retry lucide icon-settings-2"
+        title="Set weather location"
+        aria-label="Set weather location"
+        onclick={() => changeLocation()}
+      ></button>
+    {:else if data}
+      {#if data.icon && data.iconColor}
+        <span class="condition-icon lucide icon-{data.icon}" style="--color: {data.iconColor};"></span>
+      {/if}
+      {#if $userPreferences.weatherSettings.displayMode !== "onlyTemperature"}
+        <div class="info">
+          <h1>
+            {data.temperature.toFixed(1)} °C
+          </h1>
+          <p>
+            <button class="lucide icon-refresh-cw" title="Refresh" aria-label="Refresh" onclick={() => refresh()}></button>
+            {#if $userPreferences.weatherSettings.displayMode === "withCity" && city}
+              <span>
+                {city}
+              </span>
+            {:else if $userPreferences.weatherSettings.displayMode === "withCondition" && data.condition}
+              <span>
+                {data.condition}
+              </span>
+            {/if}
+          </p>
+        </div>
+      {:else}
+        <h1 class="single">
+          <span>{data.temperature.toFixed(1)} °C</span>
+          <button class="lucide icon-refresh-cw" title="Refresh" aria-label="Refresh" onclick={() => refresh()}></button>
+        </h1>
+      {/if}
+    {:else}
+      <p>Failed to get weather info</p>
+      <button class="retry lucide icon-refresh-cw" title="Retry" aria-label="Retry" onclick={() => refresh()}></button>
+    {/if}
+  </div>
+{/if}
diff --git a/src/apps/components/shell/runtime.ts b/src/apps/components/shell/runtime.ts
index 0934d47b5..4891fd25c 100755
--- a/src/apps/components/shell/runtime.ts
+++ b/src/apps/components/shell/runtime.ts
@@ -9,9 +9,7 @@ import { UserPaths } from "$ts/user/store";
 import { Store } from "$ts/writable";
 import type { AppKeyCombinations } from "$types/apps/accelerator";
 import type { AppContextMenu, AppProcessData } from "$types/apps/app";
-import type { SearchItem } from "$types/services/search";
 import type { RecursiveDirectoryReadReturn } from "$types/system/fs";
-import type { Workspace } from "$types/user";
 import { ShellAccelerators } from "./accelerators";
 import { ShellContextMenu } from "./context";
 
@@ -46,25 +44,6 @@ export class ShellRuntime extends AppProcess implements IShellRuntime {
     this.setSource(__SOURCE__);
   }
 
-  gotReadySignal(): Promise<void> {
-    throw new Error("Method not implemented.");
-  }
-  deleteWorkspace(workspace: Workspace): Promise<void> {
-    throw new Error("Method not implemented.");
-  }
-  MutateIndex(e: KeyboardEvent): void | -1 {
-    throw new Error("Method not implemented.");
-  }
-  Trigger(result: SearchItem): Promise<void> {
-    throw new Error("Method not implemented.");
-  }
-  Submit(): void {
-    throw new Error("Method not implemented.");
-  }
-  changeShell(id: string): Promise<false | undefined> {
-    throw new Error("Method not implemented.");
-  }
-
   async start() {
     if (Stack.getProcess(+Env.get("shell_pid"))) return false;
 
@@ -201,9 +180,6 @@ export class ShellRuntime extends AppProcess implements IShellRuntime {
     });
   }
 
-  //#endregion
-  //#region STARTMENU
-
   public async refreshStartMenu(): Promise<void> {
     try {
       const tree = await Fs.tree(this.STARTMENU_FOLDER);
@@ -220,12 +196,6 @@ export class ShellRuntime extends AppProcess implements IShellRuntime {
     }
   }
 
-  //#endregion
-  //#region CALENDAR
-
-  //#endregion
-  //#region WEATHER
-
   async exit() {
     this.startMenuOpened.set(false); // First close the start menu
     await this.spawnOverlayApp("ExitApp", this.pid); // Then spawn the exit overlay
@@ -254,6 +224,4 @@ export class ShellRuntime extends AppProcess implements IShellRuntime {
 
     this.FullscreenCount.set(fullscreenCount);
   }
-
-  //#endregion
 }
diff --git a/src/apps/user/settings/Settings/Page/Shell.svelte b/src/apps/user/settings/Settings/Page/Shell.svelte
index 0d8dc5890..bfb939109 100755
--- a/src/apps/user/settings/Settings/Page/Shell.svelte
+++ b/src/apps/user/settings/Settings/Page/Shell.svelte
@@ -56,10 +56,22 @@
       <input type="checkbox" class="switch" bind:checked={$userPreferences.shell.taskbar.accentedStartButton} />
     </Option>
   </Section>
-  <Section caption="Action Center">
+
+  <Section caption="Weather">
+    <Option caption="Show...">
+      <select bind:value={$userPreferences.weatherSettings.displayMode}>
+        <option value="disabled">Nothing</option>
+        <option value="onlyTemperature">Just the temperature</option>
+        <option value="withCity">Temperature and the city</option>
+        <option value="withCondition">Temperature and the condition</option>
+      </select>
+    </Option>
     <Option caption="Weather location">
-      <button onclick={() => process.showSlide("shell_weatherLocation")} disabled={process.safeMode}>Change...</button>
+      <button onclick={() => process.showSlide("shell_weatherLocation")} disabled={process.safeMode || $userPreferences.weatherSettings.displayMode === "disabled"}>Change...</button>
     </Option>
+  </Section>
+
+  <Section caption="Action Center">
     <Option caption="Hide the quick settings">
       <input
         type="checkbox"
diff --git a/src/apps/user/settings/Settings/Slides/WeatherLocation.svelte b/src/apps/user/settings/Settings/Slides/WeatherLocation.svelte
index 6a4d6e61a..3027e5905 100755
--- a/src/apps/user/settings/Settings/Slides/WeatherLocation.svelte
+++ b/src/apps/user/settings/Settings/Slides/WeatherLocation.svelte
@@ -40,13 +40,9 @@
 
   function apply(result: WeatherSearchResult) {
     userPreferences.update((v) => {
-      v.shell.actionCenter.weatherLocation = {
-        latitude: result.latitude,
-        longitude: result.longitude,
-        name: result.country ? `${result.name || "Unknown"}, ${result.country}` : result.name || "Unknown",
-      };
-
-      v.shell.actionCenter.cardIndex = 0;
+      v.weatherSettings.latitude = result.latitude;
+      v.weatherSettings.longitude = result.longitude;
+      v.weatherSettings.name = result.country ? `${result.name || "Unknown"}, ${result.country}` : result.name || "Unknown";
 
       return v;
     });
@@ -56,7 +52,6 @@
     dispatch?.dispatch("refresh-weather");
 
     setTimeout(() => {
-      dispatch?.dispatch("open-action-center");
       searchInput = "";
       hasSearched = false;
       working = false;
diff --git a/src/css/apps/components/contextmenu.css b/src/css/apps/components/contextmenu.css
index 5770cca9d..357c56f1b 100755
--- a/src/css/apps/components/contextmenu.css
+++ b/src/css/apps/components/contextmenu.css
@@ -4,6 +4,10 @@
   pointer-events: none !important;
 }
 
+#contextMenu div.context-menu {
+  z-index: calc(infinity) !important;
+}
+
 #contextMenu div.context-menu,
 #contextMenu div.context-menu div.sub-items {
   position: absolute;
@@ -113,7 +117,7 @@
 #contextMenu div.context-menu.colored button.menu-item:not(.subitems):active {
   background-color: var(--accent-textual);
   opacity: 1;
-  color: var(--win-bg);
+  color: var(--accent-textual-fg);
   box-shadow: none;
 }
 
diff --git a/src/css/apps/components/messagebox.css b/src/css/apps/components/messagebox.css
index 1a3a5cfdb..edbe55e0b 100755
--- a/src/css/apps/components/messagebox.css
+++ b/src/css/apps/components/messagebox.css
@@ -1,5 +1,6 @@
 #messageBox {
   width: max-content !important;
+  height:fit-content !important;
   display: flex;
   flex-direction: column;
 }
@@ -13,7 +14,7 @@
   padding: 0;
   display: flex;
   flex-direction: column;
-  flex-grow: 1;
+  height: fit-content;
 }
 
 #messageBox div.top {
diff --git a/src/css/apps/components/shell/actioncenter.css b/src/css/apps/components/shell/actioncenter.css
index fb101a430..8c7e8137b 100755
--- a/src/css/apps/components/shell/actioncenter.css
+++ b/src/css/apps/components/shell/actioncenter.css
@@ -1,5 +1,4 @@
 @import url("./actioncenter/clock.css");
-@import url("./actioncenter/cardstack.css");
 @import url("./actioncenter/notifications.css");
 @import url("./actioncenter/quicksettings.css");
 
diff --git a/src/css/apps/components/shell/actioncenter/cardstack.css b/src/css/apps/components/shell/actioncenter/cardstack.css
deleted file mode 100755
index b18b46d5d..000000000
--- a/src/css/apps/components/shell/actioncenter/cardstack.css
+++ /dev/null
@@ -1,34 +0,0 @@
-@import url("./cardstack/indicator.css");
-@import url("./cardstack/weather.css");
-@import url("./cardstack/gallery.css");
-@import url("./cardstack/notes.css");
-
-div.shell div.actioncenter div.top div.card-stack {
-  overflow: hidden;
-  width: 150px;
-  max-width: 150px;
-  min-width: 150px;
-  position: relative;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.cards {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: fit-content;
-  margin-top: calc(-120px * var(--index, 0));
-  transition: margin-top 0.3s;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.cards div.card {
-  height: 110px;
-  margin-bottom: 10px;
-  overflow: hidden;
-  border-radius: 10px;
-  transition: scale 0.3s;
-}
-
-div.shell div.actioncenter div.top div.card-stack.changing div.cards div.card {
-  scale: 0.9;
-}
diff --git a/src/css/apps/components/shell/actioncenter/cardstack/gallery.css b/src/css/apps/components/shell/actioncenter/cardstack/gallery.css
deleted file mode 100755
index 48d3ee46a..000000000
--- a/src/css/apps/components/shell/actioncenter/cardstack/gallery.css
+++ /dev/null
@@ -1,15 +0,0 @@
-div.shell div.actioncenter div.top div.card-stack div.card.gallery {
-  background-color: var(--button-glass-bg);
-  background-image: var(--src);
-  background-position: center;
-  background-size: cover;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.gallery span.lucide {
-  font-size: 24px;
-  margin-bottom: 5px;
-}
diff --git a/src/css/apps/components/shell/actioncenter/cardstack/indicator.css b/src/css/apps/components/shell/actioncenter/cardstack/indicator.css
deleted file mode 100755
index 639a39c2b..000000000
--- a/src/css/apps/components/shell/actioncenter/cardstack/indicator.css
+++ /dev/null
@@ -1,26 +0,0 @@
-div.shell div.actioncenter div.top div.card-stack div.indicator {
-  position: absolute;
-  top: 0;
-  height: 100%;
-  left: 6px;
-  width: 4px;
-  z-index: 10000;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  gap: 6px;
-  pointer-events: none !important;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.indicator div.dot {
-  width: 4px;
-  height: 4px;
-  border-radius: 2px;
-  background-color: var(--button-glass-active-bg);
-  pointer-events: initial !important;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.indicator div.dot.active {
-  background-color: #fff;
-}
diff --git a/src/css/apps/components/shell/actioncenter/cardstack/notes.css b/src/css/apps/components/shell/actioncenter/cardstack/notes.css
deleted file mode 100755
index 755dcd3c6..000000000
--- a/src/css/apps/components/shell/actioncenter/cardstack/notes.css
+++ /dev/null
@@ -1,19 +0,0 @@
-div.shell div.actioncenter div.top div.card-stack div.card.notes {
-  background-color: #ffe26c;
-  padding: 15px;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.notes textarea {
-  width: 100%;
-  height: 100%;
-  resize: none;
-  border: none;
-  background-color: transparent;
-  color: #000;
-  text-align: right;
-  font-family: "Handlee";
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.notes textarea::-webkit-scrollbar {
-  display: none;
-}
diff --git a/src/css/apps/components/shell/actioncenter/cardstack/weather.css b/src/css/apps/components/shell/actioncenter/cardstack/weather.css
deleted file mode 100755
index 6f0ed6366..000000000
--- a/src/css/apps/components/shell/actioncenter/cardstack/weather.css
+++ /dev/null
@@ -1,85 +0,0 @@
-div.shell div.actioncenter div.top div.card-stack div.card.weather {
-  --gradient-start: #41aaff;
-  --gradient-end: #71b2c8;
-  background: linear-gradient(to bottom right, var(--gradient-start) 0%, var(--gradient-end) 100%);
-  background-size: cover;
-  background-position: center;
-  background-repeat: no-repeat;
-  padding: 0 15px;
-  display: flex;
-  align-items: end;
-  flex-direction: column;
-  justify-content: center;
-  transition: background 0.3s;
-  position: relative;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-color: #0002;
-  transition: background-color 0.3s;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather.night::before {
-  background-color: #0008;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather * {
-  z-index: 100;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather span.condition-icon {
-  color: var(--color, var(--fg));
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather * {
-  color: #fff;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather.errored,
-div.shell div.actioncenter div.top div.card-stack div.card.weather.loading {
-  align-items: center;
-  justify-content: center;
-}
-
-div.shell div.actioncenter div.top div.card.weather.errored p {
-  text-align: center;
-  opacity: 1 !important;
-}
-
-div.shell div.actioncenter div.top div.card.weather.errored button {
-  margin: 0;
-  padding: 0;
-  background-color: transparent;
-  font-size: 16px;
-  margin-top: 10px;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather h1 {
-  font-size: 28px;
-  line-height: 40px;
-  font-family: "fredoka";
-  font-weight: 500;
-}
-div.shell div.actioncenter div.top div.card-stack div.card.weather p {
-  opacity: 0.7;
-  display: flex;
-  align-items: center;
-  gap: 5px;
-  font-size: 12px;
-  white-space: nowrap;
-}
-
-div.shell div.actioncenter div.top div.card-stack div.card.weather p button {
-  margin: 0;
-  padding: 0;
-  background-color: transparent;
-  border-radius: 0;
-  font-size: 12px;
-  height: 12px;
-}
diff --git a/src/css/apps/components/shell/actioncenter/notifications.css b/src/css/apps/components/shell/actioncenter/notifications.css
index 6c89e499d..863adc0e1 100755
--- a/src/css/apps/components/shell/actioncenter/notifications.css
+++ b/src/css/apps/components/shell/actioncenter/notifications.css
@@ -172,7 +172,7 @@ div.shell div.actioncenter div.notification.collapsed div.buttons {
 div.shell div.actioncenter div.notifications button.quick-settings-toggle {
   margin-left: auto;
   text-decoration: none;
-  color: var(--accent-lighter);
+  color: var(--accent-textual);
 }
 
 div.shell div.actioncenter div.notifications button.quick-settings-toggle.shown {
diff --git a/src/css/apps/components/shell/taskbar.css b/src/css/apps/components/shell/taskbar.css
index 4cca9f2eb..a9d4a17d8 100755
--- a/src/css/apps/components/shell/taskbar.css
+++ b/src/css/apps/components/shell/taskbar.css
@@ -1,5 +1,7 @@
 @import url("./taskbar/openedapps.css");
 @import url("./taskbar/calendar.css");
+@import url("./taskbar/weatherapplet.css");
+
 div.shell div.taskbar {
   display: flex;
   align-items: center;
@@ -287,7 +289,7 @@ div.shell div.shell div.taskbar button.clock-button.active,
 div.shell div.shell div.taskbar button.clock-button.active span,
 #arcShell div.shell div.taskbar button.workspace-manager-button.active span,
 #arcShell div.shell div.taskbar button.action-center-button.active span {
-  color: var(--win-bg) !important;
+  color: var(--accent-textual-fg) !important;
 }
 
 .theme-light div.shell div.taskbar::before {
diff --git a/src/css/apps/components/shell/taskbar/weatherapplet.css b/src/css/apps/components/shell/taskbar/weatherapplet.css
new file mode 100644
index 000000000..88a1055d3
--- /dev/null
+++ b/src/css/apps/components/shell/taskbar/weatherapplet.css
@@ -0,0 +1,87 @@
+div.shell div.taskbar div.weather-applet {
+  --gradient-start: #41aaff;
+  --gradient-end: #71b2c8;
+  background: linear-gradient(to bottom right, var(--gradient-start) 0%, var(--gradient-end) 100%);
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  padding: 0 15px;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  justify-content: center;
+  transition: background 0.3s;
+  position: relative;
+  height: 40px;
+  border-radius: 10px;
+  overflow: hidden;
+  outline: var(--button-glass-hover-bg) 1px solid;
+  outline-offset: -1px;
+}
+
+div.shell div.taskbar div.weather-applet button.lucide {
+  width: 12px;
+  height: 12px;
+  padding: 0;
+  font-size: 12px;
+  background-color: transparent;
+}
+
+div.shell div.taskbar div.weather-applet button.lucide:active {
+  background-color: transparent;
+  color: var(--accent-transparent);
+}
+
+div.shell div.taskbar div.weather-applet p {
+  font-size: 12px;
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  opacity: 0.8;
+}
+
+div.shell div.taskbar div.weather-applet h1 {
+  font-size: 16px;
+  line-height: 16px;
+  display: flex;
+  align-items: center;
+  gap: 5px;
+}
+
+div.shell div.taskbar div.weather-applet h1.single {
+  font-size: 20px;
+  line-height: 20px;
+  font-weight: normal;
+}
+
+div.shell div.taskbar div.weather-applet h1 button.lucide {
+  opacity: 0.5;
+}
+
+div.shell div.taskbar div.weather-applet span.condition-icon {
+  color: var(--color, var(--fg));
+  font-size: 28px;
+}
+
+div.shell div.taskbar div.weather-applet * {
+  color: #fff;
+}
+
+div.shell div.taskbar div.weather-applet::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: #0002;
+  transition: background-color 0.3s;
+}
+
+div.shell div.taskbar div.weather-applet.night::before {
+  background-color: #0008;
+}
+
+div.shell div.taskbar div.weather-applet * {
+  z-index: 100;
+}
diff --git a/src/css/apps/components/shell/workspaces.css b/src/css/apps/components/shell/workspaces.css
index c6423a8f5..b3c21a5f0 100755
--- a/src/css/apps/components/shell/workspaces.css
+++ b/src/css/apps/components/shell/workspaces.css
@@ -113,10 +113,12 @@
 }
 
 #arcShell div.virtual-desktops button.add {
+  display: flex;
+  justify-content: center;
+  align-items: center;
   width: 80px;
   height: 80px;
   background-color: var(--button-glass-bg);
-  /* box-shadow: var(--secondary-box-shadow); */
   font-size: 24px;
   outline: var(--button-glass-bg) 1px solid;
   outline-offset: -1px;
diff --git a/src/css/apps/user/mediaplayer/player.css b/src/css/apps/user/mediaplayer/player.css
index 96fdf0215..27e04e485 100755
--- a/src/css/apps/user/mediaplayer/player.css
+++ b/src/css/apps/user/mediaplayer/player.css
@@ -31,9 +31,21 @@
 }
 
 #MediaPlayer.fullscreen div.audio-visual {
-  background: linear-gradient(to bottom, #0008 0%, #0008 100%), var(--cover-backdrop, var(--wallpaper));
+  background: linear-gradient(to bottom right, #0008 0%, #0008 100%), var(--cover-backdrop, var(--wallpaper));
   background-position: center;
   background-size: cover;
+  position: relative;
+}
+
+#MediaPlayer.fullscreen div.audio-visual::after {
+  content: "";
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  background-color: #ffffff01;
+  backdrop-filter: blur(20px);
 }
 
 #MediaPlayer video {
@@ -120,10 +132,12 @@
   margin-bottom: 10px;
   width: fit-content;
   justify-content: center;
+  text-shadow: 0 0 9px #000a;
 }
 
 #MediaPlayer.fullscreen div.audio-visual > div.file p.author {
   font-size: 20px !important;
+  text-shadow: 0 0 4px #000d;
 }
 
 #MediaPlayer div.audio-visual > div.cover-art img {
diff --git a/src/css/apps/user/settings/section.css b/src/css/apps/user/settings/section.css
index 4f9e105c2..6d74b77f7 100755
--- a/src/css/apps/user/settings/section.css
+++ b/src/css/apps/user/settings/section.css
@@ -101,6 +101,22 @@
   height: 24px;
 }
 
+
+#systemSettings section div.content div.option div.right select {
+  height: 24px;
+  padding: 0;
+  background-color: var(--button-bg);
+  border:none;
+  text-align: right;
+  padding-right: 10px;
+}
+
+#systemSettings section div.content div.option div.right button {
+  padding: 0 10px;
+  height: 24px;
+  border-radius: 8px;
+}
+
 #systemSettings section div.content div.option + div.option {
   border-top: var(--win-border);
 }
diff --git a/src/css/window.css b/src/css/window.css
index a89102ba1..97fd94ea8 100755
--- a/src/css/window.css
+++ b/src/css/window.css
@@ -37,10 +37,17 @@ div.window:not(.core) {
 }
 
 div.window {
+  --accent-textual: var(--accent-light) !important;
+  --accent-textual-fg: var(--accent-suggested-fg) !important;
   scrollbar-color: var(--button-glass-bg) transparent;
   scrollbar-width: thin;
 }
 
+.theme-light div.window {
+  --accent-textual: var(--accent-dark-medium) !important;
+  --accent-textual-fg: var(--accent-dark-medium-fg) !important;
+}
+
 div.window:not(.core).shell-colored.colored::before {
   opacity: 0.1;
   transition: opacity 0.1s !important;
diff --git a/src/interfaces/IUserDaemon.ts b/src/interfaces/IUserDaemon.ts
index 8afdcc87a..14a7885fc 100644
--- a/src/interfaces/IUserDaemon.ts
+++ b/src/interfaces/IUserDaemon.ts
@@ -1,5 +1,5 @@
 import type { UserDaemonStartOptions } from "$types/daemon";
-import type { ReadableStore } from "$types/shared/writable";
+import type { BooleanStore, ReadableStore } from "$types/shared/writable";
 import type { UserInfo, UserPreferences } from "$types/user";
 import type { AxiosInstance } from "axios";
 import type { IAccountUserContext } from "./contexts/IAccountUserContext";
@@ -43,6 +43,7 @@ export interface IUserDaemon extends IProcess {
   _blockLeaveInvocations: boolean;
   _toLoginInvoked: boolean;
   _criticalProcess: boolean;
+  InitComplete: BooleanStore;
   copyList: ReadableStore<string[]>;
   cutList: ReadableStore<string[]>;
   get betaClient(): AxiosInstance;
diff --git a/src/interfaces/runtimes/IShellRuntime.ts b/src/interfaces/runtimes/IShellRuntime.ts
index fd534656c..0ceb2762e 100644
--- a/src/interfaces/runtimes/IShellRuntime.ts
+++ b/src/interfaces/runtimes/IShellRuntime.ts
@@ -26,7 +26,6 @@ export interface IShellRuntime extends IAppProcess {
   stop(): Promise<boolean>;
   pinApp(appId: string): Promise<void>;
   unpinApp(appId: string): void;
-  deleteWorkspace(workspace: Workspace): Promise<void>;
   refreshStartMenu(): Promise<void>;
   exit(): Promise<void>;
   updateFullscreenCount(): void;
diff --git a/src/ts/daemon/contexts/init.ts b/src/ts/daemon/contexts/init.ts
index 7d6e5714d..7bd9affde 100644
--- a/src/ts/daemon/contexts/init.ts
+++ b/src/ts/daemon/contexts/init.ts
@@ -134,6 +134,8 @@ export class InitUserContext extends UserContext implements IInitUserContext {
 
     await Daemon.spawn?.spawnApp("contextMenu", this.pid, { noWorkspace: true });
 
+    Daemon.InitComplete.set(true);
+
     for (const payload in startup) {
       if (payload === "contextMenu") continue;
 
diff --git a/src/ts/daemon/index.ts b/src/ts/daemon/index.ts
index 93762d4c2..44dc54ec4 100644
--- a/src/ts/daemon/index.ts
+++ b/src/ts/daemon/index.ts
@@ -60,6 +60,7 @@ export class UserDaemon extends Process implements IUserDaemon {
   public copyList = Store<string[]>([]);
   public cutList = Store<string[]>([]);
   public serviceHost?: ServiceHost;
+  public InitComplete = Store<boolean>(false);
 
   public get betaClient() {
     return axios.create({
diff --git a/src/ts/helpers/weather.ts b/src/ts/helpers/weather.ts
index 9b7c402e6..e2a2c8a67 100644
--- a/src/ts/helpers/weather.ts
+++ b/src/ts/helpers/weather.ts
@@ -10,8 +10,8 @@ export class WeatherHelper extends BaseHelper {
 
     const preferences = this.userPreferences();
     const params = {
-      latitude: preferences.shell.actionCenter.weatherLocation.latitude,
-      longitude: preferences.shell.actionCenter.weatherLocation.longitude,
+      latitude: preferences.weatherSettings.latitude,
+      longitude: preferences.weatherSettings.longitude,
       current: ["temperature_2m", "weather_code", "is_day"],
     };
     const url = "https://api.open-meteo.com/v1/forecast";
@@ -75,7 +75,7 @@ export class WeatherHelper extends BaseHelper {
         start: "#d7d2cc",
         end: "#304352",
       },
-      iconColor: "#778899",
+      iconColor: "#90abc7",
       icon: "cloudy",
     },
     45: {
diff --git a/src/ts/servicehost/services/MigrationSvc/index.ts b/src/ts/servicehost/services/MigrationSvc/index.ts
index 5f81409ea..3caa7d08b 100644
--- a/src/ts/servicehost/services/MigrationSvc/index.ts
+++ b/src/ts/servicehost/services/MigrationSvc/index.ts
@@ -12,6 +12,7 @@ import { LogLevel } from "$types/shared/logging";
 import { AppShortcutsMigration } from "./nodes/AppShortcuts";
 import { FileAssociationsMigration } from "./nodes/FileAssociations";
 import { IconConfigurationMigration } from "./nodes/IconConfiguration";
+import { WeatherSettingsMigration } from "./nodes/WeatherSettingsMigration";
 
 export class MigrationService extends BaseService implements IMigrationService {
   private Index = Store<Record<string, number>>({});
@@ -24,7 +25,12 @@ export class MigrationService extends BaseService implements IMigrationService {
     .WithCooldown(100)
     .Build();
 
-  public MIGRATIONS: IMigrationNodeConstructor[] = [FileAssociationsMigration, IconConfigurationMigration, AppShortcutsMigration];
+  public MIGRATIONS: IMigrationNodeConstructor[] = [
+    FileAssociationsMigration,
+    IconConfigurationMigration,
+    AppShortcutsMigration,
+    WeatherSettingsMigration,
+  ];
 
   public get Config() {
     return this.Index();
diff --git a/src/ts/servicehost/services/MigrationSvc/nodes/WeatherSettingsMigration.ts b/src/ts/servicehost/services/MigrationSvc/nodes/WeatherSettingsMigration.ts
new file mode 100644
index 000000000..d19dcbcc4
--- /dev/null
+++ b/src/ts/servicehost/services/MigrationSvc/nodes/WeatherSettingsMigration.ts
@@ -0,0 +1,36 @@
+import type { IMigrationNodeConstructor } from "$interfaces/IMigrationNode";
+import type { IMigrationService } from "$interfaces/services/IMigrationService";
+import { Daemon } from "$ts/env";
+import { DefaultUserPreferences } from "$ts/user/default";
+import type { MigrationStatusCallback, MigrationResult } from "$types/services/migrations";
+import { MigrationNode } from "../node";
+
+export class WeatherSettingsMigration extends MigrationNode {
+  static override name = "WeatherSettingsMig";
+  static override friendlyName = "Weather Settings Migration";
+  static override version = 1.0;
+
+  constructor(self: IMigrationNodeConstructor, svc: IMigrationService) {
+    super(self, svc);
+  }
+
+  async runMigration(cb?: MigrationStatusCallback): Promise<MigrationResult> {
+    const preferences = Daemon.preferences();
+
+    if (preferences.weatherSettings?.migrated) return { result: "err_ok" };
+
+    cb?.("Updating weather information");
+
+    Daemon.preferences.update((v) => {
+      v.weatherSettings.migrated = true;
+      v.weatherSettings.latitude = v.shell.actionCenter.weatherLocation?.latitude!;
+      v.weatherSettings.longitude = v.shell.actionCenter.weatherLocation?.longitude!;
+      v.weatherSettings.name = v.shell.actionCenter.weatherLocation?.name!;
+      v.shell.actionCenter.weatherLocation = undefined;
+
+      return v;
+    });
+
+    return { result: "err_ok" };
+  }
+}
diff --git a/src/ts/user/default.ts b/src/ts/user/default.ts
index a4bd81e94..ea5f0222b 100644
--- a/src/ts/user/default.ts
+++ b/src/ts/user/default.ts
@@ -23,12 +23,6 @@ export const DefaultUserPreferences: UserPreferences = {
       accentedStartButton: false,
     },
     actionCenter: {
-      weatherLocation: {
-        // unset
-        latitude: Infinity,
-        longitude: Infinity,
-        name: "unset",
-      },
       noteContent: "",
       galleryImage: "",
       cardIndex: 0,
@@ -92,6 +86,13 @@ export const DefaultUserPreferences: UserPreferences = {
   globalSettings: {},
   _internalImportBlocklist: [],
   enableVerboseLogin: false,
+  weatherSettings: {
+    migrated: false,
+    displayMode: "withCondition",
+    latitude: 0,
+    longitude: 0,
+    name: "unset",
+  },
 };
 
 export const DefaultUserInfo: UserInfo = {
diff --git a/src/types/user/index.ts b/src/types/user/index.ts
index ec9c7e663..bd9a1295f 100644
--- a/src/types/user/index.ts
+++ b/src/types/user/index.ts
@@ -42,6 +42,7 @@ export interface UserPreferences {
   startup?: Record<string, "app" | "file" | "folder" | "share" | "disabled">;
   _internalImportBlocklist: string[];
   enableVerboseLogin?: boolean;
+  weatherSettings: WeatherSettings;
 }
 
 export type ExpandedUserInfo = UserInfo & { profile: PublicUserInfo };
@@ -78,7 +79,7 @@ export interface ShellPreferences {
   visuals: VisualPreferences;
   customStyle: CustomStylePreferences;
   actionCenter: {
-    weatherLocation: {
+    weatherLocation?: { // made optional 2026-08-01
       latitude: number;
       longitude: number;
       name?: string;
@@ -90,6 +91,14 @@ export interface ShellPreferences {
   };
 }
 
+export interface WeatherSettings {
+  latitude: number;
+  longitude: number;
+  name?: string;
+  displayMode: "withCity" | "withCondition" | "onlyTemperature" | "disabled";
+  migrated: boolean;
+}
+
 export interface TaskbarPreferences {
   labels: boolean;
   docked: boolean;