feat: the send button as in Telegram - a blue plane with no plate, coming in only when there is something to send; the empty chat shows a chat mark and «Спросите AI помощника»

internal/server/web/static/app.css

@@ -860,6 +860,13 @@ body.touch.term-active .ai-fab { bottom:104px; }
 .ai-head .ai-chatname { min-width:3ch; }
 .ai-head .ai-chatsel { flex:0 1 auto; }
 .ai-chat-body { position:relative; flex:1; min-height:0; }
+/* The empty chat: a quiet chat mark and a word, in the middle. */
+.ai-hello { margin:auto; display:flex; flex-direction:column; align-items:center; gap:12px; padding:24px 12px; text-align:center; animation:ai-hello-in .3s ease both; }
+.ai-hello[hidden] { display:none; }
+.ai-hello-icon { width:60px; height:60px; display:flex; align-items:center; justify-content:center; border-radius:50%;
+                 color:var(--muted); background:#151a21; border:1px solid var(--border); }
+.ai-hello-text { color:var(--muted); font-size:14px; font-weight:500; }
+@keyframes ai-hello-in { from { opacity:0; transform:translateY(6px); } }
 .ai-list { height:100%; box-sizing:border-box; overflow:auto; padding:12px; display:flex; flex-direction:column; gap:10px; }
 .ai-jump { position:absolute; right:14px; bottom:14px; z-index:2; width:38px; height:38px; padding:0; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:var(--text); background:var(--panel); border:1px solid var(--border); box-shadow:0 4px 14px rgba(0,0,0,.35); }
 .ai-jump:hover { background:#202833; }
@@ -895,6 +902,20 @@ body.touch.term-active .ai-fab { bottom:104px; }
 .ai-form-in textarea:focus { outline:none; border-color:transparent; }
 .ai-attach { flex:none; width:36px; height:36px; padding:0; display:inline-flex; align-items:center; justify-content:center; color:var(--muted); background:transparent; border:0; border-radius:50%; }
 .ai-attach:hover { color:var(--text); background:#1b222c; }
+/* Send, as in Telegram: no plate, a blue plane that comes in when there is
+   something to send (and stays as "stop" while the answer runs), and goes
+   away when the field is empty. A round shade under the pointer, like the
+   clip's. As far from the right edge as from the top and bottom. */
+.ai-send { flex:none; box-sizing:border-box; width:0; height:36px; min-width:0; padding:0; margin:0 0 0 -5px; overflow:hidden;
+           display:inline-flex; align-items:center; justify-content:center; align-self:center; line-height:1;
+           color:var(--accent); background:transparent; border:0; border-radius:50%;
+           opacity:0; transform:scale(.4); pointer-events:none;
+           transition:width .2s ease, margin .2s ease, opacity .16s ease, transform .24s cubic-bezier(.3,1.45,.55,1), background-color .15s, color .15s; }
+.ai-send.show { width:36px; margin:0 3px 0 0; opacity:1; transform:none; pointer-events:auto; }
+.ai-send:hover { color:#7ab6ff; background:#1b222c; }
+.ai-send:active { transform:scale(.9); }
+.ai-send:focus-visible { outline:none; box-shadow:0 0 0 2px rgba(79,157,255,.45); }
+.ai-send .ai-plane { display:block; flex:none; transform:translateX(1px); }
 .ai-attachments { display:flex; flex-wrap:wrap; gap:5px; padding:2px 3px 6px; }
 .ai-attachments[hidden] { display:none; }
 .ai-file-chip { display:inline-flex; align-items:center; gap:4px; max-width:100%; padding:3px 7px 3px 9px; border:1px solid var(--border); border-radius:999px; background:#151a21; color:var(--muted); font-size:11.5px; }
@@ -910,8 +931,6 @@ body.touch.term-active .ai-fab { bottom:104px; }
   .ai-box { inset:0; width:auto; max-width:none; height:auto; border-radius:0; border:0; z-index:60; transform:translateY(40px); }
   .ai-box.on { transform:none; }
 }
-.ai-send { width:36px; height:36px; padding:0; flex:none; display:inline-flex; align-items:center; justify-content:center; border-radius:9px; }
-.ai-send .ai-plane { display:block; flex:none; transform:translateX(.5px); }
 /* The panel's own confirm and prompt. */
 dialog.uidlg { width:fit-content; min-width:min(300px, 92vw); max-width:min(560px, 92vw); }
 .uidlg form { padding:18px; display:grid; gap:14px; }
@@ -940,9 +959,7 @@ dialog.uidlg { width:fit-content; min-width:min(300px, 92vw); max-width:min(560p
 body:not(.touch) .ai-head { cursor:grab; user-select:none; -webkit-user-select:none; }
 body.ai-dragging, body.ai-dragging * { cursor:grabbing !important; user-select:none; -webkit-user-select:none; }
 body:not(.touch) .ai-fab { cursor:grab; touch-action:none; }
-/* Send: the field's height, square. */
-.ai-form-in textarea, .ai-send, .ai-attach { box-sizing:border-box; }
-.ai-send { width:36px; height:36px; align-self:center; }
+.ai-form-in textarea, .ai-attach { box-sizing:border-box; }
 @media (max-width: 640px) {
   .ai-fab { width:46px; height:46px; right:22px; bottom:24px; }
   body.touch.term-active .ai-fab { bottom:110px; }
@@ -956,7 +973,6 @@ body.ai-dragging .ai-fab, body.ai-dragging .ai-box { transition:none; }
 /* The field and the send button: one height on every phone, the button
    square whatever the text size. */
 .ai-form-in textarea { min-height:40px; }
-.ai-send { min-height:36px; max-height:36px; min-width:36px; max-width:36px; line-height:1; border-radius:9px; }
 .ai-form-in textarea { border-radius:10px; }
 /* Настройки: the key with its eye; PostgreSQL's fields only when chosen. */
 .ai-form .keybox { display:flex; gap:6px; align-items:center; }
@@ -1097,5 +1113,3 @@ body.no-motion *, body.no-motion *::before, body.no-motion *::after, body.no-mot
 /* The + menu's roots (Терминал, Файловый менеджер) a little to the left of
    what they open, so the nesting reads. */
 .addmenu > .item { padding-left:7px; }
-/* The send button as far from the right edge as from the top and bottom. */
-.ai-entry .ai-send { margin-right:2px; }