From e51fdd4e646031aa4d1b68b903edb1f440603d89 Mon Sep 17 00:00:00 2001
From: Alexej Wolff <awolff@draug.me>
Date: Wed, 11 Feb 2026 18:53:12 +0100
Subject: [PATCH] Add AI usage indicators to story creation form

---
 src/pages/CreateStoryPage.css | 23 ++++++++----
 src/pages/CreateStoryPage.tsx | 66 +++++++++++++++++++++++++----------
 2 files changed, 64 insertions(+), 25 deletions(-)

diff --git a/src/pages/CreateStoryPage.css b/src/pages/CreateStoryPage.css
index fa2d22e..675c7fc 100644
--- a/src/pages/CreateStoryPage.css
+++ b/src/pages/CreateStoryPage.css
@@ -55,6 +55,23 @@
   border-bottom: 1px solid #333;
 }
 
+.ai-tag {
+  font-size: 0.7rem;
+  padding: 0.2rem 0.5rem;
+  background: rgba(102, 126, 234, 0.2);
+  color: #a0b4ff;
+  border-radius: 6px;
+  font-weight: 500;
+  vertical-align: middle;
+  margin-left: 0.5rem;
+}
+
+.section-hint {
+  color: #888;
+  font-size: 0.85rem;
+  margin: -0.75rem 0 1rem;
+}
+
 .form-group {
   margin-bottom: 1rem;
 }
@@ -612,12 +629,6 @@
   color: #666;
 }
 
