feat: add editable CSS in StylesheetViewer and ElementPopup

- Make stylesheet fully editable via textarea with 1s debounce
- Allow editing CSS blocks in ElementPopup with live updates
- Replace syntax highlighting with plain textarea for better editing UX
- Updates reflect in PagedJS preview after debounce timeout

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

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

src/components/ElementPopup.vue

@@ -23,7 +23,11 @@
         <p v-else class="no-styles">Aucun style éditable</p>
       </div>
       <div class="popup-css">
-        <pre><code class="hljs language-css" v-html="highlightedCss"></code></pre>
+        <textarea
+          :value="elementCss"
+          @input="handleCssInput"
+          spellcheck="false"
+        ></textarea>
       </div>
     </div>
   </div>
@@ -32,11 +36,6 @@
 <script setup>
 import { ref, computed } from 'vue';
 import { useStylesheetStore } from '../stores/stylesheet';
-import hljs from 'highlight.js/lib/core';
-import css from 'highlight.js/lib/languages/css';
-import 'highlight.js/styles/github.css';
-
-hljs.registerLanguage('css', css);
 
 const stylesheetStore = useStylesheetStore();
 
@@ -94,11 +93,6 @@ const fontSizeData = computed(() => {
   return stylesheetStore.extractValue(selector.value, 'font-size');
 });
 
-const highlightedCss = computed(() => {
-  if (!elementCss.value) return '<span class="no-css">Aucun style défini</span>';
-  return hljs.highlight(elementCss.value, { language: 'css' }).value;
-});
-
 const updateFontSize = (value) => {
   if (!fontSizeData.value) return;
   stylesheetStore.updateProperty(
@@ -109,6 +103,21 @@ const updateFontSize = (value) => {
   );
 };
 
+let cssDebounceTimer = null;
+
+const handleCssInput = (event) => {
+  const newCss = event.target.value;
+
+  if (cssDebounceTimer) {
+    clearTimeout(cssDebounceTimer);
+  }
+
+  cssDebounceTimer = setTimeout(() => {
+    const oldBlock = elementCss.value;
+    stylesheetStore.content = stylesheetStore.content.replace(oldBlock, newCss);
+  }, 1000);
+};
+
 defineExpose({ handleIframeClick });
 </script>
 
@@ -157,21 +166,22 @@ defineExpose({ handleIframeClick });
 
 .popup-css {
   flex: 1;
-  padding: 0.75rem;
   background: #1e1e1e;
-  max-height: 200px;
-  overflow-y: auto;
+  display: flex;
 }
 
-.popup-css pre {
-  margin: 0;
+.popup-css textarea {
+  width: 100%;
+  height: 200px;
+  background: #1e1e1e;
+  color: #abb2bf;
+  border: none;
+  padding: 0.75rem;
+  font-family: 'Courier New', Courier, monospace;
   font-size: 0.75rem;
   line-height: 1.4;
-}
-
-.popup-css code {
-  background: transparent;
-  color: #fff;
+  resize: none;
+  outline: none;
 }
 
 .control {