/* reknow.ru: механики ответа rkw (specs/rkw-mechanics). Только на неэкзаменационных
   страницах (html[data-rkw]); цвета — токены темы (светлая и тёмная). */
:root{--rkw-c1:var(--primary);--rkw-c2:var(--pow);--rkw-c3:var(--hint);--rkw-c4:var(--ok);--rkw-r:14px}
@media screen{.rkw-on .rkw-src,.rkw-on .rkw-fb{display:none!important}
  .rkw-listen .expr .rkw-fb,.rkw-listen .prompt .rkw-fb{display:none!important}}
@media print{.rkw,.rkw-kinds,.rkw-kchip,.rkw-zones,.rkw-keys,.rkw-unit{display:none!important}
  .rkw-src{display:revert!important}.rkw-fb{display:inline!important}}

.rkw{margin:16px 0 4px}
.rkw-head{margin:0 0 10px}
.rkw-tip{margin:0;font-size:14px;line-height:1.45;color:var(--muted)}
.rkw-tip.rkw-warn{color:var(--bad);font-weight:700}
.rkw-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:12px;min-height:24px}
.rkw-score{font-weight:800;font-size:15px;color:var(--primary-ink);margin-right:auto}
.rkw-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rkw button{font:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.rkw button:focus{outline:none}
.rkw button:focus-visible,.rkw .rkw-svg:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.rkw-fix{margin-left:auto;padding-left:8px;font-size:12.5px;font-weight:800;color:var(--bad);overflow-wrap:anywhere;min-width:0}
.rkw-chip,.rkw-card,.rkw-tog{flex-wrap:wrap}
.rkw-ok{border-color:var(--ok)!important;background:var(--ok-bg)!important}
.rkw-bad{border-color:var(--bad)!important;background:var(--bad-bg)!important}
.rkw-miss{border-color:var(--ok)!important;border-style:dashed!important}
.rkw-again,.rkw-recheck{min-height:44px}

/* ---- чип механики в шапке карточки и полоса слева ---- */
.rkw-kchip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;letter-spacing:.02em;
  padding:3px 9px;border-radius:99px;background:var(--primary-soft);color:var(--primary-ink);margin-left:6px}
.rkw-kchip::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.7}
.qcard[data-rkw-k]{box-shadow:inset 4px 0 0 var(--primary)}
.qcard[data-rkw-k="stolby"],.qcard[data-rkw-k="seriya"]{box-shadow:inset 4px 0 0 var(--pow)}
.qcard[data-rkw-k="pryamaya"],.qcard[data-rkw-k="polya"]{box-shadow:inset 4px 0 0 var(--hint)}
.qcard[data-rkw-k="sborka"],.qcard[data-rkw-k="marker"],.qcard[data-rkw-k="slushai"]{box-shadow:inset 4px 0 0 var(--ok)}

