fix: correct Windows settings dark surfaces and search alignment

Author: reycn

src/features/settings/ProviderSettings.vue

@@ -670,7 +670,7 @@ onBeforeUnmount(() => {
   min-width: 190px;
   overflow: hidden;
   padding: 18px 12px;
-  background: var(--paper);
+  background: var(--chrome-solid);
   display: grid;
   align-content: start;
   grid-template-rows: minmax(0, 1fr) auto;

src/features/settings/SettingsWorkspace.vue

@@ -255,6 +255,7 @@ fluent-button.category-button {
   width: 100%;
 }
 fluent-button.category-button::part(content) {
+  color: inherit;
   display: flex;
   box-sizing: border-box;
   width: 100%;
@@ -480,6 +481,7 @@ section.settings.settings-workspace.native-settings-window[data-section] {
 }
 .workspace-actions {
   display: flex;
+  margin-inline-start: auto;
   align-items: center;
   gap: 12px;
 }

src/platform/windows/reader.css

@@ -34,6 +34,9 @@
     --radius-sm: 6px;
     --chrome-solid: #f3f3f3;
   }
+  [data-appearance='dark'] .app[data-platform='win32'] {
+    --chrome-solid: #28282b;
+  }
 
   .desktop[data-platform='win32'] .toolbar .title {
     font-weight: 600;

tests/desktop/windows-controls-smoke.mjs

@@ -218,9 +218,24 @@ export async function verifyWindowsControls(window) {
     `document.querySelector('.fluent-kernel-modes fluent-tab[data-kernel-mode=pdf_math_precise]').dataset.state==='on'`,
   );
   await category('providers');
+  assert.equal(
+    await run(
+      `(()=>{const actions=document.querySelector('.workspace-actions').getBoundingClientRect();const header=document.querySelector('.workspace-heading');const rect=header.getBoundingClientRect();return Math.abs(rect.right-actions.right-parseFloat(getComputedStyle(header).paddingRight))<2;})()`,
+    ),
+    true,
+    'Provider search and close controls must align to the trailing edge',
+  );
   await wait(`!!document.querySelector('fluent-button.provider-list-item')`);
   await run(`document.querySelector('fluent-button.provider-list-item').click()`);
   await wait(`!!document.querySelector('fluent-button.provider-list-item.is-browse')`);
+  await run(`document.documentElement.dataset.appearance='dark'`);
+  assert.equal(
+    await run(
+      `(()=>{const background=el=>getComputedStyle(el).backgroundColor;const dark=color=>{const channels=color.match(/[\\d.]+/g);return channels&&channels.slice(0,3).every(value=>Number(value)<100)};return ['.workspace-heading','.workspace-page','.provider-browser'].every(selector=>dark(background(document.querySelector(selector))));})()`,
+    ),
+    true,
+    'Settings and provider surfaces must use dark backgrounds',
+  );
   window.show();
   await new Promise((resolve) => setTimeout(resolve, 350));
   await writeFile(