fix(web): align provider controls with machine tabs - #9769

💭 Let me open the file to see what changes are there.

1. browse_code — apps/web/src/components/settings/ProviderSettingsPanel.tsx

2. browse_code — apps/web/src/components/settings/ProviderSettingsPanel.tsx

💭 I should look at the changes to EnvironmentProviderSettings around lines 975-1040 next.

3. browse_code — apps/web/src/components/settings/ProviderSettingsPanel.tsx

💭 This looks like a layout refactor that replaces SettingsSection's headerAction slot with a hand-built toolbar row and a new hideTitle prop. I'm weighing whether this bypasses the existing shared-component slot in a way that violates the rule against duplicating styling that should instead be a variant or new slot on the shared component.

4. browse_code — Show the SettingsSection component definition in apps/web/src (props: variant, hideTitle, headerAction, title) with its class strings and how header/headerAction are rendered.

💭 This looks like a real violation worth flagging—the toolbar row duplicates the exact header padding and layout treatment (px-3 sm:px-4, items-center, min-height) that the shared SettingsSection header slot already provides, so the fix should be a new slot or variant on that component rather than hand-building the same geometry again. But I want to double check whether this is genuinely the "same treatment" or a legitimately different layout need—the header slot uses items-start with a smaller min-height, while this toolbar needs items-center at 44px to fit device tabs alongside actions, which could justify a distinct geometry rather than reuse. I should search for other call sites with similar toolbar patterns to see if this duplication is isolated or repeated across the codebase.

5. browse_code — Search apps/web/src for other call sites that render a toolbar row with classes like "px-3 sm:px-4" combined with min-h-11 or a header-like flex row outside SettingsSection's header (e.g. hideTitle usage with a hand-built header row). List file paths and the class strings.

💭 This matches an existing pattern already in the codebase, so it follows precedent. No global CSS, no inline styles, and no new raw styled buttons introduced — everything checks out clean, so I'll mark this as all clear.