feat: integrate Coloris color picker for background field

Add Coloris.js library for enhanced color selection in PageSettings with
automatic button state sync across tab changes.

Features:
- Color picker with swatches, alpha support, and format toggle (hex/rgb/hsl)
- Button positioned to the left of input field
- Automatic sync when switching tabs (remembers selected color)
- Close button and click-outside-to-close functionality
- Dark theme with pill UI style

Changes:
- Install @melloware/coloris package
- PageSettings.vue: Integrate Coloris with data-coloris attribute,
  add tab visibility detection via provide/inject, force button update
  when returning to document tab
- EditorPanel.vue: Provide activeTab to child components, increase
  panel width to 30rem
- _forms.scss: Add .input-with-color styles with custom Coloris
  button positioning (absolute positioned to left of input)
- Temporarily comment out rgb/hex format buttons (replaced by Coloris
  format toggle)

Technical details:
- Uses provide/inject pattern to detect tab changes
- Triggers synthetic input events to force Coloris button refresh
- Custom CSS overrides to position swatch button correctly

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

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

public/assets/css/src/_forms.scss

@@ -0,0 +1,72 @@
+select,
+input[type="text"],
+input[type="number"] {
+  background-color: var(--color-browngray-300);
+}
+
+.field--view-only {
+  opacity: 0.3;
+}
+
+.settings-section {
+  h2 {
+    border-bottom: 1px solid #000;
+  }
+  .settings-subsection:not(:last-child) {
+    border-bottom: 1px solid var(--color-browngray-050);
+  }
+
+  .settings-subsection {
+    padding: 0.5rem 0;
+
+    .field {
+      display: flex;
+      label {
+        width: 50%;
+      }
+
+      .input-with-unit {
+        display: flex;
+      }
+
+      .input-with-color {
+        .clr-field {
+          display: flex;
+          button {
+            position: absolute;
+            transform: none;
+            height: 1rem;
+            top: auto;
+            right: auto;
+            cursor: pointer;
+          }
+
+          input {
+            padding-left: 2.5rem;
+          }
+        }
+      }
+    }
+
+    &.margins {
+      display: flex;
+      flex-wrap: wrap;
+      h3 {
+        width: 100%;
+      }
+      .field {
+        width: 50%;
+
+        label {
+          width: 50%;
+        }
+
+        .input-with-unit {
+          input {
+            width: 50%;
+          }
+        }
+      }
+    }
+  }
+}