/* ---- «В теме: N видов заданий» ---- */
.rkw-kinds{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 10px}
.rkw-kl{font-size:13px;color:var(--muted);font-weight:700;margin-right:2px}
.rkw-kb{font:inherit;font-size:13px;font-weight:700;padding:6px 11px;min-height:34px;border-radius:99px;cursor:pointer;
  border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.rkw-kb .rkw-kn{color:var(--muted);font-weight:800;margin-left:3px}
.rkw-kb[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-accent,#fff)}
.rkw-kb[aria-pressed="true"] .rkw-kn{color:inherit;opacity:.8}

/* ---- карточки, фишки, переключатели — общий вид ---- */
.rkw-card,.rkw-chip,.rkw-tog,.rkw-tile,.rkw-colh,.rkw-ynb,.rkw-step,.rkw-play,.rkw-key{
  min-height:44px;box-sizing:border-box;border:2px solid var(--line);border-radius:12px;background:var(--surface);
  color:var(--ink);cursor:pointer;text-align:left;line-height:1.35;transition:border-color .15s,background-color .15s,transform .15s}
.rkw-card:hover:not(:disabled),.rkw-chip:hover:not(:disabled),.rkw-tog:hover:not(:disabled),.rkw-tile:hover:not(:disabled),
.rkw-colh:hover:not(:disabled),.rkw-ynb:hover:not(:disabled){border-color:var(--primary)}
.rkw button:disabled{cursor:default}
.rkw-sel{border-color:var(--primary)!important;background:var(--primary-soft)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 22%,transparent)}
.rkw-t{min-width:0;overflow-wrap:anywhere}

/* Лента */
.rkw-lenta{list-style:none;margin:0;padding:0 0 0 18px;display:flex;flex-direction:column;gap:8px;position:relative}
.rkw-lenta::before{content:"";position:absolute;left:5px;top:-6px;bottom:-6px;width:3px;border-radius:3px;
  background:linear-gradient(180deg,var(--primary),var(--pow))}
.rkw-li{position:relative}
.rkw-li::before{content:"";position:absolute;left:-17px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;
  background:var(--surface);border:3px solid var(--primary)}
.rkw-li.rkw-over .rkw-card{border-style:dashed;border-color:var(--primary)}
.rkw-card{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;font-size:15px}
.rkw-pos{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;border-radius:8px;
  background:var(--primary-soft);color:var(--primary-ink);font-weight:800;font-size:14px}
.rkw-grip{flex:none;width:10px;height:16px;opacity:.45;
  background:radial-gradient(circle,var(--muted) 1.4px,transparent 1.6px) 0 0/5px 5px}
.rkw-end{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:2px 0 6px 18px}
.rkw-end+.rkw-lenta+.rkw-end{margin:8px 0 0 18px}
.rkw-dragging .rkw-card{cursor:grabbing}

/* Раскладка */
.rkw-tray{display:flex;flex-wrap:wrap;gap:8px;min-height:50px;padding:10px;border:2px dashed var(--line);border-radius:var(--rkw-r);
  background:var(--bg);margin-bottom:12px}
.rkw-empty{font-size:13.5px;color:var(--muted);align-self:center}
.rkw-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;font-size:15px;max-width:100%}
.rkw-l{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;border-radius:7px;
  background:var(--primary-soft);color:var(--primary-ink);font-weight:800;font-size:13px}
.rkw-cols{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:10px}
.rkw-col{display:flex;flex-direction:column;gap:6px;min-width:0;padding:8px;border-radius:var(--rkw-r);
  background:color-mix(in srgb,var(--c) 9%,var(--surface));border:2px solid color-mix(in srgb,var(--c) 30%,var(--line))}
.rkw-col.rkw-over{border-color:var(--c);border-style:dashed}
.rkw-colh{display:flex;align-items:center;gap:8px;padding:8px 10px;font-weight:800;font-size:14px;
  border-color:color-mix(in srgb,var(--c) 45%,var(--line))}
.rkw-colh .rkw-n{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;
  background:var(--c);color:var(--on-accent,#fff);font-size:13px}
.rkw-cnt{margin-left:auto;font-size:12.5px;color:var(--muted)}
.rkw-picking .rkw-colh:not(:disabled){border-style:dashed;border-color:var(--c)}
.rkw-drop{display:flex;flex-direction:column;gap:6px;min-height:36px}
.rkw-drop .rkw-chip{width:100%}

/* Несколько верных */
.rkw-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.rkw-tog{display:flex;align-items:center;gap:10px;padding:9px 12px;font-size:15px}
.rkw-box{flex:none;width:22px;height:22px;border-radius:7px;border:2px solid var(--line);background:var(--surface);position:relative}
.rkw-tog[aria-pressed="true"]{border-color:var(--primary);background:var(--primary-soft)}
.rkw-tog[aria-pressed="true"] .rkw-box{background:var(--primary);border-color:var(--primary)}
.rkw-tog[aria-pressed="true"] .rkw-box::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;
  border:solid var(--on-accent,#fff);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.rkw-plain{opacity:.75}

/* Найди в тексте */
.rkw-text{font-size:18px;line-height:2.05;margin:0}
.rkw-tok{font:inherit;padding:1px 3px;margin:0 -1px;border:0;border-radius:6px;background:none;color:var(--ink);cursor:pointer;
  min-height:0;box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--primary) 30%,transparent)}
.rkw-tok:hover:not(:disabled){background:var(--primary-soft)}
.rkw-tok[aria-pressed="true"]{background:color-mix(in srgb,var(--hint) 30%,transparent);box-shadow:inset 0 -3px 0 var(--hint)}
.rkw-tok.rkw-ok{background:var(--ok-bg)!important;box-shadow:inset 0 -3px 0 var(--ok)}
.rkw-tok.rkw-bad{background:var(--bad-bg)!important;box-shadow:inset 0 -3px 0 var(--bad);text-decoration:line-through}
.rkw-tok.rkw-miss{background:none!important;box-shadow:inset 0 0 0 2px var(--ok);border-style:none!important}

/* Серия */
.rkw-ser{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;counter-reset:rs}
.rkw-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:center;padding:10px 12px;
  border:2px solid var(--line);border-radius:var(--rkw-r);background:var(--surface);counter-increment:rs}
