/* edu.css — edu.llmcase.ru (Telegram Mini App + браузер). Монохром бренда llmcase: токены
   один в один из design/redesign/feed.css. Обложки гайдов яркие — приходят готовыми, здесь не красятся.
   Отступы между блоками — только шкалой --sp-*. Классы — только латиница. */

/* ── Шрифты (self-host Geist, Geist Mono) ── */
@font-face{ font-family:"Geist"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(/fonts/geist-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:"Geist"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(/fonts/geist-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:"Geist"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(/fonts/geist-cyrillic.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face{ font-family:"Geist"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(/fonts/geist-cyrillic-ext.woff2) format("woff2");
  unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; }
@font-face{ font-family:"Geist Mono"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(/fonts/geist-mono-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:"Geist Mono"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(/fonts/geist-mono-cyrillic.woff2) format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }

/* ── Токены (= feed.css) ── */
*{ box-sizing:border-box; margin:0; padding:0; }
:root{
  --paper:#f7f6f4; --surface:#ffffff; --surface-2:#f1efec;
  --ink:#1d1b17; --ink-2:#514c44; --muted:#8c867b; --faint:#b6b0a4;
  --line:#e7e4de; --line-2:#dcd8d0; --ease:cubic-bezier(0.23,1,0.32,1);
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;
  --font:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,Helvetica,Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --shadow:0 12px 30px rgba(0,0,0,.14);
  --nav-h:56px;
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --paper:#121212; --surface:#1a1a1a; --surface-2:#232321; --ink:#ecebe7; --ink-2:#b7b2a9;
  --muted:#8a857b; --faint:#5f5b53; --line:#2a2926; --line-2:#343330; --shadow:0 12px 30px rgba(0,0,0,.5); } }
:root[data-theme="light"]{ --paper:#f7f6f4; --surface:#ffffff; --surface-2:#f1efec; --ink:#1d1b17;
  --ink-2:#514c44; --muted:#8c867b; --faint:#b6b0a4; --line:#e7e4de; --line-2:#dcd8d0; --shadow:0 12px 30px rgba(0,0,0,.14); }
:root[data-theme="dark"]{ --paper:#121212; --surface:#1a1a1a; --surface-2:#232321; --ink:#ecebe7;
  --ink-2:#b7b2a9; --muted:#8a857b; --faint:#5f5b53; --line:#2a2926; --line-2:#343330; --shadow:0 12px 30px rgba(0,0,0,.5); }

/* ── База ── */
html{ -webkit-text-size-adjust:100%; }
body{ background:var(--paper); color:var(--ink); font-family:var(--font); font-size:15px; line-height:1.5;
      letter-spacing:-0.006em; -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent;
      min-height:100dvh; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
img,svg{ display:block; max-width:100%; }
:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; border-radius:8px; }
[hidden]{ display:none !important; }

/* Каркас: колонка 640px, запас снизу под плавающую навигацию + safe-area */
.edu-app{ max-width:640px; margin:0 auto; padding:var(--sp-3) var(--sp-4);
  padding-top:calc(var(--sp-3) + env(safe-area-inset-top, 0px));
  padding-bottom:calc(90px + env(safe-area-inset-bottom, 0px)); }
.edu-app > * + *{ margin-top:var(--sp-4); }
body[data-page="guide"] .edu-app{ padding-bottom:calc(var(--sp-6) + env(safe-area-inset-bottom, 0px)); }

/* ── Верхняя панель ── */
.edu-top{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); min-height:44px; }
.edu-top h1{ font-size:22px; font-weight:600; letter-spacing:-0.02em; line-height:1.2; }
.edu-top h1 span{ color:var(--muted); font-weight:500; }
.edu-top-title{ flex:1; text-align:center; font-size:14px; font-weight:500; color:var(--muted);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.edu-back,.edu-icon-btn{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:50%; color:var(--ink);
  transition:background .16s var(--ease), color .16s var(--ease), transform .16s var(--ease); }
.edu-back svg,.edu-icon-btn svg{ width:20px; height:20px; }
.edu-back:hover,.edu-icon-btn:hover{ background:var(--surface-2); }
.edu-back:active,.edu-icon-btn:active{ transform:scale(.94); }
.edu-icon-btn{ color:var(--muted); }
.edu-icon-btn.on{ color:var(--ink); background:var(--surface-2); }
.edu-icon-btn.on svg{ fill:currentColor; }
.edu-top > span:empty{ flex:0 0 44px; }
/* Аватар: круг, инициалы Mono */
.edu-ava{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
  border-radius:50%; background:var(--ink); color:var(--paper); font:600 14px var(--mono); overflow:hidden;
  border:1px solid var(--line); }
.edu-ava img{ width:100%; height:100%; object-fit:cover; }
.edu-ava.big{ width:64px; height:64px; font-size:20px; }

/* ── Hero: тёмная карточка на бумаге ── */
.edu-hero{ display:block; position:relative; background:var(--ink); color:var(--paper); border-radius:20px;
  padding:var(--sp-5); overflow:hidden; transition:transform .2s var(--ease), opacity .2s var(--ease); }
a.edu-hero:active{ transform:scale(.99); }
.edu-hero > * + *{ margin-top:var(--sp-3); }
.edu-hero-k{ font:500 11px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; opacity:.6; }
.edu-hero h2{ font-size:24px; font-weight:600; letter-spacing:-0.025em; line-height:1.15; text-wrap:balance; }
.edu-hero-p{ font-size:15px; line-height:1.5; opacity:.78; max-width:38ch; }
.edu-hero-row{ display:flex; align-items:center; gap:var(--sp-3); }
.edu-hero-hint{ display:block; font-size:13px; opacity:.65; white-space:nowrap; }
.edu-progress{ flex:1; display:block; height:4px; border-radius:2px; background:rgba(255,255,255,.18); overflow:hidden; }
.edu-progress > i{ display:block; height:100%; border-radius:2px; background:var(--paper); transition:width .4s var(--ease); }
.edu-hero .edu-btn.light{ margin-top:var(--sp-4); }

/* ── Кнопки ── */
.edu-btn{ display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2); min-height:48px;
  padding:0 var(--sp-5); border-radius:14px; background:var(--ink); color:var(--paper); font-size:15px; font-weight:500;
  letter-spacing:-0.01em; white-space:nowrap; border:1px solid var(--ink); user-select:none;
  transition:transform .16s var(--ease), background .16s var(--ease), color .16s var(--ease), border-color .16s var(--ease); }
.edu-btn svg{ width:18px; height:18px; flex:0 0 auto; }
.edu-btn:hover{ opacity:.92; }
.edu-btn:active{ transform:scale(.97); }
.edu-btn.light{ background:var(--paper); color:var(--ink); border-color:var(--paper); }
.edu-btn.sm{ min-height:40px; padding:0 var(--sp-4); border-radius:11px; font-size:14px; }
.edu-btn.ghost{ background:transparent; color:var(--ink); border-color:var(--line-2); }
.edu-btn.ghost:hover{ background:var(--surface-2); opacity:1; }

/* ── Гейт доступа ── */
.edu-gate{ display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-3) var(--sp-4); background:var(--surface);
  border:1px solid var(--line); border-radius:16px; }
.edu-gate p{ flex:1; font-size:14px; line-height:1.45; color:var(--ink-2); min-width:0; }
.edu-gate p b{ color:var(--ink); font-weight:600; }
.edu-gate .edu-btn{ flex:0 0 auto; }
.edu-gate.ok{ background:var(--surface-2); border-color:transparent; }
.edu-gate.ok .edu-badge{ background:var(--ink); color:var(--paper); }
.edu-badge{ flex:0 0 auto; display:inline-flex; align-items:center; height:24px; padding:0 var(--sp-2); border-radius:8px;
  background:var(--surface-2); color:var(--ink); font:600 11px/1 var(--mono); letter-spacing:.06em; text-transform:uppercase; }

/* ── Поиск ── */
.edu-search{ display:flex; align-items:center; gap:var(--sp-2); height:48px; padding:0 var(--sp-4); background:var(--surface);
  border:1px solid var(--line); border-radius:14px; color:var(--muted); cursor:text;
  transition:border-color .16s var(--ease), box-shadow .16s var(--ease); }
.edu-search svg{ width:18px; height:18px; flex:0 0 auto; }
.edu-search:focus-within{ border-color:var(--ink); color:var(--ink); }
.edu-search input{ flex:1; min-width:0; height:100%; border:0; background:none; font:inherit; font-size:16px; color:var(--ink); outline:0; }
.edu-search input::placeholder{ color:var(--muted); }
.edu-search input::-webkit-search-cancel-button{ -webkit-appearance:none; appearance:none; }

/* ── Чипы-категории: единственный горизонтальный скролл ── */
.edu-chips{ display:flex; gap:var(--sp-2); overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity;
  scrollbar-width:none; margin-left:calc(-1 * var(--sp-4)); margin-right:calc(-1 * var(--sp-4)); padding:0 var(--sp-4); }
.edu-chips::-webkit-scrollbar{ display:none; }
.edu-chip{ flex:0 0 auto; scroll-snap-align:start; display:inline-flex; align-items:center; height:36px; padding:0 var(--sp-4);
  border-radius:999px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); font-size:14px; font-weight:500;
  white-space:nowrap; transition:background .16s var(--ease), color .16s var(--ease), border-color .16s var(--ease); }
.edu-chip:hover{ border-color:var(--ink); color:var(--ink); }
.edu-chip.on{ background:var(--ink); color:var(--paper); border-color:var(--ink); }

/* ── Сетка карточек ── */
.edu-grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--sp-3); }
@media (min-width:560px){ .edu-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--sp-4); } }
.edu-card{ display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:16px;
  overflow:hidden; transition:transform .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease); }
