feat: enhance control panel UI and resize functionality

Panel UI improvements:
- Replace heading elements (h1-h6) with styled divs to avoid navigation interference
- Change ContentsControl position from northwest to west for better accessibility

Panel collapse/expand enhancements:
- Fix panel dragging to prevent unexpected positioning jumps
- Keep panel width and upper-left position when collapsing to header-only mode
- Complete height reduction when collapsed (no minimal size maintained)
- Toggle resize handle visibility based on panel state

Resize handle improvements:
- Change resize symbol from arrow to clean dot (●) in bottom-right corner
- Remove background circle, show transparent dot only
- Fix resize direction to properly follow mouse movement from bottom-right
- Set dynamic minimum size constraints (header height + padding)
- Allow arbitrary panel sizing with proper bounds checking
- Reset panel size to defaults when closed/collapsed

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

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

testdrive-jsui/static/js/controls/edit-control.js

@@ -68,11 +68,11 @@ class EditControl extends ControlBase {
         return this.safeOperation(() => {
             return `
                 <div style="padding: 1rem; font-size: 0.8rem;">
-                    <h4 style="margin-top: 0; margin-bottom: 1rem;">Edit Tools</h4>
+                    <div style="margin-top: 0; margin-bottom: 1rem; font-weight: 600; font-size: 1.1em; color: #333;">Edit Tools</div>
 
                     <!-- Document Actions -->
                     <div class="action-section" style="margin-bottom: 1rem;">
-                        <h5 style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666;">Document Actions</h5>
+                        <div style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666; font-weight: 600;">Document Actions</div>
 
                         <button onclick="this.closest('.edit-control').editControl.printDocument()"
                                 style="width: 100%; padding: 0.5rem; margin-bottom: 0.3rem; background: #28a745; color: white; border: none; border-radius: 3px; cursor: pointer; font-size: 0.8rem;">
@@ -97,7 +97,7 @@ class EditControl extends ControlBase {
 
                     <!-- Navigation Tools -->
                     <div class="navigation-section" style="margin-bottom: 1rem;">
-                        <h5 style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666;">Navigation</h5>
+                        <div style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666; font-weight: 600;">Navigation</div>
 
                         <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem;">
                             <button onclick="this.closest('.edit-control').editControl.scrollToTop()"
@@ -119,7 +119,7 @@ class EditControl extends ControlBase {
 
                     <!-- Text Tools -->
                     <div class="text-section" style="margin-bottom: 1rem;">
-                        <h5 style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666;">Text Tools</h5>
+                        <div style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666; font-weight: 600;">Text Tools</div>
 
                         <button onclick="this.closest('.edit-control').editControl.showFindReplace()"
                                 style="width: 100%; padding: 0.4rem; margin-bottom: 0.3rem; background: #ffc107; color: #000; border: none; border-radius: 3px; cursor: pointer; font-size: 0.7rem;">
@@ -146,7 +146,7 @@ class EditControl extends ControlBase {
 
                     <!-- Markdown Tools -->
                     <div class="markdown-section" style="margin-bottom: 1rem;">
-                        <h5 style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666;">Markdown Tools</h5>
+                        <div style="margin: 0 0 0.5rem 0; font-size: 0.9em; color: #666; font-weight: 600;">Markdown Tools</div>
 
                         <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem;">
                             <button onclick="this.closest('.edit-control').editControl.insertMarkdown('**', '**', 'Bold text')"
@@ -240,7 +240,7 @@ class EditControl extends ControlBase {
             `;
 
             exportMenu.innerHTML = `
-                <h4 style="margin-top: 0;">Export Document</h4>
+                <div style="margin-top: 0; font-weight: 600; font-size: 1.1em; color: #333; margin-bottom: 1rem;">Export Document</div>
                 <button onclick="this.parentElement.exportAsHTML()" style="display: block; width: 100%; padding: 0.5rem; margin-bottom: 0.3rem; background: #28a745; color: white; border: none; border-radius: 3px; cursor: pointer;">
                     Export as HTML
                 </button>