refactor: reorganize theme scopes and add UI themes for editor elements

Breaking Changes:
- Renamed 'ui' scope to 'mode' for light/dark themes
- Created new 'ui' scope for editor interface elements

New Features:
- Added 4 UI themes for editor interface: standard, greyscale, electric, psychedelic
- UI themes control editor panels, buttons, focus colors, and shadows
- Updated legacy theme mappings to include 'standard' UI theme by default
- Enhanced themes command to display scope-specific properties

Theme Scopes:
- mode: Light/dark color schemes (light, dark)
- ui: Editor interface elements (standard, greyscale, electric, psychedelic)
- document: Typography and layout (basic, github, academic)
- branding: Accent colors (corporate, startup)

Usage Examples:
- markitect md-render file.md --theme dark,electric,academic
- markitect themes --scope ui
- markitect themes --scope mode

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

markitect/plugins/builtin/markdown_commands.py

@@ -28,9 +28,9 @@ def get_default_format(available_formats=['table', 'json', 'yaml', 'simple'], fa
 
 # Layered theme system - themes can be combined across different scopes
 LAYERED_THEMES = {
-    # UI Themes - Interface colors and backgrounds
+    # Mode Themes - Light/dark color schemes
     'light': {
-        'scope': 'ui',
+        'scope': 'mode',
         'properties': {
             'body_background': '#ffffff',
             'body_color': '#333333',
@@ -47,7 +47,7 @@ LAYERED_THEMES = {
         }
     },
     'dark': {
-        'scope': 'ui',
+        'scope': 'mode',
         'properties': {
             'body_background': '#0d1117',
             'body_color': '#e1e4e8',
@@ -64,6 +64,60 @@ LAYERED_THEMES = {
         }
     },
 
+    # UI Themes - Editor interface elements (floating panels, buttons, editing frames)
+    'standard': {
+        'scope': 'ui',
+        'properties': {
+            'editor_panel_bg': '#f8f9fa',
+            'editor_panel_border': '#dee2e6',
+            'editor_button_bg': '#ffffff',
+            'editor_button_hover': '#e9ecef',
+            'editor_button_active': '#dee2e6',
+            'editor_text_color': '#212529',
+            'editor_focus_color': '#0066cc',
+            'editor_shadow': 'rgba(0,0,0,0.1)'
+        }
+    },
+    'greyscale': {
+        'scope': 'ui',
+        'properties': {
+            'editor_panel_bg': '#f5f5f5',
+            'editor_panel_border': '#d0d0d0',
+            'editor_button_bg': '#ffffff',
+            'editor_button_hover': '#e8e8e8',
+            'editor_button_active': '#d4d4d4',
+            'editor_text_color': '#333333',
+            'editor_focus_color': '#666666',
+            'editor_shadow': 'rgba(0,0,0,0.15)'
+        }
+    },
+    'electric': {
+        'scope': 'ui',
+        'properties': {
+            'editor_panel_bg': '#001122',
+            'editor_panel_border': '#00ffff',
+            'editor_button_bg': '#003366',
+            'editor_button_hover': '#0066cc',
+            'editor_button_active': '#0099ff',
+            'editor_text_color': '#00ffff',
+            'editor_focus_color': '#ffff00',
+            'editor_shadow': 'rgba(0,255,255,0.3)'
+        }
+    },
+    'psychedelic': {
+        'scope': 'ui',
+        'properties': {
+            'editor_panel_bg': 'linear-gradient(45deg, #ff6b35, #f7931e, #ffd23f, #06ffa5)',
+            'editor_panel_border': '#ff1493',
+            'editor_button_bg': 'rgba(255,255,255,0.2)',
+            'editor_button_hover': 'rgba(255,20,147,0.3)',
+            'editor_button_active': 'rgba(255,20,147,0.5)',
+            'editor_text_color': '#ffffff',
+            'editor_focus_color': '#ff1493',
+            'editor_shadow': 'rgba(255,20,147,0.4)'
+        }
+    },
+
     # Document Themes - Typography and layout
     'basic': {
         'scope': 'document',
@@ -116,10 +170,10 @@ LAYERED_THEMES = {
 
 # Legacy compatibility - map old theme names to new layered equivalents
 LEGACY_THEME_MAPPING = {
-    'basic': ['light', 'basic'],
-    'github': ['light', 'github'],
-    'dark': ['dark', 'basic'],
-    'academic': ['light', 'academic']
+    'basic': ['light', 'standard', 'basic'],
+    'github': ['light', 'standard', 'github'],
+    'dark': ['dark', 'standard', 'basic'],
+    'academic': ['light', 'standard', 'academic']
 }
 
 # Keep TEMPLATE_STYLES for backward compatibility in tests
@@ -1963,8 +2017,8 @@ def md_render_command(ctx, input_file, output, theme, css, edit, editor_theme,
 @click.command()
 @click.option('--format', type=click.Choice(['table', 'list', 'json']), default='table',
               help='Output format: table (default), list, or json')
-@click.option('--scope', type=click.Choice(['ui', 'document', 'branding', 'all']), default='all',
-              help='Filter themes by scope: ui, document, branding, or all (default)')
+@click.option('--scope', type=click.Choice(['mode', 'ui', 'document', 'branding', 'all']), default='all',
+              help='Filter themes by scope: mode (light/dark), ui (editor interface), document (typography), branding (colors), or all (default)')
 def themes_list_command(format, scope):
     """
     List all available themes and their properties.
@@ -1990,17 +2044,29 @@ def themes_list_command(format, scope):
         theme_scope = theme_data['scope']
         if scope == 'all' or scope == theme_scope:
             properties = theme_data['properties']
-            # Get key properties for display
+            # Get key properties for display based on scope
             key_props = []
-            if 'body_background' in properties:
-                key_props.append(f"bg:{properties['body_background']}")
-            if 'font_family' in properties:
-                family = properties['font_family'].split(',')[0].strip().strip('"\'')
-                key_props.append(f"font:{family}")
-            if 'link_color' in properties:
-                key_props.append(f"links:{properties['link_color']}")
-            if 'accent_color' in properties:
-                key_props.append(f"accent:{properties['accent_color']}")
+            if theme_scope == 'mode':
+                if 'body_background' in properties:
+                    key_props.append(f"bg:{properties['body_background']}")
+                if 'link_color' in properties:
+                    key_props.append(f"links:{properties['link_color']}")
+            elif theme_scope == 'ui':
+                if 'editor_panel_bg' in properties:
+                    key_props.append(f"panel:{properties['editor_panel_bg']}")
+                if 'editor_text_color' in properties:
+                    key_props.append(f"text:{properties['editor_text_color']}")
+                if 'editor_focus_color' in properties:
+                    key_props.append(f"focus:{properties['editor_focus_color']}")
+            elif theme_scope == 'document':
+                if 'font_family' in properties:
+                    family = properties['font_family'].split(',')[0].strip().strip('"\'')
+                    key_props.append(f"font:{family}")
+                if 'link_color' in properties:
+                    key_props.append(f"links:{properties['link_color']}")
+            elif theme_scope == 'branding':
+                if 'accent_color' in properties:
+                    key_props.append(f"accent:{properties['accent_color']}")
 
             layered_themes.append({
                 'name': theme_name,