.edu-card:hover{ border-color:var(--line-2); transform:translateY(-1px); }
.edu-card:active{ transform:scale(.98); }
.edu-card-cover{ position:relative; aspect-ratio:16/10; background:var(--surface-2); overflow:hidden; }
.edu-cover-svg,.edu-cover-img{ width:100%; height:100%; object-fit:cover; transition:filter .2s var(--ease), opacity .2s var(--ease); }
.edu-card.locked .edu-cover-svg,.edu-card.locked .edu-cover-img{ filter:saturate(.55) brightness(.92); opacity:.85; }
.edu-flags{ position:absolute; inset:var(--sp-2) var(--sp-2) auto; display:flex; justify-content:space-between; gap:var(--sp-1); pointer-events:none; }
.edu-flag{ display:inline-flex; align-items:center; gap:var(--sp-1); height:22px; padding:0 var(--sp-2); border-radius:999px;
  background:var(--paper); color:var(--ink); font:600 11px/1 var(--mono); letter-spacing:.02em; }
.edu-flag svg{ width:12px; height:12px; }
.edu-flag.done{ background:var(--ink); color:var(--paper); }
.edu-flag.lock{ margin-left:auto; width:22px; padding:0; justify-content:center; background:rgba(0,0,0,.55); color:#fff; }
.edu-card-body{ display:flex; flex-direction:column; gap:var(--sp-1); padding:var(--sp-3); flex:1; }
.edu-card-cat{ font:500 11px/1.2 var(--mono); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.edu-card h3{ font-size:14px; font-weight:600; line-height:1.3; letter-spacing:-0.012em; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.edu-card-meta{ display:flex; flex-wrap:wrap; gap:var(--sp-1) var(--sp-2); margin-top:auto; padding-top:var(--sp-1); font-size:12px; color:var(--muted); }
.edu-card-meta span{ display:inline-flex; align-items:center; gap:3px; }
.edu-card-meta svg{ width:13px; height:13px; }
.edu-card-meta .free{ color:var(--ink-2); font-weight:500; }

/* Пустые состояния */
.edu-empty{ text-align:center; color:var(--muted); font-size:15px; padding:var(--sp-7) var(--sp-4); }
.edu-empty-sm{ color:var(--muted); font-size:14px; padding:var(--sp-3) 0; }

/* Подвал */
.edu-foot{ text-align:center; font-size:12.5px; color:var(--muted); padding-top:var(--sp-5); }
.edu-foot a{ color:var(--ink-2); text-decoration:underline; text-decoration-color:var(--line-2); text-underline-offset:3px; }
.edu-foot a:hover{ color:var(--ink); }

/* ── Плавающая нижняя навигация — тёмная таблетка ── */
.edu-nav{ position:fixed; left:50%; bottom:calc(var(--sp-4) + env(safe-area-inset-bottom, 0px)); transform:translateX(-50%); z-index:50;
  display:flex; align-items:center; gap:var(--sp-1); height:var(--nav-h); padding:0 var(--sp-1); border-radius:999px;
  background:var(--ink); color:var(--paper); box-shadow:var(--shadow); }
.edu-nav a{ display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2); min-width:48px; height:48px; padding:0 var(--sp-4);
  border-radius:999px; font-size:14px; font-weight:500; color:var(--paper); opacity:.72;
  transition:background .16s var(--ease), color .16s var(--ease), opacity .16s var(--ease); }
.edu-nav a svg{ width:20px; height:20px; }
.edu-nav a:hover{ opacity:1; }
.edu-nav a.on{ background:var(--paper); color:var(--ink); opacity:1; }
.edu-nav a[aria-label]:not(:has(span)){ padding:0 var(--sp-3); }
.edu-nav a:focus-visible{ outline-color:var(--paper); outline-offset:-3px; }

/* ── Статья-гайд ── */
.edu-article{ display:block; }
.edu-article > * + *{ margin-top:var(--sp-4); }
.edu-article-cover{ aspect-ratio:16/9; border-radius:20px; overflow:hidden; background:var(--surface-2); }
.edu-article-cover .edu-cover-svg,.edu-article-cover .edu-cover-img{ width:100%; height:100%; object-fit:cover; }
.edu-article h1{ font-size:26px; font-weight:600; letter-spacing:-0.025em; line-height:1.15; text-wrap:balance; }
.edu-article-meta{ display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-3); font-size:13px; color:var(--muted); margin-top:var(--sp-3); }
.edu-article-meta span{ display:inline-flex; align-items:center; gap:var(--sp-1); }
.edu-article-meta svg{ width:14px; height:14px; }
.edu-article-meta .free,.edu-article-meta .pro{ height:22px; padding:0 var(--sp-2); border-radius:8px; font:600 11px/1 var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.edu-article-meta .free{ background:var(--surface-2); color:var(--ink-2); }
.edu-article-meta .pro{ background:var(--ink); color:var(--paper); }
.edu-lead{ font-size:17px; line-height:1.5; color:var(--ink-2); letter-spacing:-0.01em; }
/* Оглавление */
.edu-toc{ background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:var(--sp-4); }
.edu-toc-t{ font:500 11px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:var(--sp-3); }
.edu-toc ol{ list-style:none; counter-reset:toc; display:flex; flex-direction:column; }
.edu-toc li{ counter-increment:toc; }
.edu-toc li a{ display:flex; gap:var(--sp-3); align-items:baseline; min-height:40px; padding:var(--sp-2) 0; font-size:15px; line-height:1.4; color:var(--ink);
  border-top:1px solid var(--line); }
.edu-toc li:first-child a{ border-top:0; }
.edu-toc li a::before{ content:counter(toc, decimal-leading-zero); flex:0 0 auto; font:500 12px/1.6 var(--mono); color:var(--muted); }
.edu-toc li a:hover{ color:var(--ink-2); }

/* Видео 16:9 */
.edu-video{ margin:var(--sp-5) 0; aspect-ratio:16/9; border-radius:16px; overflow:hidden; background:var(--surface-2); border:1px solid var(--line); }
.edu-video iframe{ display:block; width:100%; height:100%; border:0; }

/* «Отметить пройденным» */
.edu-done-row{ display:flex; justify-content:center; padding-top:var(--sp-5); border-top:1px solid var(--line); margin-top:var(--sp-6); }
.edu-done-row .edu-btn{ width:100%; max-width:360px; }

/* Предыдущий / следующий */
.edu-pn{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-3); margin-top:var(--sp-5); }
.edu-pn a{ display:flex; flex-direction:column; gap:var(--sp-1); min-height:64px; padding:var(--sp-3) var(--sp-4); background:var(--surface);
  border:1px solid var(--line); border-radius:14px; font-size:14px; font-weight:500; line-height:1.35; color:var(--ink);
  transition:border-color .16s var(--ease), background .16s var(--ease); }
.edu-pn a:hover{ border-color:var(--line-2); background:var(--surface-2); }
.edu-pn a small{ font-size:12px; font-weight:400; color:var(--muted); }
.edu-pn a.r{ text-align:right; align-items:flex-end; }

/* Замок / пустой профиль / ошибка */
.edu-locked{ text-align:center; padding:var(--sp-6) var(--sp-5); background:var(--surface); border:1px solid var(--line); border-radius:20px; }
.edu-locked > * + *{ margin-top:var(--sp-3); }
.edu-locked-ico{ display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:50%;
  background:var(--surface-2); color:var(--ink); margin:0 auto; }
.edu-locked-ico svg{ width:24px; height:24px; }
.edu-locked h3{ font-size:20px; font-weight:600; letter-spacing:-0.02em; line-height:1.2; text-wrap:balance; }
.edu-locked p{ font-size:15px; line-height:1.5; color:var(--ink-2); max-width:44ch; margin-left:auto; margin-right:auto; }
.edu-locked p b{ color:var(--ink); font-weight:600; }
.edu-locked .edu-btn{ margin-top:var(--sp-5); width:100%; max-width:360px; }
.edu-teaser-t{ font:500 11px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-top:var(--sp-5); }
.edu-teaser{ list-style:none; counter-reset:teaser; text-align:left; margin-top:var(--sp-3); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.edu-teaser li{ counter-increment:teaser; display:flex; gap:var(--sp-3); align-items:baseline; padding:var(--sp-3) var(--sp-4); font-size:14.5px; line-height:1.4;
  color:var(--ink-2); background:var(--surface-2); border-top:1px solid var(--line); }
.edu-teaser li:first-child{ border-top:0; }
.edu-teaser li::before{ content:counter(teaser, decimal-leading-zero); font:500 12px/1.6 var(--mono); color:var(--muted); flex:0 0 auto; }

/* ── Профиль ── */
.edu-me-top{ display:flex; align-items:center; gap:var(--sp-4); }
.edu-me-top > div:last-child{ display:flex; flex-direction:column; gap:var(--sp-1); min-width:0; }
.edu-me-top b{ font-size:18px; font-weight:600; letter-spacing:-0.015em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.edu-me-top span{ font-size:13px; color:var(--muted); }
.edu-stats{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--sp-2); }
.edu-stat{ display:flex; flex-direction:column; gap:var(--sp-1); padding:var(--sp-3) var(--sp-4); background:var(--surface); border:1px solid var(--line); border-radius:14px; }
.edu-stat b{ font:600 22px/1.1 var(--mono); letter-spacing:-0.02em; font-variant-numeric:tabular-nums; }
.edu-stat span{ font-size:12px; color:var(--muted); }
.edu-sec-h{ font:500 11px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); padding-top:var(--sp-3); margin-top:var(--sp-5) !important; }
/* Строки списков (закладки, пройдено, кнопка выхода) */
.edu-li{ display:flex; flex-direction:column; gap:2px; min-height:52px; padding:var(--sp-3) var(--sp-4); background:var(--surface); border:1px solid var(--line);
  border-radius:14px; color:var(--ink); text-align:left; width:100%; transition:background .16s var(--ease), border-color .16s var(--ease); }
.edu-li + .edu-li{ margin-top:var(--sp-2); }
.edu-li:hover{ background:var(--surface-2); border-color:var(--line-2); }
.edu-li-cat{ font:500 11px/1.2 var(--mono); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.edu-li-t{ font-size:15px; font-weight:500; line-height:1.35; }
.edu-li.as-btn{ justify-content:center; font-size:15px; font-weight:500; color:var(--ink-2); }
.edu-li.as-btn:hover{ color:var(--ink); }

/* ── Тело гайда: типографика ── */
.edu-body{ font-size:16px; line-height:1.6; color:var(--ink); letter-spacing:-0.005em; overflow-wrap:anywhere; }
.edu-body > * + *{ margin-top:var(--sp-4); }
.edu-body h2{ font-size:21px; font-weight:600; letter-spacing:-0.02em; line-height:1.25; margin-top:var(--sp-6); scroll-margin-top:var(--sp-5); position:relative; }
.edu-body h2 a[href^="#"]{ color:inherit; }
.edu-body h2:hover a[href^="#"]::after{ content:"#"; margin-left:var(--sp-2); color:var(--faint); font-weight:400; }
.edu-body h3{ font-size:17px; font-weight:600; letter-spacing:-0.012em; line-height:1.3; margin-top:var(--sp-5); scroll-margin-top:var(--sp-5); }
.edu-body p{ color:var(--ink); }
.edu-body ul,.edu-body ol{ padding-left:1.35em; }
.edu-body li{ margin-top:var(--sp-2); }
.edu-body li::marker{ color:var(--muted); font-variant-numeric:tabular-nums; }
.edu-body blockquote{ padding:var(--sp-1) 0 var(--sp-1) var(--sp-4); border-left:2px solid var(--ink); color:var(--ink-2); font-size:16px; }
.edu-body blockquote p + p{ margin-top:var(--sp-2); }
.edu-body code{ font-family:var(--mono); font-size:.88em; padding:.12em .4em; border-radius:6px; background:var(--surface-2); border:1px solid var(--line); color:var(--ink); }
.edu-body pre{ padding:var(--sp-3) var(--sp-4); border-radius:12px; background:var(--surface-2); border:1px solid var(--line); overflow-x:auto; font-family:var(--mono); font-size:13.5px; line-height:1.55; }
.edu-body pre code{ padding:0; border:0; background:none; font-size:inherit; }
.edu-body strong{ font-weight:600; color:var(--ink); }
.edu-body a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--line-2); text-decoration-thickness:1px; text-underline-offset:3px; transition:text-decoration-color .16s var(--ease); }
.edu-body a:hover{ text-decoration-color:var(--ink); }
.edu-body img{ border-radius:12px; height:auto; }
.edu-body hr{ border:0; border-top:1px solid var(--line); margin:var(--sp-6) 0; }

