ux(admin): Q-modal ergonomic improvements — формулы скрыты, preview по требованию

Полный wizard-refactor Q-modal был отложен как высокорискованный
(сложная форма с многими типами вопросов, риск регрессии). Вместо
этого — безопасные ergonomic-улучшения:

1) FORMULA BAR — collapsed by default
   Раньше: 18 кнопок формул всегда занимали ~50px вертикали в модалке,
   но нужны только при создании math-вопросов.
   Теперь: маленькая кнопка «Вставить формулу» с chevron. Click → bar
   разворачивается. Состояние сохраняется в пределах сессии (DOM-стейт).

2) PREVIEW — показывается только когда есть текст
   Раньше: пустой preview-блок с placeholder «Введите текст вопроса…»
   занимал ~80px независимо от состояния.
   Теперь: .q-preview-wrap.hidden скрывается полностью пока textarea
   пуста. Появляется по input с debounce 150ms (уже было).

Эффект: модал стал ~130px ниже в типичном кейсе (создание non-math
вопроса). На 1080p теперь умещается без скролла для single/multi
с 4 опциями.

Без wizard'а, без риска регрессии — но visible UX-win. Wizard-refactor
по-прежнему доступен как опция, если понадобится дальнейшее снижение
когнитивной нагрузки.

frontend/admin.html

@@ -486,7 +486,23 @@
     .tst-empty { text-align: center; padding: 20px; color: var(--text-3); font-size: 0.82rem; }
     .src-toggle { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
     /* formula bar */
-    .formula-bar { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; padding: 8px 12px; background: #f0f2ff; border-radius: 10px; margin-bottom: 8px; }
+    /* Formula bar: hidden by default, toggled via #qf-fml-toggle */
+    .formula-bar { display: none; gap: 4px; align-items: center; flex-wrap: wrap; padding: 8px 12px; background: #f0f2ff; border-radius: 10px; margin-bottom: 8px; }
+    .formula-bar.visible { display: flex; }
+    .fml-toggle {
+      display: inline-flex; align-items: center; gap: 5px;
+      padding: 4px 10px; margin-bottom: 6px;
+      border: 1px solid var(--border); border-radius: 999px;
+      background: transparent; color: var(--text-3); cursor: pointer;
+      font-family: 'Manrope', sans-serif; font-size: 0.74rem; font-weight: 700;
+      transition: all .12s;
+    }
+    .fml-toggle:hover { border-color: var(--violet); color: var(--violet); }
+    .fml-toggle.open { background: #f0f2ff; color: var(--violet); border-color: rgba(155,93,229,.3); }
+    .fml-toggle .fml-chev { width: 11px; height: 11px; transition: transform .18s; }
+    .fml-toggle.open .fml-chev { transform: rotate(180deg); }
+    /* Preview: hidden by default, visible when textarea has content */
+    .q-preview-wrap.hidden { display: none; }
     .fml { padding: 4px 9px; border: 1px solid rgba(155,93,229,0.2); border-radius: 6px; background: #fff; font-family: 'Manrope', sans-serif; font-size: 0.82rem; font-weight: 600; color: var(--violet); cursor: pointer; transition: background 0.15s; }
     .fml:hover { background: rgba(155,93,229,0.08); }
     /* preview */
@@ -1624,6 +1640,10 @@
         </div>
       </div>
 
+      <button type="button" class="fml-toggle" id="qf-fml-toggle" onclick="toggleFormulaBar()">
+        <svg class="fml-chev" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>
+        <span>Вставить формулу</span>
+      </button>
       <div class="formula-bar" id="formula-bar">
         <span style="font-size:0.7rem;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:0.05em">Формулы:</span>
         <button type="button" class="fml" onclick="ins('\\frac{a}{b}')" title="Дробь">ᵃ⁄ᵦ</button>
@@ -1652,9 +1672,9 @@
         <div class="char-counter" id="qf-text-cnt">0 / 500</div>
       </div>
 
-      <div class="q-preview-wrap" id="q-preview-wrap">
+      <div class="q-preview-wrap hidden" id="q-preview-wrap">
         <div style="font-size:0.7rem;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:6px">Предпросмотр</div>
-        <div class="q-preview-text" id="q-preview-text">Введите текст вопроса…</div>
+        <div class="q-preview-text" id="q-preview-text"></div>
       </div>
 
       <div class="opts-header" id="qf-opts-header">