Convert all Vue component CSS to SCSS with nested BEM syntax

[Claude]

Converted all Vue component <style scoped> blocks from plain CSS to SCSS (lang="scss"), utilizing SCSS nesting to optimize BEM-style class hierarchies and reduce code repetition.

Changes

• UI components (12 files): EiButton, EiInput, EiTextarea, EiSelect, EiCheckbox, EiSwitch, EiPanel, EiTree, EiBorderToggle, EiFontPicker, EiNumberInput, EiColorPicker
• AI components (5 files): AIPanel, ChatInput, MessageBubble, ServerManagerModal, SchemaJsonModal
• Designer components (24 files): All toolbar, canvas, panel, and overlay components
• Playground components (1 file): PreviewOverlay

Example transformation

Before (CSS):

.ei-button { }
.ei-button:hover:not(:disabled) { }
.ei-button:disabled { }
.ei-button--primary { }
.ei-button--primary:hover:not(:disabled) { }

After (SCSS):

.ei-button {
  &:hover:not(:disabled) { }
  &:disabled { }
  
  &--primary {
    &:hover:not(:disabled) { }
  }
}

All styling behavior preserved while eliminating ~1000 lines of class name repetition through SCSS nesting of BEM modifiers (&--modifier), elements (&__element), and pseudo-selectors (&:hover, &:focus, &:disabled).