--- 

+++ 

@@ -5,3 +5,3 @@

 import {
-    el, mount, card, button, toggleSwitch, field, fieldValue, modal,
+    sectionTabs, el, mount, card, button, toggleSwitch, field, fieldValue, modal,
     toast, confirmDialog, copyText, busy, loadingBlock, errorBlock, emptyBlock,
@@ -122,10 +122,3 @@

     const host = el('div', { class: 'page' });
-    const tabbar = el('div', { class: 'subtabs' });
-    TABS.forEach(function (tb) {
-        tabbar.appendChild(el('button', {
-            class: 'subtab' + (tb.key === active ? ' active' : ''),
-            onClick: function () { drawShell(view, tb.key); },
-        }, [el('span', { text: tb.icon }), ' ', t(tb.label)]));
-    });
-    const content = el('div', { class: 'subcontent' }, [loadingBlock()]);
+    const { tabbar, content } = sectionTabs(TABS, active, key => drawShell(view, key));
     mount(host, [tabbar, content]);
@@ -243,5 +236,8 @@

                 kvp(t('mk_rule_trigger'), ruleTriggerText(r)),
-                kvp(t('mk_rule_msgkey'), r.messages_text_key || '—'),
                 kvp(t('mk_rule_max'), fmtNum(r.max_sends_per_period)),
                 kvp(t('mk_rule_cta'), ruleCtaText(r)),
+            ]),
+            el('div',{class:'technical-reference'},[
+                el('span',{text:t('mk_rule_msgkey')}),
+                el('code',{dir:'ltr',text:r.messages_text_key || '—'}),
             ]),