fix(studio): the title bar's controls are out of the window drag region again

Every button in the top-right of the shell was dead: the account button, the
icon buttons beside it, and the window's own minimize, maximize and close. The
title bar is the drag handle, -webkit-app-region inherits, and a control that
does not opt back out is drag surface — the OS takes the press and the page
never hears it, with nothing on screen to say why.

The opt-out had been there. 49b574687 removed .themer, a control that no longer
existed, and .themer happened to be the last selector of the list that carried
the declaration — so the block left with it and the two selectors above it were
swallowed by the next rule's comma. The comment above the rule went on saying
"every control on it opts back out" for two days while none of them did.

Membership is now what the markup says is interactive rather than the controls
someone remembered to list, so a new button on the bar is covered by existing
and deleting one takes nothing with it.

The check belongs in the shell and only there. In a plain browser the property
does not inherit — a child of a drag region computes "none" — so a page-level
guard cannot fail on this and would be worse than having none. It went into
test/smoke.js, which drives the real window, and it was run against the missing
rule first: it names button.thbtn, button.wc and the account button exactly.

desktop/electron/test/smoke.js

@@ -68,6 +68,31 @@ async function run() {
     .catch((e) => ({ code: -1, type: String(e) }))`);
   check("the page reaches the kernel through the gate", status.code === 200 && status.type.includes("json"), status);
 
+  // The title bar is the window's drag handle, and -webkit-app-region inherits:
+  // interactive means what the markup says, so a wordmark with role=img and the
+  // group wrapping the window buttons stay drag surface as they should.
+  // a control that does not opt back out is drag surface, the OS swallows the
+  // click, and nothing on screen says why. Only the shell can see this — in a
+  // plain browser the property does not inherit, so a page-level guard cannot
+  // fail on it and would be worse than none.
+  const dragging = await js(`(() => {
+    const bar = document.querySelector('.chrome');
+    if (!bar) return ['no .chrome'];
+    const out = [];
+    const INTERACTIVE = 'button, a[href], input, select, textarea, summary, ' +
+      '[role=button], [role=tab], [role=option], [role=menuitem], [role=menuitemcheckbox], ' +
+      '[role=switch], [role=checkbox], [role=radio], [role=treeitem], [role=link]';
+    for (const el of bar.querySelectorAll(INTERACTIVE)) {
+      const s = getComputedStyle(el);
+      if (s.display === 'none' || s.visibility === 'hidden') continue;
+      if (s.getPropertyValue('-webkit-app-region') !== 'drag') continue;
+      const cls = typeof el.className === 'string' ? el.className.split(/\s+/)[0] : '';
+      out.push(el.tagName.toLowerCase() + (cls ? '.' + cls : ''));
+    }
+    return [...new Set(out)];
+  })()`);
+  check("every control on the title bar is out of the drag region", dragging.length === 0, dragging);
+
   const prefs = win.webContents.getLastWebPreferences() ?? {};
   check("node integration is off", prefs.nodeIntegration !== true);
   check("context isolation is on", prefs.contextIsolation !== false);

desktop/frontend-next/src/styles/app.css

@@ -192,8 +192,17 @@
   /* Two spellings because the shells disagree: --wails-draggable is Wails'
      own property, -webkit-app-region is Chromium's. Each ignores the other. */
   [data-titlebar="app"] .chrome { --wails-draggable: drag; -webkit-app-region: drag }
-  [data-titlebar="app"] .chrome button,
-  [data-titlebar="app"] .chrome .picker,
+  /* Membership is what the markup says is interactive, not a list of the
+     controls that happened to be on the bar: the opt-out lived on the last
+     selector of a list, a control was deleted, and the declaration left with
+     it — so every control on the title bar became drag surface and the window
+     ate its clicks. Held by perf/press.mjs. */
+  [data-titlebar="app"] .chrome
+    :is(button, a[href], input, select, textarea, summary, .picker,
+        [role="button"], [role="tab"], [role="menuitem"], [role="switch"]) {
+    --wails-draggable: no-drag;
+    -webkit-app-region: no-drag;
+  }
   /* macOS floats its lights over the corner at a y AppKit owns — measured centre
      25.5px, which is the platform's own unified-toolbar metric. The row matches
      that height rather than the spec's 39px, or the lights sit 6px below the