/* ── Тело гайда: фенсы инфографики (blog-render.js) в монохроме ── */
.edu-body .blog-figure{ margin:var(--sp-5) 0; }
.edu-body .blog-figure img{ width:100%; border-radius:14px; border:1px solid var(--line); }
.edu-body .blog-figure figcaption{ margin-top:var(--sp-2); font-size:13px; color:var(--muted); text-align:center; }

/* Шаги */
.edu-body .blog-steps{ list-style:none; padding:0; margin:var(--sp-5) 0; display:flex; flex-direction:column; gap:var(--sp-2); }
.edu-body .blog-step{ display:flex; gap:var(--sp-3); align-items:flex-start; margin:0; padding:var(--sp-3) var(--sp-4); background:var(--surface); border:1px solid var(--line); border-radius:14px; }
.edu-body .blog-step-num{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%;
  background:var(--ink); color:var(--paper); font:600 13px/1 var(--mono); }
.edu-body .blog-step-body{ min-width:0; }
.edu-body .blog-step-title{ font-weight:600; font-size:15.5px; line-height:1.35; letter-spacing:-0.01em; }
.edu-body .blog-step-desc{ margin-top:var(--sp-1); font-size:14.5px; line-height:1.5; color:var(--ink-2); }

/* Ключевой тезис */
.edu-body .blog-key{ margin:var(--sp-5) 0; padding:var(--sp-4) var(--sp-5); background:var(--ink); color:var(--paper); border-radius:16px;
  font-size:17px; font-weight:500; line-height:1.45; letter-spacing:-0.012em; }
