fix(toolbar): align settings control geometry

scripts/e2e-settings-memory-debug.test.mjs

@@ -150,10 +150,10 @@ test('Memory Debug Mode toggle saves immediately without a Save button', async (
   assert.equal(settings.get().memoryDebugMode, true);
 });
 
-test('Settings markup exposes the official UBSan help link in a protected new tab', async () => {
+test('Settings markup uses the shared toolbar gear icon and exposes the official UBSan help link in a protected new tab', async () => {
   const html = await readFile(new URL('../src/ui/index.html', import.meta.url), 'utf8');
 
-  assert.match(html, /id="btn-settings"[\s\S]*settings-gear-icon[\s\S]*Settings/);
+  assert.match(html, /id="btn-settings"[\s\S]*class="codicon codicon-gear" aria-hidden="true"[\s\S]*Settings/);
   assert.match(html, /id="settings-panel"/);
   assert.match(html, /id="setting-memory-debug"/);
   assert.match(html, /href="https:\/\/clang\.llvm\.org\/docs\/UndefinedBehaviorSanitizer\.html"/);
@@ -162,10 +162,10 @@ test('Settings markup exposes the official UBSan help link in a protected new ta
   assert.doesNotMatch(html, /settings-save|Save settings|Apply settings/i);
 });
 
-test('Settings gear uses the toolbar icon size', async () => {
+test('Settings relies on the shared toolbar icon style', async () => {
   const css = await readFile(new URL('../src/ui/styles.css', import.meta.url), 'utf8');
 
-  assert.match(css, /\.settings-gear-icon\s*\{[^}]*font-size:\s*16px\s*;/s);
+  assert.doesNotMatch(css, /\.settings-gear-icon\s*\{/);
 });
 
 test('Settings backdrop preserves accurate workspace theme previews', async () => {

scripts/smoke-browser.mjs

@@ -956,6 +956,12 @@ int main() {
         const icon = document.querySelector(selector);
         return icon ? getComputedStyle(icon).fontSize : null;
       };
+      const rect = (selector) => {
+        const element = document.querySelector(selector);
+        if (!element) return null;
+        const { width, height } = element.getBoundingClientRect();
+        return { width, height };
+      };
       return {
         buttonText: button?.textContent?.replace(/\\s+/g, ' ').trim(),
         expanded: button?.getAttribute('aria-expanded'),
@@ -964,9 +970,15 @@ int main() {
         helpHref: help?.href,
         helpTarget: help?.target,
         helpRel: help?.rel,
-        settingsGearSize: iconSize('#btn-settings .settings-gear-icon'),
+        settingsGearSize: iconSize('#btn-settings .codicon-gear'),
         openIconSize: iconSize('#btn-open .codicon'),
         compileIconSize: iconSize('#btn-compile .codicon'),
+        settingsButtonRect: rect('#btn-settings'),
+        openButtonRect: rect('#btn-open'),
+        compileButtonRect: rect('#btn-compile'),
+        settingsGearRect: rect('#btn-settings .codicon-gear'),
+        openIconRect: rect('#btn-open .codicon'),
+        compileIconRect: rect('#btn-compile .codicon'),
       };
     })()`);
     assert(settingsDefault.buttonText?.includes('Settings'), 'Settings button label did not render');
@@ -977,6 +989,16 @@ int main() {
       'Settings gear size does not match the Open icon');
     assert(settingsDefault.settingsGearSize === settingsDefault.compileIconSize,
       'Settings gear size does not match the Compile icon');
+    assert(settingsDefault.settingsButtonRect?.height === settingsDefault.openButtonRect?.height,
+      'Settings button height does not match the Open button');
+    assert(settingsDefault.settingsButtonRect?.height === settingsDefault.compileButtonRect?.height,
+      'Settings button height does not match the Compile button');
+    assert(settingsDefault.settingsGearRect?.width === settingsDefault.openIconRect?.width &&
+      settingsDefault.settingsGearRect?.height === settingsDefault.openIconRect?.height,
+      'Settings gear dimensions do not match the Open icon');
+    assert(settingsDefault.settingsGearRect?.width === settingsDefault.compileIconRect?.width &&
+      settingsDefault.settingsGearRect?.height === settingsDefault.compileIconRect?.height,
+      'Settings gear dimensions do not match the Compile icon');
     assert(
       settingsDefault.helpHref === 'https://clang.llvm.org/docs/UndefinedBehaviorSanitizer.html',
       `Unexpected UBSan help URL: ${settingsDefault.helpHref}`

src/ui/index.html

@@ -43,7 +43,7 @@
         aria-controls="settings-panel"
         aria-expanded="false"
       >
-        <span class="settings-gear-icon" aria-hidden="true">⚙</span>
+        <span class="codicon codicon-gear" aria-hidden="true"></span>
         Settings
       </button>
     </header>

src/ui/styles.css

@@ -187,10 +187,6 @@ select:focus {
   flex: 0 0 auto;
 }
 
-.settings-gear-icon {
-  font-size: 16px;
-}
-
 /* ── Extension settings drawer ───────────────────────────────────────────── */
 
 .settings-backdrop {