/* ═══ ВКЛАДКА «КУРСЫ» ═══════════════════════════════════════════════════════
   Уроки ступени, бесплатные уроки, витрина ступеней. Своей вёрстки здесь
   почти нет: списки уроков рисует рядыУроков() и они приезжают со всеми
   стилями .msplan / .msurow / .stepgo из cabinet.css и styles-кабинет.css.

   Этот файл нужен ровно для трёх вещей:
   1) вернуть вид экрану урока, который во вкладке переименован (см. ниже);
   2) полоса «сколько пройдено» внутри карточки списка;
   3) витрина ступеней — строки с волосяной линией, не стопка плашек.

   Подключать ПОСЛЕ cabinet.css и styles-кабинет.css: правила ниже перебивают
   именно их, и порядок здесь несущий.

   Язык системы соблюдаем буквально: ни одного своего цвета (только токены
   system.css), перечисление — строки с волосяной линией, иконок-эмодзи нет,
   плотный объект на вкладке не заводим (герой на этом экране свободен).
   ────────────────────────────────────────────────────────────────────────── */

/* ── 1. ЭКРАН УРОКА ─────────────────────────────────────────────────────────
   откройУрок() даёт узлу id="msurok", и по этому id его находят ЧУЖИЕ
   правила: styles-кабинет.css гасит .wrap:has(#msurok) .rail, а tabs.js
   считает такой узел вторым уровнем вкладки «Сейчас». Урок, открытый здесь,
   ломал бы рельсу на «Записях» и подсовывал кнопку «назад» на «Сейчас»,
   поэтому tab-kursy.js переименовывает узел в #nzk-urok.

   ⚠️ ПАРА К ЧУЖИМ ПРАВИЛАМ. Ниже дословно повторён вид #msurok из
   cabinet.css («Экран урока: свой, в мини-аппе») и из блока «широкий экран»
   styles-кабинет.css. Меняешь там — меняй здесь. Правило про рельсу НЕ
   повторяем осознанно: рельса живёт в другой вкладке и гасить её незачем. */
#nzk-urok{display:flex;flex-direction:column;gap:10px;margin-top:4px}
#nzk-urok[hidden]{display:none}

/* ── 2. КАРКАС ВКЛАДКИ ──────────────────────────────────────────────────────
   Пока открыт урок, заголовок и списки уступают ему место — тем же способом,
   каким это делает шапкаСтупени() на «Сейчас». display этим узлам мы не
   задаём, но парную строку пишем сразу: поймать потерянный [hidden] дороже,
   чем написать её сейчас. */
#nzk-body[hidden],#nzk-h1[hidden]{display:none}

/* ── 3. «СКОЛЬКО ПРОЙДЕНО» ──────────────────────────────────────────────────
   Полоса — та же .bar, что у чек-листа подготовки: один язык прогресса на
   весь кабинет. Своей карточки (.prog) вокруг не заводим — она стояла бы
   стеклом внутри стекла.

   Отступы руками: styles-кабинет.css снимает у .msplan gap, как только внутри
   появляются ряды уроков (.msplan:has(.msurow){gap:0}), и всё расстояние там
   держат margin'ы соседей. */
.nzk-prog{display:flex;flex-direction:column;gap:6px;margin:2px 0 11px}
.msplan .nzk-prog > span{font-family:var(--mono);font-size:11px;font-weight:500;
  letter-spacing:.09em;text-transform:uppercase;color:var(--taupe);line-height:1.2}

/* ── 4. ВИТРИНА СТУПЕНЕЙ ────────────────────────────────────────────────────
   Рассказ про каждую ступень длиной в экран живёт на /gate одной копией —
   сюда он не переезжает. Здесь список: имя, цена, состав, отметка «открыта».
   Перечисление показываем строками с волосяной линией — тем же приёмом, что
   уроки, а не стопкой карточек.

   gap снимаем и держим отступы margin'ами — ровно как у .msplan с рядами
   уроков, иначе волосяные линии разъезжаются от заголовка на 7px. */
.nzk-vit{gap:0}
.nzk-vit > b{margin-bottom:6px}
.nzk-vit > span{margin-bottom:6px}
.nzk-vit > .msback{margin-top:12px}

.nzk-step{display:flex;flex-direction:column;gap:5px;padding:12px 0;
  border-top:1px solid var(--hair)}
