@charset "utf-8";
  :root{
    --paper:#ffffff; --ink:#12151c; --ink-2:#5a6170; --ink-3:#9aa1ad; --line:#e8eaf0; --wash:#f5f6fa;
    --blue:#1f3fe0; --blue-bg:#eaf0ff; --blue-line:#b9c8ff;
    --lime:#dcff45; --lime-deep:#b8e600;
    --coral:#ff5a2e; --coral-bg:#ffefe9;
    --good:#12a150; --good-bg:#e4f8ec; --warn:#e69500; --warn-bg:#fff5d6;
    --stress:#e0173a; --weak:#7c3aed;
    --ru:"IBM Plex Sans","Segoe UI",Arial,sans-serif; --enf:"Source Serif 4",Georgia,"Times New Roman",serif; --mono:"IBM Plex Mono",Menlo,Consolas,monospace;
    --w:640px; --pad:22px; --s2:12px; --s3:20px; --s4:32px; --s5:48px;
    --av-rover:url(data:image/webp;base64,UklGRhIHAABXRUJQVlA4IAYHAADQIACdASpgAGAAPl0kjkUjoiEbii4AOAXEsgBgiwsub0C/EciV0b8fzHzkvK96AHmA8sX9OfezvRnoI/qr6cXtAft9goHWT5cSWtcT9Vv2XEjtgf4bMAvZ77B/wOO3S0fNPUn/vvoVaJ3zH/Jf+T3Df5b/c1bT/RPZFWm4csV98TANTDCOex8JnSa1+jcU5pPzCOmbA1w8cKs01k7QN6ETwZAOBRaPAihfy5lZDVTcGg5PZ/pUkWGXzv5rlAFxC8Zh34ekQ2qcUn1YbOcqcyWXPiiBlt+2StaZkrNKnoFX31rh5eP3OzDyypnoWZ0uLeTa3BCy6ORaxeRdD7rs3JaizFBs307WZlJjqjn4vJzAAP79YMwxe4S5xcNQSnALB/8PXPzf8Dj5MarqY1RofsAX6q/lkIrxVj5qgsEl9ycwcYD5XdCmeVY1TtlQRZV3GxGFva2MlJwikx/zdLW6neT8iFq2j+4/ds31Fl9xc6IZJ5o3UfNKGx7XHqnvz6QNHmP3Cb0AkCoOdU3Rll2uNQ+Od4t9idM9wIP85Bd6Wzt1ttRjpnR0SoYpgL3+sxnrF+lbZ9MPj4aGfwnXYDw08uEB3Llm0uV0grd+vFfsqODmoNVAs9tQXFAjDJtvkVKCPJBSiQxLRtGdDdtWNRsmbVigGfGXgtZF6NAGz0O0X3BDL+8YtT5uLPXPeFebMH5pw6W32f7TEWiQgnNS8cU0H+LLq5AlhxPSCwQgfuOqnPOGl5AV54LC828IcTLg+vz4JXWTIbHbvPNkm9SlKLf1NkDsSGyiyHEZLfpH0Z43c/6ejiwwxXyyYyE3239Cb+wpqRbODrfuhWNmVpziq8BCc2yQX6LfPYXB0xqQcXui4h/4O/UTLFujDJTbzEz/VVm4AzpIf1Bj0+IBHXTZGZ3CQYswKm4MXrSj74srALwRzVIrtzuII/HdMM1mFPfZOGZNfHBDekZC0mcHL5xIdE0SOpTxcWdKhbaDXxzaI65FF5LZI972AXmz98Q+4rBn/gal9yQebyDCWJdgmR9/662LOlrm5h5D7tHjFT6uVulbeQnftjdqPHiugj+birwFLFtWkQwXyURd7SYCIAzzDlQiqQOqPNCZTwr86j5DIP+irs7O0+/FyEiq+rq+zl3Rl5ZYsau3ONa9R8wOJYT7iuFg1LmPqLzga2Xpg9HSuLn+SIaotHiGMFgkUjl1KLHMsrjLMaK99zWy/W1AB8E/4O9P050dbkl9NttRsxwekuh+SFqfofuxjSWERZn3th8IR6uD68HcR43YwNCjiGjHAAfl5b9K3R9F5fMFU1dxPW0T7S0WxvxhcNLXxtX9jiu1Z/0/5b+CRf2iWrQaxv2eH7e6sjw95cOSOf5LBmYyPEg4HrHJqA4+e3RChc0TirI+DZyWrRx53Kzj2pL2iaH1W+7glYh87A9o70l+OCo0HU8sZD8DcDTUUu0/SH/ZukfgaJHfYCoucgZq4s/gBVRYjJUefk9I8suTZJf+krRjiZoeI0tmzghHe5n2XI3Mx37E9SVBYyxL3BEIY6dzEwmX4YVNhji3/0UDt1rLbLs8UXKtP61b06kGs8PfD9i1G/JBqYcpOobwg+ODEgy0CZdqbGCwE6WgbglsmNpuJ+hFDXb/5V9fGUd2I31QXo7geiyG8yJ1K6WRvA2pSksIeMnGJV10YHVwr3Zdr4xllxR+Qvx4c3pc5I6G1YIfBjir/W0bYONfNjVyzLP9JFHg3qi5nWlJYB95EXhoqU/aN4juYv54R+D2sgiGnvbCUvhzF6VZsheRLYqb+LCvLc46mGX/E6YhMB2Ucg19moB07AvIBr5q3PtFDVxMxtlReEQXZnjpK6rcrNI6wSP/bxEbGq+1sixaXfaD8efba0iht+NKwlgAjnkgyF4S/use3MrA/iCqWgLcNepIqmULmJvA9wwimGJKZxdk+m4sVNS0JUlLkIG7Y0bIseZ4rI/zl6LDihF54ZOOFFDVWLA/DBBf02yMeJhXBADa39xeII2k+u4Jso3IQy06KqHrCiibFKIMjLty9xEz0FPsZvd4Wm4HzRyqI9PV14VkUUhFNlWMRHPdXxO/6qyUnc7QnCXsV3skTXxIJlvfdD/djfr/fe6sIOSytXq0xekWb3NA8XnvZrFZ6ve+J9C22YlOn2pcFVfejObp74AheSzxO5Z5/Jdw/Xitq44UZRj9E8nb7VoNgS+jLgznghxaW4Hyr8fZafisel9ApH/fwM8dNl6/lM/kYtVIU8773dKdF+wk1+P3SfQombZ3IEPRx+RYv00tKb79nL6darQHErx0eNz1AUpvVWIFfc3p0Ch8kVby0J0ZBlpXxulR0iXYXROgqABG/rGnYB8uIrKdtTcdaC5Y7OPWK9AXMlMcPt6PP31sAAAA); --av-bermet:url(data:image/webp;base64,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); --av-mia:url(data:image/webp;base64,UklGRuwKAABXRUJQVlA4IOAKAADwLQCdASpgAGAAPl0gjUUjoaEZzXbYOAXEtgBcFwms3xv/beapWP71+NuYEPx2UTvvMF/UnpceYX9wPV29IHoAf1vqL/QA8ub2O/3N/bf2oM1A8nng5+Q8M/LB7W9veVb0l5kfyb8RfpfzD9m/A/gEfkH86/0W/vgD+t3Fb8yXuAfzD+tcZn4T7AH5q/7HqT/9X+h9EP01/5vcG/mf9m/5Prne0P9wPZx/aJ26qHTN76F6NuIzS82HqE7fN870BBLsuMMMRWlNftUUj21jzJ8sJhbICeCA7Vd1+FJIl99AFAT54+BELziPtl7uc1Vs8vFPQgnhzUz+XUUMZepoRIPWHxN8z7PNoH/DO/762YEDdARsUoHOYbGLJ7XKx/Ux94bvUZTQqX1c8LIAaD5xzLjaumVWiZpNNnPEWztHNwqtF0CpK0rleXO+P7KaRg0w3OSw3/V8hUf6Cj6OdvYUUJb4tvdd07SENcBILRE4FCMXo+WhyXFVFbAAAP7+fmOmIL2uEGTtXCU+/g6j8f9YwsLXEOoK8PuSxsqhO4CNDVeWeLB3vm6+xtPhDqgOIh4jOv51r0ZARuDuJT88enzt6TxX9Bfnghq3t59zAbBkcSw8WV/EWeeusRJgQehl705gZyeXlPV2jN1CZocCOuVPnyeInW7NRl0Ae1VNZwQQ59n2kl++aGzj79QdO1rPZVk4800u2fZKVoQ9dH9IzqaIlIzyiuatha4wdsfIINe27AdZXt3zX9eXea/pJCl7xkLonG8KBGAwpkTwIPa4n7y538Cob3bev4iZpRDo3Rgin+U+e6dV8xkGNCcIIDCPWxubCZwk3ylz5QOhwngNMfA4LebYoQRIqQreNMhhj1dt97tKETYeAkHUglVo0aCA9tenWvYgAtJoBfTyL/MQn/6nwzauSUj6q4O2nQf64rkehCde3BWXwXJXYJyxRn7UxRjHD/wVV/JhAwZVpY+NfKAEReoSsF2UGCrX+oA+BBMdDXnAXLzjam7/MOfdFQV+ouQGJGDlMaY8HJZQAXTz0A95H8aOzLKeTc/YUmK7x9vw0MDWttDMkzmANioj4hA8DmJGmCICj2aJxBvkbcUib/gUKINgk/rtbMk6Q9I7N5BPEUqlrEAgBPpGQY+mqx7AWdeaxC+7gHc/d13cA94/8XMgizon0slyA028LTsoa0UIGH6ZnjMe4Hn5LHaqCKn1LlH+E9zgLHldDwqLG9SOgaO1RQ/m1t39hJlzFEIPtWTTwz9+vbIT8RfbD37XM47vdrVePfINSvuEV9H0tfoXYu2eSVZjRwid85G17967r7XpdZP675FzxpryJW4HkoOGL3mXq/WI80kjLkqo+YWOMG9TxiNU+a7EYfQCeCOY9c4+TcsYE9TBpUEzjIalZ9mlVKDT2vtDlvp/Lg/XTxUTUW76TfFLFwWua+oWPXc4aOhYGg4EbAeiMoZ22DWuq4AxIP9lNfsSNKTs0VXfOCyskYL2VY194RrhotFN0V9rl6/fGBg/XhCcDzuQ0ymL+r/wkC7ldhCcBLQqyvilG7ukPQPG28foBtZcOao3aM7QE3JQSqbfraRCNYmVsHbfgrNMPOVOoo8FZmo8F/hkYQoTXGvYVnSNaugqmmX9E1dcyO/6yQ8bgk9z+vYPd2Aj94YXAPten6vd6qUe2floj8bNOeCvxa7j4qhrbOfalVq08uljfjqvUYPdshbuvaNx8JltTzu6Kkxfd2WCrnBuWCwyt/Qnn14bjD9FLY3IuqQgFONTjL0QKjsd6rrZX41La8MVlVI/i6sxPsudIFOL0Er7M+fy16vkUQtrppjKolt4l6yx0ekLP2HlcB4medDRUdklvn1KUVideqCOwqnvtHFlxoXmHm/C6cA7ISxWPyYsc80A3r955C7BCFGUbzvYFvOpd9ce7B/0jpXM0Q61eTlLV0aBB34Ko9+JpmAaka7jA5jMhLl/Oim/eEXk4MI8KMenJxK3NbPNYs5XZkYl8l3Jol80V/xwnGM7EomIQt2PuH5/eh17TEZoGLpvCBQn3W5q7rUSPO8H9F+FSQXYwrjWbPUJacEsaDLFL46ylAMIllcPs9tfN6YRuBhMl5n6owkJiL8LAH2m/vIc6OETFZ4Cgs7EFKE8odhIVDMPDvj/G40N8L/DLEq2SjiL1I0jz2QKPzOhUIBcpRW5f5YGPEJbcvo6Kw6U7N8h4HwOOH2XYURL4E3u04zraQ2f1UXw0UW3Bw2IhzDTktpCq/pUhVrJLGACqOkOOu0W3Hxz0rHgcjPOigNiObrOIo/oxwqth8ebmydIl8aPyYHGXmaXZHmB4ejOqxYfVbbAFf7kfP9btNTgamE3oOwWxKSdpQF+UTKRGkX9RIb5qu+hKQ26bBdv3wC5OX+RjdSoE88nL0Zdp6C7zn2t0UMPn3dWhWqBHb8pG21IPfAuaoIIkvDj5PDn3jqIvDepFV9u6CkThE+a3CEZK145GrQyPKentC1ZJzNr8VY6AxVFxNlYb/LQZJN9Dgz3BT8ff10dZwCrrcmDIjFT3lOsKWBnesMPwYi9w/BDwI+Gn5kuDa676tGB0kTC0moYnNlgemeJae/5d8vqTzOwsXbZgGS1/2HtDBndJvb0FuHngJIqo2zAS0Rzs4s2NYd899PojgMKp2qJsfl6k4DlKaiViwjQB4/u7aDeHDsf3T/I07sL2fv/kkfzyVIuI56iHz/aA4Eyv2WLtgF37zrTcmLZaVYRvCVtMWhaN7RLdw67jGLwtbkPIQfoznGnH5LJAOLC5RCZwmJO7bc1ONlFh9v//4hFS2gDwirT5PVH99kl7tmToTeQ3mZa8VEn+Dq0Q0kIwgvemek/eJzegk3+PxVy08pAnU4bisSaA3hf/EgL2xqPLbgFfFYfG/L5L9EWPbgDL8/i0WJB/k+ZwmjxgtkDUXUlkloNoVwxZSCWugQB9RSnV21W8me+UH8E9+ibrMQbIxrelB5JqGkeqWx1BPkXbThP1opm6XJVIrX295Os/EY5830eYoQGlrjrDeevhtaONTrQJoJWbe/jzAxCiEcGwRnTUOI5LPqPuyjhIbFzJUa6DdauzpNGKDe6PFZMimNrAXtz72vrapuGJFH7BzET7pyqIKeHvIbnbP58FYqMJc/Y4NN3o9HpiGUacDpHHruJPJCmKKM1Xm+U8WyQN7zUYq/UAxIc9Kn/zmPu/6QlX38OzQUvoBsx2+cI7Q8jcZJyIyRVckFnTzs++l8CNs6iEihvuNgB70MgCfsOch/+GbjrSBYBuNzBwW76IEunInEM0DtbU9CCsZquuG34zkEPfgXQ+7pnN8VX2quYCaMo5gJU/dPrvNbSmXeS/U7WODu4waggzTNNrhWflEqsUB9sGw5iKFPXrnNAMi7lxagvzIg4ScB936AbNhSVEDEXk9mPO7JMeCES5HyBpSATCaLGIDB8eKXeOIDZRqRuQdA2/BwHlkfRpEMxMONB9gRDw+julzWh0ZvS+sz7PX7kYXAPKhQ4me7W+nWFHHkQ11Oqwxqc4iqYNUxEPhe9ijvmGnSp0cnQVifcERQL32GSNxWycVTaASvz8aq83g9fHZV1bOZdJTNBe7YccrLqhiKMqR41v5/tlYCX3BvzsTmyGskmNMdEZLpWnHWpZwATGmUgi6No/TZac33CRFxZbdhotZygcLu4ZMtLKf+JWPjll+uhC9ObGw3el6QSeqTLanBAAAA=); --av-bakai:url(data:image/webp;base64,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);
    color-scheme:light;
  }
  html,body{background:var(--paper);color:var(--ink);margin:0}
  body{font-family:var(--ru);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;padding-bottom:104px}
  *{box-sizing:border-box}
  button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
  button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
  @media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

  .top{position:sticky;top:0;background:var(--paper);z-index:5;border-bottom:1px solid var(--line)}
  .top-in{max-width:var(--w);margin:0 auto;padding:12px var(--pad) 10px;display:flex;flex-direction:column;gap:8px}
  .kicker{display:flex;justify-content:space-between;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
  .kicker b{font-weight:700;color:var(--ink)}
  .bar{height:5px;border-radius:3px;background:var(--line);overflow:hidden}
  .bar i{display:block;height:100%;background:var(--lime-deep);transition:width .3s}

  main{max-width:var(--w);margin:0 auto;padding:var(--s4) var(--pad) var(--s5)}
  .screen{display:flex;flex-direction:column;gap:var(--s3)}
  .eyebrow{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);font-weight:600;margin:0}
  h1{font-size:clamp(23px,5.8vw,29px);line-height:1.22;margin:0;font-weight:700;text-wrap:balance}
  p{margin:0;max-width:min(34em,100%)}
  ul{margin:0;padding-left:1.15em;display:flex;flex-direction:column;gap:var(--s2);max-width:min(34em,100%)}
  li::marker{color:var(--blue)}
  ol.steps{margin:0;padding-left:1.5em;display:flex;flex-direction:column;gap:var(--s3,12px);max-width:min(34em,100%)}
  ol.steps li{padding-left:.25em}
  ol.steps li::marker{color:var(--blue);font-weight:700}
  .term{text-decoration:underline dotted var(--blue);text-decoration-thickness:1.5px;text-underline-offset:3px;text-decoration-skip-ink:none;cursor:pointer}      /* грамматический термин: нажми — имя по-английски, определение, пример */
  /* Подсветка английского (en, mark) не выше строки — в любом контейнере. Самат, 18 сентября 2026, с телефона: подсветки соседних строк
     и две половины перенесённого предложения наезжали друг на друга (фишка 1.41em + отступ в строке 1.4–1.5em). Теперь фишка — 1em без
     вертикального отступа (закрашено около 1.35em); предложение на карточке и в клетке слов — одна плашка. Проверка: node renderer/overlap.js <html>. */
  #main en,#main mark,.fb en,.fb mark{font-size:1em;padding-block:0}
  #main .fb en,body .fb en{font-size:.94em}   /* предложение в отклике переносится чаще всего: плашка чуть ниже, строка отклика остаётся 1.5em */
  #main :is(p,li):has(en,mark),#main .what:has(en),#main td:has(en),#main div:not([class]):has(> en.sent){line-height:1.64}   /* объяснение, реплика, ячейка таблицы с подсветками: между подсветками соседних строк зазор не меньше 3px (было 0–1px — с телефона читалось как наезд) */
  #main .t:has(en){line-height:1.64}   /* подпись в клетке слов */
  body .fb:has(en),body .fb :is(div,p,span):has(> en){line-height:1.5}   /* отклик и текст задания: строка 1.5em вместо 1.4em */
  .card .ct>en,.w>en,#main .t en.sent{margin-block:1.5px;display:inline-block;max-width:100%;white-space:normal;line-height:inherit}   /* предложение на карточке и в клетке слов: одна закрашенная плашка на все строки, а не две половины внахлёст */
  #main h1 en,#main h1 mark{background:none;color:var(--en-fg);padding:0}   /* в заголовке строка 1.22em: английское слово — цветом и шрифтом, без плашки, иначе плашки двух строк заголовка сходятся */
  .term:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:3px}
  .ipop .ip-ex{margin-top:10px;padding-top:8px;border-top:1px solid var(--line);font-size:14px;line-height:1.4;display:flex;flex-direction:column;gap:2px}
  .ipop .ip-ex en{font-family:var(--enf);font-weight:600;font-size:1.08em;cursor:pointer}
  .gloss{font-weight:400;font-style:italic;font-size:.9em;opacity:.62;white-space:nowrap}      /* английское имя термина: «подлежащее (subject)» — не пример языка, а подпись */
  .note{color:var(--ink-2)}
  h3{margin:0;font-size:1em;font-weight:700}

  /* English: two levels */
  en{font-family:var(--enf);color:var(--blue);font-size:1.07em;font-weight:500;cursor:pointer;border-radius:4px;padding:0 .1em;margin:0 -.1em;transition:background .15s}
  en:hover,en.play{background:var(--blue-bg)}
  mark{background:var(--lime);color:var(--ink);padding:.02em .28em;border-radius:5px;font-family:var(--enf);font-weight:700;font-size:1.05em;box-decoration-break:clone;-webkit-box-decoration-break:clone;cursor:pointer}
  mark en{color:var(--ink);font-size:1em;padding:0;margin:0}

  .ex{display:flex;flex-direction:column;gap:6px;padding:14px 16px;background:var(--blue-bg);border-radius:12px;max-width:min(34em,100%)}
  .ex .l1{font-family:var(--enf);color:var(--blue);font-size:1.22em;font-weight:600;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .ex .l1 en{font-size:1em;padding:0;margin:0}
  .ex .l2{color:var(--ink-2)}
  .ex .ipa{font-family:var(--mono);font-size:.82em;color:var(--blue);display:none}
  .ex.open .ipa{display:block}
  .spk{width:36px;height:36px;border-radius:50%;background:var(--paper);border:1.5px solid var(--blue-line);display:inline-flex;align-items:center;justify-content:center;flex:none}
  .spk svg{width:16px;height:16px;fill:var(--blue)}
  details.rule{margin:0 0 10px;border:1px solid var(--line);border-radius:12px;background:var(--wash);padding:8px 12px;font-size:14px}
  details.rule summary{cursor:pointer;font-weight:700;color:var(--muted);list-style:none}
  details.rule summary::before{content:'▸ '} details.rule[open] summary::before{content:'▾ '}
  details.rule ul{margin:6px 0 0;padding-left:18px} details.rule li{margin:3px 0} details.rule p{margin:6px 0 0}
  .exs{display:flex;flex-direction:column;gap:var(--s2)}
  /* «Ровер сказал → как ждала Бермет»: строка Ровера над исправленным примером (16 сентября 2026, правка Самата) */
  .cmp{display:flex;flex-direction:column;gap:var(--s2);max-width:min(34em,100%)}
  .cmp .was{display:flex;align-items:center;gap:8px;padding:2px 16px 6px;font-family:var(--enf);font-size:1.05em;color:var(--ink-2);cursor:pointer}
  .cmp .was en{text-decoration:underline wavy var(--coral);text-underline-offset:3px}
  .cmp .was .tag{margin-left:auto;font-family:var(--ru);font-size:.75em;font-weight:700;color:var(--coral);white-space:nowrap}
  .cmp .ex mark{background:var(--mark-bg);color:var(--mark-fg);padding:.03em .36em;border-radius:.28em;font-size:1em}   /* введённое слово в исправленном примере (Самат, 16 сентября 2026) */
  /* порядок слов: артикль · прилагательное · существительное — три ячейки в ряд */
  .pos{display:flex;align-items:flex-start;gap:4px;max-width:min(34em,100%);margin:6px 0}
  .pos .c{flex:1;text-align:center;min-width:0}
  .pos .c en{display:block;font-family:var(--enf);font-size:1.25em;font-weight:700;color:var(--blue);padding-bottom:4px}
  .pos .c .br{height:9px;margin:0 6px;border:2px solid var(--blue);border-top:0;border-radius:0 0 3px 3px}
  .pos .c small{display:block;margin-top:10px;font-size:.78em;color:var(--ink-2);line-height:1.2}
  .pos .c.mv > en{background:var(--blue);color:#fff}
  .pos .plus{width:1.2em;flex:none;text-align:center;font-size:1.35em;font-weight:800;line-height:1;color:var(--blue);padding-top:.3em}
  /* «::: формула» (gen_lesson.py, 19 сентября 2026): ячейка .c — английская часть, скобка, роль; «+» стоит в начале своей ячейки (.pc),
     поэтому при переносе вторая строка начинается с плюса. Ячейки делят ширину поровну, но не уже самого длинного слова роли:
     4–5 ячеек на 360 px переходят на вторую строку, а не вылезают за экран. Без образца в ячейке — сама роль (.rl). */
  .pos.fml{flex-wrap:wrap;justify-content:center;gap:10px 0;margin:0;width:100%}
  .pos.fml .pc{display:flex;align-items:flex-start;flex:1 1 0;min-width:min-content;max-width:50%}
  .pos.fml .c{display:flex;flex-direction:column;align-items:center;flex:1 1 auto;min-width:0}
  #main .pos.fml .c>en{display:inline-block;max-width:100%;margin:0;padding:.04em .45em;font-size:1.12em;font-weight:700;line-height:1.35;overflow-wrap:break-word;color:var(--en-fg)}
  .pos.fml .c .br{display:block;width:calc(100% - 10px);max-width:8em;height:8px;margin:4px 0 0}
  .pos.fml .c small{display:block;margin-top:5px;padding:0 1px;font-size:12.5px;line-height:1.3;color:var(--ink-2);text-align:center;overflow-wrap:break-word}
  #main .pos.fml small en{background:none;color:var(--en-fg);padding:0;margin:0;border-radius:0;font-size:1.06em;font-weight:600;line-height:inherit}
  .pos.fml .plus{width:auto;padding:.14em 3px 0;font-size:1.2em}
  .pos.fml .rl{display:block;align-self:stretch;padding:7px 5px;border:1.5px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font-size:13px;line-height:1.3;text-align:center;overflow-wrap:break-word}
  #main .pos.fml .rl en{background:none;color:var(--en-fg);padding:0;margin:0;border-radius:0;font-size:1.06em;font-weight:600;line-height:inherit}
  #main .pos.fml:is(.n4,.n5) .c>en{font-size:1.02em;padding:.04em .35em}
  .pos.fml:is(.n4,.n5) :is(small,.rl){font-size:12px}
  /* «::: шкала» (gen_lesson.py, 19 сентября 2026): предложение над линией времени; середина линии — момент речи, подпись «сейчас»
     одна на весь блок. Точки: сейчас — одна в середине, регулярно — ряд по всей линии, в прошлом — левее, в будущем — правее. */
  .tl{display:flex;flex-direction:column;gap:12px;max-width:min(34em,100%);padding:12px 14px 8px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
  .tl-r{display:flex;flex-direction:column;gap:8px}
  #main .tl-r>en{align-self:flex-start;display:inline-block;max-width:100%;margin-block:1.5px;line-height:1.4}
  .tl-ax{position:relative;display:block;height:12px;margin-right:8px}
  .tl-ax::before{content:"";position:absolute;left:0;right:0;top:5px;height:2px;border-radius:1px;background:var(--ink-3)}
  .tl-ax::after{content:"";position:absolute;left:50%;top:-6px;width:2px;height:24px;margin-left:-1px;border-radius:1px;background:var(--ink-2)}
  .tl-ax i{position:absolute;z-index:1;top:1px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 2px var(--card)}
  .tl-ax .ar{position:absolute;right:-8px;top:1px;width:0;height:0;border-left:9px solid var(--ink-3);border-top:5px solid transparent;border-bottom:5px solid transparent}
  .tl-now{width:calc(100% - 8px);margin-top:-7px;text-align:center;font-size:12.5px;font-weight:700;line-height:1.2;color:var(--ink-2)}

  /* dialogue with avatars */
  .say{display:flex;flex-direction:column;gap:12px;max-width:min(34em,100%)}
  .ln{display:grid;grid-template-columns:36px 1fr;gap:4px 12px;align-items:start}
  .ln .av{width:36px;height:36px;border-radius:50%;background:var(--wash) center/cover no-repeat;grid-row:span 2}
  .ln .who{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);font-weight:600;line-height:1}
  .ln .what{font-family:var(--enf);color:var(--blue);font-size:1.15em;font-weight:500}
  .ln .what.ru{font-family:var(--ru);color:var(--ink);font-size:1em}
  .av.rover{background-image:var(--av-rover)} .av.bermet{background-image:var(--av-bermet)} .av.mia{background-image:var(--av-mia)} .av.bakai{background-image:var(--av-bakai)}

  .art{border-radius:14px;overflow:hidden;background:var(--wash)}
  .art img{display:block;width:100%;height:auto}

  .rows{display:flex;flex-direction:column;border-top:1px solid var(--line);max-width:min(34em,100%)}
  .row{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:12px 0;border-bottom:1px solid var(--line);align-items:baseline}
  .row .k{color:var(--ink-2)}
  .row .v{font-family:var(--enf);color:var(--blue);font-size:1.15em;font-weight:700}
  .row .e{grid-column:1/-1;color:var(--ink-2)}

  /* feedback from Bermet */
  .fb{display:none;grid-template-columns:36px 1fr;gap:12px;align-items:start;background:var(--good-bg);padding:14px 16px;border-radius:12px;max-width:min(34em,100%)}
  .fb.warn{background:var(--warn-bg)}
  .fb.show{display:grid;animation:in .25s ease}
  .fb .av{width:36px;height:36px;border-radius:50%;background:var(--av-bermet) center/cover no-repeat}
  @keyframes in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

  .opts{display:flex;flex-direction:column;gap:10px;max-width:min(34em,100%)}
  .opt{text-align:left;border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;min-height:52px;font-family:var(--enf);color:var(--blue);font-size:1.15em;font-weight:500;transition:.15s;background:var(--paper)}
  .opt.ru{font-family:var(--ru);color:var(--ink);font-size:1em}
  .opt:hover{border-color:var(--blue-line)}
  .opt.good{border-color:var(--good);background:var(--good-bg);color:var(--good)}
  .opt.warn{border-color:var(--warn);background:var(--warn-bg);color:var(--warn)}
  .opt:disabled{cursor:default}

  .lines{display:flex;flex-direction:column;gap:14px;max-width:min(34em,100%)}
  .line{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-family:var(--enf);color:var(--blue);font-size:1.2em;font-weight:500}
  .line.ru{font-family:var(--ru);color:var(--ink);font-size:1em}
  .line .tr{font-family:var(--ru);color:var(--ink-2);font-size:.8em;font-weight:400;width:100%}
  .slot{display:inline-flex;align-items:center;justify-content:center;min-width:3em;height:2em;border-bottom:2px solid var(--blue);color:var(--blue);padding:0 .3em;cursor:pointer;font-family:inherit}
  .slot.hot{background:var(--blue-bg);border-radius:6px 6px 0 0}
  .slot.good{border-color:var(--good);color:var(--good)} .slot.warn{border-color:var(--warn);color:var(--warn)}
  .bank{display:flex;flex-wrap:wrap;gap:10px}
  .chip{border:1.5px solid var(--blue-line);border-radius:999px;padding:8px 18px;min-height:44px;font-family:var(--enf);color:var(--blue);font-size:1.1em;font-weight:500;background:var(--paper)}
  .chip.ru{font-family:var(--ru);font-size:1em}
  .chip.used{opacity:.3} .chip.hot{background:var(--blue-bg);border-color:var(--blue)}

  /* segmented rows */
  .segs{display:flex;flex-direction:column;gap:10px;max-width:min(34em,100%)}
  .seg{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
  .seg .w{font-family:var(--enf);color:var(--blue);font-size:1.15em;font-weight:500}
  .seg .w small{font-family:var(--ru);color:var(--ink-2);font-size:.75em;margin-left:8px;font-weight:400}
  .seg .g{display:flex;gap:6px}
  .seg .g button{min-width:52px;height:40px;border:1.5px solid var(--line);border-radius:10px;font-family:var(--enf);color:var(--blue);font-weight:600;font-size:1.05em}
  .seg .g button.pick{background:var(--blue);color:#fff;border-color:var(--blue)}
  .seg .g button.good{background:var(--good);border-color:var(--good);color:#fff}
  .seg .g button.warn{background:var(--warn);border-color:var(--warn);color:#fff}

  .typed{display:flex;flex-direction:column;gap:12px;max-width:min(34em,100%)}
  .trow{display:flex;align-items:center;gap:12px;font-family:var(--enf);color:var(--blue);font-size:1.15em;font-weight:500}
  .trow input{width:4.4em;height:46px;border:1.5px solid var(--line);border-radius:10px;padding:0 12px;font-family:var(--enf);font-size:1em;color:var(--blue);text-align:center}
  .trow input.good{border-color:var(--good);background:var(--good-bg)} .trow input.warn{border-color:var(--warn);background:var(--warn-bg)}

  /* card sort */
  .card{border:1.5px solid var(--line);border-radius:16px;padding:22px 20px;font-family:var(--enf);color:var(--blue);font-size:1.35em;font-weight:600;text-align:center;max-width:min(34em,100%);min-height:96px;display:flex;align-items:center;justify-content:center}
  .card.ru{font-family:var(--ru);color:var(--ink);font-size:1.1em;font-weight:500;text-align:left}
  .cardn{font-size:13px;color:var(--ink-2);text-align:right;max-width:min(34em,100%)}
  .twin{display:flex;gap:10px;max-width:min(34em,100%)}
  .twin button{flex:1;min-height:52px;border-radius:12px;font-weight:700;font-size:16px}
  .twin .yes{background:var(--good);color:#fff} .twin .no{background:var(--coral);color:#fff}
  .twin button:disabled{opacity:.35}

  .console{font-family:var(--mono);font-size:15px;background:var(--ink);color:#e9ecf5;border-radius:12px;padding:16px 18px;line-height:1.8;max-width:min(34em,100%)}
  .console .w{padding:2px 4px;border-radius:4px;cursor:pointer}
  .console .w.hot:hover{background:rgba(255,255,255,.14)}
  .console .w.hit{background:var(--coral);color:#fff;text-decoration:line-through}
  .console .w.fixed{background:var(--lime);color:var(--ink);text-decoration:none}
  .step{display:flex;flex-direction:column;gap:12px;max-width:min(34em,100%)}
  .step.dim{opacity:.4;pointer-events:none}

  /* pron module */
  .sp{display:flex;flex-direction:column;gap:12px;padding:18px;border:1.5px solid var(--line);border-radius:16px;max-width:min(34em,100%)}
  .sp .l1{font-family:var(--enf);color:var(--blue);font-size:1.35em;font-weight:600;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
  .sp .l1 en{font-size:1em}
  .sp .ann{font-family:var(--mono);font-size:1em;color:var(--ink-2);letter-spacing:.02em}
  .sp .ann b{color:var(--stress);font-weight:700} .sp .ann u{color:var(--weak);text-decoration:none;font-weight:600} .sp .ann i{color:var(--coral);font-style:normal;font-weight:700}
  .sp .ru{color:var(--ink-2)}
  .mic{display:flex;align-items:center;gap:14px}
  .micb{width:60px;height:60px;border-radius:50%;background:var(--coral);display:inline-flex;align-items:center;justify-content:center;flex:none;box-shadow:0 6px 18px rgba(255,90,46,.35)}
  .micb.rec{animation:pulse .9s infinite}
  .micb svg{width:24px;height:24px;fill:#fff}
  @keyframes pulse{50%{transform:scale(1.08)}}
  .score{display:none;grid-template-columns:64px 1fr;gap:14px;align-items:center}
  .score.show{display:grid;animation:in .3s}
  .ring{width:64px;height:64px}
  .ring circle{fill:none;stroke-width:7}
  .ring text{font-family:var(--ru);font-weight:700;font-size:18px;fill:var(--ink)}
  .bars{display:grid;grid-template-columns:auto 1fr auto;gap:6px 10px;align-items:center;font-size:13px}
  .bars .tr{height:7px;background:var(--line);border-radius:5px;overflow:hidden}
  .bars .fi{height:100%;border-radius:5px;background:var(--good)}
  .bars .vl{font-variant-numeric:tabular-nums;color:var(--ink-2);font-weight:600}
  .words{display:flex;flex-wrap:wrap;gap:6px}
  .words span{font-family:var(--enf);font-size:1.05em;padding:2px 8px;border-radius:6px}
  .words .g{color:var(--good);background:var(--good-bg)} .words .a{color:var(--warn);background:var(--warn-bg)}

  /* vocab */
  .vocab{display:flex;flex-direction:column;border-top:1px solid var(--line);max-width:min(34em,100%)}
  .v{display:grid;grid-template-columns:36px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
  .v .w{font-family:var(--enf);color:var(--blue);font-size:1.15em;font-weight:600}
  .v .t{color:var(--ink-2);text-align:right}

  /* memory load */
  .load{display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;padding:24px 0}
  .loadbar{width:min(260px,100%);height:8px;background:var(--line);border-radius:99px;overflow:hidden}
  .loadfill{display:block;height:100%;width:0;background:var(--lime-deep);animation:fill 1.2s ease-out .3s forwards}
  @keyframes fill{to{width:100%}}
  .load .ok{color:var(--good);font-weight:600;opacity:0;animation:in .3s 1.5s forwards}

  .end{padding:var(--s3);background:var(--blue-bg);border-radius:14px;max-width:min(34em,100%)}

  .bottom{position:fixed;left:0;right:0;bottom:0;background:var(--paper);border-top:1px solid var(--line);z-index:5}
  .bottom-in{max-width:var(--w);margin:0 auto;padding:12px var(--pad);display:flex;gap:10px;align-items:center}
  .ghost{color:var(--ink-2);padding:12px 8px;min-height:48px}
  .cta{flex:1;background:var(--blue);color:#fff;border-radius:12px;min-height:52px;font-weight:700;font-size:17px;transition:opacity .15s}
  .cta:disabled{opacity:.3;cursor:default}
  .cta.alt{background:var(--paper);color:var(--blue);border:1.5px solid var(--blue);flex:none;min-width:180px}
  .pair{display:flex;gap:10px;flex-wrap:wrap;max-width:min(34em,100%)}
  .pair .cta{flex:1 1 200px}

  .screen{animation:in .22s ease}
  main{padding-top:24px}
  .line{font-size:1.3em}
  .line.ru{font-size:1.05em;line-height:1.6}
  .slot{min-width:2.6em;height:1.7em;border-bottom-width:2.5px;cursor:default}
  .line.ru .slot{font-family:var(--ru)}
  .slot.good{background:var(--good-bg);border-radius:6px 6px 0 0}
  .tr{color:var(--ink-2);font-size:.95em}
  .chip{padding:8px 22px;min-height:48px;font-size:1.15em;font-weight:600}
  .chip.good{background:var(--good);border-color:var(--good);color:#fff} .chip.warn{background:var(--warn-bg);border-color:var(--warn);color:var(--warn)} .chip:disabled{cursor:default}
  .legend{font-size:14px;color:var(--ink-2)}
  .trow{font-size:1.3em} .trow input{height:50px;border-color:var(--blue-line);border-radius:12px}
  .card{padding:26px 20px;font-size:1.4em;min-height:110px}
  .console{font-size:16px;line-height:1.9} .console .w{cursor:default} .console .w.hot{cursor:pointer} .console .dim{opacity:.45}
  /* Rover reads his console line (his voice, bugs and all): a bare speaker glyph where the prompt arrow was */
  .console .csay{background:none;border:0;padding:0 2px 0 0;margin:0;vertical-align:-3px;cursor:pointer;color:inherit} .console .csay .spk{width:auto;height:auto;background:none;border:0;display:inline-flex} .console .csay .spk svg{width:15px;height:15px;fill:var(--lime,#C7F43D)} .console div.play .csay .spk svg{fill:#fff}
  .sp .l1{font-size:1.4em} .micb{width:64px;height:64px} .micb svg{width:26px;height:26px}
  .deckwrap{display:flex;flex-direction:column;gap:14px}
  .deckdots{display:flex;gap:5px;max-width:min(34em,100%)}
  .deckdots i{flex:1;height:4px;border-radius:2px;background:var(--line)}
  .deckdots i.done{background:var(--good)} .deckdots i.cur{background:var(--blue)}
  .deck{display:flex;flex-direction:column;gap:var(--s3)}
  .deck.in{animation:flyin .3s cubic-bezier(.2,.8,.3,1)} .deck.back{animation:flyback .3s cubic-bezier(.2,.8,.3,1)}
  @keyframes flyin{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}
  @keyframes flyback{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
  .ln{grid-template-columns:36px 1fr;gap:0 10px;align-items:flex-end}
  .ln .av{grid-row:auto;align-self:flex-end}
  .ln .what{background:var(--wash);border-radius:16px 16px 16px 4px;padding:10px 14px;border-left:3px solid var(--ink-3);max-width:34em}
  .ln .what.bermet{border-left-color:var(--blue)} .ln .what.mia{border-left-color:var(--coral)} .ln .what.rover{border-left-color:var(--ink-3)} .ln .what.bakai{border-left-color:var(--good)}
  .fb{border-radius:16px 16px 16px 4px;align-items:flex-end}
  .vocab{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:0;max-width:min(34em,100%)}
  .vr{display:grid;grid-template-columns:32px 1fr;gap:2px 8px;align-items:center;padding:10px 12px;border:1.5px solid var(--line);border-radius:14px;cursor:pointer;transition:border-color .15s,background .15s}
  .vr:active,.vr.play{border-color:var(--blue);background:var(--blue-bg)}
  .vr .spk{grid-row:1/3;align-self:center}
  .vr .w{font-family:var(--enf);color:var(--blue);font-size:1.15em;font-weight:600;line-height:1.2}
  .vr .t{color:var(--ink-2);font-size:.9em;line-height:1.2}
  @media(max-width:360px){.vocab{grid-template-columns:1fr}}
  /* полная форма → короткая: выпавшая буква гаснет, апостроф встаёт на её место (9 сентября 2026) */
  .shorten{display:flex;flex-direction:column;gap:9px;max-width:min(34em,100%)}
  .sh{display:grid;grid-template-columns:1fr 26px 1fr;align-items:center;gap:8px}
  .sh .fu,.sh .sho{font-family:var(--enf);font-weight:600;font-size:1.12em;text-align:center;
       background:var(--en-bg);color:var(--en-fg);border-radius:.5em;padding:.14em .5em}
  .sh .arr{text-align:center;color:var(--ink-3);font-weight:800}
  /* Уходит только буква. Апостроф всегда виден: на «низкой» фазе экран показывал «I m» —
     форму, которой не существует (Самат, 9 сентября 2026). */
  .sh .drop{color:var(--warn);animation:shdrop 2.6s ease-in-out infinite}
  .sh .apo{color:var(--warn);font-weight:800}
  @keyframes shdrop{0%,30%{opacity:1;text-decoration:none}50%,100%{opacity:.22;text-decoration:line-through}}
  @media (prefers-reduced-motion:reduce){.sh .drop{animation:none;opacity:.4;text-decoration:line-through}}
  .shmore{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin-top:2px;max-width:min(34em,100%)}
  .shmore span{font-family:var(--enf);font-size:.98em;color:var(--ink-2);white-space:nowrap}
  .shmore b{font-weight:700;color:var(--en-fg)}
  @media(max-width:340px){.shmore{grid-template-columns:1fr}}
  /* Воздух в объяснении. Только проза TEACH/SCENE: на деках (карточка, десять фраз)
     лишние 2 px ломают бюджет экрана — проверено t3.js 9 сентября 2026. */
  .screen>p+p{margin-top:3px}
  .screen>ul>li+li{margin-top:3px}
  /* TYPED (1 октября 2026): кнопка «Проверить» — рядом с полем, когда набирают предложение целиком (поле на всю
     ширину), и в строке перевода под строкой с пропуском; заметка о русской раскладке */
  .trow.whole input{flex:1;min-width:0;width:auto;text-align:left}
  .tfoot{display:flex;align-items:center;gap:10px} .tfoot .tr{flex:1;min-width:0} .tfoot .tchk{margin-left:auto}
  .tchk{flex:none;height:46px;padding:0 14px;border-radius:12px;background:var(--cta-bg);color:var(--cta-fg);font:700 15px var(--ru)}
  .tchk:disabled{opacity:.4;cursor:default}
  .kbd{font-size:14px;line-height:1.35;color:var(--warn);font-weight:600}
  .trow en.tail{margin-left:-8px}
  /* MATCH a1: английские готовые фразы на фишках к русской строке-случаю — фишки поменьше, по две в ряд */
  .bank.long{display:grid;grid-template-columns:1fr 1fr;gap:8px} .bank.long .chip{font-size:1em;padding:6px 10px;min-height:42px;line-height:1.25}
  /* CARDS с ответами на кнопках: английская фраза на кнопке, а не «да / нет» зелёным и коралловым */
  .twin.ans button{background:var(--en-bg);color:var(--en-fg);font-family:var(--enf);font-weight:600;font-size:17px;line-height:1.25;padding:6px 10px}
  .twin.ans button.good{background:var(--mark-bg);color:var(--mark-fg)}
  .twin.ans button.warn{background:var(--warn-bg);color:var(--warn);box-shadow:inset 0 0 0 1.5px var(--warn)}
  .twin.ans button:disabled{opacity:1} .twin.ans button:disabled:not(.good):not(.warn){opacity:.45}
  /* блок «::: термин»: рамка с термином и определением */
  .tbox{display:flex;flex-direction:column;gap:4px;border:1.5px solid var(--brand);border-radius:14px;padding:10px 14px;background:var(--card);max-width:min(34em,100%)}
  .tbox .tb-t{font-weight:800;color:var(--h1)}
  html[data-theme=night] .tbox{border-color:var(--lime)}
  /* format: a1 — таблица в три столбца: подлежащее и форма в строку, пример под ними */
  .rows.c3 .row{grid-template-columns:minmax(0,1fr) max-content;padding:8px 0;gap:2px 12px} .rows.c3 .row .e{grid-column:auto;text-align:right} .rows.c3 .row .x{grid-column:1/-1}
  /* format: a1 — абзацы и реплики перед пузырём задания на экране деки: в размер пузыря задания, чтобы дека помещалась */
  .pre{display:flex;flex-direction:column;gap:inherit;font-size:15px;line-height:1.45}
  .pre .say{gap:8px} .pre .ln{grid-template-columns:28px 1fr;gap:0 8px} .pre .ln .av{width:28px;height:28px} .pre .ln .what{font-size:14.5px;padding:7px 11px;line-height:1.4}
  /* CARDS с ответами на кнопках: вопрос на карточке короче и ниже, чем утверждение «так или не так» */
  .card.q{min-height:0;padding:14px 16px;font-size:1.2em}

  :root{--en-bg:#C7F43D;--en-fg:#173F35;--mark-bg:#173F35;--mark-fg:#C7F43D;--ru:"Nunito","IBM Plex Sans","Segoe UI",Arial,sans-serif;--card:#fff;
    --paper:#fff;--ink:#101512;--ink-2:#4a5550;--ink-3:#8a948f;--line:#e2e6df;--wash:#F3EEE3;
    --brand:#173F35;--on-brand:#fff;--h1:var(--brand);--blue:#1b5f4c;--blue-bg:#eef4ef;--blue-line:#a9c9bd;
    --lime:#C7F43D;--lime-deep:#9fd21a;--good:#173F35;--good-bg:#eefbc0;--warn:#e04a1e;--warn-bg:#ffe9e2;--coral:#ff5a2e;
    --cta-bg:var(--lime);--cta-fg:var(--brand);--head-bg:var(--paper);--head-fg:var(--ink-2);--wm:var(--brand);--prog:var(--brand);--head-line:var(--line);--tile:var(--lime);--tile-fg:var(--brand)}
  html[data-theme=navy]{--en-bg:#c9f65c;--en-fg:#171c3d;--mark-bg:#171c3d;--mark-fg:#c9f65c;--ink:#171c3d;--ink-2:#4c5270;--ink-3:#8a90a8;--line:#e1e4ee;--wash:#f1f3fa;
    --brand:#171c3d;--blue:#1f4fd8;--blue-bg:#eef2ff;--blue-line:#b9c8ff;--lime:#c9f65c;--lime-deep:#a6dc2a;--good:#171c3d;--good-bg:#effcc8;
    --cta-bg:var(--brand);--cta-fg:var(--lime)}
  html[data-theme=sand]{--en-bg:#C7F43D;--en-fg:#173F35;--mark-bg:#173F35;--mark-fg:#C7F43D;--paper:#F3EEE3;--ink-2:#5a5f58;--line:#e3ddcf;--wash:#fff;--blue-bg:#fff;
    --cta-bg:var(--brand);--cta-fg:var(--lime)}
  html[data-theme=cream]{--en-bg:#cfeae4;--en-fg:#1f6f63;--mark-bg:#2f8a7c;--mark-fg:#f6f3ec;--paper:#ebf3f5;--ink:#142826;--ink-2:#4f6664;--ink-3:#86999a;--line:#d4e2e4;--wash:#fff;--card:#fff;
    --brand:#2f8a7c;--on-brand:#f6f3ec;--h1:#173f3a;--blue:#1f6f63;--blue-bg:#fff;--blue-line:#a7d3c8;
    --lime:#cdeee7;--lime-deep:#54a08e;--good:#2f8a7c;--good-bg:#dcf1ec;--warn:#e04a1e;--warn-bg:#ffe9e2;
    --cta-bg:var(--brand);--cta-fg:#f6f3ec;--wm:var(--brand);--tile:var(--brand);--tile-fg:#f6f3ec}
  html[data-theme=pastel]{--en-bg:#cfeee6;--en-fg:#256e63;--mark-bg:#2e8577;--mark-fg:#e6f6f1;--paper:#e7f3ee;--ink:#1f3230;--ink-2:#556a67;--ink-3:#8ea3a0;--line:#cfe2db;--wash:#f1ecfa;--card:#fff;
    --brand:#2e8577;--on-brand:#fff;--h1:#1f3230;--blue:#2a7f72;--blue-bg:#fff;--blue-line:#b3dcd3;
    --lime:#fbefb4;--lime-deep:#e2c94a;--good:#2e8577;--good-bg:#dff3ec;--warn:#e2684a;--warn-bg:#fde5dc;
    --cta-bg:var(--brand);--cta-fg:#fff;--wm:var(--brand);--tile:#fbefb4;--tile-fg:#3a9a8b}
  html[data-theme=pastel] .ex{border:1px solid var(--line)} html[data-theme=pastel] .rows{background:#fff;border-radius:16px;padding:2px 14px;border-top:0}
  html[data-theme=pastel] .what.mia{border-left-color:#b39ddb} html[data-theme=pastel] .rulecard .rk{color:#fff} html[data-theme=pastel] .console,html[data-theme=cream] .console{background:#1f3230}
  html[data-theme=night]{--en-bg:#173F35;--en-fg:#C7F43D;--mark-bg:#C7F43D;--mark-fg:#101512;--paper:#101512;--ink:#eef0ea;--ink-2:#b5bcb3;--ink-3:#7d857f;--line:#2b332d;--wash:#1b211d;--card:#1b211d;--mark-fg:#101512;
    --brand:#173F35;--on-brand:#f4f1e7;--h1:#f4f1e7;--blue:#ffffff;--blue-bg:#1b211d;--blue-line:#3a453e;
    --lime:#C7F43D;--lime-deep:#9fd21a;--good:#C7F43D;--good-bg:#233016;--warn:#ff7a55;--warn-bg:#3a1f17;
    --cta-bg:var(--lime);--cta-fg:#101512;--wm:var(--lime);--prog:var(--lime);--tile:var(--lime);--tile-fg:#173F35}
  html[data-theme=night] .ghost{color:var(--lime)} html[data-theme=night] .what.bermet{border-left-color:var(--lime)} html[data-theme=night] .fb{border-left-color:var(--lime)}
  html[data-theme=night] .console{background:#000;border:1px solid var(--line)}
  html[data-theme=sand] .ex,html[data-theme=cream] .ex{border:1px solid var(--line)} html[data-theme=sand] .rows,html[data-theme=cream] .rows{background:#fff;border-radius:16px;padding:2px 14px;border-top:0}
  html[data-theme=cream] .what.bermet{border-left-color:var(--brand)}
  html{background:var(--paper)} body{font-family:var(--ru);font-size:16px;line-height:1.5;padding-bottom:92px}
  main{padding:14px var(--pad) 24px} .screen{gap:14px}
  h1{font-weight:800;color:var(--h1);letter-spacing:-.01em;font-size:clamp(21px,5.6vw,26px);line-height:1.2}
  ul{gap:6px}
  .top{background:var(--head-bg);color:var(--head-fg);border-bottom:1px solid var(--head-line)}
  .top-in{gap:4px;padding:8px var(--pad) 5px}
  .tline{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .logo{display:flex;align-items:center;gap:8px;text-decoration:none} .smark{width:32px;height:32px;border-radius:8px;flex:none}
  .wm{height:30px;width:auto;display:block;color:var(--wm)}
  .kick{font-size:12.5px;font-weight:700;letter-spacing:.02em;color:var(--head-fg);display:flex;align-items:center;gap:8px;white-space:nowrap}
  .tbtn{width:34px;height:34px;border-radius:50%;border:0;background:transparent;color:var(--head-fg);padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
  .tbtn svg{width:22px;height:22px} .tbtn:hover,.tbtn[aria-expanded=true]{background:var(--wash)}
  .prog{position:relative;height:16px;color:var(--prog)}
  .wavebg{position:absolute;left:0;right:0;bottom:1px;width:100%;height:12px;overflow:visible}
  .boat{position:absolute;bottom:4px;width:15px;height:15px;margin-left:-9px;transition:left .4s}
  .tmenu{position:fixed;top:64px;right:10px;z-index:30;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.22);padding:6px;min-width:190px;display:none}
  .tmenu.open{display:block;animation:in .18s ease} .tmenu .tt{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);padding:6px 12px 4px}
  .tmenu button{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;font:inherit;font-weight:700;color:inherit;padding:8px 12px;border-radius:10px;cursor:pointer;text-align:left}
  .tmenu button.cur{background:var(--wash)} .tmenu button:hover{background:var(--wash)}
  .tmenu .sw{display:flex;gap:2px;flex:none} .tmenu .sw i{width:13px;height:18px;border:1px solid rgba(0,0,0,.12)} .tmenu .sw i:first-child{border-radius:5px 0 0 5px} .tmenu .sw i:last-child{border-radius:0 5px 5px 0}
  .tmenu .chk{margin-left:auto;font-weight:800;color:var(--lime-deep)}
  .posb{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;white-space:nowrap}
  .navmenu{left:10px;right:10px;min-width:0;max-height:72vh;overflow:auto;padding-bottom:10px}   /* список экранов для проверки урока: один клик — на любой экран (Самат, 16 сентября 2026) */
  .navmenu button{padding:6px 10px;font-weight:600;font-size:14px;gap:8px;align-items:baseline;line-height:1.3}
  .navmenu .n{color:var(--ink-3);min-width:2.2em;flex:none;font-variant-numeric:tabular-nums;text-align:right}
  .navmenu .k{font-size:10px;letter-spacing:.06em;color:var(--ink-3);flex:none;min-width:4.4em}
  .navmenu .h{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* режим правок (16 сентября 2026): выделение, вычеркнуто, переписано, вставлено, заметка, панель действий */
  body.rv main :is(p,li,h1,.what,.l2,.ex .l1,.opt,.card .ct,.line,.fb,.note,.vr .t,.rulecard li,.row .e,.row .k,.was){cursor:pointer}
  body.rv main{padding-bottom:120px}
  .rv-sel{outline:2px dashed var(--coral);outline-offset:3px;border-radius:6px}
  .rv-del{text-decoration:line-through;text-decoration-color:var(--coral);text-decoration-thickness:2px;color:var(--ink-3)}
  .rv-edit{background:var(--good-bg);box-shadow:-4px 0 0 var(--good);border-radius:4px}
  .rv-ins{background:var(--good-bg);border-left:3px solid var(--good);padding:6px 10px;border-radius:6px}
  .rv-note{box-shadow:-4px 0 0 var(--warn)} .rv-note::after{content:" ✎";color:var(--warn)}
  .rvbar{position:fixed;left:0;right:0;z-index:26;display:flex;flex-wrap:wrap;gap:6px;padding:6px 10px;background:var(--card);border-top:1px solid var(--line)}
  .rvbar button{font:inherit;font-size:12px;font-weight:700;padding:6px 9px;border-radius:9px;border:1px solid var(--line);background:var(--wash);color:var(--ink);cursor:pointer}
  .rvhint{flex:1 0 100%;font-size:12px;color:var(--muted)}
  .rvbar button:disabled{opacity:.4} .rvbar button.dl{background:var(--mark-bg);color:var(--mark-fg);border-color:var(--mark-bg)}
  .bottom-in{padding:10px var(--pad) 12px;min-height:70px;box-sizing:border-box} .cta{-webkit-appearance:none;appearance:none;min-height:48px;background:var(--cta-bg);color:var(--cta-fg);border-radius:999px;font-weight:800;font-family:var(--ru);font-size:16px}
  .ghost{color:var(--brand);font-weight:700;font-family:var(--ru);min-height:44px}
  .ex{padding:10px 14px;gap:3px;background:var(--blue-bg)} .ex .l1{font-size:1.12em;gap:8px} .exs{gap:8px} .spk{width:30px;height:30px} .spk svg{width:16px;height:16px}
  .art{display:flex;justify-content:center;background:none;border-radius:0} .art img{max-height:var(--arth,170px);max-width:100%;width:auto;height:auto;border-radius:14px;display:block}
  .say{gap:10px} .ln .what{font-size:15.5px;padding:9px 13px}
  .opts{gap:8px} .opt{padding:11px 14px;min-height:48px;font-size:1.1em;font-family:var(--enf)} .opt.ru{font-family:var(--ru)}
  .card{padding:18px 18px;font-size:1.3em;min-height:90px} .twin button{min-height:48px;font-family:var(--ru)}
  .chip,.opt{font-family:var(--enf)} .chip.ru,.opt.ru{font-family:var(--ru)} .chip{background:var(--card);padding:7px 20px;min-height:46px;font-size:1.1em} .chip.good{background:var(--lime);border-color:var(--lime);color:var(--brand)}
  .card,.vr,.trow input{background:var(--card)} .trow input{color:var(--ink)}
  .line{display:block;font-size:1.25em;line-height:1.75} .line .slot{display:inline-flex;vertical-align:middle;height:1.6em;min-width:2.6em;margin:0 .1em} .line .tr{display:block;margin-top:2px;line-height:1.5} .slot.good{background:var(--lime);color:var(--mark-fg)}
  mark{color:var(--mark-fg)}
  .console{background:var(--brand);font-size:15px;line-height:1.7;padding:12px 14px}
  .load{padding:6px 0;gap:6px} .load .note{font-size:15px}
  .rulecard{position:relative;background:var(--brand);color:var(--on-brand);border-radius:16px;padding:12px 16px 24px;overflow:hidden;margin-top:6px;max-width:min(34em,100%);font-size:15px;line-height:1.45}
  .rulecard .rk{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--lime);margin-bottom:4px}
  .rulecard ul{margin:0;padding-left:1.1em;gap:3px} .rulecard en{color:#fff}
  .rwave{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:14px;fill:var(--lime)}
  .sp{padding:14px;gap:10px} .sp .l1{font-size:1.25em} .micb{width:56px;height:56px} .micb svg{width:22px;height:22px} .score{grid-template-columns:56px 1fr;gap:10px}
  .ln .what.bermet{border-left-color:var(--brand)} .ln .what.mia{border-left-color:#8b87d6}
  .fb{background:var(--wash);border-left:3px solid var(--good);color:var(--ink);font-size:15px;padding:10px 14px;gap:10px;grid-template-columns:32px 1fr} .fb.warn{background:var(--warn-bg);border-left-color:var(--warn)} .fb .what{background:transparent} .fb .av{width:32px;height:32px}
  .fb{box-shadow:none;border-radius:14px} .fb.show{animation:in .25s ease}
  .vocab{gap:8px} .vr{padding:8px 10px;gap:0 6px;grid-template-columns:28px 1fr} .vr .w{font-size:1.08em} .vr .t{font-size:.85em}
  @media(max-width:360px){.vocab{grid-template-columns:1fr 1fr}} @media(max-width:320px){.vocab{grid-template-columns:1fr}}
  @media(max-height:700px){body{font-size:15px} .console{font-size:14px;line-height:1.6} .screen{gap:11px} main{padding-top:10px} h1{font-size:clamp(20px,5.4vw,23px)}}

  /* English pills */
  en{background:var(--en-bg);color:var(--en-fg);border-radius:.55em;padding:.02em .38em;margin:0;font-family:var(--enf);font-weight:600;font-size:1.04em;box-decoration-break:clone;-webkit-box-decoration-break:clone;line-height:1.35}
  en.play{background:var(--mark-bg);color:var(--mark-fg)}
  h1 en{font-size:.95em;vertical-align:baseline}
  mark{background:var(--mark-bg);color:var(--mark-fg);border-radius:.5em;padding:.02em .4em}
  .rows .v mark{font-size:1.1em}
  .ex{background:var(--card);border:1px solid var(--line)} .ex .l1{color:var(--ink)} .ex .l1 en{font-size:1.05em} .ex .ipa{color:var(--ink-2)}
  .spk{background:var(--card);border-color:var(--line)} .spk svg{fill:var(--en-fg)} html[data-theme=night] .spk svg{fill:var(--lime)}
  .ln .what{font-family:var(--ru);color:var(--ink);font-size:15.5px;font-weight:500} .what.rover{border-left-color:var(--ink-3)}
  .rulecard en{background:var(--lime);color:var(--brand)} html[data-theme=night] .rulecard en{background:#101512;color:var(--lime)}
  html[data-theme=cream] .rulecard en,html[data-theme=pastel] .rulecard en{background:#fff;color:var(--brand)}
  html[data-theme=pastel] .say.intro .ln .what,html[data-theme=cream] .say.intro .ln .what{background:#fff;border:1px solid var(--line);border-left-width:3px}
  .opt{background:var(--en-bg);color:var(--en-fg);border-color:transparent;font-family:var(--enf);font-weight:600} .opt.ru{background:var(--card);color:var(--ink);border-color:var(--line);font-family:var(--ru)} .opt en{background:none;padding:0;font-size:1em}
  .opt.good{border-color:var(--mark-bg);background:var(--mark-bg);color:var(--mark-fg)} .opt.warn{background:var(--warn-bg);border-color:var(--warn);color:var(--warn)}
  .chip{background:var(--en-bg);color:var(--en-fg);border-color:transparent;font-family:var(--enf);font-weight:600} .chip.ru{background:var(--card);color:var(--ink);border-color:var(--line);font-family:var(--ru);font-weight:700}
  .chip.good{background:var(--mark-bg);border-color:var(--mark-bg);color:var(--mark-fg)} .chip.warn{background:var(--warn-bg);border-color:var(--warn);color:var(--warn)}
  .line{font-family:var(--ru);color:var(--ink)} .line:not(.ru) en{font-size:1.06em;line-height:1.6;padding:.1em .45em} .line.ru en{font-size:1em} .line en .slot{margin:0 .05em} .line .slot{border-bottom-color:var(--en-fg);color:var(--en-fg);background:rgba(255,255,255,.55);border-radius:.4em .4em 0 0} .line.ru .slot{background:var(--card);border-bottom-color:var(--en-fg);color:var(--en-fg)} .line.ru .slot.good{background:var(--mark-bg);color:var(--mark-fg);border-bottom-color:var(--mark-bg)} .line.ru .slot.warn{background:var(--warn-bg);color:var(--warn);border-bottom-color:var(--warn)} .slot.good{background:var(--mark-bg);color:var(--mark-fg);border-bottom-color:var(--mark-bg)} .slot.warn{background:var(--warn-bg);color:var(--warn);border-bottom-color:var(--warn)}
  .card{background:var(--card);color:var(--ink)} .card:not(.ru) en{font-size:1em;padding:.08em .5em} .card.ru{font-family:var(--ru);font-size:1.15em;font-weight:600} .card.ru en{font-size:1em}
  .vr .w en{font-size:1em} .vr{background:var(--card)} .vr .w{color:var(--ink)}
  .trow en{font-size:1.1em} .trow input{border-color:var(--en-fg)}
  .sp{background:var(--card)} .sp .l1{color:var(--ink)} .sp .l1 en{font-size:1em}
  /* the pipeline's interlinear line, everywhere an English line is shown */
  /* with three or more example blocks on one screen the line appears on tap (.open), to keep the screen budget */
  .exs.many .ex .ipa{display:none} .exs.many .ex.open .ipa{display:block}
  .ex .ipa{display:block;font-family:var(--mono);font-size:.84em;color:var(--ink-2);letter-spacing:.02em;line-height:1.35}
  .ex .ipa b,.vr .ann b{color:var(--stress);font-weight:700} .ex .ipa u,.vr .ann u{color:var(--weak);text-decoration:none;font-weight:600} .ex .ipa i,.vr .ann i{color:var(--coral);font-style:normal;font-weight:700}
  .vr .t .ann{font-family:var(--mono);font-size:.95em;color:var(--ink-2)}
  html[data-theme=night]{--stress:#ff7a8a;--weak:#c4b5fd}
  /* after a correct answer the › arrow lights up and waits for the tap (no auto-advance) */
  .darr.go{color:var(--brand);background:var(--en-bg);animation:nudge 1.1s ease-in-out 3} html[data-theme=night] .darr.go:not(:disabled){color:var(--mark-fg);background:var(--mark-bg)}
  @keyframes nudge{50%{transform:translateY(-50%) translateX(4px)}}
  /* idioms: the pill keeps its colours and gets a dotted underline; the pop-up is a bottom sheet above the bar */
  en.idiom{text-decoration:underline dotted;text-decoration-thickness:1.5px;text-underline-offset:3px;cursor:pointer}
  .ln .what>en.idiom:only-child{background:var(--en-bg);color:var(--en-fg);padding:.03em .36em;font-size:1.05em}
  /* centred with auto margins, not translateX(-50%): the generic `in` keyframe animates transform, and on a
     translateX-centred box the sheet flashed 180px to the right before snapping back (Samat: «jump out funny») */
  .ipop{position:fixed;left:12px;right:12px;margin:0 auto;bottom:84px;width:min(360px,calc(100% - 24px));background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.22);padding:14px 40px 12px 16px;z-index:40;
        opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .22s ease,transform .22s cubic-bezier(.2,.8,.3,1),visibility 0s linear .22s}
  .ipop.show{opacity:1;visibility:visible;transform:none;transition:opacity .22s ease,transform .22s cubic-bezier(.2,.8,.3,1),visibility 0s}
  @media (prefers-reduced-motion:reduce){.ipop{transition:none}}
  .ipop .ip-phrase{font-family:var(--enf);font-weight:600;font-size:1.25em;color:var(--en-fg);margin-bottom:4px} html[data-theme=night] .ipop .ip-phrase{color:var(--lime)}
  .ipop .ip-phrase .ip-ru{font-family:var(--ru);font-weight:800;color:var(--h1)}   /* подсказка термина: «Подлежащее (subject)» — термин русским шрифтом, имя в скобках английским */
  .ipop .ip-def{font-size:15px;line-height:1.45}
  .ipop .ip-x{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:50%;border:0;background:var(--wash);color:var(--ink-2);font-size:14px;cursor:pointer}
  .ipop .ip-say{margin-top:8px;font:700 13px var(--ru);color:var(--brand);background:none;border:0;padding:0;cursor:pointer} html[data-theme=night] .ipop .ip-say{color:var(--lime)}
  /* READ (Mia's reading page): the text on top, the instruments for the current sentence below — one screen */
  .rdtext{font-family:var(--enf);font-size:15.5px;line-height:1.6;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:9px 12px;max-width:min(34em,100%);text-wrap:pretty}
  .rs{cursor:pointer;border-radius:.28em;padding:.02em .22em;margin:0 -.02em;transition:background .15s;box-decoration-break:clone;-webkit-box-decoration-break:clone}
  .rs.seen{color:var(--en-fg)} html[data-theme=night] .rs.seen{color:var(--lime)} .rs.cur,.rs.cur.seen{background:var(--en-bg);color:var(--en-fg)} .rs.play{background:var(--mark-bg);color:var(--mark-fg)}
  .sp.rd{padding:8px 10px 10px;gap:6px;max-width:min(34em,100%)}
  .rdhead{display:grid;grid-template-columns:32px 1fr 32px;align-items:center;gap:4px}
  .rdhead .darr{position:static;transform:none;height:48px}
  .rdmid{display:flex;flex-direction:column;gap:2px;min-width:0;text-align:center}
  .sp.rd .l1{font-size:1.15em;justify-content:center} .sp.rd .ann{font-size:.92em} .sp.rd .ru{font-size:14px}
  .rdbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap} .rdbar .micb{width:46px;height:46px} .rdbar .micb svg{width:20px;height:20px} .rdbar .note{font-size:14px;color:var(--ink-2)} .rdbar .sprow{margin:0 0 0 auto}
  .sp.rd .score{grid-template-columns:48px 1fr;gap:8px} .sp.rd .ring{width:48px;height:48px} .sp.rd .bars{display:none} .sp.rd .words span{font-size:.95em;padding:1px 6px}
  @media(max-height:700px){.rdtext{font-size:14.5px;line-height:1.5;padding:7px 10px} .sp.rd{padding:6px 8px 8px;gap:4px} .rdhead .darr{height:40px} .rdbar .micb{width:42px;height:42px}}
  /* the grammar card: buttons on LOAD and the finale; the viewer is a full-screen sheet with the card in an iframe, scaled to the width */
  .cardbtns{margin-top:0;gap:8px} .cardbtns .cta{min-height:40px;font-size:14.5px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;flex:1 1 120px;min-width:0}
  @media(max-height:700px){.cardbtns .cta{min-height:36px} .load{padding:2px 0;gap:4px} .rulecard{padding:10px 14px 20px;font-size:14px;line-height:1.35;margin-top:2px}}
  .cardview{position:fixed;inset:0;z-index:60;background:var(--wash);display:flex;flex-direction:column} .cardview[hidden]{display:none}
  .cv-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px 10px 18px;background:var(--card);border-bottom:1px solid var(--line);font-weight:800;color:var(--ink)}
  .cv-bar .ip-x{position:static;width:34px;height:34px;border-radius:50%;border:0;background:var(--wash);color:var(--ink-2);font-size:15px;cursor:pointer}
  .cv-scroll{flex:1;overflow:auto;padding:8px} .cv-page{width:100%;overflow:hidden;box-shadow:0 8px 28px rgba(0,0,0,.18);border-radius:6px;background:#fff}
  #cvframe{width:794px;height:1123px;border:0;transform-origin:top left;display:block;background:#fff}
  body.cvopen{overflow:hidden}
  /* repeat line at the end of a correct feedback */
  .fb .rep{margin-top:6px;padding-top:6px;border-top:1px dashed var(--line);font-size:15px}
  .fb i.ipa{font-style:normal;font-family:var(--enf);color:var(--ink-2)}
  /* the drill's task is Bermet's line (9 Sept 2026): a compact bubble so the screen budget holds */
  .say.intro{margin:0} .say.intro .ln{grid-template-columns:28px 1fr;gap:0 8px} .say.intro .ln .av{width:28px;height:28px} .say.intro .ln .what{font-size:14.5px;padding:7px 11px;line-height:1.4}
  @media(max-height:700px){.say.intro .ln .what{font-size:14px;padding:6px 10px} .fb{padding:7px 9px;font-size:13.5px;line-height:1.4} .fb .av{width:28px;height:28px} .fb{grid-template-columns:28px 1fr;gap:8px}}
  /* the one whole-sentence pill: the «Повтори вслух» line is the tap-to-repeat affordance (Samat, 8 Sept 2026) */
  .fb .rep en,.fb .rep en.sent{background:var(--en-bg);color:var(--en-fg);padding:.06em .42em;border-radius:.28em;line-height:1.5} .fb .rep .rl{color:var(--ink-2);font-weight:700;font-size:13px;letter-spacing:.02em;text-transform:uppercase;margin-right:4px} .fb .rep en{font-size:1.02em} .fb .rep .tr{color:var(--ink-2)}
  .takeb{font:600 .85em var(--font,inherit);color:var(--ink-2);background:var(--card);border:1px solid var(--line);border-radius:10px;padding:6px 10px;cursor:pointer} .takeb.play{color:var(--brand);border-color:var(--brand)}
  .words .note{font-size:.9em;color:var(--ink-2);font-family:var(--ru)}
  .sprow{display:flex;gap:8px;flex-wrap:wrap;margin-top:-2px}
  .slowb{font:600 .85em var(--font,inherit);color:var(--brand);background:var(--wash);border:1px solid var(--line);border-radius:10px;padding:6px 10px;cursor:pointer}
  .slowb.play{background:var(--mark-bg);color:var(--mark-fg);border-color:var(--mark-bg)}
  .fb en,.what en{font-size:1em}

  /* drills: card with arrows, no sentence pills */
  .deckcard{position:relative;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 32px;min-height:120px} .deck{gap:16px}
  @media(max-height:700px){.deckcard{padding:8px 26px} .opt{min-height:40px;padding:7px 12px} .opts{gap:5px} main{padding:8px var(--pad) 10px} .screen{gap:9px} .console{padding:8px 12px;line-height:1.45} .fb{padding:8px 10px;font-size:14px} h1{margin:0} .deck{gap:12px}}
  /* short options (every option ≤ 12 chars, e.g. an / the) sit in one row like chips instead of stacked cards */
  .opts.row{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px} .opts.row .opt{flex:0 1 auto;min-width:5.5em;text-align:center;padding:9px 18px}
  html[data-theme=night] .deckcard{background:var(--card)}
  .darr{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:56px;border:0;background:none;color:var(--ink-3);padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:10px}
  .darr svg{width:24px;height:24px} .darr:not(.nx) svg{transform:scaleX(-1)} .darr:not(.nx){left:2px} .darr.nx{right:2px}
  .darr:not(:disabled){color:var(--brand)} html[data-theme=night] .darr:not(:disabled){color:var(--lime)} .darr:disabled{opacity:.35;cursor:default}
  .deck .line:not(.ru) en,.opt:not(.ru) en,.card:not(.ru) en,.sp .l1 en{background:none;color:var(--ink);padding:0;font-size:1.05em}
  .deck .line{font-size:1.2em} .line .slot{background:var(--wash);border-bottom-color:var(--brand);color:var(--brand)} .slot.good{background:var(--mark-bg);color:var(--mark-fg);border-bottom-color:var(--mark-bg)}
  .opt{background:var(--card);color:var(--ink);border-color:var(--line)} .opt.good{background:var(--mark-bg);border-color:var(--mark-bg);color:var(--mark-fg)} .opt.good en{color:inherit}
  .card{border-color:var(--line)}
  .ln .what>en:only-child{background:none;color:var(--en-fg);padding:0;font-size:1.05em}
  .fb en,.what en{font-size:.98em}
  mark en,en mark,.chip en,.slot en,.rulecard mark{background:none;color:inherit;padding:0;font-size:1em;border-radius:0}
  .fb en,.what en{font-size:.98em}
  .fb{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--good)} .fb.warn{background:var(--card);border-left-color:var(--warn)}
  en,mark{border-radius:.28em;padding:.03em .36em} .line .slot{border-radius:.28em .28em 0 0}
  .chip{border-radius:10px;padding:7px 18px} .opt{border-radius:12px} .cta{border-radius:14px} .card{border-radius:14px}
  .ex .l1 en{background:none;color:var(--en-fg);padding:0;font-size:1.08em} html[data-theme=night] .ex .l1 en{color:var(--lime)}
  .twin .yes{color:var(--on-good,#fff)} .console .w.fixed{background:var(--mark-bg);color:var(--mark-fg)}
  html[data-theme=night]{--on-good:#101512}
  h1 en{font-size:.95em;vertical-align:baseline}
  en.sent{background:none;color:var(--en-fg);padding:0;font-size:1.04em} html[data-theme=night] en.sent{color:var(--lime)} .rulecard en.sent{color:var(--lime)}
  /* a sentence that OPENS a list item is the example the line comments on («This is a helmet — артикль перед helmet»):
     it gets the pill like any tappable example, not the plain sentence treatment (Samat, 8 Sept 2026) */
  main li>en.sent:first-child{background:var(--en-bg);color:var(--en-fg);padding:.04em .4em;border-radius:.28em;font-size:1em;line-height:1.5} html[data-theme=night] main li>en.sent:first-child{color:var(--en-fg)}
  .snd{display:flex;flex-direction:column;gap:10px;max-width:min(34em,100%)}
  .sndrow{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;align-items:start} .sndrow .k{font-size:14px;color:var(--ink-2);font-weight:700;padding-top:6px}
  .ws{display:flex;flex-wrap:wrap;gap:8px} .sw{display:inline-flex;align-items:center;gap:6px;padding:5px 10px 5px 8px;border:1.5px solid var(--line);border-radius:10px;background:var(--card);cursor:pointer}
  .sw i{font-family:var(--mono);font-style:normal;font-size:13px;color:var(--ink-2)} .sw en{font-size:1em} .sw.play{border-color:var(--brand)}
  .last .darr.nx{visibility:hidden}
  .deckwrap{gap:10px}
  @media(min-height:701px){.deckcard{padding-top:10px;padding-bottom:10px}
    .deckwrap > .fb{font-size:14.5px;padding:7px 11px;grid-template-columns:28px 1fr;gap:8px} .deckwrap > .fb .av{width:28px;height:28px}
    .deckwrap > .fb .rep{font-size:inherit}}
  /* ── engine-a1.css — стили нового A1 (6 октября 2026, задание A+B). build.py добавляет файл только в сборки нового A1
     (_NEW) и в общие стили пакета; у старых уроков байты прежние. ── */
  /* отклик задания проявляется плавно, а не выскакивает (Самат, 6 октября: «a bit too rapid»): только прозрачность, без
     сдвига, поэтому высота экрана в замерах t3 та же. Движок (правка в build.py) перезапускает проявление на каждом отклике;
     при «Уменьшить движение» базовый CSS снимает анимацию, и отклик стоит сразу */
  .fb.show{animation:fbfade .28s ease-out}
  @keyframes fbfade{from{opacity:0}to{opacity:1}}
  /* BUILD «Собери предложение» (engine-a1.js): русская фраза, строка ответа, банк плиток, «Проверить». Плитки — фишки курса
     (.chip), плотнее обычных: ответ в четыре плитки встаёт в одну строку на 320 px, место касания — не меньше 44×44 px;
     ушедшая плитка оставляет пустое место в банке. На экране ниже 701 px промежутки ещё теснее */
  .bld{display:flex;flex-direction:column;gap:10px}
  .bru{margin:0;font-weight:700;font-size:1.05em;line-height:1.35}
  .bans{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:52px;padding:0 0 6px;border-bottom:2px solid var(--line);transition:border-color .2s}
  .bans.warn{border-bottom-color:var(--warn)}
  .bph{color:var(--ink-2);font-size:15px;line-height:1.35}
  .bbank{gap:6px;justify-content:center}
  .deck .tile{min-height:44px;min-width:44px;padding:4px 11px;font-size:1.05em;line-height:1.2}
  @media(max-height:700px){.bld{gap:7px} .bans{min-height:48px;padding-bottom:4px} .bans,.bbank{gap:5px}}
  @media(max-width:359px){.deck .tile{font-size:1em;padding:4px 9px}}   /* 320 px: «Mia is not ready» — одна строка */
  .tile.out{visibility:hidden}
  /* пустой ряд банка сворачивается, когда ответ уходит на новую строку (engine-a1.js, fold): строка ответа и ряд банка одной
     высоты, и экран с откликом не длиннее, чем с одной строкой ответа (обзор, 6 октября 2026: на 360 px конец отклика уходил
     под нижнюю панель). Сам банк не прячется: пустой банк без рядов держит свои промежутки, и «Проверить» не поднимается */
  .bbank .tile.gone{display:none}
  .tile:focus-visible,.bchk:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
  /* отвеченный пункт: банк и «Проверить» уходят, собранное предложение остаётся над откликом (экран короче, t3) */
  .bld.done .bbank,.bld.done .bfoot{display:none} .bld.done .bans{border-bottom-color:transparent;padding-bottom:0}
  .bfoot{display:flex;justify-content:flex-end}
  /* TYPED, отвеченный пункт (6 октября 2026): «Проверить» уходит, как у BUILD; перевод под полем занимает всю ширину. Кнопка
     неактивна только после верного ответа (engine-tail.js: inp.disabled, btn.disabled) */
  .tfoot .tchk:disabled{display:none}
  .srt{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  /* TYPED со свободным ключом «= ___» (класс free — правка движка в build.py, рост — freeWire в engine-a1.js): имя, страна
     или город. Пустое поле и короткое слово — прежние 4,4em; длинное слово («Kazakhstan», «Kyrgyzstan») поле показывает
     целиком: оно растёт с текстом, а пилюля перед ним («I'm from») при нехватке места переносится на две строки. На 320 px
     шрифт поля и промежутки чуть меньше, чтобы и там «Kazakhstan» встал целиком (6 октября 2026, проба урока 1·2) */
  /* строка ввода с пропуском (7 октября 2026, Самат: «There is no way to ensure from Bishkek is written in one line?»):
     пилюля не рвётся внутри (from Bishkek. — одной строкой), строка переносится между пилюлей и полем; пустое поле — 3,2em
     и растёт с текстом (fieldWire в engine-a1.js), поэтому «I ___ from Bishkek.» помещается в одну строку */
  .trow:not(.whole){flex-wrap:wrap;row-gap:8px}
  .trow:not(.whole)>en{white-space:nowrap}
  .trow .tbr{flex-basis:100%;height:0}   /* перенос после первого предложения пары (fieldWire, 7 октября 2026) */
  .trow:not(.whole) input{flex:none;width:3.2em;min-width:3.2em;max-width:100%;padding:0 8px}
  .trow.free:not(.whole) input{flex:none;min-width:4.4em;max-width:100%;padding:0 8px}
  @media(max-width:359px){.trow.free{gap:8px} .trow.free en.tail{margin-left:-4px} .trow.free:not(.whole) input{font-size:.9em;padding:0 5px}}
  /* ── итоговый обзор экранов (6 октября 2026) ── */
  /* «*Верно:*» деки — в пузыре Бермет над декой вместо задания, когда отвечен последний пункт (engine-a1.js, a1Verno);
     у деки без пузыря — абзацем под откликом */
  .fb .fbv{margin:6px 0 0}
  .say.intro.a1in{animation:fbfade .28s ease-out}
  /* CARDS (engine-a1.js, a1Card): кнопки не «да / нет» (she · it) — обе одного цвета; после ответа верная — тёмная с ✓,
     нажатая неверная — красная рамка, третья гаснет */
  .twin.nt button{background:var(--en-bg);color:var(--en-fg);font-family:var(--enf);font-weight:600;font-size:17px}
  .twin.nt.ru button{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line);font-family:var(--ru);font-weight:700;font-size:16px}
  .twin button.good:disabled,.twin button.warn:disabled{opacity:1}
  .twin:not(.ans) button.good{background:var(--mark-bg);color:var(--mark-fg);box-shadow:none}
  .twin:not(.ans) button.warn{background:var(--warn-bg);color:var(--warn);box-shadow:inset 0 0 0 1.5px var(--warn)}
  .twin button.good::after{content:" ✓"/"";font-weight:800}
  /* TYPED: знак в начале хвоста после поля («, thanks.», «.») — вплотную к полю, не своя пилюля (engine-a1.js, a1Tail) */
  .trow .tpun{margin-left:-10px;font-family:var(--enf);color:var(--en-fg);font-weight:600}
  @media(max-width:359px){.trow.free .tpun{margin-left:-6px}}
  /* DEBUG: пропущенное слово — красная метка вставки ^ перед нажатым словом, слово не зачёркнуто (engine-a1.js, a1Tap) */
  .console .w.ins{background:none;color:inherit;text-decoration:none}
  .console .w.ins::before{content:"";display:inline-block;width:.4em;height:.4em;border-left:2.5px solid var(--coral);border-top:2.5px solid var(--coral);
    transform:translateY(.1em) rotate(45deg);margin:0 .45em 0 .05em}
  /* английская пилюля до трёх слов (I и Rover, is from) не рвётся на две строки (build.py: класс nw у пилюли en()) */
  en.nw{white-space:nowrap}
  /* фишки задания на странице подводки BLANKS — строкой «Фишки: …», а не кнопками: нажать их там нельзя (gen_lesson.py) */
  .bankleg{color:var(--ink-2)}
  /* реплика героя с идиомой — одним пузырём: английский целиком, идиома в нём с подчёркиванием (gen_lesson.py, ln_calls) */
  .what en.sent en.idiom{background:none;color:inherit;padding:0;margin:0;font-size:1em;border-radius:0}
  /* BLANKS и MATCH, отвеченный пункт: банк фишек уходит, как у BUILD и TYPED (итоговый обзор экранов, 6 октября 2026). Ответ
     стоит в пропуске, отклик — под карточкой; место банка нужно пузырю задания над декой и итогу деки в нём (бюджет 390 px) */
  .deck .bank:has(.chip.good){display:none}
  /* пузырь задания над декой — на 10 px от карточки, как отклик под ней (а не 14 px, как абзацы экрана): на деке с пузырём
     задания (теперь и у BLANKS) экран не длиннее бюджета 390 px (t3) */
  .screen>.say.intro+.deckwrap{margin-top:-4px}
  /* плитки слов (WORDS) на 2 px ниже (6 октября 2026): рисунки в плитках слов сняты (Самат: «I don't want them»), а
     плитка с рисунком была на 4 px ниже плитки без него — без рисунков экран слов 1·1а выходил за бюджет t3 на 3 px.
     Поле 7 px сверху и снизу вместо 8 (правило узкого экрана в build.py) возвращает запас; вид тот же */
  .vr{padding-top:7px;padding-bottom:7px}
  /* ── подсказки произношения (7 октября 2026; vocab/terms/tools/tmp/respelling/SPEC.md, аудит §4) ── */
  /* Подсказка (MAI NEYM iz ROU·vər) — своим цветом и латинским моноширинным шрифтом с ə (IBM Plex Mono уже в шрифтах страницы),
     всегда отдельной строкой или отдельной плашкой: она не сливается с русским текстом. Цвет — свой в каждой теме, контраст
     к фону не меньше 4,5:1 (hint_check.js) */
  :root{--hint:#1f5fbf}
  html[data-theme=navy]{--hint:#6a2fc0}
  html[data-theme=cream],html[data-theme=pastel]{--hint:#2d52ad}
  html[data-theme=night]{--hint:#a3cdff}
  .hint{font-family:var(--mono);font-weight:500;color:var(--hint);letter-spacing:.01em;line-height:1.35;overflow-wrap:anywhere}
  .ex .ipa.hint{color:var(--hint)}
  .sp .ann.hint{color:var(--hint);letter-spacing:.01em}
  /* всплывающая подсказка над нажатой пилюлей (engine-a1.js, a1HintShow): плашка с хвостиком к пилюле */
  .hintpop{position:fixed;z-index:25;max-width:calc(100vw - 32px);box-sizing:border-box;padding:5px 11px;border-radius:10px;
    background:var(--card);border:1.5px solid var(--hint);color:var(--hint);font-family:var(--mono);font-weight:500;font-size:15px;
    line-height:1.35;letter-spacing:.01em;box-shadow:0 6px 18px rgba(0,0,0,.16);pointer-events:none;overflow-wrap:anywhere}
  .hintpop[hidden]{display:none}
  .hintpop::after{content:"";position:absolute;left:var(--ax,50%);bottom:-6px;width:9px;height:9px;margin-left:-5px;background:var(--card);
    border-right:1.5px solid var(--hint);border-bottom:1.5px solid var(--hint);transform:rotate(45deg)}
  .hintpop.below::after{bottom:auto;top:-6px;transform:rotate(225deg)}
  /* окно термина (engine-a1.js, a1TermHint): строка подсказки под английским именем и под примером */
  .ipop .ip-hint{font-size:13px;font-weight:500;margin-top:2px}
  .ipop .ip-phrase .ip-hint{font-size:13px}
  /* подсказка в тексте экрана ([[MAI]] в .md, gen_lesson.py): прямая, не курсив */
  i.hint{font-style:normal;font-size:.92em;white-space:nowrap}
  /* пропуск в задании (7 октября 2026, Самат: «this type of background in drills is not consistent across all the themes»).
     Фон пропуска был общим цветом --wash: песочный в основной теме, сиреневый в navy и pastel, а в sand, cream и night
     совпадал с карточкой, и пропуска не было видно; в night ещё и черта тёмно-зелёная на тёмной карточке. Теперь у
     пропуска свой цвет --field, лёгкий оттенок цвета темы, видный на карточке в каждой теме, а черта и буквы — цвета
     английского текста темы (--en-fg, как рамка поля TYPED). Отмеченные пропуски (.good, .warn) не трогаем. */
  :root,html[data-theme=forest],html[data-theme=sand]{--field:#eaf1ed}
  html[data-theme=navy]{--field:#f1f3fa}
  html[data-theme=cream]{--field:#e8f3f1}
  html[data-theme=pastel]{--field:#e6f2ee}
  html[data-theme=night]{--field:#283129}
  .line .slot:not(.good):not(.warn){background:var(--field);border-bottom-color:var(--en-fg);color:var(--en-fg)}
  /* неверный ответ в пропуске (engine-tail.js ставит .warn): по задумке коралловый, как поле TYPED с ошибкой, но правило
     .line .slot{background:var(--wash)} в build.py перекрывало его тем же цветом --wash; возвращаем во всех темах */
  .line .slot.warn{background:var(--warn-bg);color:var(--warn);border-bottom-color:var(--warn)}
  /* подсказка в цвете (7 октября 2026, Самат: «for the IPA in the suilo app … it had different colors and symbols. Can you
     bring back those?»): цвета suilo и старых уроков — ударная часть (заглавные) --stress, ə и слабые служебные слова
     --weak, стрелка ↘ ↗ --coral, ‿ серая; остальное — --ink-2. Разметку ставит hintHtml (engine-a1.js) */
  .hint,.hintpop,.ex .ipa.hint,.sp .ann.hint{color:var(--ink-2)}
  .hint b,.hintpop b{color:var(--stress);font-weight:700}
  .hint u,.hintpop u{color:var(--weak);text-decoration:none}
  .hint .ar,.hintpop .ar{color:var(--coral);font-style:normal;font-weight:700}
  .hint .tie,.hintpop .tie{color:var(--ink-3)}
  /* кнопка «медленно» в READ (7 октября 2026): фон --wash и буквы --brand — в night тёмно-зелёное на тёмной карточке, кнопки
     не видно; как у пропуска — цвет поля темы и английский цвет темы */
  .slowb{background:var(--field);color:var(--en-fg);border-color:var(--line)}
  /* ── vz.css — схемы урока (renderer/visuals/DESIGN.md). build.py добавляет файл только в сборки со схемами. ──
     Цвета мест в предложении — как на карточках реестра, в «Ночи» — тёмный набор карточек. Приглушённое — цвет --vz-mute
     (самый светлый тон шкалы темы, который держит 4,5:1 на --paper и --card), никогда не прозрачность. */
  :root{--subj:#534AB7;--pred:#0F6E56;--obj:#993C1D;--adv:#A8327A;--vz-mute:#6d7772;--vz-link:var(--ink-2);--vz-ink:var(--ink)}
  html[data-theme=navy]{--vz-mute:#6e748f}
  html[data-theme=sand]{--vz-mute:#666d66}
  html[data-theme=cream]{--vz-mute:#5b7170}
  html[data-theme=pastel]{--vz-mute:#5b706d}
  html[data-theme=night]{--subj:#AFA9EC;--pred:#5DCAA5;--obj:#F0997B;--adv:#EE8FCB;--vz-mute:#828a84}

  /* фигура: карточка с рамкой; дорожки (скобка, дуга, слова, линия, подпись места, часть речи) заняты с первого шага.
   Подпись места стоит сразу под своей линией, приглушённая часть речи — дорожкой ниже (обзор 3 октября, пункт 1). */
  figure.vz{margin:0;container-type:inline-size;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:8px 12px 6px;
    display:flex;flex-direction:column;gap:6px;max-width:min(34em,100%);touch-action:manipulation;-webkit-tap-highlight-color:transparent;
    --vz-gp:5px;--vz-brk-h:0px;--vz-arc-h:0px;--vz-bar-h:0px;--vz-pos-h:0px;--vz-lbl-h:0px}
  /* схема без линий и подписей мест (parse-sentence, parse-verb-is-am): поля групп 2 px, промежуток между группами
     равен обычному пробелу между словами, иначе «Mia  is  a doctor.» читается как опечатка (четвёртый обзор, 3 октября) */
  figure.vz:not(.vz-bar-on):not(.vz-lbl-on):not(.vz-tap){--vz-gp:2px}
  .vz.vz-brk-on{--vz-brk-h:26px} .vz.vz-arc-on{--vz-arc-h:14px} .vz.vz-bar-on{--vz-bar-h:7px} .vz.vz-pos-on{--vz-pos-h:16px} .vz.vz-lbl-on{--vz-lbl-h:16px}
  /* строки разделены волосяной линией посреди зазора (пункт 2). Линия — украшение (1,3:1): строку с переводом
   объединяют динамик в её начале и общий отступ слов и перевода (четвёртый обзор). Линия идёт от начала слов, мимо
   динамика, и высоты не добавляет */
.vz-rows{display:flex;flex-direction:column;gap:7px;user-select:none;-webkit-user-select:none;cursor:pointer;isolation:isolate}   /* isolate: подложка звучащей группы (z-index:-1) ложится на фон схемы, а не под него */
.vz-row{position:relative}
.vz-row+.vz-row::before{content:"";position:absolute;left:calc(41px + var(--vz-pad,0px));right:0;top:-4px;border-top:1px solid var(--line);pointer-events:none}
.vz-tap .vz-row::before{content:none}
  .vz-still .vz-rows{cursor:default}
  .vz-row{display:grid}
  .vz-fr{grid-area:1/1;display:flex;flex-direction:column;min-width:0;padding-left:var(--vz-pad,0px)}   /* --vz-pad ставит vzFit: подпись вышла за начало строки — сдвигается весь кадр, перевод вместе со словами */
  .vz-line{display:flex;align-items:flex-start;font-family:var(--enf);font-weight:600;font-size:clamp(19px,7cqi,24px);line-height:1.3}
  .vz-spk{position:relative;z-index:2;flex:none;width:44px;height:44px;padding:0;margin:calc(var(--vz-brk-h) + var(--vz-arc-h) + .65em - 22px) 0 -14px -8px;
    display:inline-flex;align-items:center;justify-content:center;border-radius:50%;-webkit-tap-highlight-color:transparent}
  .vz-spk .spk{width:30px;height:30px}
  .vz-spk.play .spk{background:var(--mark-bg);border-color:var(--mark-bg)} .vz-spk.play .spk svg{fill:var(--mark-fg)}
  .vz-s{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
  .vz-gs{display:flex;align-items:flex-start}
  .vz-g{position:relative;display:inline-grid;grid-template-columns:repeat(var(--n),auto);
    grid-template-rows:var(--vz-arc-h) 1.3em var(--vz-bar-h) var(--vz-lbl-h) var(--vz-pos-h);column-gap:.26em;padding:0 var(--vz-gp) 0 calc(var(--vz-gp) + var(--vz-room,0px));
    justify-items:center;color:var(--vz-ink);-webkit-tap-highlight-color:transparent}
  /* --vz-room — место для части речи: когда две части речи одной строки сошлись бы ближе 6 px, vzFit даёт группе поле
     слева, и слова раздвигаются ровно на нехватку (4 октября 2026). Без него поле прежнее; в задании TAP поля нет */
  .vz-w{grid-row:2;white-space:nowrap;color:inherit}
  .vz-end{padding-top:var(--vz-arc-h);margin-left:calc(1px - var(--vz-gp));color:var(--vz-ink)}
  .vz-ru{font-family:var(--ru);font-size:14.5px;line-height:1.3;color:var(--ink-2);padding-left:41px}
  .vz-tap .vz-ru{padding-left:5px}

  /* место в предложении: цвет слов, школьная линия и подпись (как на карточках) */
  .vz-g.subj{color:var(--subj)} .vz-g.pred{color:var(--pred)} .vz-g.obj{color:var(--obj)} .vz-g.adv{color:var(--adv)}
  /* линия выходит за слово на 3 px с каждой стороны (в поле группы) и не короче .8em: под «I» она читается как та же
     линия, что под «The map», а не как дефис. Поля в процентах при расчёте ширины колонки считаются нулём, поэтому линия
     колонку не раздвигает; между линиями соседних групп остаётся 4 px (четвёртый обзор, 3 октября) */
  .vz-bar{grid-row:3;grid-column:1/-1;justify-self:stretch;align-self:start;height:0;margin:2px min(-3px,(100% - .8em) / 2) 0;transform-origin:0 0}
  .subj>.vz-bar{border-bottom:2px solid var(--subj)}
  .pred>.vz-bar{border-bottom:6px double var(--pred)}
  .obj>.vz-bar{border-bottom:2px dashed var(--obj)}
  .adv>.vz-bar{height:2px;background:linear-gradient(to right,var(--adv) 0 9px,transparent 9px 12px,var(--adv) 12px 14px,transparent 14px 17px) 0 0/17px 2px repeat-x}
  /* подпись нулевой ширины: текст по центру своей колонки и может выходить на соседей — колонку слова он не раздвигает.
     Подпись всегда в одну строку (nowrap): «глагол-связка» не переносится по дефису (решение Самата, 4 октября 2026).
     vzFit() (vz.js) сдвигает текст подписи (left у .vz-tx): часть речи — только у края схемы, подпись места — с колонки
     соседа, у которого есть часть речи. */
  .vz-pos,.vz-lbl,.vz-brk-l{display:flex;justify-content:center;width:0;justify-self:center;font-family:var(--ru);font-size:12.5px;line-height:16px;white-space:nowrap;pointer-events:auto}
  .vz-lbl{grid-row:4;grid-column:1/-1;font-weight:700;color:inherit}
  .vz-lbl.vz-ask{color:var(--vz-mute);font-weight:600}
  .vz-pos{grid-row:5;color:var(--vz-mute);font-weight:600;position:relative}
  .vz-tx{display:block;position:relative;z-index:1}   /* текст подписи над рамками соседних групп: касание подписи — её группа */
  /* дуга глагола-связки: мост от середины подлежащего над серединой к середине слов о том, кто оно или какое оно */
  .vz-arc{position:absolute;top:2px;left:0;right:0;height:calc(var(--vz-arc-h) - 3px);border-top:2px solid var(--vz-link);pointer-events:none}
  .vz-arc.a-from{left:calc(50% + var(--vz-room,0px) / 2);border-left:2px solid var(--vz-link);border-top-left-radius:12px}   /* середина слов, а не рамки: поле --vz-room только слева */
  .vz-arc.a-to{right:calc(50% - var(--vz-room,0px) / 2);border-right:2px solid var(--vz-link);border-top-right-radius:12px}
  /* скобка «предложение» над всей строкой, знак в конце включён; подпись над скобкой, от её начала */
  .vz-brk{position:relative;align-self:stretch;height:var(--vz-brk-h)}
  .vz-brk::after{content:"";position:absolute;left:var(--vz-gp);right:0;bottom:3px;height:6px;border:2px solid var(--vz-mute);border-bottom:0;border-radius:3px 3px 0 0}
  .vz-brk-l{position:absolute;left:var(--vz-gp);top:0;justify-content:flex-start;color:var(--vz-mute);font-weight:600;line-height:14px}

  /* шаги: что появится позже, уже занимает место и скрыто (не прозрачность-приглушение, а скрытие до своего шага) */
  .vz-off{opacity:0;visibility:hidden}
  .vz-g.vz-pre{color:var(--vz-ink)}
  .vz-g.vz-pre>:is(.vz-bar,.vz-lbl){opacity:0;visibility:hidden}
  .vz-anim .vz-g{transition:color .35s ease}
  /* звучит группа: подложка --en-bg (цвет английских пилюль курса) только под строкой слов, подписи под ней остаются на
     своём фоне. --wash не годится: в «Песке», «Инее» и «Ночи» он равен --card (третий обзор, 3 октября) */
  .vz-g.play::after{content:"";grid-row:2;grid-column:1/-1;justify-self:stretch;align-self:stretch;margin:-1px calc(-1 * var(--vz-gp));border-radius:8px;background:var(--en-bg);z-index:-1}

  /* подписи шагов копятся списком; место под каждую занято с первого шага */
  .vz-caps{margin:0;padding:0 0 0 1.35em;display:flex;flex-direction:column;gap:1px;font-size:14.5px;line-height:1.5;color:var(--ink)}
  /* одна высота строки у всех подписей (пункт 6): 1.5 — пилюли соседних строк не сходятся ближе 1 px (overlap.js),
     а #main li:has(en) с его 1.64 здесь перебит, иначе подпись с пилюлей шире прочих и экран 320×640 не вмещает схему */
  #main .vz-caps li{padding-left:.15em;line-height:1.5} .vz-caps li::marker{color:var(--vz-mute);font-weight:700}
  .vz-cap{font-size:14.5px;line-height:1.5;color:var(--ink)}
  :is(.vz-caps,.vz-cap) :is(en,.term){white-space:nowrap}   /* группа the map и термин «глагол-связка» не рвутся на две строки */
  .deckwrap:has(figure.vz-tap) .fb en{white-space:nowrap}        /* отклики задания TAP: группа (the key) и предложение — одной пилюлей */
  .deckwrap:has(figure.vz-tap) .fb .term{white-space:nowrap}      /* и термин в отклике («глагол-связка») не рвётся по дефису */
  /* стрелки деки TAP: неактивная стрелка скрыта (место остаётся), чтобы не стоять вплотную к кольцам и не прыгать вниз
     после промаха; в деке из одного задания стрелок не видно совсем */
  .deckcard:has(figure.vz-tap) .darr:disabled{visibility:hidden}
  /* на последней карточке деки TAP стрелка «дальше» делает то же, что «Продолжить», и стоит вплотную к отклику: её нет
     (класс vz-lastcard ставит vzWire; четвёртый обзор, 3 октября) */
  .deckcard.vz-lastcard .darr.nx{visibility:hidden}
  /* «Ночь»: левая полоса отклика-промаха — цвета промаха (правило темы красит полосу любого отклика в --lime) */
  html[data-theme=night] .deckwrap:has(figure.vz-tap) .fb.warn{border-left-color:var(--warn)}
  .vz-ctl{display:flex;align-items:center;justify-content:space-between;gap:10px}
  .vz-cnt{position:relative;font-size:13.5px;font-weight:600;color:var(--vz-mute)}
  /* только для диктора: на последнем шаге счётчик говорит, что шаг последний и что сделает кнопка «Ещё раз» */
  .vz-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  /* рамка кнопки — --vz-mute (≥ 3:1 к --card), как контур слов задания TAP: всё, что в схеме нажимается, обведено одинаково */
  .vz-btn{min-height:44px;min-width:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--vz-mute);background:var(--card);color:var(--ink);font:700 15px var(--ru)}
  .vz-btn:active{background:var(--en-bg)}

  /* задание TAP: только слова; группа — кнопка не меньше 44×44, между группами пустой зазор; линии и подписи —
     у верной группы после ответа (тогда схема совпадает со схемой правила) */
  /* 1 px сверху (было 4): над кольцами и так стоит промежуток деки; на 320×640 отвеченное задание помещается и в темах,
     где облачко Бермет на 2 px выше («Иней», «Пастель»; четвёртый обзор) */
  figure.vz.vz-tap{background:none;border:0;padding:1px 0 0;max-width:100%}
  .vz-tap .vz-gs{gap:8px}
  .vz-tap .vz-g{min-width:44px;min-height:44px;padding:7px var(--vz-gp) 3px;cursor:pointer;justify-content:center;align-content:start}
  .vz-tap .vz-g{grid-template-rows:var(--vz-arc-h) 1.3em 7px var(--vz-bar-h) var(--vz-lbl-h) var(--vz-pos-h)}   /* 7 px: линия и подписи ниже рамки группы */
  .vz-tap .vz-bar{grid-row:4} .vz-tap .vz-lbl{grid-row:5} .vz-tap .vz-pos{grid-row:6}
  /* кольцо — по рамке группы (не меньше 44 px), поэтому кольцо и место касания совпадают для любого слова (пункт 5) */
  .vz-tap .vz-g::before{content:"";position:absolute;left:0;right:0;top:calc(1px + var(--vz-arc-h));height:calc(1.3em + 12px);border-radius:10px;box-shadow:inset 0 0 0 1.5px var(--vz-mute);pointer-events:none}
  .vz-tap .vz-end{margin-left:-5px;padding-top:7px}   /* точка в 3 px от кольца: зазор между группами 8 px */
  .vz-tap .vz-g:not(.vz-ok){color:var(--vz-ink)}
  .vz-tap .vz-g:not(.vz-ok)>:is(.vz-bar,.vz-lbl,.vz-pos,.vz-arc){visibility:hidden}
  .vz-tap .vz-g.warn::before{box-shadow:inset 0 0 0 2px var(--warn)}
  .vz-tap .vz-g.vz-ok::before{box-shadow:inset 0 0 0 3px var(--good)}
  /* после ответа (vz-done) у остальных групп кольца нет: кольцо остаётся одно, у ответа (пункт 4) */
  .vz-tap.vz-done .vz-g:not(.vz-ok)::before{box-shadow:none}
  /* фокус с клавиатуры — по видимому кольцу, не по всей сетке группы с пустыми дорожками (пункт 9) */
  .vz-tap .vz-g:focus-visible{outline:none}
  .vz-tap .vz-g:focus-visible::before{outline:2px solid var(--blue);outline-offset:2px}
  .vz-q{font-size:15.5px}
  /* высокий контраст (forced-colors): box-shadow браузер убирает, поэтому кольца задания TAP рисуются рамкой */
  @media (forced-colors:active){
    .vz-tap .vz-g::before{box-shadow:none;box-sizing:border-box;border:1.5px solid ButtonText}
    .vz-tap .vz-g.warn::before,.vz-tap .vz-g.vz-ok::before{border:3px solid Highlight}
    .vz-tap.vz-done .vz-g:not(.vz-ok)::before{border:0}}

  /* ── пошаговая схема (4 октября 2026, DESIGN.md §17): SVG по замеру (vz.js, vzdLayout), вид пробы
     visuals/reference/trial-2026-10-04.html. Цвета членов предложения — как на карточках (--subj, --pred, --obj);
     уровень слова — серый (части речи без цвета, правило серии); ошибка — --vzd-warn: тёмный красный, который держит
     4,5:1 как текст заметки на --card (--warn темы — 3,6–3,9:1). Всё в px: 1 px схемы = 1 px экрана. */
  :root{--vzd-warn:#C0392B;--vzd-word:#5F5E5A;--vzd-word-bg:#F1EFE8}
  html[data-theme=night]{--vzd-warn:#FF8A7A;--vzd-word:#B4B2A9;--vzd-word-bg:#2A2A27}
  /* пошаговая схема (7 октября 2026, Самат: «Bermet's avatar is inside the card sometimes and sometimes it is outside»):
     белая карточка — только рисунок (.vzd-stage::before); реплика Бермет и кнопки шага стоят под ней на странице, как
     пузырь Бермет над карточкой задания, поэтому её лицо — у края колонки, как на всех экранах */
  figure.vzd{gap:10px;padding:0;background:none;border:0;border-radius:0;position:relative;z-index:0}
  figure.vzd .vzd-stage{margin:10px 12px}
  figure.vzd .vzd-stage::before{content:"";position:absolute;inset:-10px -12px;background:var(--card);border:1px solid var(--line);border-radius:14px;z-index:-1}
  figure.vzd .vzd-say{margin-top:2px}
  figure.vzd .vzd-ctl{margin:0;padding:0}   /* у схемы больше нет поля карточки: ряд кнопок — ровно по ширине колонки */
  .vzd-fig{cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:10px;touch-action:manipulation;user-select:none;-webkit-user-select:none}
  .vzd-fig[aria-disabled=true]{cursor:default}
  .vzd-fig:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
  .vzd-svg{display:block;overflow:visible}
  .vzd-svg .c-subj{--c:var(--subj)} .vzd-svg .c-pred{--c:var(--pred)} .vzd-svg .c-obj{--c:var(--obj)} .vzd-svg .c-adv{--c:var(--adv)}
  .vzd-svg .c-warn{--c:var(--vzd-warn)} .vzd-svg .c-word{--c:var(--vzd-word)} .vzd-svg .c-ink{--c:var(--ink)}
  .vzd-w{font-family:var(--enf);font-weight:600;fill:var(--ink)}
  .vzd-chip-b{fill:var(--vzd-word-bg);stroke:var(--vzd-word);stroke-width:1}
  .vzd-chip-t{font:700 12px var(--ru);fill:var(--vzd-word)}
  .vzd-lead{stroke:var(--vzd-word);stroke-width:1.2;stroke-dasharray:2 3}
  .vzd-tier-t{font:800 12px var(--ru);letter-spacing:.04em}
  .vzd-tier.w .vzd-tier-b{fill:var(--vzd-word-bg);stroke:var(--vzd-word);stroke-width:1}
  .vzd-tier.w .vzd-tier-t{fill:var(--vzd-word)}
  .vzd-tier.s .vzd-tier-b{fill:var(--ink)}
  .vzd-tier.s .vzd-tier-t{fill:var(--card)}
  .vzd-ring{fill:none;stroke:var(--c);stroke-width:2.4}
  .vzd-ring.vzd-dash{stroke-dasharray:5 4}
  .vzd-ul{stroke:var(--c);stroke-width:3.5;stroke-linecap:round}
  .vzd-lab{font:800 12.5px var(--ru);fill:var(--c)}
  .vzd-q{font:700 12px var(--ru);fill:var(--vz-mute)}
  .vzd-note{font:800 12.5px var(--ru);fill:var(--c)}
  .vzd-arr{fill:none;stroke:var(--c);stroke-width:2;stroke-linecap:round}
  .vzd-head{fill:var(--c)}
  .vzd-mk{fill:none;stroke:var(--c);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
  .vzd-tr{font:600 14px var(--ru);fill:var(--ink-2)}
  /* шаги: pre — ещё не пришло, gone — ушло. Новое слово падает сверху, ушедшее уходит вниз; кольцо, линия и стрелка
     рисуются (pathLength 100: штрих 101 закрывает весь контур, без щели у начала); подписи появляются после них */
  .vzd-svg [data-s]{transition:opacity .35s ease,transform .5s cubic-bezier(.2,.8,.2,1)}   /* длительности — VZD_PD в vz.js */
  .vzd-svg .pre,.vzd-svg .gone{opacity:0}
  .vzd-svg .vzd-w.pre{transform:translateY(-24px)} .vzd-svg .vzd-w.gone{transform:translateY(20px)}
  .vzd-svg .vzd-draw{stroke-dasharray:101 200;stroke-dashoffset:0;transition:stroke-dashoffset .55s ease,opacity 0s}
  .vzd-svg .vzd-draw.pre{stroke-dashoffset:101;transition:none} .vzd-svg .vzd-draw.gone{transition:opacity .3s ease}
  .vzd-svg .vzd-late.on{transition-delay:.3s}
  .vzd-now .vzd-svg [data-s]{transition:none!important}
  /* строка шага (обзор экранов, 6 октября 2026): слова, которого на шаге нет, место не держит; на шаге, где оно входит, слова
     и всё, что к ним привязано, едут на новые места (vz.js: обёртки .vzd-sh, сдвиг по шагам в data-dx) */
  .vzd-svg .vzd-sh{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
  .vzd-now .vzd-svg .vzd-sh{transition:none!important}
  /* реплика Бермет: у каждого шага своё место в одной клетке, видна реплика текущего шага, высота — по самой длинной.
     Подсказки шагов-догадок стоят в той же клетке: высота схемы одна и с подсказкой (6 октября 2026) */
  .vzd-say{display:grid}
  .vzd-st{grid-area:1/1;visibility:hidden} .vzd-st.on{visibility:visible}
  /* темп (6 октября 2026): реплика нового шага проявляется последней, после картинки (vz.js ставит задержку); подсказка
     догадки проявляется сразу. При «Уменьшить движение» базовый CSS снимает анимацию — реплика стоит сразу */
  .vzd-st.vzd-in{animation:vzdsay .35s ease-out both}
  @keyframes vzdsay{from{opacity:0}to{opacity:1}}
  .vzd-now .vzd-st{animation:none!important}
  /* подсказка к неверной цели — вид попытки: пузырь Бермет на фоне промаха, как отклик-промах задания */
  .vzd-hint .ln .what{background:var(--warn-bg);border-left-color:var(--warn)}
  .vzd-say .ln{grid-template-columns:28px 1fr;gap:0 8px} .vzd-say .ln .av{width:28px;height:28px}
  .vzd-say .ln .what{font-size:15px;padding:8px 11px;line-height:1.45}
  /* английская пилюля (the map, a doctor) и термин (глагол-связка) в реплике не рвутся на две строки (5 октября 2026) */
  .vzd-say :is(en,.term){white-space:nowrap}
  /* реплика с одной английской пилюлей (Слово sorry осталось на месте.): правило движка .ln .what>en:only-child снимает
     с неё подложку — оно для реплики героя целиком по-английски. В реплике Бермет у схемы пилюля та же, что и рядом (5 октября 2026) */
  .vzd-say .ln .what>en:only-child{background:var(--en-bg);padding:.02em .38em;font-size:.98em} .vzd-say .ln .what>en:only-child.play{background:var(--mark-bg);color:var(--mark-fg)}
  /* стрелка «‹» (шаг назад) слева, счётчик посередине, одна главная кнопка справа: стрелка «›» (шаг вперёд), а на последнем
     шаге — она же «↺ Ещё раз» словами (6 октября 2026; отдельной кнопки «Ещё раз» нет; Самат: «replace Шаг назад and Шаг
     вперед with arrows only»). Стрелки — круглые кнопки 48 px; на последнем шаге главная кнопка шире, по надписи. В
     шаге-догадке счётчик — «Угадай», главная кнопка выключена. Ряд в одну строку на любой ширине.
     Ряд кнопок липнет к низу окна над нижней панелью (5 октября 2026): на высокой схеме (360×660) главная кнопка иначе уходит
     под панель, и до неё надо листать. Место в потоке прежнее, высота экрана не меняется (t3 меряет то же); когда ряд
     прилип и лежит поверх конца реплики, у него тень сверху (vz.js, vzdStick). --vzd-bot — высота нижней панели (vz.js) */
  .vzd-ctl{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;position:sticky;bottom:calc(var(--vzd-bot,72px) + 6px);z-index:4;
    background:var(--paper,var(--card));margin:0 -6px;padding:0 6px;border-radius:12px}
  .vzd-ctl.vzd-stuck{box-shadow:0 -10px 12px -8px rgba(0,0,0,.28)}
  .vzd-cnt{flex:1 1 auto;min-width:0;text-align:center;font-size:13.5px;font-weight:600;color:var(--vz-mute);font-variant-numeric:tabular-nums;white-space:nowrap}
  .vzd-ctl button{flex:none;min-height:44px;min-width:44px;padding:0 12px;border-radius:999px;border:1.5px solid var(--vz-mute);background:var(--card);color:var(--ink);font:800 15px var(--ru);white-space:nowrap}
  .vzd-ctl button:disabled{opacity:.4;cursor:default}
  .vzd-ctl .vzd-back,.vzd-ctl .vzd-next:not(.vzd-last){width:48px;min-width:48px;padding:0;display:inline-grid;place-items:center}   /* галочка — ровно посередине круга (у «‹» без grid она прижималась влево) */
  .vzd-ctl button svg{width:22px;height:22px;display:block} .vzd-ctl .vzd-back svg{transform:scaleX(-1)}
  .vzd-ctl .vzd-back:not(:disabled):active{background:var(--en-bg)}
  /* главная кнопка — тёмная, цвета текста: 4,5:1 в каждой теме (--mark-bg с --mark-fg в «Инее» и «Пастели» — 3,8–4,0:1) и
     не спорит с лаймовой «Продолжить» внизу экрана */
  .vzd-ctl .vzd-next{display:inline-grid;align-items:center;justify-items:center;background:var(--ink);border-color:var(--ink);color:var(--card)}
  .vzd-next>span{grid-area:1/1} .vzd-next .vzd-l2,.vzd-next.vzd-last .vzd-l1{display:none} .vzd-next.vzd-last .vzd-l2{display:inline}
  /* счётчик — «1 из 6» (диктор слышит «Шаг 1 из 6»); уже 312 px (360 px) надпись «↺ Ещё раз» чуть плотнее */
  @container (max-width:311px){.vzd-ctl .vzd-next.vzd-last{font-size:14px;padding:0 9px}}
  /* «Продолжить» нижней панели появляется, когда каждая схема экрана дошла до последнего шага (vz.js, vzdGate), — плавно */
  @keyframes vzdReveal{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  #next.vzd-reveal{animation:vzdReveal .35s ease-out both}
  @media (prefers-reduced-motion:reduce){#next.vzd-reveal{animation:none}}
  /* шаг-догадка (6 октября 2026): цели — HTML-кнопки поверх SVG (.vzd-tg рядом с .vzd-fig, vz.js ставит их по замеру).
     Кнопка — место касания 44 px; видно кружок-место 24 px с «+» (в тесной схеме — 20 px, vz.js --vzd-sld; у крайнего
     кружка место касания сдвинуто внутрь карточки, кружок стоит на --cx) или пунктирную рамку вокруг слова. Промах — цель
     вздрагивает (280 мс) и краснеет; после двух промахов верная цель мягко пульсирует три раза (не по кругу) и остаётся
     обведённой. При «Уменьшить движение» базовый CSS снимает движение, обводка остаётся */
  .vzd-stage{position:relative}
  .vzd-tg{position:absolute;left:0;top:0;width:100%;height:0;pointer-events:none;z-index:2}
  .vzd-tg button{position:absolute;height:44px;padding:0;margin:0;border:0;background:none;cursor:pointer;pointer-events:auto;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
  .vzd-tg button::before{content:"";position:absolute;box-sizing:border-box;pointer-events:none}
  .vzd-tg .vzd-slot::before{content:"+";left:var(--cx,50%);top:50%;width:var(--vzd-sld,24px);height:var(--vzd-sld,24px);margin:calc(var(--vzd-sld,24px) / -2) 0 0 calc(var(--vzd-sld,24px) / -2);
    border-radius:50%;border:2px dashed var(--vz-mute);background:var(--card);color:var(--vz-mute);display:grid;place-items:center;font:800 calc(var(--vzd-sld,24px) * .7)/1 var(--ru)}
  .vzd-tg .vzd-pick::before{left:var(--bl);width:var(--bw);top:var(--bt);height:var(--bh);border:1.5px dashed var(--vz-mute);border-radius:var(--br,9px)}   /* рамка — форма кольца (vz.js, 7 октября 2026) */
  .vzd-tg button:hover::before{border-color:var(--ink);color:var(--ink)}
  .vzd-tg button:focus-visible{outline:none}
  .vzd-tg button:focus-visible::before{outline:2px solid var(--blue);outline-offset:2px}
  .vzd-tg button.no{animation:vzdshake .28s ease-in-out}
  .vzd-tg button.no::before{border-style:solid;border-color:var(--vzd-warn);color:var(--vzd-warn)}
  .vzd-tg button.cue::before{border:2.5px solid var(--pred);color:var(--pred);animation:vzdcue 1.1s ease-in-out 3}
  @keyframes vzdshake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
  @keyframes vzdcue{50%{transform:scale(1.15)}}
  .vzd-guess .vzd-fig{cursor:default}
  /* режим правок: видны реплики всех шагов, по порядку, — их можно выбрать и поправить */
  body.rv .vzd-say{gap:6px} body.rv .vzd-st{grid-area:auto;visibility:visible}
  /* ── pictures.css — места рисунков (3 октября 2026, renderer/pictures.py, реестр art/a1-pictures.yaml). build.py добавляет
     файл только в сборки с блоком «::: рисунок». Рамка — настоящий размер рисунка: экран меряется так же, как с картинкой.
     Есть файл art/pictures/<id>.webp — в рамке картинка (.has-img), размер тот же. */
  .pic{margin:0;flex:none;position:relative;overflow:hidden;box-sizing:border-box;background:var(--wash);border:1.5px dashed var(--ink-3);color:var(--ink-2)}
  .pic.has-img{background:none;border:0}
  .pic img{display:block;width:100%;height:100%;object-fit:cover}
  .pic-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px 14px;text-align:center}
  .pic-t{font-size:13px;line-height:1.35;font-weight:600;color:var(--ink-2)}
  .pic-id{font:11px/1.2 var(--mono,monospace);color:var(--ink-2);display:none}
  body.rv .pic-id{display:block}   /* id рисунка — только в режиме правок; ученик видит в рамке одно описание (обзор экранов, 6 октября 2026) */
  .pic-ph svg{width:62%;height:62%}
  /* сцена: по правилу картинок сцен (.art, --arth 170 px, 3:2, одна высота на все телефоны); тесный экран — pic_h в раскладке */
  .pic-wide{align-self:center;width:255px;height:170px;max-width:100%;border-radius:14px}
  .pic-side .pic-ph,.pic-tile .pic-ph,.pic-row .pic-ph{padding:0}
  .pic-side{width:64px;height:64px}
  .pic-tile{width:40px;height:40px} .pic-row{width:44px;height:44px}
  .pic-face{border-radius:50%} .pic-object{border-radius:10px}
  /* лицо или предмет слева от абзаца: карточка героя */
  .pic-side-row{display:flex;align-items:center;gap:12px}
  .pic-side-row>p{flex:1;min-width:0;margin:0}
  /* READ: ряд рамок между подводкой и текстом */
  .pic-strip{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
  /* WORDS: рисунок слева в плитке слова, на месте динамика; динамик — значком на углу рисунка (вся плитка звучит по нажатию).
     Справа от слова рисунок отнимал у слова место: на 360 px в две колонки helmet и «уставший» налезали на рамку.
     Рисунок 40 px и поля плитки 6 px сверху и снизу: плитка с рисунком не выше плитки без него (56 px), экран слов не растёт.
     Рисунок и значок — в одной коробке .vr-pic: значок встаёт от правого нижнего угла рисунка и выходит за него на 4 px
     при промежутке 8 px, так что до слова остаются 4 px при любых полях плитки (раньше left:38px от края плитки — впритык) */
  .vr.has-pic{grid-template-columns:40px minmax(0,1fr);gap:0 8px;padding-top:6px;padding-bottom:6px}
  .vr.has-pic>.vr-pic{grid-column:1;grid-row:1/3;align-self:center;position:relative;width:40px;height:40px}
  .vr-pic>.spk{position:absolute;right:-4px;bottom:-3px;width:20px;height:20px;z-index:1}
  .vr-pic>.spk svg{width:11px;height:11px}

