# Plan: Launcher Config UX Refinement (Cohesion & Stability)

The goal of this plan is to address the visual "bouncing", layering overload, and the misplaced close button in the new Launcher configuration modal.

## 1. Dimensional Stability
- **Problem:** Switching tabs causes the modal to resize vertically and horizontally, leading to a "bouncing" feel.
- **Solution:** 
    - Set a fixed height for the `Launcher_cfg` container (e.g., `h-[750px]`).
    - Use `overflow-y-auto` only for the right-hand content pane.
    - Ensure the sidebar has a stable width.

## 2. Visual Hierarchy & Layering
- **Problem:** Too many nested backgrounds (Page > Launcher > Modal > Inner Pane > Section Pane > Section Content).
- **Solution:**
    - Flatten the background of the main content pane.
    - Simplify `Launcher_Cfg_Section.svelte`:
        - Remove `shadow-xl` from individual sections.
        - Use subtler borders instead of strong "preset-outlined" colors.
        - Remove the secondary background (`bg-white/5`) from the section content area.
    - Standardize on a single, clean surface color for the right-hand pane.

## 3. The "Centered Close Button" Bug
- **Problem:** A close button is appearing in the middle of the screen.
- **Investigation:** 
    - Check for absolute-positioned elements in `Launcher_cfg.svelte` or `+layout.svelte`.
    - Verify if Flowbite's `Modal` default close button is clashing with internal buttons.
- **Solution:**
    - Consolidate all "Close" actions.
    - Use the Modal's built-in top-right close button (if available) or a single, well-positioned button in the sidebar.

## 4. Implementation Steps

### Step 1: Update `Launcher_cfg.svelte`
- Set stable dimensions: `h-[750px] max-h-[90vh] w-[1000px] max-w-[95vw]`.
- Remove internal shadows and borders that conflict with the Modal container.
- Clean up the sidebar "Close" button.

### Step 2: Update `Launcher_cfg_section.svelte`
- Simplify the styling to reduce visual clutter.
- Remove `shadow-xl`.
- Use consistent padding and margins.

### Step 3: Update `+layout.svelte`
- Ensure the `Modal` is configured for a stable, large view without default padding issues.
- Verify the `modal_cfg_open` logic.

### Step 4: Add `Launcher_cfg_field.svelte` (Helper)
- Implement a unified field helper to standardize Label/Description/Input layouts across all tabs.

## 5. Verification
- Toggle between all 7 tabs. Verify zero layout shift (height/width remains constant).
- Check appearance in Light and Dark modes.
- Verify "Technical Mode" transitions.