.rkw-row>.rkw-t::before{content:counter(rs) ") ";font-weight:800;color:var(--primary-ink)}
.rkw-yn{display:flex;gap:6px}
.rkw-ynb{padding:8px 12px;font-weight:700;font-size:14px;text-align:center;min-width:84px}
.rkw-ynb[aria-pressed="true"].rkw-yn1{border-color:var(--ok);background:var(--ok-bg)}
.rkw-ynb[aria-pressed="true"].rkw-yn0{border-color:var(--bad);background:var(--bad-bg)}
.rkw-why{grid-column:1/-1;font-size:13.5px;color:var(--muted)}

/* Сборка */
.rkw-line{display:flex;flex-wrap:wrap;gap:6px;min-height:52px;padding:8px;border-radius:var(--rkw-r);
  border:2px solid var(--primary);background:var(--primary-soft);margin-bottom:10px;align-items:center}
.rkw-slot{display:inline-block;width:46px;height:34px;border-radius:9px;border:2px dashed color-mix(in srgb,var(--primary) 40%,var(--line))}
.rkw-shelf{display:flex;flex-wrap:wrap;gap:8px}
.rkw-tile{padding:8px 14px;font-family:var(--mono);font-size:16px;text-align:center}
.rkw-tile.rkw-ghost{opacity:.25;border-style:dashed;cursor:default;display:inline-flex;align-items:center}
.rkw-tile.rkw-in{background:var(--surface)}

/* Поля */
.rkw-polya{font-size:17px;line-height:2.4}
.rkw-pt{white-space:normal}
.rkw-f{font-family:var(--mono);font-size:17px;text-align:center;padding:6px 6px;margin:0 4px;min-height:40px;box-sizing:border-box;
  border:2px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);vertical-align:middle}
.rkw-f:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 20%,transparent)}

/* Прямая */
.rkw-scale{display:flex;flex-direction:column;align-items:center;gap:6px}
.rkw-val{font-size:15px;color:var(--ink);min-height:22px}
.rkw-scrow{display:flex;align-items:center;gap:8px;width:100%;justify-content:center}
.rkw-svg{width:100%;max-width:640px;height:auto;touch-action:none;cursor:pointer;user-select:none;-webkit-user-select:none}
.rkw-sc-thermo .rkw-svg,.rkw-sc-beaker .rkw-svg{max-width:160px;max-height:340px}
.rkw-step{flex:none;width:44px;font-size:22px;font-weight:800;text-align:center;padding:0}
.rkw-svg .rkw-ax,.rkw-svg .rkw-tube{fill:none;stroke:var(--muted);stroke-width:2.5}
.rkw-svg .rkw-bulb{fill:var(--bad);opacity:.85}
.rkw-svg .rkw-tk{stroke:var(--muted);stroke-width:2}
.rkw-svg .rkw-lb{fill:var(--ink);font-family:var(--sans);font-size:15px}
.rkw-sc-thermo .rkw-lb,.rkw-sc-beaker .rkw-lb{font-size:16px}
.rkw-svg .rkw-hit{fill:transparent}
.rkw-svg .rkw-dot{fill:var(--primary);stroke:var(--surface);stroke-width:2}
.rkw-svg .rkw-needle{stroke:var(--primary);stroke-width:4;stroke-linecap:round}
.rkw-svg .rkw-fill{fill:color-mix(in srgb,var(--primary) 30%,transparent)}
.rkw-sc-thermo .rkw-fill{fill:var(--bad);opacity:.8}
.rkw-svg .rkw-right{fill:var(--ok);stroke:var(--ok)}
.rkw-svg .rkw-wrong{fill:var(--bad);stroke:var(--bad)}
.rkw-svg .rkw-fill.rkw-right{fill:color-mix(in srgb,var(--ok) 35%,transparent)}

/* Вставка */
.rkw-gap{display:inline-grid;justify-items:center;max-width:100%;vertical-align:baseline;min-width:3.2em;padding:0 6px;margin:0 2px;border-bottom:3px solid var(--primary);
  border-radius:6px 6px 0 0;background:var(--primary-soft);color:var(--primary-ink);font-weight:800;text-align:center}
