/* Раскладки экранов Marketing Master поверх tokens.css и bundle.css.
   Источник вида — макеты 00_Platform_Spec/design/screens (телефон 390 px, компьютер 1440 px).
   Сначала телефон, с 900 px — компьютер. Значения — токены справочника. */

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--night); -webkit-text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; font-size: 15px; line-height: 22px; }
img, svg, video { max-width: 100%; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
button { font: inherit; }
.mm-icon { display: block; flex: none; width: 1em; height: 1em; }
[hidden] { display: none !important; }
.mono { font-family: var(--font-mono); }
.wrap { width: 100%; max-width: 1280px; margin: 0 auto; padding-left: max(var(--space-5), env(safe-area-inset-left, 0px)); padding-right: max(var(--space-5), env(safe-area-inset-right, 0px)); }
.skip-link { position: absolute; left: -9999px; top: 8px; z-index: 50; padding: 8px 14px; background: var(--amber); color: var(--on-amber); }
.skip-link:focus { left: 8px; }
.kicker { font-size: 14px; line-height: 20px; color: var(--mm-text-2); }
.kicker--amber { color: var(--amber-text); }
.note { font-size: 13px; line-height: 18px; color: var(--mm-text-3); }
.note--body { font-size: 14px; line-height: 21px; color: var(--mm-text-2); }
.section-title { font-family: var(--font-display); font-weight: 400; font-size: 26px; line-height: 30px; }
.back-link { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px; font-size: 15px; color: var(--mm-text) !important; text-decoration: none; }
.back-link .mm-icon { width: 16px; height: 16px; }
.inline-code { padding: 1px 4px; background: var(--paper-inset); font-family: var(--font-mono); font-size: 0.88em; }

/* Шапка и навигация ------------------------------------------------------------------- */
.site-header { position: relative; z-index: 5; border-bottom: 1px solid var(--night-line); background: var(--night); }
.site-header__inner { max-width: 1280px; margin: 0 auto; min-height: 56px; padding: 0 max(var(--space-5), env(safe-area-inset-left, 0px)); display: flex; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-8); }
.site-logo { display: flex; align-items: center; gap: 10px; min-height: 44px; color: var(--night-ink) !important; text-decoration: none; }
.site-logo .mm-icon { width: 20px; height: 20px; color: var(--amber); }
.site-logo span { font-family: var(--font-display); font-size: 20px; line-height: 28px; font-weight: 500; letter-spacing: 0.01em; }
.site-nav { display: none; }
.site-nav a { display: flex; align-items: center; gap: var(--space-2); min-height: 44px; padding: 0 14px; color: var(--night-ink-2) !important; text-decoration: none; font-size: 15px; }
.site-nav a .mm-icon { width: 20px; height: 20px; }
.site-nav a:hover { color: var(--night-ink) !important; }
.site-nav a[aria-current="page"] { color: var(--amber) !important; font-weight: 500; }
.site-nav .mm-status--soon { margin-left: 2px; }
.site-header__aside { display: flex; align-items: center; gap: var(--space-4); }
.site-header__telegram { display: none; min-height: 40px; font-size: 14px; }
.site-header__telegram .mm-icon { width: 16px; height: 16px; }
.site-header--reading, .page-module .site-header { display: none; }

.tabbar { position: fixed; z-index: 20; left: 0; right: 0; bottom: 0; height: calc(68px + env(safe-area-inset-bottom, 0px)); padding-bottom: env(safe-area-inset-bottom, 0px); display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); border-top: 1px solid var(--night-edge); background: var(--night); }
.tabbar a { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; color: var(--night-ink-3) !important; text-decoration: none; font-size: 12px; line-height: 16px; }
.tabbar a .mm-icon { width: 24px; height: 24px; }
.tabbar a[aria-current="page"] { color: var(--amber) !important; }
/* «скоро» у пункта «Сообщество» (Telegram, решение владельца 2026-10-23): значок справа от иконки на её середине, иконка и подпись не двигаются */
.tabbar a .mm-status--soon { position: absolute; top: 13px; left: calc(50% + 14px); padding: 0 3px; font-size: 12px; line-height: 16px; }
body:has(.tabbar) .site-footer { padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }  /* нижняя панель закрывает низ страницы: подвал даёт ей место */
.phone-bar { height: 52px; padding: 0 12px 0 8px; display: flex; align-items: center; justify-content: space-between; color: var(--night-ink); }
.phone-bar .back-link { padding: 0 8px; }
.phone-bar__mark { font-family: var(--font-mono); font-size: 12px; color: var(--night-ink-3); }
.phone-bar__glyph { color: var(--amber-text); }

/* ASCII-сцена ------------------------------------------------------------------------- */
.scene { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; }