.edu-body .blog-key strong{ color:inherit; }
.edu-body .blog-key code{ background:rgba(255,255,255,.12); border-color:transparent; color:inherit; }
.edu-body .blog-key a{ color:inherit; text-decoration-color:rgba(255,255,255,.4); }

/* Цифры */
.edu-body .blog-stats{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--sp-2); margin:var(--sp-5) 0; }
@media (min-width:560px){ .edu-body .blog-stats{ grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); } }
.edu-body .blog-stat-card{ padding:var(--sp-4); background:var(--surface); border:1px solid var(--line); border-radius:14px; }
.edu-body .blog-stat-value{ font:600 26px/1.1 var(--mono); letter-spacing:-0.02em; font-variant-numeric:tabular-nums; color:var(--ink); }
.edu-body .blog-stat-label{ margin-top:var(--sp-1); font-size:13px; line-height:1.4; color:var(--muted); }

/* Сравнение «было / стало» */
.edu-body .blog-compare{ margin:var(--sp-5) 0; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--surface); font-size:14.5px; }
.edu-body .blog-cmp-head,.edu-body .blog-cmp-row{ display:grid; grid-template-columns:1fr 1fr; }
.edu-body .blog-cmp-head{ background:var(--surface-2); font:500 11px/1.3 var(--mono); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.edu-body .blog-cmp-row{ border-top:1px solid var(--line); }
.edu-body .blog-cmp-a,.edu-body .blog-cmp-b{ padding:var(--sp-3) var(--sp-4); line-height:1.45; min-width:0; }
.edu-body .blog-cmp-a{ color:var(--ink-2); border-right:1px solid var(--line); }
.edu-body .blog-cmp-b{ color:var(--ink); font-weight:500; }
.edu-body .blog-cmp-head .blog-cmp-b{ font-weight:500; color:var(--ink); }

/* Бары */
.edu-body .blog-bars{ margin:var(--sp-5) 0; padding:var(--sp-4); background:var(--surface); border:1px solid var(--line); border-radius:14px; display:flex; flex-direction:column; gap:var(--sp-3); }
.edu-body .blog-bar-row{ display:grid; grid-template-columns:minmax(72px, 32%) 1fr auto; align-items:center; gap:var(--sp-3); font-size:13.5px; }
.edu-body .blog-bar-label{ color:var(--ink-2); line-height:1.3; }
.edu-body .blog-bar-track{ height:8px; border-radius:4px; background:var(--surface-2); overflow:hidden; }
.edu-body .blog-bar-fill{ height:100%; border-radius:4px; background:var(--ink); transition:width .5s var(--ease); }
.edu-body .blog-bar-val{ font:500 13px/1 var(--mono); font-variant-numeric:tabular-nums; color:var(--ink); white-space:nowrap; }

/* Промо / врезка */
.edu-body .blog-promo{ margin:var(--sp-5) 0; padding:var(--sp-4) var(--sp-5); background:var(--surface-2); border:1px solid var(--line); border-radius:16px; font-size:15px; line-height:1.5; color:var(--ink-2); }
.edu-body .blog-promo p + p{ margin-top:var(--sp-2); }
.edu-body .blog-promo a{ color:var(--ink); }

/* ── Доступность и движение ── */
@media (hover:none){ .edu-card:hover,.edu-li:hover,.edu-pn a:hover{ transform:none; } }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}

