Merge issue-44 (Refs #44)

# Conflicts:
#	craft/src/styles/editor.css

craft/src/styles/editor.css

@@ -2502,3 +2502,58 @@ body {
 .rt-toolbar-input.is-invalid {
   border-color: var(--color-danger);
 }
+
+/* #44 palettes */
+.token-chip {
+  flex: none;
+  padding: 1px 6px;
+  font-size: 10px;
+  font-weight: 600;
+  line-height: 16px;
+  color: var(--color-accent);
+  background: var(--color-accent-subtle);
+  border: 1px solid var(--color-accent);
+  border-radius: 999px;
+  white-space: nowrap;
+}
+
+.palette-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 6px;
+}
+
+.palette-preview {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 6px 4px;
+  background: var(--color-bg-elevated);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  color: var(--color-text-muted);
+  font-size: 10px;
+  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
+}
+
+.palette-preview:hover { border-color: var(--color-text-muted); }
+
+.palette-preview.active {
+  border-color: var(--color-accent);
+  box-shadow: 0 0 0 2px var(--color-accent-subtle);
+  color: var(--color-text);
+}
+
+.palette-dots { display: flex; }
+
+.palette-dot {
+  width: 14px;
+  height: 14px;
+  border-radius: 50%;
+  border: 1px solid var(--color-border);
+  margin-left: -3px;
+}
+
+.palette-dot:first-child { margin-left: 0; }