/* Главная ----------------------------------------------------------------------------- */
.hero { position: relative; overflow: hidden; min-height: 640px; }
.hero__veil { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(11, 11, 24, 0) 30%, rgba(11, 11, 24, 0.92) 70%); }
.hero__inner { position: relative; padding-bottom: 40px; }
.landing-header { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-8); }
.landing-nav { display: none; }
.landing-nav a { display: flex; align-items: center; min-height: 44px; padding: 0 14px; color: var(--night-ink-2) !important; text-decoration: none; font-size: 15px; }
.landing-login { display: flex; align-items: center; min-height: 44px; padding: 0 4px; color: var(--night-ink) !important; text-decoration: none; font-size: 15px; font-weight: 500; }
.hero__text { padding-top: 140px; display: flex; flex-direction: column; gap: 16px; }
.hero__title { font-family: var(--font-display); font-weight: 300; font-size: 50px; line-height: 0.96; letter-spacing: -0.01em; text-wrap: balance; }
.hero__lead { font-size: 16px; line-height: 24px; color: var(--night-ink-2); }
.hero__actions { display: flex; flex-direction: column; gap: 12px; padding-top: 6px; }
.hero__actions .mm-btn { width: 100%; }
.hero__secondary { min-height: 48px; }
.hero__note { font-size: 13px; line-height: 18px; color: var(--night-ink-3); text-align: center; }

