Simplify rail motion and add routing help toggle

test/web/rule-editor-contract.test.js

@@ -135,11 +135,16 @@ test('ordered rules use one accessible drag handle and a compact icon route cont
   assert.match(styles, /\.client-local-rule \+ \.client-local-rule::before[\s\S]*linear-gradient\(90deg/);
 });
 
-test('rule values normalize on paste and help stays collapsed above the list', () => {
+test('rule values normalize on paste and help animates both directions above the list', () => {
   assert.match(routing, /normalizeRouteRules\(\[\{ \.\.\.rule, value \}\], \{ strict: true \}\)/);
   assert.match(routing, /onPaste=\{\(event\) => \{[\s\S]*event\.preventDefault\(\)[\s\S]*normalizeDraftRuleValue\(rule, event\.clipboardData\.getData\('text'\)\)/);
   assert.match(routing, /onBlur=\{\(\) => feature\.change\(index, 'value', normalizeDraftRuleValue\(rule, rule\.value\)\)\}/);
-  assert.match(routing, /<details className="client-local-rules-help">[\s\S]*<summary>[\s\S]*Как работают правила[\s\S]*<form id="client-local-rules-form"/);
+  assert.equal((routing.match(/Проверяются сверху вниз\. Первое совпадение выбирает маршрут/g) || []).length, 0);
+  assert.equal((routing.match(/Правила проверяются сверху вниз\. Первое совпадение выбирает маршрут/g) || []).length, 1);
+  assert.match(routing, /const \[helpOpen, setHelpOpen\] = useState\(false\)[\s\S]*aria-expanded=\{helpOpen\}[\s\S]*aria-controls="client-local-rules-help-content"[\s\S]*setHelpOpen\(\(current\) => !current\)[\s\S]*Как работают правила[\s\S]*aria-hidden=\{!helpOpen\}[\s\S]*<form id="client-local-rules-form"/);
   assert.doesNotMatch(routing, /client-local-rules-note/);
-  assert.match(styles, /\.client-local-rules-help > div \{[\s\S]*background: color-mix/);
+  assert.match(styles, /\.client-local-rules-help-reveal \{[\s\S]*grid-template-rows:\s*0fr[\s\S]*opacity:\s*0[\s\S]*420ms cubic-bezier\(0\.16, 1, 0\.3, 1\)/);
+  assert.match(styles, /\.client-local-rules-help\.is-open \.client-local-rules-help-reveal \{[\s\S]*grid-template-rows:\s*1fr[\s\S]*opacity:\s*1/);
+  assert.match(styles, /\.client-local-rules-help-content \{[\s\S]*overflow:\s*hidden/);
+  assert.match(styles, /\.client-local-rules-help-copy \{[\s\S]*background: color-mix[\s\S]*translateY\(-6px\)[\s\S]*transition:\s*transform 420ms/);
 });