/* Строка ступени: имя слева, цена или отметка — справа. */
.nzk-step .nzk-t{display:flex;align-items:baseline;gap:10px}
.msplan .nzk-step .nzk-t b{flex:1;min-width:0;font-family:var(--font-head);
  font-size:14.5px;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
/* Цена — моноширинным, как везде в системе, где число важнее слова. */
.msplan .nzk-step .nzk-pr{flex:none;font-family:var(--mono);font-size:13px;
  font-weight:600;color:var(--head);line-height:1.2;white-space:nowrap}
/* «Открыта» — зелёный язык «сделано», тот же, что у пройденного урока. */
.msplan .nzk-step .nzk-tag{flex:none;display:inline-flex;align-items:center;
  min-height:22px;padding:0 9px;border-radius:999px;white-space:nowrap;
  font-size:11px;font-weight:650;line-height:1;
  color:var(--ok-ink);background:var(--ok-bg);border:1px solid transparent}
/* Подпись ступени — тело текста, а не мелкая метка. */
.msplan .nzk-step > i{font-style:normal;font-size:13px;line-height:1.55;color:var(--ink2)}
/* Состав тарифа — тихие чипы (.chip из cabinet.css). Свой цвет им не нужен,
   но .msplan span перекрывает кегль и краску чипа — возвращаем их. */
.nzk-tr{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.msplan .nzk-tr > span{display:inline-flex;align-items:center;min-height:24px;
  padding:0 10px;border-radius:999px;white-space:nowrap;
  font-size:11.5px;font-weight:650;line-height:1;
  color:var(--chip-ink);background:var(--chip-bg);border:1px solid var(--chip-line)}
/* Уже открытая ступень — не предложение, а факт: гасим её на полтона. */
.nzk-step.on .nzk-t b{color:var(--ink2)}

/* ── 5. ШИРОКИЙ ЭКРАН ───────────────────────────────────────────────────────
   На вебе .wrap раскрывается до 1320px ради плитки чек-листа. Списки уроков и
   экран урока — это статьи: во всю ширину монитора строка не читается.
   Числа те же, что у #msstage / #msurok в styles-кабинет.css. */
@media (min-width:900px){
  #nzk-urok{max-width:860px;margin-left:auto;margin-right:auto}
  #nzk-urok .ubtn{max-width:420px;margin-left:auto;margin-right:auto}
  #nz-courses > h1,#nzk-body{max-width:860px;margin-left:auto;margin-right:auto}
}

/* ── Занятие интенсива ───────────────────────────────────────────────────────
   Вход в шаги плана — первым блоком вкладки. Панель та же (.msplan), своего
   вида не заводим: список уроков, витрина и занятие — три ответа на один
   вопрос «что у меня есть», и выглядеть они должны одинаково.

   Кнопка тоже готовая (.msback), только тянется на всю ширину: она здесь
   единственная и делить строку ей не с кем. */
.nzk-zan .msback{width:100%;margin-top:2px}
.nzk-zan .msnote{display:block;font-size:12px;color:var(--muted);margin-top:2px}
/* Занятий может быть несколько — каждое своей строкой, разделённые волоском.
   Рамок вокруг строк нет намеренно: панель одна, а внутри перечисление. */
.nzk-zrow{padding:11px 0;border-top:1px solid var(--hair)}
.nzk-zrow:first-of-type{border-top:0;padding-top:4px}
.nzk-zt b{display:block;font-size:14px;font-weight:650;color:var(--ink)}
.nzk-zt i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px}
.nzk-zrow .nzk-prog{margin:8px 0 9px}

/* ═══ МОИ КУРСЫ: ПЛАШКИ И КАРТОЧКА КУРСА ════════════════════════════════════
   Вкладка стала двухуровневой: сверху список курсов, содержимое — внутри.
   Раньше все списки вываливались подряд, и найти в них своё было нельзя. */

.nzk-list{display:flex;flex-direction:column;gap:9px;margin-bottom:var(--s5)}

/* Плашка курса. Кнопка целиком, а не карточка со ссылкой внутри: нажимается
   вся площадь, как в родных списках телефона. */
.nzk-course{display:flex;flex-direction:column;gap:5px;width:100%;text-align:left;
  padding:14px 15px;border:1px solid var(--glass-line);border-radius:var(--r-l);
  background:var(--pane);box-shadow:var(--pane-edge);color:inherit;font:inherit;cursor:pointer;
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%);
  transition:transform var(--dur) var(--ease)}
