diff --git a/ui/dev/harness.html b/ui/dev/harness.html
index 4497084..fdbdfef 100644
--- a/ui/dev/harness.html
+++ b/ui/dev/harness.html
@@ -51,9 +51,9 @@
         </div>
       </figure>
       <figure class="cell" style="margin:0">
-        <figcaption>ours — bare .title-bar, no wrapper</figcaption>
+        <figcaption>ours — app.html shell (active above, inactive below)</figcaption>
         <div class="stage">
-          <div style="width: 320px">
+          <div class="window glass active" style="width: 320px">
             <div class="title-bar">
               <div class="title-bar-text">miniSCP</div>
               <div class="title-bar-controls">
@@ -62,9 +62,18 @@
                 <button aria-label="Close"></button>
               </div>
             </div>
-            <div style="background: var(--w7-surface); padding: 10px">
-              <p style="margin:0">No frame, no shadow, no glass.</p>
+            <div class="window-body"><p style="margin:0">Focused window.</p></div>
+          </div>
+          <div class="window glass" style="width: 320px; margin-top: 12px">
+            <div class="title-bar">
+              <div class="title-bar-text">miniSCP</div>
+              <div class="title-bar-controls">
+                <button aria-label="Minimize"></button>
+                <button aria-label="Maximize"></button>
+                <button aria-label="Close"></button>
+              </div>
             </div>
+            <div class="window-body"><p style="margin:0">Unfocused — chrome desaturates.</p></div>
           </div>
         </div>
       </figure>
diff --git a/ui/src/app/app.html b/ui/src/app/app.html
index 020fbbc..f5da772 100644
--- a/ui/src/app/app.html
+++ b/ui/src/app/app.html
@@ -1,4 +1,7 @@
-<div class="flex h-screen flex-col bg-background text-foreground">
+<!-- .window.glass is 7.css's Aero frame (radius, 1px border, inset highlight,
+     drop shadow, backdrop blur); .active is what un-greys the title bar and its
+     control glyphs — every .title-bar-controls rule is keyed on it. -->
+<div class="window glass flex h-screen flex-col" [class.active]="windowFocused()">
   @if (!rpc.available) {
     <div class="flex flex-1 items-center justify-center">
       <div class="max-w-sm rounded-lg border border-border bg-card p-6 text-center shadow-sm">
@@ -10,17 +13,22 @@
       </div>
     </div>
   } @else {
-    <!-- win7 skin only: the window is frameless, so this IS the chrome -->
+    <!-- the window is frameless, so this IS the chrome -->
     <app-title-bar [title]="appName" (closeRequested)="closeWindow()" />
-    <app-tab-bar />
 
-    <main class="flex min-h-0 flex-1 divide-x divide-border">
-      <app-file-panel side="left" />
-      <app-file-panel side="right" />
-    </main>
+    <!-- 7.css's .window-body: the recessed inner panel, with the 6px inset and
+         its own border that give a Win7 window its depth. -->
+    <div class="window-body flex min-h-0 flex-1 flex-col overflow-hidden">
+      <app-tab-bar />
 
-    <app-transfer-bar />
-    <app-status-bar />
+      <main class="flex min-h-0 flex-1 divide-x divide-border">
+        <app-file-panel side="left" />
+        <app-file-panel side="right" />
+      </main>
+
+      <app-transfer-bar />
+      <app-status-bar />
+    </div>
   }
 
   <!-- modal block: the connection-manager window owns the app until closed -->
diff --git a/ui/src/app/app.ts b/ui/src/app/app.ts
index 9b78da0..62a237d 100644
--- a/ui/src/app/app.ts
+++ b/ui/src/app/app.ts
@@ -45,6 +45,11 @@ import { UpdaterService } from './updater.service';
   host: {
     '(window:keydown)': 'onWindowKeydown($event)',
     '(window:contextmenu)': 'blockContextMenu($event)',
+    // Aero greys an inactive window's title bar and controls. The webview gets
+    // DOM focus/blur when the native window's focus changes, so this needs no
+    // RPC — see the `active` binding on .window in app.html.
+    '(window:focus)': 'windowFocused.set(true)',
+    '(window:blur)': 'windowFocused.set(false)',
   },
 })
 export class App {
@@ -62,6 +67,9 @@ export class App {
   /** The connection-manager window is open — this window is modal-blocked. */
   readonly managerOpen = signal(false);
 
+  /** Drives `.window.active`: Aero desaturates an unfocused window's chrome. */
+  readonly windowFocused = signal(document.hasFocus());
+
   /** Shown in the win7 title bar (no native titlebar to carry it). */
   readonly appName = BRANDING.appName;