/* ── Блок кода / промпт с кнопкой «Скопировать» (только в edu; в блоге такого блока нет) ── */
.edu-body .edu-code{position:relative;margin:var(--sp-5) 0;background:var(--surface-2);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.edu-body .edu-code pre{margin:0;padding:44px 16px 16px;overflow-x:auto;font-family:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13.5px;line-height:1.55;color:var(--ink);white-space:pre-wrap;word-break:break-word;background:none;border:0}
.edu-body .edu-code code{background:none;padding:0;border:0;font:inherit;color:inherit}
.edu-body .edu-code-lang{position:absolute;left:14px;top:12px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.edu-body .edu-copy{position:absolute;right:10px;top:8px;height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .16s var(--ease)}
.edu-body .edu-copy:hover{background:var(--paper)}
.edu-body .edu-copy.ok{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* ── Гейт подписки: две кнопки в ряд внутри закрытого блока ── */
.edu-gate-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap;justify-content:center;margin-top:var(--sp-4)}
.edu-gate .edu-btn + .edu-btn{margin-left:0}

/* ── Hero-блок покупки: цена крупно, кнопка на всю ширину на мобильном ── */
.edu-hero-price{align-items:baseline;gap:var(--sp-3);margin-top:var(--sp-2)}
.edu-hero-price b{font-size:28px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.edu-hero-buy .edu-btn{display:flex;justify-content:center;width:100%;margin-top:var(--sp-4)}