.nzk-course:active{transform:translateY(1px)}
.nzk-ct{display:flex;align-items:center;justify-content:space-between;gap:10px}
.nzk-ct b{font-family:var(--font-head);font-size:15.5px;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
.nzk-chev{width:18px;height:18px;flex:none;color:var(--dim)}
.nzk-cs{font-size:12.5px;color:var(--muted);line-height:1.45}
/* Полоса пройденного — тот же рисунок, что у .bar в чек-листе. */
.nzk-course .bar{display:block;height:4px;margin-top:4px;border-radius:4px;overflow:hidden;
  background:var(--track)}
.nzk-course .bar i{display:block;height:100%;border-radius:4px;background:var(--bar-fill)}

/* Что можно купить. Тише плашек своих курсов: это предложение, а не то, что
   у человека уже есть. */
.nzk-buy{display:flex;flex-direction:column;gap:8px}
.nzk-bh{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;color:var(--taupe);margin-bottom:2px}
.nzk-brow{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
  text-align:left;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-m);
  background:none;color:inherit;font:inherit;cursor:pointer;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.nzk-brow:hover{border-color:var(--open-line);background:var(--glass-3)}
.nzk-bt{min-width:0}
.nzk-bt b{display:block;font-size:14px;font-weight:650;color:var(--ink)}
.nzk-bt i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px;line-height:1.4}
.nzk-bp{flex:none;font-size:14px;font-weight:700;color:var(--blue);white-space:nowrap}

/* Внутри курса: кнопка возврата, имя, подпись. */
.nzk-back{display:inline-flex;align-items:center;gap:6px;min-height:38px;margin-bottom:var(--s3);
  padding:0 14px 0 10px;border-radius:999px;cursor:pointer;
  border:1px solid var(--btn-line);background:var(--btn-bg);color:var(--btn-ink);
  box-shadow:var(--inset-1);font:inherit;font-size:13px;font-weight:650}
.nzk-back svg{width:16px;height:16px;flex:none}
.nzk-back:active{transform:translateY(1px)}
.nzk-ch{font-family:var(--font-head);font-size:22px;font-weight:700;letter-spacing:-.02em;
  margin:0;color:var(--ink)}
.nzk-cd{font-size:13px;color:var(--muted);line-height:1.5;margin:6px 0 var(--s4)}

/* ── Предложение курса: цена, кнопка и рассказ ───────────────────────────────
   Тот же текст, что на витрине, но внутри приложения. Решение принимают
   наверху (цена и кнопка), подробности читают ниже. */
