Fix mobile font size and enable smart keyboard features

src/pages/CreateStoryPage.css

@@ -596,6 +596,95 @@
   line-height: 1.6;
 }
 
+/* Markdown preview */
+.markdown-preview {
+  margin-top: 1rem;
+  background: #0d0d0d;
+  border: 1px solid #333;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.preview-header {
+  padding: 0.5rem 1rem;
+  background: #1a1a1a;
+  color: #888;
+  font-size: 0.85rem;
+  border-bottom: 1px solid #333;
+}
+
+.preview-content {
+  padding: 1rem;
+  color: #ccc;
+  font-size: 0.95rem;
+  line-height: 1.6;
+  max-height: 400px;
+  overflow-y: auto;
+}
+
+.preview-content h1,
+.preview-content h2,
+.preview-content h3,
+.preview-content h4 {
+  color: #fff;
+  margin: 1rem 0 0.5rem;
+}
+
+.preview-content h1:first-child,
+.preview-content h2:first-child,
+.preview-content h3:first-child {
+  margin-top: 0;
+}
+
+.preview-content p {
+  margin: 0.5rem 0;
+}
+
+.preview-content strong {
+  color: #a0b4ff;
+}
+
+.preview-content em {
+  color: #c9a0ff;
+}
+
+.preview-content ul,
+.preview-content ol {
+  margin: 0.5rem 0;
+  padding-left: 1.5rem;
+}
+
+.preview-content li {
+  margin: 0.25rem 0;
+}
+
+.preview-content code {
+  background: rgba(102, 126, 234, 0.2);
+  padding: 0.1rem 0.4rem;
+  border-radius: 4px;
+  font-family: "Fira Code", monospace;
+  font-size: 0.85em;
+}
+
+.preview-content pre {
+  background: #111;
+  padding: 1rem;
+  border-radius: 8px;
+  overflow-x: auto;
+}
+
+.preview-content pre code {
+  background: none;
+  padding: 0;
+}
+
+.preview-content blockquote {
+  border-left: 3px solid #667eea;
+  padding-left: 1rem;
+  margin: 0.5rem 0;
+  color: #999;
+}
+
 /* Character fields */
 .character-fields {
   display: flex;

src/pages/CreateStoryPage.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect } from "react";
 import { useNavigate, Link, useParams } from "react-router-dom";
+import ReactMarkdown from "react-markdown";
 import { useAuth } from "../contexts/AuthContext";
 import { createStory, getStory, updateStory } from "../services/api";
 import type { Character } from "../types";