-.section-hint {
-  color: #888;
-  font-size: 0.9rem;
-  margin: -0.5rem 0 1rem;
-}
-
 /* Персонажи */
 .character-card {
   background: #0d0d0d;
diff --git a/src/pages/CreateStoryPage.tsx b/src/pages/CreateStoryPage.tsx
index 3a4f673..d390c81 100644
--- a/src/pages/CreateStoryPage.tsx
+++ b/src/pages/CreateStoryPage.tsx
@@ -355,6 +355,9 @@ export default function CreateStoryPage() {
 
           <div className="form-group">
             <label htmlFor="title">Название истории *</label>
+            <p className="field-hint">
+              Только для отображения. Не используется ИИ.
+            </p>
             <input
               type="text"
               id="title"
@@ -368,7 +371,10 @@ export default function CreateStoryPage() {
           </div>
 
           <div className="form-group">
-            <label htmlFor="language">Язык истории *</label>
+            <label htmlFor="language">
+              Язык истории * <span className="ai-tag">🤖 ИИ</span>
+            </label>
+            <p className="field-hint">ИИ будет отвечать на выбранном языке.</p>
             <div className="language-grid">
               {LANGUAGES.map((lang) => (
                 <button
@@ -422,17 +428,19 @@ export default function CreateStoryPage() {
               </label>
               <div className="nsfw-info">
                 <span className={`nsfw-label ${form.isNsfw ? "active" : ""}`}>
-                  🔞 NSFW контент
+                  🔞 NSFW контент <span className="ai-tag">🤖 ИИ</span>
                 </span>
                 <span className="nsfw-hint">
-                  Включите, если история содержит контент 18+
+                  Снимает ограничения ИИ на контент 18+
                 </span>
               </div>
             </div>
           </div>
 
           <div className="form-group">
-            <label htmlFor="temperature">🎲 Креативность ИИ</label>
+            <label htmlFor="temperature">
+              🎲 Креативность ИИ <span className="ai-tag">🤖 ИИ</span>
+            </label>
             <p className="field-hint">
               Управляет креативностью ответов ИИ. Низкая = сосредоточенный,
               Высокая = креативный
@@ -461,7 +469,12 @@ export default function CreateStoryPage() {
 
         {/* Жанры */}
         <section className="form-section">
-          <h2>🎭 Жанры</h2>
+          <h2>
+            🎭 Жанры <span className="ai-tag">🤖 ИИ</span>
+          </h2>
+          <p className="section-hint">
+            Влияет на стиль и атмосферу генерации ИИ.
+          </p>
 
           {form.genres.length > 0 && (
             <div className="selected-tags">
@@ -515,7 +528,10 @@ export default function CreateStoryPage() {
 
         {/* Сеттинги */}
         <section className="form-section">
-          <h2>🏰 Сеттинг</h2>
+          <h2>
+            🏰 Сеттинг <span className="ai-tag">🤖 ИИ</span>
+          </h2>
+          <p className="section-hint">Определяет мир и эпоху для ИИ.</p>
 
           {form.settings.length > 0 && (
             <div className="selected-tags">
@@ -569,13 +585,15 @@ export default function CreateStoryPage() {
 
         {/* Сюжет */}
         <section className="form-section">
-          <h2>📜 Сюжет</h2>
+          <h2>
+            📜 Сюжет <span className="ai-tag">🤖 ИИ</span>
+          </h2>
 
           <div className="form-group">
             <label htmlFor="plot">Полный сюжет *</label>
             <p className="field-hint">
-              Подробное описание сюжета, которое будет управлять историей.
-              Используется ИИ. Поддерживается Markdown.
+              Основа для ИИ — подробное описание сюжета и ключевых событий.
+              Поддерживается Markdown.
             </p>
             <textarea
               id="plot"
@@ -602,13 +620,15 @@ export default function CreateStoryPage() {
 
         {/* Первое сообщение */}
         <section className="form-section">
-          <h2>💬 Первое сообщение</h2>
+          <h2>
+            💬 Первое сообщение <span className="ai-tag">🤖 ИИ</span>
+          </h2>
 
           <div className="form-group">
             <label htmlFor="firstMessage">Начало истории</label>
             <p className="field-hint">
-              Первое сообщение, которое увидит игрок при начале игры. Если
-              оставить пустым, ИИ сгенерирует начало автоматически.
+              Первое сообщение, которое увидит игрок. Если пусто — ИИ
+              сгенерирует автоматически.
             </p>
             <textarea
               id="firstMessage"
@@ -624,14 +644,15 @@ export default function CreateStoryPage() {
 
         {/* Правила повествования */}
         <section className="form-section">
-          <h2>📝 Правила повествования</h2>
+          <h2>
+            📝 Правила повествования <span className="ai-tag">🤖 ИИ</span>
+          </h2>
 
           <div className="form-group">
             <label htmlFor="narrativeRules">Инструкции для ИИ</label>
             <p className="field-hint">
-              Кастомные правила поведения ИИ: стиль повествования, запреты,
-              формат ответов. Если оставить пустым, будут использованы
-              стандартные правила живой истории.
+              Кастомные правила поведения ИИ. Если пусто — используются
+              стандартные правила.
             </p>
             <textarea
               id="narrativeRules"
@@ -661,7 +682,12 @@ export default function CreateStoryPage() {
 
         {/* Мир */}
         <section className="form-section">
-          <h2>🌍 Мир</h2>
+          <h2>
+            🌍 Мир <span className="ai-tag">🤖 ИИ</span>
+          </h2>
+          <p className="section-hint">
+            Весь раздел используется ИИ для построения контекста мира.
+          </p>
 
           <div className="form-group">
             <label htmlFor="worldName">Название мира *</label>
@@ -726,9 +752,11 @@ export default function CreateStoryPage() {
 
         {/* NPC Персонажи */}
         <section className="form-section">
-          <h2>👥 NPC Персонажи мира</h2>
+          <h2>
+            👥 NPC Персонажи мира <span className="ai-tag">🤖 ИИ</span>
+          </h2>
           <p className="section-hint">
-            Персонажи, которых игрок встретит в истории.
+            Персонажи, которых ИИ будет использовать в истории.
           </p>
 
           {form.characters.map((char, index) => (