fix(settings): keep Python interpreter dialog rows aligned

e2e/settings.spec.ts

@@ -1,5 +1,45 @@
 import { expect, test } from "./fixtures";
 
+test("Add Python Interpreter keeps environment labels and fields inside their rows", async ({ workbench: page }) => {
+  await page.keyboard.press("Meta+,");
+  const settings = page.getByRole("dialog", { name: "Settings", exact: true });
+  await settings.getByRole("textbox", { name: "Search settings" }).fill("Python Interpreter");
+  await settings
+    .getByRole("tree", { name: "Settings pages" })
+    .getByRole("treeitem", { name: "Python Interpreter", exact: true })
+    .click();
+  await settings.getByRole("button", { name: "Add Interpreter…", exact: true }).click();
+  const dialog = page.getByRole("dialog", { name: "Add Python Interpreter", exact: true });
+  await expect(dialog).toBeVisible();
+
+  for (const width of [1000, 800, 520]) {
+    await page.setViewportSize({ width, height: 760 });
+    await expect(async () => {
+      const labelsFit = await dialog.getByRole("list", { name: "Interpreter type" }).evaluate((list) =>
+        [...list.querySelectorAll("button")].every((button) => {
+          const box = button.getBoundingClientRect();
+          const range = document.createRange();
+          range.selectNodeContents(button);
+          return [...range.getClientRects()].every(
+            (r) => r.top >= box.top - 1 && r.bottom <= box.bottom + 1 && r.right <= box.right + 1,
+          );
+        }),
+      );
+      expect(labelsFit).toBe(true);
+    }).toPass({ timeout: 3000 });
+
+    const location = dialog.getByRole("textbox", { name: "Location:", exact: true });
+    const fieldSpacing = await location.evaluate((input) => ({
+      rowHeight: input.parentElement!.getBoundingClientRect().height,
+      fieldHeight: input.getBoundingClientRect().height,
+    }));
+    expect(fieldSpacing.rowHeight).toBeLessThanOrEqual(fieldSpacing.fieldHeight + 1);
+    const base = await dialog.getByRole("button", { name: "Base interpreter", exact: true }).boundingBox();
+    const loc = await location.boundingBox();
+    expect(base!.y - loc!.y - loc!.height).toBeLessThan(50);
+  }
+});
+
 test("Project Structure keeps edits across repeated shortcuts and applies them", async ({ workbench: page }) => {
   await page.keyboard.press("Meta+;");
   const dialog = page.getByRole("dialog", { name: "Project Structure", exact: true });

src/features/settings/languages/AddInterpreterDialog.tsx

@@ -226,7 +226,7 @@ export function AddInterpreterDialog({
               <label htmlFor={ids.existing}>
                 <T>Interpreter:</T>
               </label>
-              <div className={`${styles.pathRow} ${styles.existingPathRow}`}>
+              <div className={styles.pathRow}>
                 <Select
                   id={ids.existing}
                   className={styles.pathInput}

src/features/settings/languages/Sdk.module.css

@@ -152,7 +152,7 @@
 /* Add Python Interpreter dialog */
 .dialogBody {
   display: grid;
-  grid-template-columns: 150px minmax(0, 1fr);
+  grid-template-columns: minmax(150px, max-content) minmax(0, 1fr);
   min-height: 300px;
 }
 .kinds {
@@ -174,6 +174,7 @@
   color: var(--fg);
   font: inherit;
   text-align: left;
+  white-space: nowrap;
 }
 .kindOn {
   background: var(--bg-list-selected);
@@ -187,12 +188,14 @@
 }
 .radios {
   display: flex;
-  gap: 16px;
+  flex-wrap: wrap;
+  gap: 6px 16px;
 }
 .radio {
   display: inline-flex;
   align-items: center;
   gap: 6px;
+  white-space: nowrap;
 }
 .pathRow {
   display: flex;
@@ -201,7 +204,7 @@
   flex: 1;
   min-width: 0;
 }
-.existingPathRow {
+.form > .pathRow {
   flex: none;
 }
 .pathInput {