@@ -652,7 +653,7 @@ export default function CreateStoryPage() {
             <label htmlFor="narrativeRules">Инструкции для ИИ</label>
             <p className="field-hint">
               Кастомные правила поведения ИИ. Если пусто — используются
-              стандартные правила.
+              стандартные правила. Поддерживается Markdown.
             </p>
             <textarea
               id="narrativeRules"
@@ -677,6 +678,14 @@ export default function CreateStoryPage() {
               rows={14}
               className="markdown-input"
             />
+            {form.narrativeRules.trim() && (
+              <div className="markdown-preview">
+                <div className="preview-header">👁️ Превью</div>
+                <div className="preview-content">
+                  <ReactMarkdown>{form.narrativeRules}</ReactMarkdown>
+                </div>
+              </div>
+            )}
           </div>
         </section>
 

src/pages/GamePage.css

@@ -752,7 +752,7 @@
 
   .message-content {
     padding: 0.75rem 0.875rem;
-    font-size: 0.9rem;
+    font-size: 1rem;
   }
 
   .quick-actions {
@@ -768,7 +768,7 @@
   .input-container textarea {
     min-height: 32px;
     padding: 0.4rem 0.875rem;
-    font-size: 0.9rem;
+    font-size: 16px; /* Минимум 16px чтобы iOS не зумил */
   }
 
   .send-btn,

src/pages/GamePage.tsx

@@ -392,29 +392,42 @@ export default function GamePage() {
     if (messageIndex === -1) return;
 
     const message = session.messages[messageIndex];
-    
+
     // Находим следующее сообщение ИИ (если есть)
     const nextMessage = session.messages[messageIndex + 1];
-    const currentAiResponse = nextMessage?.role === "assistant" ? nextMessage.content : undefined;
+    const currentAiResponse =
-    
+      nextMessage?.role === "assistant" ? nextMessage.content : undefined;
+
     // Инициализируем версии если их нет (первая версия = оригинал с текущим ответом ИИ)
-    const versions: MessageVersion[] = message.versions || [{ 
+    const versions: MessageVersion[] = message.versions || [
-      content: message.content, 
+      {
-      timestamp: message.timestamp,
+        content: message.content,
-      aiResponse: currentAiResponse 
+        timestamp: message.timestamp,
-    }];
+        aiResponse: currentAiResponse,
-    
+      },
+    ];
+
     // Если текущая версия не имеет aiResponse, добавляем его
     const currentVersionIdx = message.activeVersion || 0;
-    if (versions[currentVersionIdx] && !versions[currentVersionIdx].aiResponse && currentAiResponse) {
+    if (
-      versions[currentVersionIdx] = { ...versions[currentVersionIdx], aiResponse: currentAiResponse };
+      versions[currentVersionIdx] &&
+      !versions[currentVersionIdx].aiResponse &&
+      currentAiResponse
+    ) {
+      versions[currentVersionIdx] = {
+        ...versions[currentVersionIdx],
+        aiResponse: currentAiResponse,
+      };
     }
-    
+
     // Добавляем новую версию (aiResponse добавится после генерации)
-    const newVersion: MessageVersion = { content: editContent.trim(), timestamp: new Date() };
+    const newVersion: MessageVersion = {
+      content: editContent.trim(),
+      timestamp: new Date(),
+    };
     const newVersions: MessageVersion[] = [...versions, newVersion];
     const newActiveVersion = newVersions.length - 1;
-    
+
     // Обновляем сообщение пользователя
     const updatedUserMessage: ChatMessage = {
       ...message,
@@ -426,7 +439,7 @@ export default function GamePage() {
     // Обрезаем историю до этого сообщения (удаляем последующие)
     const messagesUpToEdit = session.messages.slice(0, messageIndex);
     const updatedMessages = [...messagesUpToEdit, updatedUserMessage];
-    
+
     const tempSession = { ...session, messages: updatedMessages };
     setSession(tempSession);
     setEditingMessageId(null);
@@ -453,8 +466,11 @@ export default function GamePage() {
 
       // Сохраняем ответ ИИ в текущую версию
       const finalVersions: MessageVersion[] = [...newVersions];
-      finalVersions[newActiveVersion] = { ...finalVersions[newActiveVersion], aiResponse: response };
+      finalVersions[newActiveVersion] = {
-      
+        ...finalVersions[newActiveVersion],
+        aiResponse: response,
+      };
+
       const finalUserMessage: ChatMessage = {
         ...updatedUserMessage,
         versions: finalVersions,
@@ -467,7 +483,11 @@ export default function GamePage() {
         timestamp: new Date(),
       };
 
-      const allMessages = [...messagesUpToEdit, finalUserMessage, assistantMessage];
+      const allMessages = [
+        ...messagesUpToEdit,
+        finalUserMessage,
+        assistantMessage,
+      ];
 
       const finalSession: GameSession = {
         ...session,
@@ -481,13 +501,16 @@ export default function GamePage() {
         if (streamingContent.trim()) {
           // Сохраняем частичный ответ в версию
           const finalVersions: MessageVersion[] = [...newVersions];
-          finalVersions[newActiveVersion] = { ...finalVersions[newActiveVersion], aiResponse: streamingContent };
+          finalVersions[newActiveVersion] = {
-          
+            ...finalVersions[newActiveVersion],
+            aiResponse: streamingContent,
+          };
+
           const finalUserMessage: ChatMessage = {
             ...updatedUserMessage,
             versions: finalVersions,
           };
-          
+
           const partialMessage: ChatMessage = {
             id: generateId(),
             role: "assistant",
@@ -512,7 +535,10 @@ export default function GamePage() {
   };
 
   // Переключить версию сообщения
-  const handleSwitchVersion = async (messageId: string, direction: "prev" | "next") => {
+  const handleSwitchVersion = async (
+    messageId: string,
+    direction: "prev" | "next",
+  ) => {
     if (!session || !story || !currentSessionId) return;
 
     const messageIndex = session.messages.findIndex((m) => m.id === messageId);
@@ -523,24 +549,30 @@ export default function GamePage() {
 
     const currentVersion = message.activeVersion || 0;
     let newVersion: number;
-    
+
     if (direction === "prev") {
-      newVersion = currentVersion > 0 ? currentVersion - 1 : message.versions.length - 1;
+      newVersion =
+        currentVersion > 0 ? currentVersion - 1 : message.versions.length - 1;
     } else {
-      newVersion = currentVersion < message.versions.length - 1 ? currentVersion + 1 : 0;
+      newVersion =
+        currentVersion < message.versions.length - 1 ? currentVersion + 1 : 0;
     }
 
     // Сохраняем текущий ответ ИИ в текущую версию перед переключением
     const nextMessage = session.messages[messageIndex + 1];
-    const currentAiResponse = nextMessage?.role === "assistant" ? nextMessage.content : undefined;
+    const currentAiResponse =
-    
+      nextMessage?.role === "assistant" ? nextMessage.content : undefined;
+
     const updatedVersions: MessageVersion[] = [...message.versions];
     if (currentAiResponse && updatedVersions[currentVersion]) {
-      updatedVersions[currentVersion] = { ...updatedVersions[currentVersion], aiResponse: currentAiResponse };
+      updatedVersions[currentVersion] = {
+        ...updatedVersions[currentVersion],
+        aiResponse: currentAiResponse,
+      };
     }
 
     const selectedVersion = updatedVersions[newVersion];
-    
+
     const updatedMessage: ChatMessage = {
       ...message,
       content: selectedVersion.content,
@@ -562,7 +594,7 @@ export default function GamePage() {
 
     const updatedSession = { ...session, messages: updatedMessages };
     setSession(updatedSession);
-    
+
     // Сохраняем изменения
     await apiSaveSession(story.id, currentSessionId, updatedSession);
   };
@@ -601,7 +633,12 @@ export default function GamePage() {
   };
 
   const handleSwitchSession = async (sessionId: string) => {
-    console.log("[GamePage] Switching to session:", sessionId, "current:", currentSessionId);
+    console.log(
+      "[GamePage] Switching to session:",
+      sessionId,
+      "current:",
+      currentSessionId,
+    );
     if (!id || sessionId === currentSessionId) {
       setShowSessionMenu(false);
       return;
@@ -707,8 +744,8 @@ export default function GamePage() {
       </header>
 
       <div className="game-content">
-        <div 
+        <div
-          className="messages-container" 
+          className="messages-container"
           ref={messagesContainerRef}
           onScroll={handleScroll}
         >
@@ -723,13 +760,13 @@ export default function GamePage() {
                     autoFocus
                   />
                   <div className="message-edit-actions">
-                    <button 
+                    <button
                       className="edit-cancel-btn"
                       onClick={handleCancelEdit}
                     >
                       Отмена
                     </button>
-                    <button 
+                    <button
                       className="edit-save-btn"
                       onClick={() => handleSaveEdit(message.id)}
                     >
@@ -753,26 +790,33 @@ export default function GamePage() {
                       <div className="message-actions">
                         {message.versions && message.versions.length > 1 && (
                           <div className="version-switcher">
-                            <button 
+                            <button
                               className="version-btn"
-                              onClick={() => handleSwitchVersion(message.id, "prev")}
+                              onClick={() =>
+                                handleSwitchVersion(message.id, "prev")
+                              }
                             >
                               ‹
                             </button>
                             <span className="version-indicator">
-                              {(message.activeVersion || 0) + 1}/{message.versions.length}
+                              {(message.activeVersion || 0) + 1}/
+                              {message.versions.length}
                             </span>
-                            <button 
+                            <button
                               className="version-btn"
-                              onClick={() => handleSwitchVersion(message.id, "next")}
+                              onClick={() =>
+                                handleSwitchVersion(message.id, "next")
+                              }
                             >
                               ›
                             </button>
                           </div>
                         )}
-                        <button 
+                        <button
                           className="edit-btn"
-                          onClick={() => handleEditMessage(message.id, message.content)}
+                          onClick={() =>
+                            handleEditMessage(message.id, message.content)
+                          }
                           title="Редактировать"
                         >
                           ✏️
@@ -836,7 +880,13 @@ export default function GamePage() {
         </div>
         */}
 
-        <form className="input-container" onSubmit={(e) => { e.preventDefault(); handleSend(); }}>
+        <form
+          className="input-container"
+          onSubmit={(e) => {
+            e.preventDefault();
+            handleSend();
+          }}
+        >
           <textarea
             ref={inputRef}
             value={input}
@@ -844,7 +894,8 @@ export default function GamePage() {
               setInput(e.target.value);
               // Auto-resize
               e.target.style.height = "auto";
-              e.target.style.height = Math.min(e.target.scrollHeight, 150) + "px";
+              e.target.style.height =
+                Math.min(e.target.scrollHeight, 150) + "px";
             }}
             onKeyDown={handleKeyDown}
             placeholder="Что ты хочешь сделать?..."
@@ -852,24 +903,24 @@ export default function GamePage() {
             rows={1}
             name="chat-input"
             autoComplete="off"
-            autoCorrect="off"
+            autoCorrect="on"
-            autoCapitalize="off"
+            autoCapitalize="sentences"
-            spellCheck={false}
+            spellCheck={true}
             enterKeyHint="send"
             data-form-type="other"
             data-lpignore="true"
             data-gramm="false"
           />
           {isLoading ? (
-            <button type="button" onClick={handleStop} className="send-btn stop-btn">
+            <button
+              type="button"
+              onClick={handleStop}
+              className="send-btn stop-btn"
+            >
               ⏹
             </button>
           ) : (
-            <button
+            <button type="submit" disabled={!input.trim()} className="send-btn">
-              type="submit"
-              disabled={!input.trim()}
-              className="send-btn"
-            >
               ➤
             </button>
           )}