.rkw-gap>*{grid-area:1/1}
.rkw-gap .rkw-gh{visibility:hidden;text-decoration:none}
.rkw-gap.rkw-try{opacity:.6}
.rkw-gap.rkw-ok{background:var(--ok-bg);border-color:var(--ok);color:var(--ok)}
.rkw-gap.rkw-bad{background:var(--bad-bg);border-color:var(--bad);color:var(--bad);text-decoration:line-through}
.rkw-gapfix{font-weight:800;color:var(--ok)}
.rkw-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.rkw-chips .rkw-chip{font-family:var(--mono);font-size:16px}

/* Зоны */
.rkw-fig{position:relative}
.rkw-zones{position:absolute;pointer-events:none}
.rkw-zone{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;min-width:44px;min-height:44px;border-radius:50%;
  pointer-events:auto;cursor:pointer;border:3px solid var(--primary);background:color-mix(in srgb,var(--primary) 18%,transparent);
  color:var(--primary-ink);font-weight:800;font-size:14px;padding:0}
.rkw-zone.rkw-ok{background:color-mix(in srgb,var(--ok) 30%,transparent)!important}
.rkw-zone.rkw-bad{background:color-mix(in srgb,var(--bad) 30%,transparent)!important}

/* Послушай */
.rkw-slushai{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.rkw-slushai .rkw-tip{flex-basis:100%}
.rkw-play{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;font-weight:800;color:var(--primary-ink)}
.rkw-play:not(.rkw-slow){background:var(--primary);border-color:var(--primary);color:var(--on-accent,#fff)}
.rkw-ico{width:0;height:0;border-left:11px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}

/* Плитки — обычный выбор на неэкзаменационных страницах */
html[data-rkw] .choices.rkw-tiles{gap:10px}
html[data-rkw] .rkw-tiles .choice{position:relative;display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 14px 10px 12px;
  text-align:left;border-radius:14px;font-size:16.5px;transition:border-color .15s,background-color .15s,transform .15s}
html[data-rkw] .rkw-tiles .choice::before{content:attr(data-l);flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:8px;background:var(--primary-soft);color:var(--primary-ink);font-family:var(--sans);
  font-weight:800;font-size:14px}
html[data-rkw] .rkw-tiles .choice.correct::before{content:"✓";background:var(--ok);color:var(--on-accent,#fff)}
html[data-rkw] .rkw-tiles .choice.wrong::before{content:"✕";background:var(--bad);color:var(--on-accent,#fff)}
html[data-rkw] .rkw-tiles.rkw-long{grid-template-columns:minmax(0,1fr)}
p.rkw-why{margin:10px 2px 0;font-size:14px;color:var(--muted)}

/* Поле ответа: единицы и знаки */
html[data-rkw] .numrow{align-items:center}
html[data-rkw] .numrow input{font-size:21px;min-height:52px;width:170px}
.rkw-unit{font-size:16px;font-weight:700;color:var(--muted)}
.rkw-keys{display:flex;justify-content:center;gap:8px;margin-top:8px}
.rkw-key{width:52px;text-align:center;font-family:var(--mono);font-size:20px;font-weight:800;padding:0}

/* Подсказка в две ступени */
.rkw-showsol{display:inline-block;margin-top:8px;font:inherit;font-weight:800;font-size:14px;padding:8px 14px;border-radius:10px;
  border:1px solid var(--line);background:var(--surface);color:var(--primary-ink);cursor:pointer;min-height:40px}
.rkw-sol{margin-top:8px}

/* Результат: галочка и покачивание (≤ 180 мс) */
@keyframes rkw-pop{0%{transform:scale(.6);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes rkw-shake{0%,100%{transform:translateX(0)}33%{transform:translateX(-5px)}66%{transform:translateX(5px)}}
.fb.rkw-yes{animation:rkw-pop .18s ease-out}
.fb.rkw-no{animation:rkw-shake .18s ease-in-out}

/* Узкий экран: всё в столбик, цели касания ≥ 44 px */
@media (max-width:520px){
  .rkw-cols{grid-template-columns:minmax(0,1fr)}
  .rkw-grid{grid-template-columns:minmax(0,1fr)}
  .rkw-row{grid-template-columns:minmax(0,1fr)}
  .rkw-yn .rkw-ynb{flex:1}
  .rkw-text{font-size:17px}
  .rkw-scrow .rkw-step{width:40px}
  .rkw-kchip{display:none}
}
@media (prefers-reduced-motion:reduce){
  .rkw *,.rkw-tiles .choice{transition:none!important;animation:none!important}
  .fb.rkw-yes,.fb.rkw-no{animation:none}
}