.nzk-offer{padding:16px;border:1px solid var(--open-line);border-radius:var(--r-l);
  background:var(--open-bg);box-shadow:var(--pane-edge);margin-bottom:var(--s5);
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%)}
.nzk-okick{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;color:var(--blue);margin-bottom:7px}
.nzk-offer .nzk-ch{font-size:21px}
.nzk-offer .nzk-cd{margin:6px 0 0}
.nzk-oprice{display:flex;align-items:baseline;gap:9px;margin:14px 0 0}
.nzk-oprice b{font-family:var(--font-head);font-size:25px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.nzk-oprice s{font-size:13px;color:var(--taupe)}
.nzk-oprice i{font-style:normal;font-size:13px;color:var(--taupe)}
.nzk-obuy{display:flex;align-items:center;justify-content:center;width:100%;margin-top:13px;
  min-height:48px;padding:0 var(--s5);border:0;border-radius:var(--r-m);cursor:pointer;
  font-family:inherit;font-size:14.5px;font-weight:650;color:var(--accent-ink);
  background:var(--accent-bg);
  box-shadow:0 16px 34px -18px var(--accent-glow),inset 0 1px var(--accent-sheen)}
.nzk-obuy:active{transform:translateY(1px)}
.nzk-onote{display:block;font-size:12px;color:var(--taupe);line-height:1.45;margin-top:8px}
.nzk-onote:empty{display:none}

/* Сам рассказ. Разметка приехала с витрины (h2/h3/p/ul) — здесь ей задаётся
   типографика кабинета, чтобы страница не выглядела вставкой из другого мира. */
.nzk-text{color:var(--ink2)}
.nzk-text h2{font-family:var(--font-head);font-size:19px;font-weight:700;letter-spacing:-.02em;
  color:var(--ink);margin:0 0 var(--s3)}
.nzk-text h3{font-family:var(--font-head);font-size:15px;font-weight:700;letter-spacing:-.015em;
  color:var(--ink);margin:var(--s5) 0 var(--s2)}
.nzk-text p{font-size:13.5px;line-height:1.6;margin:0 0 var(--s3)}
/* Маркеры возвращаем явно: общий сброс кабинета гасит их у всех списков, и
   перечисление читалось как набор абзацев со сдвигом. */
.nzk-text ul{list-style:disc;margin:0 0 var(--s3);padding-left:20px}
.nzk-text ol{list-style:decimal;margin:0 0 var(--s3);padding-left:20px}
.nzk-text li::marker{color:var(--dim)}
.nzk-text li{font-size:13.5px;line-height:1.55;margin-bottom:6px}
.nzk-text b{color:var(--ink)}
.nzk-text .pr2{font-weight:650;color:var(--ink)}

/* Вторая кнопка записи — в конце рассказа. Дочитавшему до низа возвращаться
   наверх незачем. */
.nzk-obuy2{margin:var(--s5) 0 0}

/* «Спросить» — плавающая, над нижней навигацией. Не всем нужен длинный текст:
   кому-то проще спросить человека. Живёт только на экране предложения, потому
   что рисуется вместе с ним. */
.nzk-help{position:fixed;right:16px;z-index:55;
  bottom:calc(var(--nzh) + 14px + env(safe-area-inset-bottom,0px));
  display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 16px 0 13px;
  border-radius:999px;cursor:pointer;border:1px solid var(--glass-line);
  background:var(--glass-1);color:var(--ink);box-shadow:var(--shadow-hero);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
  font:inherit;font-size:13.5px;font-weight:650}
.nzk-help svg{width:17px;height:17px;flex:none;color:var(--blue)}
.nzk-help:active{transform:translateY(1px)}

/* ── Консультант по ступеням: шторка снизу ───────────────────────────────────
   Ассистент знает цены и состав, помогает выбрать. Человек — второй шаг, но
   всегда на виду: кнопка «Написать куратору» внизу самой шторки. */
.nzk-sheet{position:fixed;inset:0;z-index:70;display:none;align-items:flex-end;justify-content:center;
  background:var(--scrim);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.nzk-sheet.on{display:flex}
/* ⚠️ ВЫСОТА ЗАДАНА ЯВНО. Шторка тянулась по содержимому, и пустой разговор
   занимал полоску внизу экрана: писать в неё неудобно, ответа не видно.
   Две трети экрана — рабочий минимум для переписки. */
.nzk-sh{width:100%;max-width:460px;height:72vh;max-height:88vh;display:flex;flex-direction:column;
  padding:14px 14px calc(14px + env(safe-area-inset-bottom,0px));
  border-radius:var(--r-l) var(--r-l) 0 0;border:1px solid var(--glass-line);border-bottom:0;
  background:var(--glass-1);box-shadow:var(--shadow-hero);
  -webkit-backdrop-filter:blur(26px) saturate(160%);backdrop-filter:blur(26px) saturate(160%)}
.nzk-shh{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.nzk-shh b{font-family:var(--font-head);font-size:16px;font-weight:700;color:var(--ink)}
.nzk-x{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:50%;
  background:none;color:var(--taupe);cursor:pointer}
.nzk-x svg{width:17px;height:17px}

.nzk-feed{flex:1;min-height:120px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;
  padding:2px 2px 10px}
.nzk-msg{max-width:88%;padding:10px 13px;border-radius:16px;font-size:13.5px;line-height:1.5;
  white-space:pre-wrap;word-break:break-word}
.nzk-msg.me{align-self:flex-end;background:var(--accent-bg);color:var(--accent-ink)}
.nzk-msg.ai{align-self:flex-start;background:var(--glass-3);color:var(--ink2);
  border:1px solid var(--hair)}
/* Ожидание ответа — с бегущими точками: модель думает несколько секунд, и
   без движения человек решает, что нажатие не сработало. */
.nzk-msg.ждёт{color:var(--taupe)}
.nzk-msg.ждёт::after{content:'';display:inline-block;width:1.2em;text-align:left;
  animation:nzkdots 1.2s steps(4,end) infinite}
@keyframes nzkdots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
@media (prefers-reduced-motion:reduce){.nzk-msg.ждёт::after{animation:none;content:'...'}}

.nzk-hello b{display:block;font-family:var(--font-head);font-size:15px;font-weight:700;
  color:var(--ink);margin-bottom:5px}
.nzk-hello span{display:block;font-size:13px;color:var(--muted);line-height:1.5}
.nzk-sug{display:flex;flex-direction:column;gap:7px;margin-top:12px}
.nzk-sug button{text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-m);
  background:none;color:var(--ink2);font:inherit;font-size:12.5px;cursor:pointer}
.nzk-sug button:hover{border-color:var(--open-line);color:var(--ink)}

.nzk-row{display:flex;gap:8px;align-items:flex-end;margin-top:2px}
/* ⚠️ 16px — НЕ КРАСОТА, А ЗАЩИТА ОТ ЗУМА. Safari на iPhone приближает всю
   страницу, когда фокус попадает в поле с кеглем меньше 16px, и человек
   оказывается в увеличенном экране, из которого сам не выберется. */
.nzk-row textarea{flex:1;min-height:44px;max-height:120px;resize:none;padding:11px 13px;
  border:1px solid var(--line);border-radius:var(--r-m);background:var(--glass-3);color:var(--ink);
  font:inherit;font-size:16px;line-height:1.35}
/* ⛔ Обводки на поле не ставим — только рамка контейнера. */
.nzk-row textarea:focus{outline:none;border-color:var(--open-line)}
.nzk-send{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;
  cursor:pointer;color:var(--accent-ink);background:var(--accent-bg);
  box-shadow:0 12px 26px -14px var(--accent-glow)}
.nzk-send:disabled{opacity:.6;cursor:default}
.nzk-send svg{width:18px;height:18px}

.nzk-human{margin-top:10px;min-height:40px;width:100%;border:1px solid var(--line);
  border-radius:var(--r-m);background:none;color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer}
.nzk-human:hover{color:var(--ink);border-color:var(--open-line)}

/* ═══ ЭКРАН ОПЛАТЫ ══════════════════════════════════════════════════════════
   Оплата — конец пути, ради которого человек шёл через рассказ и цену. Экран
   занимает всё, гасит навигацию и говорит по одной вещи за раз: сперва
   «заявка принята», ниже — выбор даты или честное «дат пока нет». */
.nzk-full{position:fixed;inset:0;z-index:95;overflow-y:auto;background:var(--page);
  opacity:0;transition:opacity .22s var(--ease)}
.nzk-full.on{opacity:1}
body.nzk-noscroll{overflow:hidden}
.nzk-fw{max-width:460px;margin:0 auto;
  padding:calc(22px + env(safe-area-inset-top,0px)) 16px calc(28px + env(safe-area-inset-bottom,0px))}
.nzk-fx{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:14px;
  width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:50%;
  background:var(--glass-2);color:var(--ink);cursor:pointer;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.nzk-fx svg{width:17px;height:17px}

/* Салют: холст поверх экрана, кликам не мешает и убирает себя сам. */
.nzk-salut{position:fixed;inset:0;z-index:96;width:100%;height:100%;pointer-events:none}

/* Удачная оплата. Галочка прилетает с отскоком, круг проявляется, штрих
   дорисовывается — три коротких движения подряд читаются как «получилось». */
.nzk-ok{text-align:center;padding:34px 8px 26px}
.nzk-okr{display:block;width:96px;height:96px;margin:0 auto 18px;color:var(--green);
  transform:scale(.55);opacity:0;
  transition:transform .5s cubic-bezier(.2,1.5,.4,1),opacity .3s var(--ease)}
.nzk-full.on .nzk-okr{transform:scale(1);opacity:1}
.nzk-okr svg{width:100%;height:100%}
.nzk-okc{opacity:0;transform:scale(.85);transform-origin:center;
  transition:opacity .3s var(--ease) .05s,transform .35s var(--ease) .05s}
.nzk-okv{stroke-dasharray:34;stroke-dashoffset:34;transition:stroke-dashoffset .45s var(--ease) .25s}
.nzk-full.on .nzk-okc{opacity:1;transform:scale(1)}
.nzk-full.on .nzk-okv{stroke-dashoffset:0}
.nzk-okt{font-family:var(--font-head);font-size:26px;font-weight:700;letter-spacing:-.02em;color:var(--ink);
  opacity:0;transform:translateY(6px);transition:opacity .3s var(--ease) .18s,transform .3s var(--ease) .18s}
.nzk-full.on .nzk-okt{opacity:1;transform:none}
.nzk-oks{font-size:15px;font-weight:650;color:var(--blue);margin-top:6px}
.nzk-okp{font-size:13px;color:var(--muted);line-height:1.55;margin:10px auto 0;max-width:330px}

/* Шаг «когда» — под сообщением об оплате. */
.nzk-step{margin-top:var(--s5)}
.nzk-dh{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;color:var(--taupe);margin-bottom:9px}
.nzk-date{display:flex;flex-direction:column;gap:3px;width:100%;text-align:left;margin-bottom:8px;
  padding:13px 15px;border:1px solid var(--line);border-radius:var(--r-m);background:none;
  color:inherit;font:inherit;cursor:pointer;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.nzk-date:hover{border-color:var(--open-line);background:var(--glass-3)}
.nzk-date:disabled{opacity:.6;cursor:default}
.nzk-dt{font-size:15px;font-weight:650;color:var(--ink)}
.nzk-dn{font-size:12.5px;color:var(--muted)}

/* Дат нет — тоже полноценный экран: значок, объяснение и два пути дальше. */
.nzk-nodates{text-align:center;padding:18px 6px 0}
.nzk-ndi{width:44px;height:44px;color:var(--dim);margin-bottom:12px}
.nzk-nodates b{display:block;font-family:var(--font-head);font-size:19px;font-weight:700;
  letter-spacing:-.02em;color:var(--ink)}
.nzk-nodates p{font-size:13.5px;color:var(--muted);line-height:1.55;margin:8px auto 18px;max-width:330px}
.nzk-nodates .nzk-obuy{margin-top:0}
.nzk-nodates .nzk-obuy:disabled{opacity:.75;cursor:default;box-shadow:none}
/* Второй путь — тише первого: менеджер нужен не всем. */
.nzk-go2{display:flex;align-items:center;justify-content:center;width:100%;min-height:46px;
  margin-top:9px;padding:0 var(--s5);border-radius:var(--r-m);cursor:pointer;
  border:1px solid var(--line);background:none;color:var(--ink2);font:inherit;font-size:14px;font-weight:650}
.nzk-go2:hover{border-color:var(--open-line);color:var(--ink)}

.nzk-pdone{padding:15px;border-radius:var(--r-m);background:var(--ok-bg);text-align:left}
.nzk-pdone b{display:block;font-size:15.5px;font-weight:700;color:var(--ok-ink)}
.nzk-pdone span{display:block;font-size:13px;color:var(--ok-ink);opacity:.85;line-height:1.5;margin-top:4px}

@media (prefers-reduced-motion:reduce){
  .nzk-full{transition:none}
  .nzk-okr,.nzk-okt{opacity:1;transform:none;transition:none}
  .nzk-okc{opacity:1;transform:none;transition:none}
  .nzk-okv{stroke-dashoffset:0;transition:none}
  .nzk-salut{display:none}
}

/* Курс, оплату которого ещё проверяют: он уже мой, но материалов нет. Метка
   рядом с именем, плашка чуть тише — чтобы не спорить с открытыми курсами. */
.nzk-course.wait{border-style:dashed}
.nzk-wtag{flex:none;margin-left:auto;font-size:10.5px;font-weight:650;letter-spacing:.02em;
  padding:3px 9px;border-radius:999px;color:var(--head);
  background:var(--soon-bg);border:1px solid var(--soon-line)}
.nzk-course.wait .nzk-chev{opacity:.5}

/* Не получилось оплатить: тот же экран, но знак и цвет другие — человек должен
   с первого взгляда понимать, что праздника не случилось. */
.nzk-ok.bad .nzk-okr{color:var(--live)}

/* ── Интенсивы внутри курса ─────────────────────────────────────────────────
   У «Мастерской» их много — по одному на продукт. Строка = интенсив: название,
   поток с датой, полоса пройденного. */
.nzk-ih{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;color:var(--taupe);margin:0 0 9px}
.nzk-ih-2{margin-top:var(--s5)}
.nzk-int{display:flex;flex-direction:column;gap:5px;width:100%;text-align:left;margin-bottom:9px;
  padding:14px 15px;border:1px solid var(--glass-line);border-radius:var(--r-l);
  background:var(--pane);box-shadow:var(--pane-edge);color:inherit;font:inherit;cursor:pointer;
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%)}
.nzk-int:active{transform:translateY(1px)}
/* Ещё не мой интенсив — тише и пунктиром: он предложение, а не мой материал. */
.nzk-int.free{background:none;border-style:dashed;box-shadow:none}
.nzk-it{display:flex;align-items:center;justify-content:space-between;gap:10px}
.nzk-it b{font-family:var(--font-head);font-size:15.5px;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
.nzk-is{font-size:12.5px;color:var(--muted)}
.nzk-int .bar{display:block;height:4px;margin-top:4px;border-radius:4px;overflow:hidden;background:var(--track)}
.nzk-int .bar i{display:block;height:100%;border-radius:4px;background:var(--bar-fill)}


/* ═══ «МОИ КУРСЫ»: ПРОДОЛЖИТЬ · СПИСОК · ЧТО ДАЛЬШЕ ═════════════════════════
   Три полосы вместо одного столбца плашек. Раньше «купить» стояло вровень с
   «моё», и человек не отличал своё от предложения. */
.nzk-h{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;color:var(--taupe);margin:0 0 9px 2px}
.nzk-h2{margin-top:var(--s6)}

/* Карточка «продолжить»: единственный акцент экрана. */
.nzk-cont{padding:16px;border:1px solid var(--open-line);border-radius:var(--r-l);
  background:var(--open-bg);box-shadow:var(--pane-edge);margin-bottom:var(--s2);
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%)}
.nzk-cont-t{font-family:var(--font-head);font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.nzk-cont-s{font-size:12.5px;color:var(--muted);margin-top:4px}
.nzk-cont-bar{height:5px;border-radius:5px;overflow:hidden;background:var(--track);margin:12px 0}
.nzk-cont-bar i{display:block;height:100%;border-radius:5px;background:var(--bar-fill)}
.nzk-cont-go{display:flex;align-items:center;justify-content:center;width:100%;min-height:46px;
  margin-top:12px;border:0;border-radius:var(--r-m);cursor:pointer;
  font-family:inherit;font-size:14.5px;font-weight:650;color:var(--accent-ink);
  background:var(--accent-bg);box-shadow:0 16px 34px -18px var(--accent-glow),inset 0 1px var(--accent-sheen)}
.nzk-cont-go:active{transform:translateY(1px)}

/* Остальные свои курсы — строками: их просматривают, а не изучают. */
.nzk-rows{display:flex;flex-direction:column;gap:8px}
.nzk-row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  padding:13px 14px;border:1px solid var(--line);border-radius:var(--r-m);background:none;
  color:inherit;font:inherit;cursor:pointer;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.nzk-row:hover{border-color:var(--open-line);background:var(--glass-3)}
.nzk-row.wait{border-style:dashed}
.nzk-row-t{flex:1;min-width:0}
.nzk-row-t b{display:block;font-size:14.5px;font-weight:650;color:var(--ink)}
.nzk-row-t i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px}

/* Витрина «что дальше»: предложение с ценой и выгодой. */
/* ── Дни на выбор ─────────────────────────────────────────────────────
   Строка = один день: дата крупно, места тихо, действие справа. Занятый день
   остаётся в списке серым — так видно, что набор идёт, просто мест нет.
   ─────────────────────────────────────────────────────────────────────── */
.nzk-dni{display:flex;flex-direction:column;gap:9px;margin-top:14px}
.nzk-den{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
  padding:14px;border:1px solid var(--glass-line);border-radius:var(--r-l);text-align:left;
  background:var(--pane);box-shadow:var(--pane-edge);cursor:pointer;font:inherit;color:inherit}
.nzk-den:hover{border-color:var(--open-line)}
.nzk-den-t{min-width:0}
.nzk-den-t b{display:block;font-family:var(--font-head);font-size:15.5px;font-weight:700;
  letter-spacing:-.015em;color:var(--ink)}
.nzk-den-t span{display:block;font-size:12px;color:var(--muted);margin-top:3px}
.nzk-den-go{flex:none;padding:9px 14px;border-radius:999px;font-size:13px;font-weight:650;
  color:var(--accent-ink);background:var(--accent-bg);
  box-shadow:0 12px 26px -18px var(--accent-glow),inset 0 1px var(--accent-sheen)}
.nzk-den.full{cursor:default;opacity:.6}
.nzk-den.full:hover{border-color:var(--glass-line)}

.nzk-offs{display:flex;flex-direction:column;gap:9px}
.nzk-off{padding:14px;border:1px solid var(--glass-line);border-radius:var(--r-l);
  background:var(--pane);box-shadow:var(--pane-edge);
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%)}
.nzk-off-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.nzk-off-t{min-width:0}
.nzk-off-t b{display:block;font-family:var(--font-head);font-size:15.5px;font-weight:700;
  letter-spacing:-.015em;color:var(--ink)}
.nzk-off-t i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:3px;line-height:1.45}
/* Метки: зелёная — «уже ваше», жёлтая — скидка. Цвет здесь несёт смысл, а не
   украшает, поэтому рядом всегда есть слова. */
.nzk-tag{flex:none;font-size:10.5px;font-weight:650;padding:4px 9px;border-radius:999px;white-space:nowrap}
.nzk-tag.ok{color:var(--ok-ink);background:var(--ok-bg)}
.nzk-tag.sale{color:#8a6100;background:rgba(255,209,102,.22)}
:root[data-theme=dark] .nzk-tag.sale{color:#FFD166;background:rgba(255,209,102,.16)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .nzk-tag.sale{color:#FFD166;background:rgba(255,209,102,.16)}}
.nzk-off-price{display:flex;align-items:baseline;gap:9px;margin-top:11px;flex-wrap:wrap}
.nzk-off-price b{font-family:var(--font-head);font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.nzk-off-price s{font-size:13px;color:var(--taupe)}
.nzk-off-price em{font-style:normal;font-size:12.5px;color:var(--green)}
.nzk-off-row{display:flex;gap:8px;margin-top:11px}
.nzk-off-go{flex:1;min-height:42px;display:flex;align-items:center;justify-content:center;
  border:0;border-radius:var(--r-m);cursor:pointer;font-family:inherit;font-size:13.5px;font-weight:650;
  color:var(--accent-ink);background:var(--accent-bg);
  box-shadow:0 14px 30px -18px var(--accent-glow),inset 0 1px var(--accent-sheen)}
.nzk-off-go2{flex:1;min-height:42px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:var(--r-m);background:none;color:var(--ink2);
  font:inherit;font-size:13.5px;font-weight:650;cursor:pointer}
.nzk-off-go2:hover{border-color:var(--open-line);color:var(--ink)}
.nzk-off .nzk-off-go2{margin-top:11px}
.nzk-off-row .nzk-off-go2{margin-top:0}

/* Подготовка внутри интенсива: пункты только для чтения — править их идут на
   вкладку «Сейчас», где есть подсказки и проверки. */
.nzk-preps{display:flex;flex-direction:column;gap:2px;margin:2px 0 10px}
.nzk-prep-i{display:flex;align-items:flex-start;gap:9px;padding:7px 0;font-size:13px;
  color:var(--muted);line-height:1.4}
.nzk-prep-i.on{color:var(--ink2)}
.nzk-prep-b{flex:none;width:18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid var(--tick-line);background:var(--tick-bg);display:grid;place-items:center;color:transparent}
.nzk-prep-i.on .nzk-prep-b{border-color:transparent;background:var(--green);color:#fff}
.nzk-prep-b svg{width:11px;height:11px}
.nzk-prep .msback{width:100%}

/* ═══ СТРАНИЦА ИНТЕНСИВА ════════════════════════════════════════════════════
   Всё про один интенсив в одном месте. Наверху — то, что важно сейчас: до
   занятия подготовка, в день занятия и после — план. Одна кнопка-акцент. */
.nzk-ikick{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;color:var(--blue);margin-bottom:4px}
.nzk-hero{padding:16px;border:1px solid var(--open-line);border-radius:var(--r-l);
  background:var(--open-bg);box-shadow:var(--pane-edge);margin:var(--s4) 0 var(--s3);
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%)}
.nzk-hero-k{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;color:var(--taupe)}
.nzk-hero-t{font-family:var(--font-head);font-size:20px;font-weight:700;letter-spacing:-.02em;
  color:var(--ink);margin-top:5px}
.nzk-hero-s{font-size:13px;color:var(--muted);line-height:1.55;margin-top:6px}
.nzk-hero-bar{height:5px;border-radius:5px;overflow:hidden;background:var(--track);margin:13px 0 0}
.nzk-hero-bar i{display:block;height:100%;border-radius:5px;background:var(--bar-fill)}
.nzk-hero-go{display:flex;align-items:center;justify-content:center;width:100%;min-height:46px;
  margin-top:13px;border:0;border-radius:var(--r-m);cursor:pointer;
  font-family:inherit;font-size:14.5px;font-weight:650;color:var(--accent-ink);
  background:var(--accent-bg);box-shadow:0 16px 34px -18px var(--accent-glow),inset 0 1px var(--accent-sheen)}
.nzk-hero-go:active{transform:translateY(1px)}
.nzk-hero-note{display:block;font-size:12px;color:var(--taupe);margin-top:9px;text-align:center}
.nzk-rec .msback{width:100%;margin-top:2px}


/* Подготовка свёрнута: строка со счётом и полоса. Восемь галочек нужны редко —
   их раскрывают, когда хотят свериться по пунктам. */
.nzk-prep-h{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.nzk-prep-ht b{display:block;font-family:var(--font-head);font-size:15px;font-weight:700;
  letter-spacing:-.015em;color:var(--ink)}
.nzk-prep-ht i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px}
.nzk-prep-h .nzk-chev{transition:transform var(--dur) var(--ease)}
.nzk-prep-h.on .nzk-chev{transform:rotate(90deg)}
.nzk-prep-bar{margin:10px 0 0}
.nzk-prep .nzk-preps{margin-top:10px}

/* Выполненная подготовка: строка с зелёной галочкой, без полосы и без списка.
   Она уже не требует внимания — только подтверждает, что всё на месте. */
.nzk-prep.done .nzk-prep-ht i{color:var(--green)}
.nzk-prep-ok{flex:none;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;
  background:var(--green);color:#fff}
.nzk-prep-ok svg{width:12px;height:12px}
/* Спокойный интенсив (открыт, но не идёт): без свечения — акцент только у того,
   что происходит прямо сейчас. */
.nzk-hero.calm{border-color:var(--glass-line);background:var(--pane)}
.nzk-hero.calm .nzk-hero-go{background:var(--btn-bg);color:var(--btn-ink);
  border:1px solid var(--btn-line);box-shadow:var(--inset-1)}