feat: add custom system message setting for AI personalization (#728)

* feat: add custom system message setting for AI personalization

Allow users to enter custom instructions via a textarea in Settings
that get appended to the AI's system prompt. Includes server-side
validation (type check + 5000 char limit), localStorage persistence,
and i18n support for all 4 locales.

* fix: add accessibility htmlFor/id pairing on custom system message textarea

lib/i18n/dictionaries/en.json

@@ -126,7 +126,10 @@
         "diagramValidation": "Diagram Validation (Experimental)",
         "diagramValidationDescription": "Use a vision language model to validate generated diagrams. Requires a VLM like GPT-5.2 or Sonnet-4.5.",
         "enabled": "Enabled",
-        "disabled": "Disabled"
+        "disabled": "Disabled",
+        "customSystemMessage": "Custom System Message",
+        "customSystemMessageDescription": "Add custom instructions appended to the AI's system prompt.",
+        "customSystemMessagePlaceholder": "e.g., Always use blue color scheme for diagrams..."
     },
     "save": {
         "title": "Save Diagram",

lib/i18n/dictionaries/ja.json

@@ -126,7 +126,10 @@
         "diagramValidation": "ダイアグラム検証（実験的）",
         "diagramValidationDescription": "視覚言語モデルを使用して生成されたダイアグラムを検証します。GPT-5.2 や Sonnet-4.5 などの VLM が必要です。",
         "enabled": "有効",
-        "disabled": "無効"
+        "disabled": "無効",
+        "customSystemMessage": "カスタムシステムメッセージ",
+        "customSystemMessageDescription": "AIのシステムプロンプトに追加されるカスタム指示を入力します。",
+        "customSystemMessagePlaceholder": "例：ダイアグラムには常に青色のカラースキームを使用..."
     },
     "save": {
         "title": "ダイアグラムを保存",

lib/i18n/dictionaries/zh-Hant.json

@@ -126,7 +126,10 @@
         "diagramValidation": "圖表驗證（實驗性）",
         "diagramValidationDescription": "使用視覺語言模型驗證產生的圖表。需要支援視覺的模型，如 GPT-5.2 或 Sonnet-4.5。",
         "enabled": "已啟用",
-        "disabled": "已停用"
+        "disabled": "已停用",
+        "customSystemMessage": "自訂系統訊息",
+        "customSystemMessageDescription": "新增自訂指示，將附加到 AI 的系統提示末尾。",
+        "customSystemMessagePlaceholder": "例如：圖表始終使用藍色配色方案..."
     },
     "save": {
         "title": "儲存圖表",

lib/i18n/dictionaries/zh.json

@@ -126,7 +126,10 @@
         "diagramValidation": "图表验证（实验性）",
         "diagramValidationDescription": "使用视觉语言模型验证生成的图表。需要支持视觉的模型，如 GPT-5.2 或 Sonnet-4.5。",
         "enabled": "已启用",
-        "disabled": "已禁用"
+        "disabled": "已禁用",
+        "customSystemMessage": "自定义系统消息",
+        "customSystemMessageDescription": "添加自定义指令，将附加到 AI 的系统提示末尾。",
+        "customSystemMessagePlaceholder": "例如：图表始终使用蓝色配色方案..."
     },
     "save": {
         "title": "保存图表",

lib/storage.ts

@@ -27,4 +27,7 @@ export const STORAGE_KEYS = {
 
     // Diagram validation
     vlmValidationEnabled: "next-ai-draw-io-vlm-validation-enabled",
+
+    // Custom system message
+    customSystemMessage: "next-ai-draw-io-custom-system-message",
 } as const