diff --git a/frontend/trainer.html b/frontend/trainer.html
index 4315c10..971f14b 100644
--- a/frontend/trainer.html
+++ b/frontend/trainer.html
@@ -238,13 +238,21 @@
.tr-fm-btn.on { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--g1), var(--g2)); box-shadow: 0 8px 16px -6px rgba(99,102,241,.5); }
/* ── варианты выбора (kind choice / verify) ── */
- .tr-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; max-width: 460px; margin: 0 auto 4px; }
- .tr-choice-btn { font: inherit; font-size: 1.15rem; font-weight: 700; cursor: pointer; padding: 14px 16px; border-radius: 15px; border: 2px solid rgba(99,102,241,.22); background: #fbfbff; color: var(--ink); transition: .14s var(--ease); }
- .tr-choice-btn:hover:not(:disabled) { border-color: var(--g1); background: #fff; transform: translateY(-1px); }
- .tr-choice-btn:disabled { cursor: default; }
- .tr-choice-btn.right { border-color: transparent; color: #fff; background: linear-gradient(135deg, #059669, #10b981); }
- .tr-choice-btn.wrongpick { border-color: transparent; color: #fff; background: linear-gradient(135deg, #dc2626, #ef4444); }
- #tr-choice-next { display: block; margin: 0 auto 4px; }
+ .tr-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; max-width: 470px; margin: 4px auto 2px; }
+ .tr-choice-btn {
+ font: inherit; font-size: 1.22rem; font-weight: 800; cursor: pointer; min-height: 60px;
+ display: flex; align-items: center; justify-content: center; text-align: center; gap: 6px;
+ padding: 12px 16px; border-radius: 16px; border: 2px solid rgba(99,102,241,.2);
+ background: linear-gradient(180deg, #fff, #f6f7ff); color: var(--ink);
+ box-shadow: var(--sh-1); transition: .15s var(--ease);
+ }
+ .tr-choice-btn:hover:not(:disabled) { border-color: var(--g1); transform: translateY(-2px); box-shadow: var(--sh-2); }
+ .tr-choice-btn:active:not(:disabled) { transform: translateY(0) scale(.98); }
+ .tr-choice-btn:disabled { cursor: default; box-shadow: none; opacity: .96; }
+ .tr-choice-btn.right { border-color: transparent; color: #fff; background: linear-gradient(135deg, #059669, #10b981); box-shadow: 0 14px 28px -10px rgba(16,185,129,.6); animation: trPop .45s var(--ease); }
+ .tr-choice-btn.wrongpick { border-color: transparent; color: #fff; background: linear-gradient(135deg, #dc2626, #ef4444); animation: trShake .4s var(--ease); }
+ .tr-choice-btn .katex { color: inherit; }
+ #tr-choice-next { display: block; margin: 14px auto 2px; min-width: 168px; justify-content: center; }
/* строка ответа */
.tr-inrow { display: flex; gap: 10px; align-items: stretch; max-width: 460px; margin: 0 auto; }
@@ -306,8 +314,11 @@
.tr-solution h4 { margin: 0 0 14px; font-family: 'Manrope', sans-serif; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--accent-ink); font-weight: 800; }
.tr-step { color: #334155; padding: 13px 0; }
.tr-step + .tr-step { border-top: 1px dashed rgba(99,102,241,.2); }
- .tr-step-note { display: block; color: var(--ink-soft); font-family: 'Manrope', sans-serif; font-size: .92rem; line-height: 1.6; margin-bottom: 7px; }
+ .tr-step-note { display: block; color: var(--ink-soft); font-family: 'Manrope', sans-serif; font-size: .92rem; line-height: 1.65; margin-bottom: 7px; }
+ /* инлайн-формулы в пояснении: соразмерны тексту, чуть подсвечены, не «прыгают» по базовой линии */
+ .tr-step-note .katex { font-size: 1.02em; color: var(--accent-ink); }
.tr-step-math { display: block; font-family: 'Cambria Math', serif; font-size: 1.2rem; color: var(--ink); margin-left: 31px; }
+ .tr-step-math .katex { font-size: 1.05em; }
.tr-step-n { display: inline-flex; align-items: center; justify-content: center; width: 23px; height: 23px; border-radius: 50%; background: linear-gradient(135deg, var(--g1), var(--g2)); color: #fff; font-family: 'Manrope', sans-serif; font-size: .72rem; font-weight: 800; margin-right: 9px; vertical-align: 1px; }
/* ── итог сессии ── */
@@ -372,6 +383,11 @@
.tr-progress-card .tr-stat-tiles { grid-template-columns: 1fr 1fr; }
.tr-inrow { flex-wrap: wrap; }
.tr-inrow .tr-btn { width: 100%; justify-content: center; }
+ .tr-choices { grid-template-columns: 1fr; gap: 9px; }
+ .tr-choice-btn { min-height: 52px; font-size: 1.12rem; }
+ #tr-choice-next { width: 100%; }
+ .tr-figure { max-width: 280px; }
+ .tr-step-math { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
* { animation-duration: .001ms !important; transition-duration: .001ms !important; }