feat: refactor popups with shared positioning and CSS tooltips

- Add usePopupPosition composable for smart popup positioning
  (bottom-right → bottom-left → top-right → top-left fallback)
- Refactor ElementPopup with complete controls matching mockup
- Add stylesheet sync: popups initialize from and watch store changes
- Add click-to-close behavior: clicking another element closes popup
- Add CSS property tooltips on all form labels (editor panel + popups)
  with dotted underline and monospace code tooltip on hover
- Add field--view-only class and disabled attribute on locked fields

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

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

src/components/ui/MarginEditor.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="margin-editor">
     <div class="field">
-      <label :for="id">{{ label }}</label>
+      <label :for="id" class="label-with-tooltip" :data-css="cssProperty">{{ label }}</label>
       <div class="input-with-unit">
         <input
           :id="id"
@@ -29,7 +29,7 @@
 
     <div v-if="expanded" class="subsection collapsed-section">
       <div v-for="side in sides" :key="side.key" class="field">
-        <label :for="`${id}-${side.key}`">{{ side.label }}</label>
+        <label :for="`${id}-${side.key}`" class="label-with-tooltip" :data-css="`${cssProperty}-${side.key}`">{{ side.label }}</label>
         <div class="input-with-unit">
           <input
             :id="`${id}-${side.key}`"
@@ -62,6 +62,10 @@ const props = defineProps({
     type: String,
     required: true
   },
+  cssProperty: {
+    type: String,
+    default: 'margin'
+  },
   simple: {
     type: Object,
     required: true,