refactor: make EditorPanel and ElementPopup fully autonomous

- Move all popup logic into ElementPopup component (state, positioning, click handling)
- Make EditorPanel autonomous with direct store access
- Simplify App.vue by removing prop drilling and intermediary logic
- Update EditorPanel to control paragraph font-size instead of .about
- Fix CSS parsing: escape selectors in extractCssValue and updateCssValue
- Remove hardcoded .about references from PagedJsWrapper

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

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

src/utils/css-parsing.js

@@ -29,8 +29,9 @@ const extractCssBlock = (css, selector) => {
  * extractCssValue(css, '@page', 'margin'); // { value: 20, unit: 'mm' }
  */
 const extractCssValue = (css, selector, property) => {
+  const escaped = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
   const regex = new RegExp(
-    `${selector}\\s*{[^}]*${property}:\\s*([\\d.]+)(px|rem|em|mm|cm|in)`,
+    `${escaped}\\s*{[^}]*${property}:\\s*([\\d.]+)(px|rem|em|mm|cm|in)`,
     'i'
   );
   const match = css.match(regex);
@@ -56,8 +57,9 @@ const extractCssValue = (css, selector, property) => {
  * }); // '@page { margin: 30mm; }'
  */
 const updateCssValue = ({ css, selector, property, value, unit }) => {
+  const escaped = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
   const regex = new RegExp(
-    `(${selector}\\s*{[^}]*${property}:\\s*)[\\d.]+(px|rem|em|mm|cm|in)`,
+    `(${escaped}\\s*{[^}]*${property}:\\s*)[\\d.]+(px|rem|em|mm|cm|in)`,
     'gi'
   );
   return css.replace(regex, `$1${value}${unit}`);