.stats { border-top: 1px solid var(--night-line); border-bottom: 1px solid var(--night-line); }
.stats__list { padding-top: 24px; padding-bottom: 24px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.stat { display: flex; flex-direction: column-reverse; gap: 6px; padding-left: 12px; border-left: 1px solid var(--night-edge); }
.stat dt { font-size: 13px; line-height: 18px; color: var(--night-ink-2); }
.stat dd { font-family: var(--font-display); font-weight: 300; font-size: 44px; line-height: 1; }

.program { padding-top: 40px; padding-bottom: 40px; display: flex; flex-direction: column; gap: 24px; }
.program__heading { font-family: var(--font-display); font-weight: 300; font-size: 44px; line-height: 1; }
.program__intro { display: flex; flex-direction: column; gap: 12px; }
.program__intro p { font-size: 15px; line-height: 22px; color: var(--night-ink-2); }
.program__list { list-style: none; padding: 0; }
.program__item { position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: 10px; }
.program__rail { position: absolute; left: 11px; top: 0; bottom: 0; width: 2px; background: var(--night-control); }
.program__item--first .program__rail { top: 28px; background: linear-gradient(to bottom, var(--amber), var(--night-control)); }
.program__item:last-child .program__rail { bottom: auto; height: 28px; }
.program__dot { position: relative; align-self: start; margin: 22px 0 0 7px; width: 10px; height: 10px; background: var(--night-station); }
.program__item--first .program__dot { margin: 20px 0 0 5px; width: 14px; height: 14px; background: var(--amber); box-shadow: var(--glow-here); animation: mm-breathe var(--time-breathe) ease-in-out infinite; }
.program__details { min-width: 0; grid-column: 2; border-bottom: 1px solid var(--night-line); }
.program__details > summary { list-style: none; cursor: pointer; min-height: 56px; padding: 14px 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.program__details > summary::-webkit-details-marker { display: none; }
.program__head { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 2px 8px; }
.program__num { font-family: var(--font-mono); font-size: 12px; color: var(--night-ink-3); }
.program__title { font-size: 15px; line-height: 20px; font-weight: 500; color: var(--night-ink); }
.program__free { grid-column: 2; font-size: 13px; color: var(--amber-text); }
.program__sign { flex: none; font-family: var(--font-mono); font-size: 13px; line-height: 20px; color: var(--night-ink-3); }
.program__sign::before { content: "[+]"; }
.program__details[open] .program__sign { color: var(--night-ink); }
.program__details[open] .program__sign::before { content: "[-]"; }
.program__details[open] .program__title { color: #ffffff; }
.program__body { padding: 0 0 18px; display: flex; flex-direction: column; gap: 8px; max-width: 680px; }
.program__body p { font-size: 15px; line-height: 22px; color: var(--night-ink-2); }
.program__body .program__meta { font-size: 13px; line-height: 18px; color: var(--night-ink-3); }
/* «Дальше новые модули»: как элемент списка программы, но без номера, без раскрывающейся части и без отметки «бесплатно» */
.program__next { min-width: 0; grid-column: 2; padding: 14px 0 18px 22px; display: flex; flex-direction: column; gap: 6px; border-bottom: 1px solid var(--night-line); }  /* слева отступ на место номера: заголовок стоит там же, где у модулей */
.program__next p { max-width: 680px; font-size: 15px; line-height: 22px; color: var(--night-ink-2); }

.how { padding: 0; }
.how__sheet { max-width: 1232px; margin: 0 auto; border-radius: var(--radius-sheet-phone) var(--radius-sheet-phone) 0 0; background: radial-gradient(130% 16% at 50% 0%, var(--lamp), transparent 70%), var(--paper); box-shadow: var(--shadow-sheet-phone); padding: 30px var(--space-5) 36px; display: flex; flex-direction: column; gap: 28px; }
.how__heading { font-family: var(--font-display); font-weight: 400; font-size: 32px; line-height: 1.05; }
.how__list { list-style: none; padding: 0; display: grid; gap: 24px; }
.how__list li { display: grid; grid-template-columns: 32px minmax(0, 1fr); column-gap: 14px; row-gap: 4px; }
.how__list li > .mm-icon, .how__icon { display: block; grid-row: 1 / span 2; width: 24px; height: 24px; color: var(--ink); }
.how__icon--green { color: var(--green-ink); }
.how__icon--ochre { color: var(--ochre); }
.how__list .how__item--amber > .mm-icon { color: var(--amber-deep); }
.how__list .how__item--blue > .mm-icon { color: var(--blue-ink); }
.how__list h3 { font-size: 16px; line-height: 22px; font-weight: 600; }
.how__list h3 .mm-status--soon { margin-left: 4px; font-weight: 400; vertical-align: 1px; }
.how__list p { font-size: 15px; line-height: 22px; color: var(--ink-2); }

.start { padding-top: 40px; padding-bottom: 40px; display: flex; flex-direction: column; gap: 20px; }
.page-landing .start { background: var(--paper); color: var(--ink); max-width: none; }
.start__text { display: flex; flex-direction: column; gap: 12px; }
.start__heading { font-family: var(--font-display); font-weight: 400; font-size: 32px; line-height: 1.05; }
.start__text p { font-size: 15px; line-height: 22px; color: var(--ink-2); }
.start__actions { display: flex; flex-direction: column; gap: 12px; }
.start__actions .mm-btn { width: 100%; }
.page-landing .start .start__telegram { color: var(--ink); border-color: var(--paper-control); }
.start__telegram .mm-icon, .night-page .mm-btn .mm-icon { width: 18px; height: 18px; }
.site-footer { border-top: 1px solid var(--night-line); }
.site-footer__inner { min-height: 72px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 32px; padding-top: 8px; padding-bottom: 8px; font-size: 13px; color: var(--night-ink-3); }
main + .site-footer { margin-top: var(--space-6); }  /* страницы курса: подвал не прилипает к листу */
/* ссылки на политику и согласие (ТЗ 13): в подвале каждой страницы; на страницах входа и регистрации — одной строкой под формой */
.site-footer__links { display: flex; flex-wrap: wrap; gap: 0 20px; }
.site-footer__links a { display: inline-flex; align-items: center; min-height: 44px; color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.site-footer__links a:hover { color: var(--night-ink); }
.site-footer--compact { border-top: 0; font-size: 13px; color: var(--night-ink-3); }
.site-footer--compact .site-footer__links { justify-content: center; }
.site-footer--compact .site-footer__inner { min-height: 0; padding: 0; justify-content: center; }
/* строка продавца под ссылками и логотип Robokassa с условиями оплаты (полный подвал); на странице входа и регистрации — только строка */
.site-footer__seller { padding-top: 0; padding-bottom: 12px; font-size: 13px; line-height: 20px; color: var(--night-ink-3); overflow-wrap: anywhere; }
.site-footer__seller a { text-decoration: underline; text-underline-offset: 3px; }
.site-footer--compact .site-footer__seller { text-align: center; padding-bottom: 16px; }
.site-footer__pay { padding-top: 16px; padding-bottom: 28px; }
.pay-terms { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
/* логотип сервиса — файл без правок: тёмный знак с белой маской, на тёмном фоне его не видно, поэтому он лежит на белой плашке */
.pay-terms__logo { display: inline-flex; align-items: center; padding: 8px 12px; background: #ffffff; border-radius: var(--radius-1); line-height: 0; }
.pay-terms__logo img { display: block; width: 161px; max-width: 100%; height: auto; }
.pay-terms__text { max-width: 820px; font-size: 13px; line-height: 20px; color: var(--night-ink-3); }
.pay-terms__text strong { font-weight: 600; color: var(--night-ink-2); }
.pay-terms__text a { text-decoration: underline; text-underline-offset: 3px; }
.program__empty { color: var(--night-ink-2); padding: 16px 0; }

/* Мой курс ---------------------------------------------------------------------------- */
.course-hero { position: relative; display: flex; flex-direction: column; gap: 20px; padding-top: 200px; padding-bottom: 24px; }
.course-hero__scene { position: absolute; left: 0; right: 0; top: 0; height: 330px; overflow: hidden; }
.course-hero__scene::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 62%; background: linear-gradient(to bottom, rgba(11, 11, 24, 0), rgba(11, 11, 24, 0.94)); }
.course-hero__text { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 10px; }
.course-hero__title { font-family: var(--font-display); font-weight: 300; font-size: 42px; line-height: 1.02; letter-spacing: -0.005em; }
.course-hero__lead { font-size: 15px; line-height: 22px; color: var(--night-ink-2); }
.course-hero__actions { display: flex; flex-direction: column; gap: 10px; padding-top: 10px; }
.course-hero__actions .mm-btn { width: 100%; }
.course-map { padding-top: 30px; padding-bottom: 28px; }
.course-map__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.course-map__row .mm-map__rail { background: var(--night-control); }
.course-map__row .mm-map__station { background: var(--night-ink-3); }
.course-map__link { text-decoration: none; }
.course-map__link .mm-map__name { color: var(--night-ink); }
.course-map__link:hover .mm-map__name { color: var(--amber-text); }
.course-map__row .mm-map__glyph { color: var(--night-ink-3); }

/* Обложка модуля ---------------------------------------------------------------------- */
.cover { position: relative; overflow: hidden; }
.cover__veil { position: absolute; left: 0; right: 0; bottom: 0; height: 70%; background: linear-gradient(to bottom, rgba(11, 11, 24, 0), rgba(11, 11, 24, 0.9)); }
.cover__inner { position: relative; padding-top: 8px; padding-bottom: 28px; display: flex; flex-direction: column; gap: 10px; }
.cover__inner .back-link { margin-bottom: 72px; }
.cover__title { font-family: var(--font-display); font-weight: 300; font-size: 40px; line-height: 1.02; letter-spacing: -0.005em; text-wrap: balance; }
.cover__lead { font-size: 15px; line-height: 22px; color: var(--night-ink-2); max-width: 600px; }

/* Лист ------------------------------------------------------------------------------- */
.sheet-wrap { position: relative; padding-left: 0; padding-right: 0; }
.mm-sheet { border-radius: var(--radius-sheet-phone) var(--radius-sheet-phone) 0 0; box-shadow: var(--shadow-sheet-phone); padding: 30px var(--space-5) 40px; background: radial-gradient(130% 16% at 50% 0%, var(--lamp), transparent 70%), var(--paper); }
.sheet-title { font-family: var(--font-display); font-weight: 400; font-size: 24px; line-height: 28px; }
.sheet-title--big { font-size: 28px; line-height: 32px; margin-bottom: 12px; }
.sheet-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.sheet-head__note { font-family: var(--font-mono); font-size: 13px; color: var(--ink-3); }
.sheet-header { display: flex; flex-direction: column; gap: 8px; margin-bottom: 24px; }
.sheet-header__title { font-family: var(--font-display); font-weight: 400; font-size: 38px; line-height: 1.02; text-wrap: balance; }
.panel { padding: 20px; display: flex; flex-direction: column; gap: 12px; font-size: 15px; line-height: 22px; }
.panel__title { display: flex; align-items: center; gap: 12px; font-size: 17px; line-height: 24px; font-weight: 600; }
.panel__title .mm-icon { width: 28px; height: 28px; color: var(--amber); }
.panel--inset { background: var(--paper-inset); border-top: 3px solid var(--ink); color: var(--ink); }
.panel--night { background: var(--night-panel); color: var(--night-ink); }
.panel__list { padding-left: 18px; display: flex; flex-direction: column; gap: 8px; color: var(--night-ink-2); }

/* Модуль ------------------------------------------------------------------------------ */
.module-sheet { display: flex; flex-direction: column; gap: 32px; }
.module-aside { display: flex; flex-direction: column; gap: 24px; }
.module-main { display: flex; flex-direction: column; gap: 32px; }
.requirements__list { list-style: none; padding: 0; margin-top: 8px; border-top: 1px solid var(--paper-line); }
.requirements__list li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--paper-line); font-size: 15px; line-height: 21px; }
.requirements__list a { color: var(--ink) !important; text-decoration: none; }
.requirements__list a:hover { text-decoration: underline; }
.requirements__list span a { color: var(--blue-ink) !important; }
.requirements__value { flex: none; color: var(--ochre); }
.module-actions { display: flex; flex-direction: column; gap: 12px; }
.module-actions .mm-btn .mm-icon, .project-main .mm-btn .mm-icon { width: 16px; height: 16px; }
.aside-block { display: flex; flex-direction: column; gap: 8px; font-size: 15px; line-height: 22px; }
.aside-block__title { font-size: 16px; line-height: 22px; font-weight: 600; }
.references__list { list-style: none; padding: 0 0 14px; display: flex; flex-direction: column; gap: 8px; }
.lessons { list-style: none; padding: 0; border-top: 1px solid var(--paper-line); }
.lessons__row a { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 2px; padding: 11px 0; border-bottom: 1px solid var(--paper-line); color: var(--ink) !important; text-decoration: none; }
.lessons__row a:hover .lessons__title { text-decoration: underline; }
.lessons__title { font-size: 15px; line-height: 21px; }
.lessons__meta { font-size: 13px; line-height: 18px; color: var(--ink-3); }
.module-main .note { margin-top: 10px; }
.works { display: grid; gap: 12px; }
.work { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; background: var(--paper-inset); color: var(--ink) !important; text-decoration: none; }
.work:hover .work__title { text-decoration: underline; }
.work__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.work__title { font-size: 16px; line-height: 22px; font-weight: 600; }
.work__status { flex: none; font-size: 13px; line-height: 20px; color: var(--ink-3); }
.work__note { font-size: 14px; line-height: 20px; color: var(--ink-2); }
.works__group { border: 1px solid var(--paper-control); }
.works__group-title { padding: 12px 16px; border-bottom: 1px solid var(--paper-control); font-size: 14px; color: var(--ink-2); }
.works__group-items { display: grid; }
.works__group-items .work { background: transparent; }
.works__group-items .work + .work { border-top: 1px solid var(--paper-control); }

/* Чтение: урок и файл пакета ---------------------------------------------------------- */
.reading { display: block; }
.reading__nav, .reading__toc { display: none; }
.reading__sheet { border-radius: var(--radius-sheet-phone) var(--radius-sheet-phone) 0 0; background: radial-gradient(130% 22% at 50% 0%, var(--lamp), transparent 70%), var(--paper); box-shadow: var(--shadow-sheet-phone); padding: 26px var(--space-5) 40px; display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.reading__head { display: flex; flex-direction: column; gap: 8px; }
.reading__kicker { font-size: 14px; line-height: 20px; color: var(--ink-3); }
.reading__title { font-family: var(--font-display); font-weight: 400; font-size: 38px; line-height: 1.02; text-wrap: balance; }
.reading__meta { font-size: 14px; line-height: 20px; color: var(--ink-3); }
.reading__foot { width: 100%; max-width: 640px; align-self: center; padding-top: 20px; border-top: 1px solid var(--paper-line); display: flex; justify-content: flex-end; }
.reading__next { display: flex; flex-direction: column; gap: 2px; text-decoration: none; }
.reading__next-label { font-size: 13px; color: var(--ink-3); }
.reading__next-title { font-size: 17px; line-height: 23px; font-weight: 600; color: var(--blue-ink); }
.reading__lessons { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: 14px; line-height: 19px; }
.reading__lessons a { display: block; padding: 6px 0; color: var(--night-ink-2) !important; text-decoration: none; }
.reading__lessons a:hover { color: var(--night-ink) !important; }
.reading__lessons li[aria-current="page"] a { color: #ffffff !important; font-weight: 600; }
.reading__lessons li[aria-current="page"] a::before { content: "> "; font-family: var(--font-mono); font-size: 12px; color: var(--amber); }
.reading__toc-title { color: var(--night-ink-3); }
.reading__toc ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.reading__toc a { color: var(--night-ink-2) !important; text-decoration: none; }
.reading__toc a:hover { color: var(--night-ink) !important; }

/* Текст урока (лист): IBM Plex Serif, колонка не шире 640–680 px */
.prose { width: 100%; max-width: 640px; align-self: center; font-family: var(--font-serif); font-size: 17px; line-height: 27px; color: var(--ink); overflow-wrap: break-word; }
.prose > * + * { margin-top: 18px; }
.prose h1, .prose h2 { font-family: var(--font-display); font-weight: 500; font-size: 28px; line-height: 1.1; margin-top: 36px; }
.prose h3 { font-family: var(--font-sans); font-size: 17px; line-height: 24px; font-weight: 600; margin-top: 28px; }
.prose h4, .prose h5, .prose h6 { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 600; margin-top: 24px; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li + li { margin-top: 6px; }
.prose blockquote { margin: 0; padding: 4px 0 4px 18px; border-left: 3px solid var(--paper-control); color: var(--ink-2); }
.prose hr { border: 0; border-top: 1px solid var(--paper-line); }
.prose code { padding: 1px 4px; background: var(--paper-inset); font-family: var(--font-mono); font-size: 0.86em; border-radius: var(--radius-1); }
.prose pre { overflow-x: auto; padding: 14px 16px; background: var(--paper-inset); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: 13px; line-height: 20px; }
.prose pre code { padding: 0; background: none; font-size: inherit; }
.prose pre.mermaid { background: transparent; padding: 8px 0; text-align: center; font-size: 13px; }
.prose pre.mermaid svg { max-width: 100%; height: auto; }
.prose .mm-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.prose .mm-table { width: auto; min-width: 100%; font-size: 14px; line-height: 20px; }
.prose .mm-table th { white-space: nowrap; vertical-align: bottom; }
.prose .mm-table td { min-width: 9ch; vertical-align: top; }
.prose .mm-table .mm-num { white-space: nowrap; }
.prose .mm-table .mm-al-right { text-align: right; }
.prose .mm-table .mm-al-center { text-align: center; }
.prose .mm-math--block { display: block; overflow-x: auto; overflow-y: hidden; padding: 6px 0; text-align: center; }
.prose .katex { font-size: 1.05em; }
.prose .katex-display { margin: 0; }
.prose img { height: auto; }
.prose--compact { font-size: 16px; line-height: 25px; }
.prose .mm-video { margin: 8px 0; font-family: var(--font-sans); }
.mm-video__frame video { background: var(--night); }
.mm-video__play .mm-icon { width: 30px; height: 30px; margin-left: 4px; }
.mm-video.is-started .mm-video__play, .mm-video.is-started .mm-video__time { display: none; }
.mm-video .mm-disclosure { font-size: 15px; }
.transcript { font-size: 15px; line-height: 22px; }
.transcript > * + * { margin-top: 10px; }

/* Проект, тест, среда ----------------------------------------------------------------- */
.sheet-wrap--top { margin-top: 0; }
.page-sheet__sheet { max-width: 1192px; margin: 0 auto; }
.page-sheet__sheet--narrow { max-width: 800px; display: flex; flex-direction: column; gap: 18px; }
/* Политика перед подтверждением: кнопка возврата на экран подтверждения над текстом и под ним (на телефоне лист без полей, поэтому поля у кнопки свои) */
.consent-back { max-width: 800px; margin: 0 auto 16px; padding: 0 var(--space-5); }
.consent-back--end { margin: 16px auto 0; padding-bottom: 24px; }
.consent-back .mm-btn { display: flex; width: 100%; min-height: 54px; }
.project-layout { display: flex; flex-direction: column; gap: 32px; }
.project-main { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.project-main section { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.project-main .prose { align-self: stretch; margin-top: 8px; }
.facts { display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: 15px; line-height: 22px; }
.facts__label { color: var(--ink-3); }
.project-main .mm-table-wrap { align-self: stretch; }
.test-facts { display: flex; gap: 32px; }
.test-facts dt { font-size: 13px; color: var(--ink-3); }
.test-facts dd { font-family: var(--font-display); font-weight: 300; font-size: 44px; line-height: 1; }
.test-threshold { color: var(--ochre); font-weight: 500; }
.env { display: flex; flex-direction: column; gap: 28px; }
.env__lead { font-family: var(--font-serif); font-size: 17px; line-height: 27px; color: var(--ink); }
.env__tabs { margin-bottom: 26px; }
.env__steps p { font-size: 15px; line-height: 22px; color: var(--ink-2); }
.env__aside { display: flex; flex-direction: column; gap: 22px; }
.env__aside .mm-btn .mm-icon { width: 16px; height: 16px; }
.env__needs { display: flex; flex-direction: column; gap: 12px; margin-bottom: 28px; }
.env__subtitle { font-size: var(--fs-section); line-height: var(--lh-section); font-weight: 600; }
.env__list, .env__actions, .env__fixes { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; font-size: var(--fs-text); line-height: var(--lh-text); }
.env__list, .env__actions { color: var(--ink); }
.env__fixes { list-style: disc; }  /* вложенный в шаг список иначе получает полые кружки */
/* Заголовок шага несёт номер («Шаг 1.»), поэтому столбца под номер у шагов среды нет */
.env__steps { gap: 36px; }
.env__steps > li { display: block; }
.env__steps .mm-steps__body { gap: 12px; }
.env__time { font-size: var(--fs-note); line-height: var(--lh-note); font-weight: 400; color: var(--ink-3); white-space: nowrap; }
.env__actions .mm-command { margin-top: 8px; }
.env .mm-command pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.env__result { padding: 10px 12px; background: var(--paper-inset); }
.copy-buffer { position: fixed; top: 0; left: -9999px; }

/* Цены и контакты: узкий лист с текстом, как у юридических страниц (.prose). Таблицы цен и модулей читаются на телефоне:
   прокручивается только сама таблица (.mm-table-wrap), страница не уезжает вбок */
.info-page .price-table th { white-space: normal; }
.info-page .price-table__sum { font-size: 18px; line-height: 24px; font-weight: 600; white-space: nowrap; }
.info-page .modules-table td { min-width: 0; }  /* у номера и числа уроков нет своего минимума в 9 знаков: на телефоне таблица помещается без прокрутки */
.info-page .modules-table td:nth-child(2) { min-width: 14ch; }
.pricing__actions { display: flex; flex-direction: column; gap: 12px; }
.pricing__actions .mm-btn { width: 100%; }
.prose.info-page a.mm-btn { text-decoration: none; }
.pricing__note { font-size: 14px; line-height: 21px; color: var(--ink-2); }
.info-page .pay-terms { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--paper-line); }
.info-page .pay-terms__logo { border: 1px solid var(--paper-line); }
.info-page .pay-terms__text { font-size: 14px; line-height: 21px; color: var(--ink-2); font-family: var(--font-sans); }
.info-page .pay-terms__text strong { color: var(--ink); }

/* Ночные экраны: «скоро» и 404 -------------------------------------------------------- */
.night-page { position: relative; overflow: hidden; min-height: calc(100vh - 57px); }
.night-page__scene { position: absolute; inset: 0; }
.night-page__inner { position: relative; padding-top: 24px; padding-bottom: 120px; display: flex; flex-direction: column; gap: 28px; }
.night-page .mm-pixel { border-color: var(--night-ink); }
.night-page__text { display: flex; flex-direction: column; gap: 12px; }
.night-page__kicker { font-family: var(--font-mono); font-size: 13px; color: var(--night-ink-3); }
.night-page__title { font-family: var(--font-display); font-weight: 300; font-size: 44px; line-height: 1; }
.night-page__subtitle { font-size: 17px; line-height: 24px; font-weight: 600; }
.night-page__lead { font-size: 15px; line-height: 22px; color: var(--night-ink-2); }
.night-page__actions { display: flex; flex-direction: column; gap: 12px; padding-top: 12px; }
.night-page__actions .mm-btn { width: 100%; }
.page-404 .night-page__kicker { display: none; }
.page-404 .night-page__inner { min-height: calc(100svh - 57px); padding-bottom: 24px; }
.page-404 .night-page__text { flex: 1; }
.page-404 .night-page__actions { margin-top: auto; }

/* Компьютер ---------------------------------------------------------------------------- */
@media (min-width: 900px) {
  .wrap { padding-left: max(var(--space-6), env(safe-area-inset-left, 0px)); padding-right: max(var(--space-6), env(safe-area-inset-right, 0px)); }
  .site-header__inner { min-height: 72px; padding: 0 max(var(--space-6), env(safe-area-inset-left, 0px)); }
  .site-logo .mm-icon { width: 22px; height: 22px; }
  .site-logo span { font-size: 22px; }
  .site-nav { display: flex; flex-wrap: wrap; gap: 4px; }
  .site-header__telegram { display: inline-flex; }
  .site-header--reading, .page-module .site-header { display: block; }
  .tabbar { display: none; }
  body:has(.tabbar) .site-footer { padding-bottom: 0; }
  .phone-bar { display: none; }

  .hero { min-height: 0; }
  .hero__veil { right: auto; width: 64%; background: linear-gradient(to right, rgba(11, 11, 24, 0.9), rgba(11, 11, 24, 0)); }
  .hero__inner { padding-bottom: 112px; }
  .landing-header { min-height: 76px; }
  .landing-nav { display: flex; gap: 4px; }
  .landing-login { padding: 0 18px; border: 1px solid var(--night-control); border-radius: var(--radius-1); }
  .hero__text { max-width: 780px; padding-top: 104px; gap: 26px; }
  .hero__title { font-size: 96px; line-height: 0.94; letter-spacing: -0.015em; }
  .hero__lead { max-width: 580px; font-size: 20px; line-height: 30px; }
  .hero__actions { flex-direction: row; flex-wrap: wrap; }
  .hero__actions .mm-btn { width: auto; min-height: 56px; }
  .hero__note { text-align: left; font-size: 14px; }
  .stats__list { padding-top: 40px; padding-bottom: 40px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 24px 32px; }
  .stat { padding-left: 20px; }
  .stat dt { font-size: 15px; }
  .stat dd { font-size: 68px; }
  .program { padding-top: 96px; padding-bottom: 96px; flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 40px 72px; }
  .program__intro { flex: 1 1 300px; max-width: 400px; position: sticky; top: 32px; gap: 18px; }
  .program__heading { font-size: 68px; }
  .program__intro p { font-size: 17px; line-height: 26px; }
  .program__list { flex: 999 1 560px; min-width: 0; }
  .program__item { grid-template-columns: 32px minmax(0, 1fr); column-gap: 16px; }
  .program__rail { left: 15px; }
  .program__item--first .program__rail { top: 32px; }
  .program__item:last-child .program__rail { height: 32px; }
  .program__dot { margin: 26px 0 0 10px; width: 12px; height: 12px; }
  .program__item--first .program__dot { margin: 24px 0 0 8px; width: 16px; height: 16px; }
  .program__details > summary { min-height: 64px; padding: 17px 0; gap: 24px; }
  .program__head { display: flex; flex-wrap: wrap; gap: 4px 16px; }
  .program__num { flex: none; width: 24px; font-size: 14px; }
  .program__title { font-family: var(--font-display); font-size: 25px; line-height: 30px; font-weight: 400; }
  .program__free { font-size: 14px; }
  .program__sign { font-size: 14px; line-height: 30px; }
  .program__body { padding: 0 0 24px 40px; }
  .program__body p { font-size: 17px; line-height: 26px; }
  .program__body .program__meta { font-size: 14px; line-height: 20px; }
  .program__next { padding: 17px 0 24px 40px; }
  .program__next p { font-size: 17px; line-height: 26px; }
  .how { padding: 0 max(var(--space-6), env(safe-area-inset-left, 0px)) 96px; }
  .how__sheet { border-radius: var(--radius-sheet); box-shadow: var(--shadow-sheet); background: radial-gradient(110% 320px at 50% 0%, var(--lamp), transparent 100%), var(--paper); padding: 56px max(24px, 5%) 64px; gap: 40px; }
  .how__heading { font-size: 58px; line-height: 1; }
  .how__list { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 40px 48px; }
  .how__list li { grid-template-columns: 1fr; row-gap: 10px; }
  .how__list li > .mm-icon, .how__icon { grid-row: auto; width: 32px; height: 32px; }
  .how__list h3 { font-size: 19px; line-height: 26px; }
  .how__list p { font-size: 16px; line-height: 24px; }
  .page-landing .start { background: transparent; color: var(--night-ink); max-width: 1280px; padding-top: 24px; padding-bottom: 112px; flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px 48px; }
  .start__text { max-width: 660px; gap: 14px; }
  .start__heading { font-weight: 300; font-size: 68px; line-height: 1; }
  .start__text p { font-size: 17px; line-height: 26px; color: var(--night-ink-2); }
  .start__actions { flex-direction: row; flex-wrap: wrap; }
  .start__actions .mm-btn { width: auto; min-height: 56px; }
  .page-landing .start .start__telegram { color: var(--night-ink); border-color: var(--night-control); }
  .site-footer__inner { min-height: 84px; font-size: 14px; }
  .site-footer__seller { font-size: 14px; }
  .pay-terms__text { font-size: 14px; }
  .pricing__actions { flex-direction: row; align-items: center; gap: 20px; }
  .pricing__actions .mm-btn { width: auto; }

  .course-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 40px; padding-top: 40px; padding-bottom: 56px; }
  .course-hero__scene { position: relative; height: 580px; border: 1px solid var(--night-edge); }
  .course-hero__scene::after { display: none; }
  .course-hero__title { font-size: 68px; line-height: 1; }
  .course-hero__lead { font-size: 17px; line-height: 26px; max-width: 520px; }
  .course-hero__actions { flex-direction: row; flex-wrap: wrap; gap: 12px; }
  .course-hero__actions .mm-btn { width: auto; min-width: 240px; }
  .course-map { padding-bottom: 96px; }
  .course-map__head { margin-bottom: 28px; }
  .course-map .section-title { font-size: 40px; line-height: 1; font-weight: 300; }
  .course-map__list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  .course-map__row { grid-template-columns: minmax(0, 1fr); grid-template-rows: 20px 12px auto; grid-template-areas: "glyph" "station" "text"; align-content: start; row-gap: 10px; padding: 0 8px 0 0; }
  .course-map__row .mm-map__glyph { grid-area: glyph; text-align: left; font-size: 13px; }
  .course-map__row .mm-map__station { grid-area: station; margin: 0; width: 12px; height: 12px; }
  .course-map__row .mm-map__text { grid-area: text; }
  .course-map__row .mm-map__rail, .course-map__row:first-child .mm-map__rail, .course-map__row:last-child .mm-map__rail { left: 0; right: 0; top: 35px; bottom: auto; width: auto; height: 2px; }
  .course-map__row:first-child .mm-map__rail { left: 6px; }
  .course-map__row:last-child .mm-map__rail { right: auto; width: 12px; }
  .course-map__row .mm-map__name { font-size: 13px; line-height: 18px; hyphens: auto; }

  .cover { min-height: 430px; }
  .cover__inner { padding-top: 32px; padding-bottom: 72px; }
  .cover__inner .back-link { margin-bottom: 56px; }
  .cover__title { font-size: 68px; line-height: 1; max-width: 760px; }
  .cover__lead { font-size: 17px; line-height: 26px; }
  .sheet-wrap { padding-left: max(var(--space-6), env(safe-area-inset-left, 0px)); padding-right: max(var(--space-6), env(safe-area-inset-right, 0px)); }
  .page-module .sheet-wrap { margin-top: -40px; padding-bottom: 80px; }
  .mm-sheet { border-radius: var(--radius-sheet); box-shadow: var(--shadow-sheet); background: radial-gradient(110% 320px at 50% 0%, var(--lamp), transparent 100%), var(--paper); padding: 48px max(var(--space-6), 4%) 64px; }
  .module-sheet { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; align-items: start; }
  .module-aside { grid-column: 2; grid-row: 1; }
  .module-main { grid-column: 1; grid-row: 1; }
  .sheet-title--big { font-size: 32px; line-height: 36px; }
  .lessons__row a { grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; column-gap: 8px; padding: 12px 0; }
  .lessons__meta { text-align: right; padding-left: 16px; }
  .works { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .works__group { grid-column: 1 / -1; }
  .works__group-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .works__group-items .work + .work { border-top: 0; border-left: 1px solid var(--paper-control); }

  .reading { display: grid; grid-template-columns: 250px minmax(0, 800px) 220px; justify-content: center; align-items: start; gap: 32px; max-width: 1360px; margin: 0 auto; padding: 40px max(var(--space-6), env(safe-area-inset-left, 0px)) 80px; }
  .reading__nav { display: flex; flex-direction: column; gap: 14px; padding-top: 8px; position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow-y: auto; }
  .reading__toc { display: flex; flex-direction: column; gap: 10px; padding-top: 64px; font-size: 14px; position: sticky; top: 16px; }
  .reading__sheet { border-radius: var(--radius-sheet); background: radial-gradient(110% 340px at 50% 0%, rgba(255, 186, 105, 0.32), transparent 100%), var(--paper); box-shadow: var(--shadow-sheet); padding: 56px max(var(--space-6), 7%) 56px; gap: 28px; }
  .reading__kicker, .reading__meta { font-size: 15px; }
  .reading__title { font-size: 58px; line-height: 0.98; letter-spacing: -0.01em; }
  .prose { font-size: 19px; line-height: 31px; }
  .prose > * + * { margin-top: 20px; }
  .prose h1, .prose h2 { font-size: 32px; }
  .prose .mm-table { font-size: 15px; line-height: 21px; }
  .prose--compact { font-size: 17px; line-height: 27px; }

  .sheet-wrap--top { margin-top: 40px; padding-bottom: 80px; }
  .consent-back { padding-left: 0; padding-right: 0; }
  .consent-back .mm-btn { display: inline-flex; width: auto; }
  .sheet-header__title { font-size: 58px; line-height: 0.98; }
  .project-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 40px; align-items: start; }
  .project-layout .panel--inset { position: sticky; top: 24px; }
  .env { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; align-items: start; }
  .env__lead { font-size: 21px; line-height: 31px; max-width: 620px; }
  .env__tabs { max-width: 282px; }
  .page-sheet__sheet.env { max-width: 1132px; }
  .env .mm-steps__title { font-size: 20px; line-height: 28px; }

  .night-page { min-height: calc(100vh - 73px); }
  .night-page__inner { padding-top: 72px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px); align-items: center; gap: 72px; }
  .night-page__window { grid-column: 2; grid-row: 1; }
  .night-page__text { grid-column: 1; grid-row: 1; max-width: 560px; gap: 18px; }
  .night-page--window-left .night-page__inner { grid-template-columns: minmax(0, 560px) minmax(0, 1fr); }
  .night-page--window-left .night-page__window { grid-column: 1; }
  .night-page--window-left .night-page__text { grid-column: 2; }
  .night-page .mm-pixel { height: 420px; }
  .night-page .mm-pixel__sprite { width: 168px; height: 216px; margin-left: -84px; }
  .night-page .mm-pixel__sprite--think { margin-left: 0; }
  .night-page__title { font-size: 72px; line-height: 0.98; }
  .night-page__subtitle { font-size: 20px; line-height: 28px; }
  .night-page__lead { font-size: 17px; line-height: 28px; }
  .night-page__actions { flex-direction: row; flex-wrap: wrap; }
  .night-page__actions .mm-btn { width: auto; min-height: 54px; }
  .page-404 .night-page__kicker { display: block; }
  .page-404 .night-page__inner { min-height: 0; padding-bottom: 120px; }
  .page-404 .night-page__actions { margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
