/* ===== ПЛАТФОРМА «СБОРКА» =====
   Взрослая версия стиля курса: графит и бумага студии, два акцента.
   Акцент один — зеленый студии: главное действие, прогресс, «сейчас». Крупные цветные поля —
   глубокий темно-зеленый со светлым текстом и спокойная бумага. Красный только для тревоги.
   30.10 пробовали оранжевый вторым акцентом и заливки им: «вырви глаз», на оранжевом не читается,
   выглядит детски, а несколько акцентов на странице мешают ориентироваться. Не возвращать.
   Мотив — сборочный чертеж: детали со швами, номера «01», подписи моноширинным шрифтом,
   тонкие линии. Логотип: буква «С» из трех деталей цветом текста и зеленый курсор терминала.
   Две темы: «Ночь» (по умолчанию) и «Бумага». */

@font-face{font-family:"Wix Madefor Display";font-weight:600;font-display:swap;src:url("/fonts/madefor-600.woff2") format("woff2")}
@font-face{font-family:"Wix Madefor Display";font-weight:800;font-display:swap;src:url("/fonts/madefor-800.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:400;font-display:swap;src:url("/fonts/manrope-400.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:500;font-display:swap;src:url("/fonts/manrope-500.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:600 800;font-display:swap;src:url("/fonts/manrope-600.woff2") format("woff2")}

:root{
  --bg:#09090B;
  --grid:rgba(255,255,255,.035);
  --surface:#121215;
  --surface-2:#17171B;
  --surface-3:#202026;
  --text:#F2F2F5;
  --muted:#A9A9B3;
  --dim:#92929D;
  --ink:#0C0C10;
  --paper:#ECEDE6;
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.16);

  --accent:#19E37D;
  --accent-text:#19E37D;
  --accent-soft:rgba(25,227,125,.10);
  --accent-line:rgba(25,227,125,.38);
  --warm:#19E37D;
  --warm-text:#19E37D;
  --warm-soft:rgba(25,227,125,.10);
  --warm-line:rgba(25,227,125,.38);
  --deep:#0F3A28;
  --red:#FF5A4E;
  --red-text:var(--red);
  --red-soft:rgba(255,90,78,.12);

  --fd:"Wix Madefor Display",system-ui,sans-serif;
  --fb:"Manrope",system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;

  --r:12px;--r-sm:8px;--r-lg:16px;
  --ease:cubic-bezier(.16,1,.3,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --lift:0 1px 0 rgba(255,255,255,.04) inset,0 14px 30px -20px rgba(0,0,0,.9);
  --side:256px;
  --top:56px;
  --tabs:64px;
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#ECEDE6;
  --grid:rgba(0,0,0,.045);
  --surface:#F6F6F1;
  --surface-2:#FFFFFF;
  --surface-3:#E2E3DB;
  --text:#121216;
  --muted:#4A4A54;
  --dim:#5D5D67;
  --line:rgba(0,0,0,.09);
  --line-strong:rgba(0,0,0,.18);
  --accent-text:#086839;
  --accent-soft:rgba(25,227,125,.16);
  --accent-line:rgba(10,138,74,.4);
  --red-text:#A62C23;
  --warm-text:#086839;
  --warm-soft:rgba(25,227,125,.16);
  --warm-line:rgba(10,138,74,.4);
  --lift:0 1px 0 rgba(255,255,255,.8) inset,0 12px 26px -20px rgba(30,30,20,.4);
  color-scheme:light;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--line-strong) transparent}
body{
  min-height:100dvh;font-family:var(--fb);font-size:16px;line-height:1.55;color:var(--text);
  background:
    linear-gradient(var(--grid) 1px,transparent 1px) 0 0/48px 48px,
    linear-gradient(90deg,var(--grid) 1px,transparent 1px) 0 0/48px 48px,
    var(--bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
::selection{background:var(--accent);color:var(--ink)}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
[hidden]{display:none !important}
:where(p,li){text-wrap:pretty}
/* заголовки и короткие строки переносятся ровно: без длинной строки и хвоста из пары слов */
:where(h1,h2,h3,b,.lead,.ph p,.label){text-wrap:balance}

/* подпись моноширинным: «ЗАНЯТИЕ 01 · ЧЕРЕЗ 11 ДНЕЙ» */
.label{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.label--warm{color:var(--warm-text)}
.label--accent{color:var(--accent-text)}

/* ── логотип ────────────────────────────────────────────────────────────
   Три детали буквы «С» со швами и курсор. При загрузке детали съезжаются,
   курсор появляется и мигает. При наведении — разнесенный вид, как на чертеже. */
.logo{display:inline-flex;align-items:center;gap:11px;color:var(--text)}
.logo__mark{width:34px;height:34px;flex:none;overflow:visible}
.logo__mark .p{fill:var(--text);transition:transform .45s var(--spring)}
.logo__mark .p2{fill:var(--text);opacity:.88}
.logo__mark .c{fill:var(--accent);transition:transform .45s var(--spring)}
.logo__mark .p1{animation:lg-in1 .7s var(--spring) both}
.logo__mark .p2{animation:lg-in2 .7s var(--spring) .08s both}
.logo__mark .p3{animation:lg-in3 .7s var(--spring) .16s both}
.logo__mark .c{animation:lg-cur .5s var(--ease) .55s both,lg-blink 1.1s steps(1) 1.1s 3,lg-idle 9s steps(1) 5s infinite}
.logo:hover .p1{transform:translate(1.5px,-1.5px)}
.logo:hover .p2{transform:translate(-2px,0)}
.logo:hover .p3{transform:translate(1.5px,1.5px)}
.logo:hover .c{transform:translate(2.5px,0)}
.logo__word{display:grid;line-height:1}
.logo__name{font-family:var(--fd);font-weight:800;font-size:21px;letter-spacing:-.03em}
.logo__sub{margin-top:5px}
@keyframes lg-in1{from{transform:translate(8px,-8px);opacity:0}}
@keyframes lg-in2{from{transform:translate(-10px,0);opacity:0}}
@keyframes lg-in3{from{transform:translate(8px,8px);opacity:0}}
@keyframes lg-cur{from{transform:translate(8px,0);opacity:0}}
@keyframes lg-blink{50%{opacity:0}}
@keyframes lg-idle{0%,94%{opacity:1}95%,97%{opacity:0}98%{opacity:1}99%{opacity:0}}

/* ── каркас ─────────────────────────────────────────────────────────────── */
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);min-height:100dvh}
.side{
  position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;gap:4px;
  padding:20px 12px 12px;border-right:1px solid var(--line);background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(12px);overflow-y:auto
}
.side .logo{padding:2px 10px 18px}
.search-btn{
  display:flex;align-items:center;gap:10px;height:38px;padding:0 10px;margin:0 2px 8px;border-radius:var(--r-sm);
  background:var(--surface);border:1px solid var(--line);color:var(--dim);font-size:14px;font-weight:500;text-align:left;transition:border-color .2s,color .2s
}
.search-btn:hover{border-color:var(--line-strong);color:var(--muted)}
.search-btn svg{width:16px;height:16px}
.search-btn kbd{margin-left:auto}
kbd{font-family:var(--mono);font-size:11px;font-weight:500;padding:1px 6px;border-radius:5px;border:1px solid var(--line-strong);color:var(--muted)}
.nav__group{padding:18px 10px 6px;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.nav__a{
  position:relative;display:flex;align-items:center;gap:11px;min-height:38px;padding:0 10px;border-radius:var(--r-sm);
  color:var(--muted);font-weight:600;font-size:14.5px;transition:background-color .15s,color .15s
}
.nav__a svg{width:18px;height:18px;flex:none;opacity:.85}
.nav__a:hover{background:var(--surface);color:var(--text)}
.nav__a[aria-current="page"]{background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--line)}
.nav__a[aria-current="page"] svg{color:var(--accent-text);opacity:1}
.nav__a[aria-current="page"]::before{content:"";position:absolute;left:-12px;top:10px;bottom:10px;width:2px;border-radius:0 2px 2px 0;background:var(--accent)}
.nav__count{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:6px;background:var(--accent);color:var(--ink);font-family:var(--mono);font-size:11px;font-weight:700;display:grid;place-items:center}
.side__foot{margin-top:auto;display:flex;flex-direction:column;gap:2px;padding-top:10px;border-top:1px solid var(--line)}
.me-chip{display:flex;align-items:center;gap:10px;padding:8px;border-radius:var(--r-sm);transition:background-color .15s}
.me-chip:hover{background:var(--surface)}
.me-chip b{display:block;font-size:14px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-chip small{color:var(--dim);font-size:12px}
.side__tools{display:flex;gap:2px;align-items:center}

.main{min-width:0;padding:32px clamp(16px,3.4vw,52px) 88px}
.page{max-width:1160px;margin:0 auto;animation:page-in .28s var(--ease)}
@keyframes page-in{from{opacity:.3;transform:translateY(5px)}}

.topbar,.tabs{display:none}
@media (max-width:960px){
  .shell{display:block}
  .side{display:none}
  .topbar{
    position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:4px;height:calc(var(--top) + env(safe-area-inset-top));
    padding:env(safe-area-inset-top) 8px 0 16px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line)
  }
  .topbar .logo-link{margin-right:auto}
  .topbar .logo__mark{width:28px;height:28px}
  .topbar .logo__name{font-size:19px}
  .main{padding:20px 16px calc(var(--tabs) + 32px + env(safe-area-inset-bottom))}
  .tabs{
    position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(5,1fr);
    height:calc(var(--tabs) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);
    background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(16px);border-top:1px solid var(--line)
  }
  .tabs a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10.5px;font-weight:700;color:var(--dim);position:relative;min-height:44px}
  .tabs a svg{width:22px;height:22px}
  .tabs a[aria-current="page"]{color:var(--text)}
  .tabs a[aria-current="page"] svg{color:var(--accent-text)}
  .tabs a[aria-current="page"]::before{content:"";position:absolute;top:0;left:30%;right:30%;height:2px;border-radius:0 0 2px 2px;background:var(--accent)}
  .tabs .dot{position:absolute;top:10px;left:calc(50% + 7px);width:8px;height:8px;border-radius:50%;background:var(--warm);box-shadow:0 0 0 2px var(--bg)}
}

/* ── заголовки страниц ──────────────────────────────────────────────────── */
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-bottom:28px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.ph__kicker{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.ph__kicker,.ph__kicker a{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.ph__kicker a:hover{color:var(--text)}
.ph h1{font-family:var(--fd);font-weight:800;font-size:clamp(32px,4.4vw,52px);line-height:1;letter-spacing:-.035em}
.ph p{color:var(--muted);margin-top:12px;max-width:620px;font-size:16.5px}
.ph__actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
h2.sec{display:flex;align-items:baseline;gap:12px;margin:44px 0 16px;font-family:var(--fd);font-weight:800;font-size:22px;letter-spacing:-.02em}
h2.sec .label{font-weight:500}
h2.sec>a{margin-left:auto;font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
h2.sec>a:hover{text-decoration:underline;text-underline-offset:3px}
.muted{color:var(--muted)}
.dim{color:var(--dim)}
.small{font-size:13.5px}

/* ── кнопки ────────────────────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 16px;border-radius:10px;
  font-weight:700;font-size:14.5px;white-space:nowrap;transition:transform .15s var(--ease),background-color .2s,border-color .2s,color .2s;
  background:var(--surface-2);border:1px solid var(--line-strong);color:var(--text)
}
.btn svg{width:17px;height:17px;flex:none}
.btn:hover{border-color:color-mix(in srgb,var(--text) 32%,transparent)}
.btn:active{transform:translateY(1px)}
.btn--accent{
  color:var(--ink);border-color:transparent;background:var(--accent);
  box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 -1px 0 rgba(0,0,0,.18) inset
}
.btn--accent:hover{background:#3BEB93;border-color:transparent}
.btn--warm{color:var(--ink);border-color:transparent;background:var(--warm);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 -1px 0 rgba(0,0,0,.18) inset}
.btn--warm:hover{background:#FF9B57;border-color:transparent}
.btn--ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn--ghost:hover{background:var(--surface);color:var(--text);border-color:transparent}
.btn--sm{min-height:34px;padding:0 12px;font-size:13.5px;border-radius:8px}
.btn--danger{color:var(--red-text)}
.btn[disabled]{opacity:.5;pointer-events:none}
.btn.is-on{color:var(--accent-text);border-color:var(--accent-line);background:var(--accent-soft)}
.btn.btn--accent.is-on{color:var(--ink);background:var(--accent)}
.icon-btn{position:relative;display:grid;place-items:center;width:40px;height:40px;border-radius:9px;color:var(--muted);transition:background-color .15s,color .15s}
.icon-btn:hover{background:var(--surface);color:var(--text)}
.icon-btn svg{width:20px;height:20px}
.icon-btn .badge{position:absolute;top:5px;right:4px;min-width:17px;height:17px;padding:0 4px;border-radius:5px;background:var(--warm);color:var(--ink);font-family:var(--mono);font-size:10px;font-weight:700;display:grid;place-items:center;box-shadow:0 0 0 2px var(--bg)}

/* ── окно и карточка ──────────────────────────────────────────────────── */
.win{position:relative;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--lift);overflow:hidden}
.win__bar{height:36px;display:flex;align-items:center;gap:9px;padding:0 14px;border-bottom:1px solid var(--line);
  font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.win__bar::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--tint,var(--dim));flex:none}
.win__bar span{overflow:hidden;text-overflow:ellipsis}
.win__bar .win__right{margin-left:auto}
.win__body{padding:20px}
:where(a).win{display:block;transition:border-color .2s,background-color .2s,transform .25s var(--ease)}
:where(a).win:hover{border-color:var(--line-strong);background:var(--surface-2)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px}
a.card{transition:border-color .2s,background-color .2s}
a.card:hover{border-color:var(--line-strong);background:var(--surface-2)}
.t-accent{--tint:var(--accent)}
.t-warm{--tint:var(--warm)}
.t-red{--tint:var(--red)}
.t-paper{--tint:var(--paper)}

.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.g3{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr))}
.stack{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;min-width:0}

/* плитка со значком вместо эмодзи */
.tile{--s:40px;width:var(--s);height:var(--s);flex:none;display:grid;place-items:center;border-radius:10px;
  background:var(--surface-3);border:1px solid var(--line);color:var(--muted)}
.tile svg{width:calc(var(--s) * .48);height:calc(var(--s) * .48)}
.tile--accent{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent-text)}
.tile--warm{background:var(--warm-soft);border-color:var(--warm-line);color:var(--warm-text)}
.tile--red{background:var(--red-soft);border-color:color-mix(in srgb,var(--red) 40%,transparent);color:var(--red-text)}
.tile--lg{--s:64px;border-radius:16px}

/* номер «01»: деталь с номером, как в инструкции по сборке */
.key{
  --s:48px;width:var(--s);height:var(--s);flex:none;border-radius:10px;display:grid;place-items:center;
  font-family:var(--mono);font-weight:600;font-size:15px;letter-spacing:.02em;color:var(--muted);
  background:var(--surface-2);border:1px solid var(--line-strong);box-shadow:0 1px 0 rgba(255,255,255,.05) inset
}
.key svg{width:20px;height:20px}
.key--sm{--s:38px;font-size:13px;border-radius:9px}
.key--done{background:var(--accent);border-color:transparent;color:var(--ink);box-shadow:0 1px 0 rgba(255,255,255,.4) inset}
.key--now{background:var(--text);border-color:transparent;color:var(--bg);box-shadow:0 1px 0 rgba(255,255,255,.4) inset}
.key--red{background:var(--red);border-color:transparent;color:var(--ink)}
.key--off{color:var(--dim);background:transparent;border-style:dashed}

/* ── статусы ───────────────────────────────────────────────────────────── */
.chip{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:7px;font-size:12.5px;font-weight:700;
  background:var(--surface-3);color:var(--muted);white-space:nowrap;border:1px solid transparent}
.chip::before{content:"";width:6px;height:6px;border-radius:2px;background:currentColor}
.chip--plain::before{display:none}
.chip--submitted{background:transparent;border-color:var(--line-strong);color:var(--text)}
.chip--changes{background:var(--red-soft);color:var(--red-text)}
.chip--accepted,.chip--done{background:var(--accent-soft);color:var(--accent-text)}
.chip--draft{background:transparent;border-color:var(--warm-line);color:var(--warm-text);font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:500}
.chip--todo{background:transparent;border-color:var(--line);color:var(--dim)}
.chip--late{background:var(--red-soft);color:var(--red-text)}
.chip--now{background:var(--warm);color:var(--ink)}
.tag{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;
  background:var(--surface-3);color:var(--muted)}

/* ── аватар: графитовая плитка с инициалами краской ──────────────────────── */
.ava{--s:36px;width:var(--s);height:var(--s);flex:none;border-radius:28%;display:grid;place-items:center;overflow:hidden;
  background:var(--surface-3);border:1px solid var(--line-strong);color:var(--tint);
  font-family:var(--fd);font-weight:800;font-size:calc(var(--s) * .38);letter-spacing:-.02em}
.ava img{width:100%;height:100%;object-fit:cover}
.ava--lg{--s:84px}
.ava--md{--s:46px}
.ava--sm{--s:28px}

/* ── главная ───────────────────────────────────────────────────────────── */
.hello{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.hello h1{font-family:var(--fd);font-weight:800;font-size:clamp(30px,4vw,46px);letter-spacing:-.035em;line-height:1;margin-top:10px}
.hello__meta{display:flex;gap:8px;flex-wrap:wrap}

.next{position:relative}
.next .win__body{padding:clamp(22px,3vw,34px);display:grid;gap:18px;position:relative}
.next__big{position:absolute;right:clamp(14px,2.4vw,30px);top:clamp(6px,1.4vw,14px);font-family:var(--fd);font-weight:800;font-size:clamp(90px,12vw,150px);line-height:1;letter-spacing:-.06em;
  color:transparent;-webkit-text-stroke:1.5px var(--line);pointer-events:none;user-select:none}
.next h2{font-family:var(--fd);font-weight:800;font-size:clamp(26px,3.2vw,38px);line-height:1.04;letter-spacing:-.03em;max-width:15em;position:relative}
.next p{color:var(--muted);max-width:560px;position:relative}
.spec{display:grid;grid-template-columns:auto auto minmax(0,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}
.spec>div{padding:12px 18px 12px 0;display:grid;gap:4px;min-width:0;align-content:start}
.spec>div+div{padding-left:18px;border-left:1px solid var(--line)}
.spec>div.wide{grid-column:1/-1;padding-left:0;border-left:0;border-top:1px solid var(--line)}
.spec b{font-size:14.5px;font-weight:700;line-height:1.35}
.spec a{color:var(--accent-text)}
@media (max-width:760px){
  .spec{grid-template-columns:1fr 1fr}
  .spec>div:nth-child(3){grid-column:1/-1;padding-left:0;border-left:0;border-top:1px solid var(--line)}
}
.next__actions{display:flex;gap:10px;flex-wrap:wrap;position:relative}

.resume{display:flex;align-items:center;gap:14px}
.resume b{display:block;font-size:15px;line-height:1.3}
.resume .label{display:block;margin-bottom:4px}
.resume svg.arr{width:18px;height:18px;margin-left:auto;color:var(--dim);flex:none;transition:transform .2s var(--ease),color .2s}
.resume:hover svg.arr{transform:translateX(3px);color:var(--text)}

.ann{border-left:2px solid var(--warm);border-radius:4px var(--r) var(--r) 4px}
.ann h3{font-size:16px;font-weight:800;margin:8px 0 4px}
.ann p{color:var(--muted);font-size:14.5px;white-space:pre-line}
.ann small{display:block;color:var(--dim);margin-top:10px;font-size:12.5px}

.facts{display:grid;gap:14px;font-size:14.5px}
.facts>div{display:flex;gap:12px;align-items:flex-start}
.facts>div>svg{width:17px;height:17px;flex:none;margin-top:3px;color:var(--dim)}
.facts a{color:var(--accent-text);font-weight:700}

.next__intro{display:grid;gap:14px;align-content:center;min-width:0}
.next--meeting .win__body{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:clamp(24px,4vw,64px)}
.next--meeting .spec{grid-template-columns:1fr 1fr}
.next--meeting .spec>div:nth-child(3){grid-column:1/-1;border-left:0;border-top:1px solid var(--line);padding-left:0}
.next--meeting .spec a{font-size:14.5px;font-weight:700}
@media (max-width:760px){.next--meeting .win__body{grid-template-columns:1fr;gap:22px}}
.home-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr));gap:14px;margin-top:14px}
.home-program{container-type:inline-size;min-width:0}
.home-program h2.sec{margin:28px 0 14px}
.home-totals{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 28px;padding:12px 20px;font-size:13px}
.home-totals b{font-variant-numeric:tabular-nums}
.home-meta{display:flex;gap:12px 24px;flex-wrap:wrap;margin-top:28px}
.home-meta a{display:inline-flex;align-items:center;gap:7px;color:var(--accent-text)}
.home-meta svg{width:16px;height:16px}
.no-lessons{padding:18px 20px}
@media (min-width:761px){
  .home-news .ann{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,2fr);gap:5px 24px;align-items:baseline}
  .home-news .ann .label,.home-news .ann h3{grid-column:1}
  .home-news .ann h3,.home-news .ann small{margin:0}
  .home-news .ann p{grid-column:2;grid-row:1 / span 2}
  .home-news .ann small{grid-column:2}
}
/* путь курса: шаги на одной линии */
.path{position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(110px,1fr));gap:0;overflow-x:auto;padding:22px 20px 18px}
.path a{position:relative;display:grid;justify-items:start;gap:10px;padding-right:14px;min-width:0}
.path a::after{content:"";position:absolute;left:46px;right:6px;top:19px;height:1px;background:var(--line-strong)}
.path a:last-child::after{display:none}
.path a.done::after{background:var(--accent-line)}
.path b{font-size:13.5px;line-height:1.3;font-weight:700}
.path .label{font-size:10.5px}
.path a:hover b{color:var(--accent-text)}

/* ── курс ──────────────────────────────────────────────────────────────── */
@container (max-width:592px){
  .home-program .path{grid-template-columns:1fr;padding:4px 14px}
  .home-program .path a{grid-template-columns:34px 1fr;column-gap:12px;row-gap:3px;padding:10px 0}
  .home-program .path a + a{border-top:1px solid var(--line)}
  .home-program .path a::after{display:none}
  .home-program .path .key{grid-row:span 2;align-self:center;--s:32px}
}
/* Счётчик и шкала компактны; место и расписание получают ширину для чтения. */
.course-head{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:6px}
.course-progress{flex:1 1 255px;min-width:0;display:flex;flex-direction:column;align-items:start}
.course-info{flex:2 1 470px;min-width:0;container-type:inline-size;display:grid;align-content:center}
.course-details{display:grid;grid-template-columns:.85fr 1.1fr 1.15fr;gap:16px}
.course-details dt{display:flex;align-items:center;gap:7px;margin-bottom:6px}
.course-details dt svg{width:15px;height:15px;flex:none}
.course-details dd{font-size:14.5px;line-height:1.45}
.course-details a{color:var(--accent-text);font-weight:700}
@container (max-width:510px){
  .course-details{grid-template-columns:1fr;gap:12px}
  .course-details>div{display:grid;grid-template-columns:86px minmax(0,1fr);gap:8px;align-items:baseline}
  .course-details dt{margin:0}
}
.course-count{font-family:var(--fd);font-weight:800;font-size:38px;line-height:1.1;letter-spacing:-.035em;font-variant-numeric:tabular-nums;margin:4px 0 16px}
.course-count>span{font-size:20px;letter-spacing:0;color:var(--muted)}
.course-scale{width:100%;margin-top:auto;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(30px,1fr));gap:4px}
.course-scale li{border-top:4px solid var(--line-strong);padding-top:5px;color:var(--muted);font:11px/1.2 var(--mono);font-variant-numeric:tabular-nums}
.course-scale li.is-done{border-color:var(--accent);color:var(--accent-text)}
.course-scale li>span:first-child{display:flex;align-items:center;gap:3px}
.course-scale svg{width:12px;height:12px}
@media (max-width:600px){
  .course-progress{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:10px}
  .course-count{margin:0;font-size:32px}
  .course-scale{grid-column:1/-1}
}
.bar{height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.bar i{display:block;height:100%;border-radius:3px;background:var(--accent);transition:width 1s var(--ease)}

.lessons{display:grid;gap:10px}
.lesson-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px;align-items:center;padding:20px 22px}
.lesson-row h3{font-family:var(--fd);font-weight:800;font-size:20px;line-height:1.15;letter-spacing:-.02em}
.lesson-row p{color:var(--muted);font-size:14.5px;margin-top:6px;max-width:620px}
.lesson-row .meta{display:flex;gap:6px 16px;flex-wrap:wrap;margin-top:10px}
.lesson-row .side-st{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.lesson-row.is-now{border-color:var(--warm-line)}
@media (max-width:640px){
  .lesson-row{grid-template-columns:auto minmax(0,1fr);padding:16px;gap:14px;align-items:start}
  .lesson-row .side-st{grid-column:2;flex-direction:row;flex-wrap:wrap;align-items:center}
}

.seg{display:inline-flex;padding:3px;gap:2px;border-radius:10px;background:var(--surface);border:1px solid var(--line);margin-bottom:20px;max-width:100%;overflow-x:auto}
.seg a,.seg button{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border-radius:8px;font-weight:700;font-size:14px;color:var(--muted);white-space:nowrap}
.seg a:hover{color:var(--text)}
.seg [aria-current="page"],.seg .is-on{background:var(--surface-3);color:var(--text)}
.seg .n{font-family:var(--mono);font-size:11px;color:var(--dim)}

/* ── чтение: занятие и гайд ─────────────────────────────────────────────── */
.read{display:grid;grid-template-columns:minmax(0,740px) 220px;gap:64px;justify-content:center}
.read:not(:has(>.read__aside)){grid-template-columns:minmax(0,740px)}
.read__aside{position:sticky;top:32px;align-self:start;max-height:calc(100dvh - 64px);overflow:auto}
@media (max-width:1240px){.read{grid-template-columns:minmax(0,740px)}.read__aside{display:none}}
.toc__t{margin-bottom:12px;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.toc a{display:block;padding:6px 0 6px 14px;border-left:1px solid var(--line-strong);font-size:13.5px;font-weight:600;color:var(--dim);line-height:1.35;transition:color .15s,border-color .15s}
.toc a.lvl3{padding-left:26px;font-weight:500}
.toc a:hover{color:var(--text)}
.toc a.on{color:var(--text);border-left:2px solid var(--warm);padding-left:13px}
.toc a.lvl3.on{padding-left:25px}
.toc-mobile{display:none;margin-bottom:24px}
@media (max-width:1240px){.toc-mobile{display:block}}
.toc-mobile summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;font-weight:700;font-size:14.5px;padding:12px 14px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line)}
.toc-mobile summary::-webkit-details-marker{display:none}
.toc-mobile summary>svg{width:17px;height:17px}
.toc-mobile summary>svg:last-child{margin-left:auto;transition:transform .2s}
.toc-mobile[open] summary>svg:last-child{transform:rotate(180deg)}
.toc-mobile .toc{padding:12px 4px 2px}

.doc-head{margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.doc-head h1{font-family:var(--fd);font-weight:800;font-size:clamp(32px,4.8vw,56px);line-height:1;letter-spacing:-.04em}
.doc-head .lead{font-size:clamp(17px,1.7vw,19px);color:var(--muted);margin-top:16px}
.doc-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:18px;align-items:center}
.doc-meta span,.doc-meta a{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.doc-meta a{color:var(--accent-text)}
.doc-meta svg{width:14px;height:14px}
.doc-result{margin-top:18px;padding:14px 16px;border-radius:var(--r-sm);background:var(--accent-soft);border:1px solid var(--accent-line);display:grid;gap:4px}
.doc-result p{font-size:15px}
.doc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}

.prose{font-size:16.5px;line-height:1.62}
.prose>*+*,.prose .part>*+*{margin-top:.8em}
.prose .part{margin-top:52px}
.prose .part:first-child{margin-top:0}
.prose h2{font-family:var(--fd);font-weight:800;font-size:clamp(23px,2.4vw,28px);line-height:1.12;letter-spacing:-.025em;scroll-margin-top:28px}
.prose h2 .h2-n{display:block;font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.08em;color:var(--warm-text);margin-bottom:10px}
.prose h3{font-family:var(--fd);font-weight:800;font-size:19px;line-height:1.25;letter-spacing:-.01em;margin-top:1.5em;scroll-margin-top:28px}
.prose h4{font-size:16.5px;font-weight:800;margin-top:1.3em}
.prose a:not(.btn):not(.link){color:var(--accent-text);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose strong{font-weight:800}
.prose ul,.prose ol{padding-left:1.3em}
.prose li+li{margin-top:.3em}
.prose li::marker{color:var(--dim)}
.prose ol>li::marker{color:var(--warm-text);font-family:var(--mono);font-size:.86em}
.prose code{font-family:var(--mono);font-size:.84em;padding:.1em .38em;border-radius:5px;background:var(--surface-3);border:1px solid var(--line)}
.prose blockquote{position:relative;padding:4px 0 4px 26px;color:var(--text);font-size:1.06em}
.prose blockquote::before{content:"“";position:absolute;left:0;top:-6px;font-family:var(--fd);font-weight:800;font-size:40px;line-height:1;color:var(--warm)}
.prose hr{border:0;height:1px;background:var(--line);margin:2em 0}
.prose .tbl{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-sm)}
.prose table{border-collapse:collapse;width:100%;font-size:15px;line-height:1.45}
.prose th,.prose td{padding:10px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.prose th{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:500;color:var(--dim);background:var(--surface);white-space:nowrap}
.prose tr:last-child td{border-bottom:0}

/* шаг: крупный номер, линия ведет к следующему шагу */
.prose .part--step{position:relative;padding-left:76px}
.prose .part--step::before{content:"";position:absolute;left:25px;top:60px;bottom:-44px;width:1px;background:linear-gradient(var(--line-strong),var(--line-strong) 70%,transparent)}
.prose .part--step:not(:has(+ .part--step))::before{bottom:0;background:linear-gradient(var(--line-strong),transparent)}
.step-h{display:flex;align-items:center;gap:20px;margin-left:-76px}
.step-n{width:52px;height:52px;flex:none;border-radius:13px;display:grid;place-content:center;justify-items:center;line-height:1;
  background:var(--surface-2);border:1px solid var(--line-strong);font-family:var(--mono);font-size:17px;font-weight:600;color:var(--text);box-shadow:0 1px 0 rgba(255,255,255,.05) inset}
.step-n small{font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--warm-text);margin-bottom:4px}
.part--step.is-current .step-n{background:var(--warm);border-color:transparent;color:var(--ink)}
.part--step.is-current .step-n small{color:var(--ink)}
@media (max-width:640px){
  .prose .part--step{padding-left:0}
  .prose .part--step::before{display:none}
  .step-h{margin-left:0;gap:14px}
  .step-n{width:44px;height:44px;font-size:15px}
}

/* план по времени */
.prose ol.timeline{list-style:none;padding:0;display:grid;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);padding:6px 0}
.timeline li{display:grid;grid-template-columns:64px 18px minmax(0,1fr);align-items:baseline;padding:7px 16px 7px 0;margin:0 !important;position:relative}
.timeline li::before{content:"";position:absolute;left:72px;top:0;bottom:0;width:1px;background:var(--line)}
.timeline li:first-child::before{top:50%}
.timeline li:last-child::before{bottom:50%}
.timeline li::after{content:"";position:absolute;left:69px;top:calc(50% - 3.5px);width:7px;height:7px;border-radius:2px;background:var(--surface-3);border:1px solid var(--line-strong)}
.timeline li:first-child::after,.timeline li:last-child::after{background:var(--warm);border-color:transparent}
.timeline time{grid-column:1;font-family:var(--mono);font-size:13px;color:var(--warm-text);text-align:right;padding-right:4px}
.timeline span{grid-column:3;font-size:15.5px}

/* пункты с жирным началом: сетка карточек */
.prose ul.cards,.prose ol.cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:10px;counter-reset:card}
.cards li{margin:0 !important;padding:14px 16px 15px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line);font-size:14.5px;line-height:1.5;display:grid;gap:5px;align-content:start;color:var(--muted)}
.cards__t{font-weight:800;font-size:15.5px;line-height:1.3;color:var(--text)}
ol.cards li::before{counter-increment:card;content:counter(card,decimal-leading-zero);font-family:var(--mono);font-size:11px;color:var(--warm-text);margin-bottom:2px}
ul.cards li{border-left:2px solid var(--accent-line)}

/* словарь: карточки терминов */
.prose dl.defs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:10px}
.defs div{padding:14px 16px 15px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line);transition:border-color .2s}
.defs div:hover{border-color:var(--line-strong)}
.defs dt{font-family:var(--fd);font-weight:800;font-size:17px;line-height:1.2;letter-spacing:-.015em;margin-bottom:6px}
.defs dd{color:var(--muted);font-size:14.5px;line-height:1.5}

/* промпт как сообщение агенту, команда как окно терминала */
.blk{border-radius:var(--r);overflow:hidden;border:1px solid var(--line-strong);background:var(--surface)}
.blk__bar{display:flex;align-items:center;gap:10px;height:40px;padding:0 6px 0 14px;border-bottom:1px solid var(--line)}
.blk__name{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.blk__name svg{width:15px;height:15px;color:var(--tint,var(--dim))}
.blk--prompt{--tint:var(--accent-text);border-color:var(--accent-line);background:linear-gradient(180deg,var(--accent-soft),transparent 80px),var(--surface)}
.blk--prompt .blk__bar{border-bottom-color:var(--accent-line)}
.blk--prompt pre{border-left:2px solid var(--accent);margin:14px 16px 16px !important;padding:2px 0 2px 14px !important}
.blk--term,.blk--code{--tint:var(--warm);background:#0B0B0E;border-color:rgba(255,255,255,.12);color:#E9E9EE}
.blk--term .blk__bar,.blk--code .blk__bar{border-bottom-color:rgba(255,255,255,.08)}
.blk--term .blk__name,.blk--code .blk__name{color:#8A8A94}
.blk__copy{margin-left:auto;height:28px;padding:0 11px;border-radius:7px;font-size:12.5px;font-weight:700;background:var(--surface-3);color:var(--text);transition:background-color .15s,color .15s}
.blk--term .blk__copy,.blk--code .blk__copy{background:#202026;color:#F2F2F5}
.blk__copy:hover,.blk__copy.ok{background:var(--accent) !important;color:var(--ink) !important}
.blk pre{margin:0;padding:16px 18px;overflow-x:auto;font-family:var(--mono);font-size:14px;line-height:1.65;white-space:pre-wrap;word-break:break-word}
.blk--term pre,.blk--code pre{white-space:pre;word-break:normal}
.blk--term pre code::before{content:"$ ";color:var(--warm)}
.blk--prompt pre,.prose .blk--prompt code{font-family:var(--fb);font-size:15.5px;line-height:1.6}
.prose .blk code{background:none;border:0;padding:0;font-size:inherit;color:inherit}

.call{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;border-radius:var(--r-sm);padding:14px 16px;background:var(--surface);border:1px solid var(--line)}
.call__ic{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--tint) 14%,transparent);color:var(--tint)}
.call__ic svg{width:17px;height:17px}
.call__body>*+*{margin-top:.5em}
.call__name{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--tint);line-height:32px;margin-bottom:-6px}
.call--tip{--tint:var(--accent-text)}
.call--note{--tint:var(--muted)}
.call--warn{--tint:var(--red-text);border-color:color-mix(in srgb,var(--red) 35%,transparent)}

.hw-task{margin-top:52px !important;border-radius:var(--r-lg);padding:clamp(18px,3vw,28px);border:1px solid var(--accent-line);background:var(--surface);scroll-margin-top:28px;position:relative;overflow:hidden}
.hw-task::before{content:"";position:absolute;left:0;top:0;right:0;height:2px;background:var(--accent)}
.hw-task>*+*{margin-top:.8em}
.hw-task__head{display:flex;align-items:center;gap:14px}
.hw-task__head .label{display:block;margin-bottom:4px}
.prose .hw-task h2{margin:0;padding:0;border:0;font-size:24px}

/* обложка материала: текст слева, паспорт справа; «Внутри» — разделы карточками */
.cover{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:28px;align-items:end}
.passport{display:grid;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--surface);overflow:hidden}
.passport>div{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid var(--line);font-size:13.5px;font-weight:700}
.passport>div:first-child{border-top:0}
.passport .label{font-size:10.5px;align-self:center}
.passport a{color:var(--accent-text)}
.passport__type{display:grid !important;gap:10px;padding:16px 14px !important;background:var(--warm-soft)}
.passport__type .tile{--s:44px}
.passport__type b{font-family:var(--fd);font-size:22px;letter-spacing:-.02em;text-transform:capitalize}
@media (max-width:760px){.cover{grid-template-columns:1fr}.passport{grid-template-columns:1fr 1fr}.passport__type{grid-column:1/-1;grid-template-columns:auto 1fr;align-items:center}}
.inside{margin:0 0 34px}
.inside .label{display:block;margin-bottom:12px}
.inside__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:8px}
.inside__grid a{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:baseline;padding:11px 13px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--surface);font-size:14px;font-weight:700;line-height:1.3;transition:border-color .15s,background-color .15s}
.inside__grid a:hover{border-color:var(--warm-line);background:var(--surface-2)}
.inside__grid a span{font-family:var(--mono);font-size:11px;font-weight:500;color:var(--warm-text)}

/* ── формы ─────────────────────────────────────────────────────────────── */
.form{display:grid;gap:16px}
.field{display:grid;gap:7px}
.field label,.field .lbl{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.field small{color:var(--dim);font-size:12.5px}
.input,.textarea,.select{
  width:100%;min-height:44px;padding:10px 13px;border-radius:9px;border:1px solid var(--line-strong);background:var(--bg);
  font-size:16px;transition:border-color .15s,box-shadow .15s
}
.textarea{min-height:110px;resize:vertical;line-height:1.5}
.input:focus,.textarea:focus,.select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.form__row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.drop{display:flex;align-items:center;gap:12px;padding:12px;border-radius:9px;border:1px dashed var(--line-strong);color:var(--dim);font-size:14px;cursor:pointer;transition:border-color .15s,color .15s}
.drop:hover{border-color:var(--accent);color:var(--text)}
.drop img{width:64px;height:44px;object-fit:cover;border-radius:5px}
.drop svg{width:20px;height:20px}
.check{display:flex;align-items:center;gap:10px;font-weight:600;font-size:14.5px;cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--accent)}
.notes textarea{min-height:130px}
.saved{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}

/* ── домашки и обсуждения ──────────────────────────────────────────────── */
.hw-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 18px}
.hw-row b{font-size:16px;line-height:1.3;display:block}
.hw-row small{color:var(--dim);font-size:13px;display:block;margin-top:3px}
@media (max-width:640px){.hw-row{grid-template-columns:auto minmax(0,1fr)}.hw-row>.chip,.hw-row>.btn{grid-column:2;justify-self:start}}
.sub-card{display:grid;gap:14px}
.sub-card .link{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:9px;background:var(--bg);border:1px solid var(--line);font-weight:700;font-size:14.5px;word-break:break-all;transition:border-color .15s}
.sub-card .link:hover{border-color:var(--accent-line)}
.sub-card .link svg{width:17px;height:17px;flex:none;color:var(--accent-text)}
.sub-card .shot{border-radius:9px;border:1px solid var(--line);max-height:460px;object-fit:contain;background:var(--bg)}
.thread{display:grid;gap:14px}
.msg{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px}
.msg__b{background:var(--surface);border:1px solid var(--line);border-radius:3px 12px 12px 12px;padding:11px 14px}
.msg--lead .msg__b{border-color:var(--accent-line)}
.msg__h{display:flex;gap:8px;align-items:center;font-size:13px;margin-bottom:4px;flex-wrap:wrap}
.msg__h b{font-size:14px}
.msg__h small{color:var(--dim)}
.msg p{white-space:pre-line;word-break:break-word;font-size:15px}
.reply{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;margin-top:4px}
.reply .textarea{min-height:46px;height:46px}
.reply .btn{min-height:46px;width:46px;padding:0}
.review-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:12px 14px;border-radius:var(--r);background:var(--surface-2);border:1px solid var(--line-strong)}

/* ── витрина ───────────────────────────────────────────────────────────── */
.proj{display:flex;flex-direction:column}
.proj__cover{aspect-ratio:16/10;position:relative;overflow:hidden;background:var(--surface-2);border-bottom:1px solid var(--line)}
.proj__cover img.shot{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.proj:hover .proj__cover img.shot{transform:scale(1.03)}
/* обложка без скриншота: чертеж окна на сетке, краска проекта на строке заголовка */
.cover-gen{position:absolute;inset:0;display:grid;place-items:center;background:
  linear-gradient(var(--line) 1px,transparent 1px) 0 0/20px 20px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/20px 20px,var(--surface-2)}
.cover-gen .mock{width:64%;aspect-ratio:16/10.5;border-radius:8px;background:var(--surface);border:1px solid var(--line-strong);box-shadow:0 22px 34px -20px rgba(0,0,0,.8);overflow:hidden;display:grid;grid-template-rows:14% 1fr}
.cover-gen .mock i{background:var(--tint)}
.cover-gen .mock div{padding:9% 9%;display:grid;align-content:start;gap:8%}
.cover-gen .mock b{display:block;height:13%;min-height:7px;width:60%;border-radius:3px;background:var(--text);opacity:.85}
.cover-gen .mock s{display:block;height:7%;min-height:4px;border-radius:2px;background:var(--dim);opacity:.45}
.cover-gen .mock u{display:block;height:15%;min-height:9px;width:34%;border-radius:4px;background:var(--tint);margin-top:4%}
.cover-gen .kind{position:absolute;left:12px;bottom:10px}
.proj__body{padding:14px 16px 16px;display:grid;gap:8px;flex:1}
.proj__body :is(h2,h3){font-family:var(--fd);font-weight:800;font-size:18px;line-height:1.2;letter-spacing:-.015em}
.proj__body p{color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.proj__foot{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:4px;font-size:13px;color:var(--dim);font-weight:600}
.proj__foot .who{display:flex;align-items:center;gap:8px;color:var(--muted);min-width:0}
.proj__foot .who span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stat{display:inline-flex;align-items:center;gap:4px;font-family:var(--mono);font-size:12px}
.stat svg{width:15px;height:15px}
.who+.stat{margin-left:auto}
.stat.on{color:var(--warm-text)}
.fire.is-on{color:var(--warm-text);border-color:var(--warm-line);background:var(--warm-soft)}
.project-hero{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line-strong);background:var(--surface-2)}
.project-hero img.shot{width:100%;height:auto;max-height:70vh;object-fit:contain}
.project-intro{display:flex;align-items:center;gap:18px}
.project-intro p{min-width:0;white-space:pre-line;overflow-wrap:anywhere}
.project-thumb{position:relative;overflow:hidden;flex:none;width:clamp(95px,16vw,160px);aspect-ratio:16/10;border-radius:var(--r-sm)}
.project-thumb .kind{display:none}
@media (max-width:500px){.project-intro{flex-direction:column;align-items:start}.project-thumb{display:none}}

/* ── участники ─────────────────────────────────────────────────────────── */
.person{display:grid;gap:12px;padding:18px;align-content:start}
.person__top{display:flex;gap:12px;align-items:center}
.person__top b{font-size:16px;display:block;line-height:1.25}
.person p{color:var(--muted);font-size:14.5px}
.person .goal{font-size:14px;color:var(--text)}
.person .goal .label{display:block;margin-bottom:3px}
.detail-page{max-width:850px;margin-inline:auto}
.detail-page .ph{margin-bottom:18px}
.project-byline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.member-awards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:14px}
.admin-tools{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));margin-top:12px}
@media (min-width:701px){
  .account-settings .field{display:grid;grid-template-columns:140px minmax(0,1fr);align-items:baseline}
  .account-settings .field>button{grid-column:2}
}
.profile-head{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-bottom:26px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.profile-head h1{font-family:var(--fd);font-weight:800;font-size:clamp(28px,4vw,44px);letter-spacing:-.035em;line-height:1}
.profile-head p{margin-top:8px}
.profile-head h1,.profile-head p{overflow-wrap:anywhere}
@media (max-width:700px){
  .profile-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px 14px}
  .profile-head>.ph__actions,.profile-head>.btn{grid-column:1/-1;justify-self:start}
}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.badge-card{display:grid;gap:10px;padding:16px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);align-content:start}
.badge-card b{font-size:14.5px}
.badge-card small{font-size:12.5px;color:var(--dim);line-height:1.4}
.badge-card.got{border-color:var(--accent-line)}
.badge-card.off{opacity:.55}

/* ── календарь ─────────────────────────────────────────────────────────── */
.ev{display:grid;grid-template-columns:68px minmax(0,1fr) auto;gap:18px;align-items:center;padding:14px 18px}
.ev__date{display:grid;justify-items:center;line-height:1;padding:10px 0;border-radius:10px;border:1px solid var(--line-strong)}
.ev__date b{font-family:var(--fd);font-weight:800;font-size:26px;letter-spacing:-.03em}
.ev__date .label{margin-top:5px;font-size:10px}
.ev b.t{font-size:16px;display:block;line-height:1.3}
.ev small.m{color:var(--dim);font-size:13.5px;display:block;margin-top:3px}
.ev--deadline .ev__date{border-color:var(--warm-line);color:var(--warm-text)}
.ev--lesson .ev__date{border-color:var(--accent-line)}
.ev--past{opacity:.5}
@media (max-width:640px){.ev{grid-template-columns:58px minmax(0,1fr);gap:14px}.ev>.chip{grid-column:2;justify-self:start}}

/* ── уведомления ───────────────────────────────────────────────────────── */
.notif{display:flex;gap:14px;align-items:center;padding:12px 14px;border-radius:var(--r-sm);transition:background-color .15s}
.notif:hover{background:var(--surface-2)}
.notif b{font-weight:600;font-size:15px;display:block;line-height:1.35}
.notif small{color:var(--dim);font-size:12.5px}
.notif.unread b{font-weight:800}
.notif.unread::after{content:"";width:8px;height:8px;border-radius:2px;background:var(--warm);margin-left:auto;flex:none}

/* ── управление ────────────────────────────────────────────────────────── */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.table{border-collapse:collapse;width:100%;font-size:14px}
.table th,.table td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
.table th{font-family:var(--mono);font-size:10.5px;font-weight:500;color:var(--dim);text-transform:uppercase;letter-spacing:.08em}
.table tr:last-child td{border-bottom:0}
.table tbody tr:hover{background:var(--surface-2)}
.table td .ok{color:var(--accent-text);font-weight:800}
.invite{display:flex;gap:10px;align-items:center;padding:12px 14px;border-top:1px solid var(--line);flex-wrap:wrap}
.invite:first-child{border-top:0}
.invite code{font-family:var(--mono);font-size:12.5px;background:var(--surface-3);padding:3px 8px;border-radius:5px;word-break:break-all}

/* ── пустые состояния, загрузка, тосты ─────────────────────────────────── */
.empty{display:grid;justify-items:center;text-align:center;gap:12px;padding:44px 20px;border:1px dashed var(--line-strong);border-radius:var(--r-lg)}
.empty :is(b,h1){font-family:var(--fd);font-weight:800;font-size:19px;letter-spacing:-.01em}
.empty p{color:var(--muted);max-width:420px;font-size:15px}
.skel{display:grid;gap:14px}
.skel i{display:block;height:120px;border-radius:var(--r);background:linear-gradient(90deg,var(--surface) 0%,var(--surface-2) 50%,var(--surface) 100%) 0 0/200% 100%;animation:skel 1.2s linear infinite}
.skel i:first-child{height:48px;width:50%}
@keyframes skel{to{background-position:-200% 0}}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:100;transform:translate(-50%,16px);opacity:0;
  padding:11px 16px;border-radius:10px;background:var(--text);color:var(--bg);font-weight:700;font-size:14px;box-shadow:0 20px 40px -18px rgba(0,0,0,.8);
  transition:opacity .25s,transform .35s var(--ease);pointer-events:none;max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
@media (max-width:960px){.toast{bottom:calc(var(--tabs) + 16px + env(safe-area-inset-bottom))}}

/* ── модальные окна и поиск ─────────────────────────────────────────────── */
.modal{position:fixed;inset:0;z-index:80;display:grid;place-items:start center;padding:10vh 16px 16px;background:rgba(5,5,7,.62);backdrop-filter:blur(6px);animation:fade .2s}
.modal__box{width:min(600px,100%);max-height:80vh;overflow:auto;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:0 40px 80px -30px rgba(0,0,0,.9);animation:pop .3s var(--ease)}
.modal__head{display:flex;align-items:center;gap:10px;padding:14px 16px 14px 20px;border-bottom:1px solid var(--line)}
.modal__head h2{font-family:var(--fd);font-weight:800;font-size:20px;letter-spacing:-.02em}
.modal__head .icon-btn{margin-left:auto}
.modal__body{padding:20px}
@keyframes fade{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.985)}}
@media (max-width:640px){
  .modal{place-items:end stretch;padding:0}
  .modal__box{width:100%;max-height:92dvh;border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom);animation:sheet .35s var(--ease)}
  @keyframes sheet{from{transform:translateY(40px);opacity:.4}}
}
.pal__in{display:flex;align-items:center;gap:12px;padding:0 16px 0 18px;border-bottom:1px solid var(--line)}
.pal__in svg{width:19px;height:19px;color:var(--dim);flex:none}
.pal__in input{flex:1;min-width:0;height:56px;border:0;background:none;font-size:17px;outline:none}
.pal__list{padding:8px;display:grid}
.pal__item{display:grid;grid-template-columns:96px minmax(0,1fr);gap:2px 12px;align-items:center;padding:10px 12px;border-radius:9px}
.pal__item .tag{grid-row:span 2;justify-self:start}
.pal__item b{font-size:15px;line-height:1.3}
.pal__item small{color:var(--dim);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pal__item.on,.pal__item:hover{background:var(--surface-3)}
.pal__hint{padding:10px 18px 14px;font-size:12.5px;color:var(--dim);display:flex;gap:16px;border-top:1px solid var(--line)}
@media (max-width:640px){.pal__item{grid-template-columns:minmax(0,1fr)}.pal__item .tag{grid-row:auto}.pal__hint{display:none}}

/* ── вход ──────────────────────────────────────────────────────────────── */
.login{min-height:100dvh;display:grid;place-items:center;padding:32px 16px}
.login__box{width:min(420px,100%);display:grid;justify-items:center;text-align:center;gap:22px}
.login .logo{flex-direction:column;gap:22px}
.login .logo__mark{width:88px;height:88px}
.login .logo__name{font-size:clamp(44px,9vw,60px);letter-spacing:-.045em}
.login .logo__word{justify-items:center}
.login .logo__sub{margin-top:12px}
.login p{color:var(--muted)}
.login .btn{width:100%;min-height:50px;font-size:15.5px}
.login__card{width:100%;display:grid;gap:12px;padding:20px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line-strong);box-shadow:var(--lift)}
.login__or{display:flex;align-items:center;gap:12px}
.login__or::before,.login__or::after{content:"";flex:1;height:1px;background:var(--line)}
.login__demo{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.login__demo .btn{min-height:40px;font-size:14px;justify-content:flex-start}
.login small{color:var(--dim);font-size:12.5px;line-height:1.5}
.login small a{text-decoration:underline}
.invite-note{display:flex;align-items:center;gap:12px;text-align:left;padding:12px 14px;border-radius:var(--r);background:var(--warm-soft);border:1px solid var(--warm-line);font-size:14.5px;font-weight:600;width:100%}
.wait{display:grid;justify-items:center;gap:12px}
.spinner{width:26px;height:26px;border-radius:50%;border:2px solid var(--surface-3);border-top-color:var(--warm);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── режим показа на проекторе ─────────────────────────────────────────── */
body.show .side,body.show .topbar,body.show .tabs,body.show .read__aside,body.show .toc-mobile,body.show .doc-actions,body.show .after-doc,body.show .follow{display:none !important}
body.show .shell{display:block}
body.show .main{padding:56px clamp(24px,6vw,96px) 40vh}
body.show .read{grid-template-columns:minmax(0,1080px)}
body.show .prose{font-size:clamp(20px,1.7vw,26px)}
body.show .doc-head h1{font-size:clamp(44px,5.4vw,84px)}
body.show .blk pre{font-size:clamp(17px,1.4vw,22px)}
body.show .blk--prompt pre{font-size:clamp(18px,1.5vw,23px)}
body.show.idle,body.show.idle *{cursor:none}
.showbar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:90;display:none;align-items:center;gap:4px;padding:5px;border-radius:12px;
  background:color-mix(in srgb,var(--surface) 92%,transparent);border:1px solid var(--line-strong);backdrop-filter:blur(10px);box-shadow:0 20px 40px -18px rgba(0,0,0,.8);opacity:.4;transition:opacity .2s}
.showbar:hover{opacity:1}
body.show .showbar{display:flex}
.showbar span{font-family:var(--mono);font-size:12px;color:var(--muted);padding:0 10px;min-width:70px;text-align:center}
.showline{position:fixed;left:0;top:0;height:2px;background:var(--warm);z-index:91;width:0;display:none;transition:width .1s linear}
body.show .showline,body.reading .showline{display:block}
.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--warm);box-shadow:0 0 0 0 var(--warm-line);animation:pulse 1.6s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}

.secbar{position:sticky;top:calc(var(--top) + env(safe-area-inset-top));z-index:30;display:flex;gap:12px;align-items:center;justify-content:space-between;
  margin:0 -16px 14px;padding:9px 16px;font-size:13px;font-weight:700;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.secbar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.secbar b{font-family:var(--mono);font-weight:500;font-size:11.5px;color:var(--warm-text);flex:none}
.follow{position:fixed;right:20px;bottom:20px;z-index:50;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 16px;border-radius:12px;
  background:var(--surface-2);border:1px solid var(--warm-line);box-shadow:0 18px 36px -16px rgba(0,0,0,.8);font-weight:800;font-size:14px}
.follow.is-on{background:var(--warm);color:var(--ink);border-color:transparent}
.follow.is-on .live-dot{background:var(--ink)}
@media (max-width:960px){.follow{bottom:calc(var(--tabs) + 14px + env(safe-area-inset-bottom));right:14px}[data-show]{display:none !important}}

.after-doc{margin-top:48px;display:grid;gap:14px}
.pager{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pager a{display:grid;gap:6px;padding:16px 18px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);transition:border-color .2s}
.pager a:hover{border-color:var(--line-strong)}
.pager b{font-size:15px;line-height:1.3}
.pager>a:only-child{grid-column:1/-1}
.pager a.next-l{text-align:right;justify-items:end}

.lock{display:grid;justify-items:center;text-align:center;gap:12px;padding:48px 20px;border-radius:var(--r-lg);background:var(--surface);border:1px dashed var(--line-strong)}
.lock b{font-family:var(--fd);font-weight:800;font-size:20px;letter-spacing:-.01em}

/* ── библиотека ────────────────────────────────────────────────────────── */
.lib-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.lib-tools .input{max-width:380px;min-height:42px}
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:20px}
.filters button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:8px;font-size:13.5px;font-weight:700;color:var(--muted);border:1px solid var(--line)}
.filters button svg{width:14px;height:14px}
.filters button:hover{color:var(--text);border-color:var(--line-strong)}
.filters button.is-on{background:var(--text);color:var(--bg);border-color:var(--text)}
.filters button .n{font-family:var(--mono);font-size:11px;opacity:.6}
.guide{display:flex;flex-direction:column;height:100%}
.guide .win__body{display:grid;gap:10px;flex:1;align-content:start}
.guide :is(h2,h3){font-family:var(--fd);font-weight:800;font-size:19px;line-height:1.2;letter-spacing:-.02em}
.guide p{color:var(--muted);font-size:14.5px}
.guide .foot{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:8px}
.guide .foot .read-ok{color:var(--accent-text);display:inline-flex;align-items:center;gap:4px}
.guide .foot svg{width:14px;height:14px}
.star{margin-left:auto;display:grid;place-items:center;width:32px;height:32px;border-radius:7px;color:var(--dim);transition:background-color .15s,color .15s}
.star:hover{background:var(--surface-3);color:var(--text)}
.star.is-on{color:var(--warm-text)}
.star.is-on svg{fill:currentColor}
.star svg{width:17px;height:17px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
}
.hw-task__head .label{display:block;margin-bottom:4px}

/* каталог материалов: сетка разного размера, главный материал крупно */
.lib-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.guide .win__body{position:relative;overflow:hidden}
.guide__glyph{position:absolute;right:-14px;bottom:-18px;width:120px;height:120px;color:var(--line-strong);pointer-events:none;transition:color .3s,transform .4s var(--ease)}
.guide__glyph svg{width:100%;height:100%;stroke-width:1}
.guide:hover .guide__glyph{color:color-mix(in srgb,var(--tint) 45%,transparent);transform:rotate(-6deg) scale(1.04)}
.guide :is(h2,h3),.guide p,.guide .foot,.guide .label{position:relative}
.guide--feat{grid-column:span 2;border-color:var(--warm-line)}
.guide--feat .win__body{padding:26px 26px 22px;gap:12px}
.guide--feat h2{font-size:clamp(24px,2.6vw,32px);line-height:1.08;letter-spacing:-.03em;max-width:14em}
.guide--feat p{font-size:15.5px;max-width:34em}
.guide--feat .guide__glyph{width:200px;height:200px;right:-20px;bottom:-34px;color:var(--warm-soft)}
@media (max-width:640px){.guide--feat{grid-column:auto}}

/* программа курса: занятия соединены линией, как шаги сборки */
.lessons--rail{position:relative;gap:12px}
.lessons--rail::before{content:"";position:absolute;left:46px;top:30px;bottom:30px;width:1px;background:var(--line-strong)}
.lessons--rail .lesson-row{position:relative}
@media (max-width:640px){.lessons--rail::before{left:39px}}
/* мелкие ссылки получают зону нажатия побольше, не сдвигая строку */
.ph__kicker a,h2.sec>a,.passport a,.msg__h a,.doc-meta a{display:inline-block;padding:9px 0;margin:-9px 0}
@media (max-width:640px){.inside__grid{grid-template-columns:1fr 1fr}.inside__grid a{font-size:13px;padding:9px 10px;gap:6px}}

/* ===== ЦВЕТНЫЕ СЦЕНЫ =====
   Крупные поля двух видов. Глубокий зеленый (.sc-warm, .sc-accent) — главное «сейчас»: следующее занятие,
   обложка занятия, прогресс курса; текст светлый, акцент ярко-зеленый. Бумага (.sc-paper) — справка
   и итоги; текст темный. Внутри сцены компоненты перекрашиваются сами через те же токены.
   В теме «Бумага» бумажная сцена становится графитовой, иначе сливается с фоном. */
.sc-warm,.sc-accent{
  --text:#F2F2F5;--muted:rgba(242,242,245,.74);--dim:rgba(242,242,245,.74);
  --line:rgba(255,255,255,.12);--line-strong:rgba(255,255,255,.22);
  --surface:rgba(255,255,255,.05);--surface-2:rgba(255,255,255,.09);--surface-3:rgba(255,255,255,.1);
  --accent-text:#3DF094;--warm-text:#3DF094;--accent-soft:rgba(25,227,125,.14);--accent-line:rgba(61,240,148,.4);
  --warm-soft:rgba(25,227,125,.14);--warm-line:rgba(61,240,148,.4);--lift:none;
  background:radial-gradient(120% 90% at 100% 0%,rgba(25,227,125,.20),transparent 58%),linear-gradient(165deg,#134830,#0A281C) !important;
  color:var(--text);border-color:rgba(61,240,148,.28) !important
}
.sc-paper{
  --text:#0C0C10;--muted:rgba(12,12,16,.72);--dim:rgba(12,12,16,.65);
  --line:rgba(12,12,16,.12);--line-strong:rgba(12,12,16,.24);
  --surface:rgba(255,255,255,.4);--surface-2:rgba(255,255,255,.6);--surface-3:rgba(12,12,16,.07);
  --accent-text:#0A7A42;--warm-text:#0A7A42;--accent-soft:rgba(10,122,66,.1);--accent-line:rgba(10,122,66,.35);
  --warm-soft:rgba(10,122,66,.1);--warm-line:rgba(10,122,66,.35);--lift:none;
  background:var(--paper) !important;color:var(--text);border-color:transparent !important
}
:root[data-theme="light"] .sc-paper{
  background:#141418 !important;--text:#F2F2F5;--muted:#B4B4BE;--dim:#8A8A94;--line:rgba(255,255,255,.1);--line-strong:rgba(255,255,255,.2);
  --surface:rgba(255,255,255,.05);--surface-2:rgba(255,255,255,.08);--surface-3:rgba(255,255,255,.1);--accent-text:#19E37D;--warm-text:#19E37D;
  --accent-soft:rgba(25,227,125,.1);--accent-line:rgba(25,227,125,.4);--warm-soft:rgba(25,227,125,.1);--warm-line:rgba(25,227,125,.4)
}
:is(.sc-warm,.sc-accent,.sc-paper) .win__bar::before{background:var(--accent-text)}
:is(.sc-warm,.sc-accent) .btn{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2);color:var(--text)}
:is(.sc-warm,.sc-accent) .btn:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.32)}
:is(.sc-warm,.sc-accent) .btn--accent{background:var(--accent);color:var(--ink);border-color:transparent}
:is(.sc-warm,.sc-accent) .btn--accent:hover{background:#3BEB93}
.sc-paper .btn{background:rgba(255,255,255,.5);border-color:rgba(12,12,16,.18);color:var(--text)}
.sc-paper .btn--accent{background:#0C0C10;color:#F2F2F5;border-color:transparent}
:root[data-theme="light"] .sc-paper .btn{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18)}
:root[data-theme="light"] .sc-paper .btn--accent{background:var(--accent);color:var(--ink)}
:where(a).win.sc-warm:hover,:where(a).win.sc-accent:hover,:where(a).win.sc-paper:hover{transform:translateY(-3px)}
.next.sc-warm .next__big,.next.sc-accent .next__big{-webkit-text-stroke-color:rgba(255,255,255,.12)}

/* обложка занятия и материала: цветная панель, текст слева, иллюстрация справа */
.cover--panel{border-radius:var(--r-lg);padding:clamp(20px,3vw,34px);margin-bottom:28px;border-bottom:0;grid-template-columns:minmax(0,1fr) minmax(200px,38%);gap:clamp(16px,3vw,34px);align-items:stretch;position:relative;overflow:hidden}
.cover--panel .ph__kicker,.cover--panel .ph__kicker a{color:var(--muted)}
.cover--panel .lead{color:var(--muted)}
.cover--panel .doc-result{background:var(--surface-2);border-color:var(--line-strong)}
.cover--panel.sc-warm .cover__art,.cover--panel.sc-accent .cover__art{border-radius:var(--r);box-shadow:0 20px 40px -24px rgba(0,0,0,.7)}
.cover__art{position:relative;border-radius:var(--r);overflow:hidden;min-height:220px;background:rgba(12,12,16,.06)}
.cover__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cover__art .next__big{position:absolute;inset:auto 14px 6px auto;font-size:clamp(110px,14vw,180px);-webkit-text-stroke-color:var(--line-strong)}
.cover__strip{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));border-top:1px solid var(--line);margin-top:4px}
.cover__strip>div{padding:12px 14px 0 0;display:grid;gap:3px}
.cover__strip>div+div{padding-left:14px;border-left:1px solid var(--line)}
.cover__strip b{font-size:14.5px}
.cover__strip a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:760px){
  .cover--panel{grid-template-columns:1fr}
  .cover__art{min-height:180px;order:-1;aspect-ratio:16/9}
  .cover__strip{grid-template-columns:1fr 1fr}
  .cover__strip>div:nth-child(odd){padding-left:0;border-left:0}
  .cover__strip>div:nth-child(n+3){border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
}

/* карточка материала: цветная картинка сверху, текст снизу на графите */
.guide__art{aspect-ratio:16/9;position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:var(--surface-2)}
.guide__art img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.guide:hover .guide__art img{transform:scale(1.05)}
.guide__art[class*="bg-"]{background:var(--paper)}
.guide--feat{display:grid !important;grid-template-columns:minmax(0,1fr) 44%;grid-template-rows:auto 1fr}
.guide--feat .win__bar{grid-column:1/-1}
.guide--feat .guide__art{aspect-ratio:auto;border-bottom:0;grid-column:2;grid-row:2;min-height:240px}
.guide--feat .win__body{grid-column:1;grid-row:2}
@media (max-width:640px){.guide--feat{grid-template-columns:1fr}.guide--feat .guide__art{grid-column:1;grid-row:2;aspect-ratio:16/9;min-height:0}.guide--feat .win__body{grid-row:3}}

/* обложки проектов без скриншота: заливка краской */
.cover-gen.bg-deep{background:radial-gradient(120% 90% at 100% 0%,rgba(25,227,125,.2),transparent 58%),linear-gradient(165deg,#134830,#0A281C)}.cover-gen.bg-paper{background:var(--paper)}.cover-gen.bg-graphite{background:#1C1C22}
.cover-gen[class*="bg-"] .mock{background:#121216;border-color:rgba(0,0,0,.4);transform:rotate(-2.5deg)}
.cover-gen[class*="bg-"] .mock b{background:#F2F2F5}
.cover-gen[class*="bg-"] .kind{background:rgba(12,12,16,.85);color:#F2F2F5}

/* вход: слева панель с иллюстрацией, справа форма */
.login--split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);padding:0;place-items:stretch}
.login__art{position:relative;background:linear-gradient(165deg,#134830,#0A281C);overflow:hidden;min-height:100dvh}
.login__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.login__art .label{position:absolute;left:28px;bottom:24px;color:rgba(242,242,245,.7)}
.login--split .login__box{place-self:center;padding:32px 16px}
@media (max-width:900px){.login--split{grid-template-columns:1fr}.login__art{min-height:34vh;max-height:40vh}.login__art .label{display:none}}

/* календарь: даты залиты краской своего события */
.ev--lesson .ev__date{background:var(--accent);border-color:transparent;color:var(--ink)}
.ev--deadline .ev__date{background:var(--paper);border-color:transparent;color:var(--ink)}
.ev--event .ev__date{background:transparent;border-color:var(--line-strong);color:var(--text)}
.ev--lesson .ev__date .label,.ev--deadline .ev__date .label{color:rgba(12,12,16,.62)}
.badge-card.got{background:linear-gradient(165deg,#134830,#0A281C);border-color:rgba(61,240,148,.28);color:#F2F2F5}
.badge-card.got small{color:rgba(242,242,245,.66)}
.badge-card.got .tile{background:var(--accent);border-color:transparent;color:var(--ink)}
h2.sec>a{margin:-9px 0 -9px auto}
.cover__art{align-self:center;aspect-ratio:3/2;min-height:0;background:transparent}
.cover--guide .cover__art{aspect-ratio:1/1;max-height:300px;justify-self:center;width:100%}
@media (max-width:760px){.cover__art{aspect-ratio:3/2}.cover--guide .cover__art{aspect-ratio:4/3;max-height:none}}
.cover__art picture,.guide__art picture{display:contents}
@media (max-width:760px){.cover--guide .cover__art{aspect-ratio:16/9}}

/* главная карточка каталога: текст шире, картинка целиком на подложке своего цвета */
@media (min-width:641px){.guide--feat{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}}
.guide--feat h2{font-size:clamp(22px,2vw,28px);line-height:1.12;letter-spacing:-.025em;max-width:none}
.guide--feat .guide__art{min-height:0}
.guide--feat .guide__art img,.cover__art img{object-fit:contain}
.guide__art img[style]{background-clip:padding-box}

/* обложка занятия и материала: заголовок на всю ширину, ниже описание и картинка рядом, кнопки, характеристики.
   (30.10: заголовок в узкой колонке рядом с картинкой ломался на три строки, справа оставалась пустота) */
.cover--panel{grid-template-columns:minmax(0,1fr) minmax(0,36%);column-gap:clamp(18px,3vw,32px);row-gap:18px;align-items:start;
  grid-template-areas:"head head" "body art" "acts acts" "strip strip"}
.cover--guide{grid-template-areas:"head head" "body art" "acts art" "strip strip"}
.cover__head{grid-area:head}
.cover__head h1{font-size:clamp(30px,3.6vw,46px);line-height:1.02;max-width:20em}
.cover__body{grid-area:body;display:grid;gap:14px;align-content:start}
.cover__body .lead{margin-top:0;font-size:16.5px;line-height:1.55}
.cover__body .doc-result{margin-top:0}
.cover--panel .cover__art{grid-area:art;align-self:start;width:100%}
.cover--guide .cover__art{aspect-ratio:4/3;max-height:none}
.cover__acts{grid-area:acts;margin-top:2px}
.cover--panel .cover__strip{grid-area:strip;margin-top:4px}
@media (max-width:760px){
  .cover--panel,.cover--guide{grid-template-columns:1fr;grid-template-areas:"art" "head" "body" "acts" "strip"}
  .cover--guide .cover__art{aspect-ratio:16/9}
}
.g-proj{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
@media (min-width:500px){
  .g-proj:has(>.proj:only-child){grid-template-columns:1fr}
  .g-proj>.proj:only-child{display:grid;grid-template-columns:minmax(120px,22%) minmax(0,1fr)}
  .g-proj>.proj:only-child .win__bar{grid-column:1/-1}
  .g-proj>.proj:only-child .proj__cover{aspect-ratio:2/1;border-bottom:0}
  .g-proj>.proj:only-child .proj__body{align-content:center}
}

/* обложка-разворот (30.10, третья версия): на всю ширину сетки чтения, текст слева,
   картинка справа в край панели от верха до низа. Картинка в отдельной рамке посреди
   зеленого выглядела вклеенной, а текст в узкой колонке переносился рвано. */
.read-cover{max-width:calc(740px + 64px + 220px);margin:0 auto 34px}
@media (max-width:1240px){.read-cover{max-width:740px}}
.read-cover .cover--panel{--cp:clamp(22px,3vw,40px);padding:var(--cp);margin:0;
  grid-template-columns:minmax(0,1fr) minmax(0,40%);grid-template-areas:"head art" "body art" "acts art" "strip art";row-gap:20px}
.read-cover .cover__head h1{font-size:clamp(30px,3.4vw,46px)}
.read-cover .cover__body .lead{font-size:17px;max-width:34em}
.read-cover .cover--panel .cover__art{grid-area:art;align-self:stretch;width:auto;aspect-ratio:auto;max-height:none;min-height:260px;
  margin:calc(var(--cp) * -1) calc(var(--cp) * -1) calc(var(--cp) * -1) 0;border-radius:0;box-shadow:none}
.read-cover .cover--panel .cover__art img{object-fit:contain;transform:scale(1.3)}
.read-cover .cover--panel.sc-warm .cover__art{border-left:1px solid rgba(61,240,148,.25)}
.read-cover .cover__strip{grid-template-columns:repeat(auto-fit,minmax(96px,1fr))}
/* уже 1240: разворот не помещается, картинка становится лентой сверху, текст идет под ней на всю ширину */
@media (max-width:1240px){
  .read-cover .cover--panel{grid-template-columns:1fr;grid-template-areas:"art" "head" "body" "acts" "strip"}
  .read-cover .cover--panel .cover__art{margin:calc(var(--cp) * -1) calc(var(--cp) * -1) 4px;aspect-ratio:21/9;min-height:0;border-left:0 !important;border-bottom:1px solid var(--line)}
  .read-cover .cover--panel .cover__art img{object-fit:cover;transform:none}
}
@media (max-width:640px){.read-cover .cover--panel .cover__art{aspect-ratio:16/10}}
.cover__strip b{white-space:nowrap}
.read-cover .cover--panel .cover__art{justify-self:stretch}
@media (max-width:640px){
  .read-cover .cover__strip{grid-template-columns:1fr 1fr}
  .read-cover .cover__strip>div{padding:10px 12px 0 0;border-left:0 !important;margin:0;border-top:0}
  .read-cover .cover__strip>div:nth-child(even){padding-left:14px;border-left:1px solid var(--line) !important}
  .read-cover .cover__strip>div:nth-child(n+3){border-top:1px solid var(--line);margin-top:10px}
}

/* скриншоты в занятиях и материалах: рамка браузера, терминала или телефона, подпись, крупно по клику */
.prose .fig{margin:1.4em 0}
.fig__frame{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line-strong);background:var(--surface-2);box-shadow:0 24px 44px -28px rgba(0,0,0,.85)}
.fig__zoom{display:block;width:100%;cursor:zoom-in}
.fig__zoom:focus-visible{outline-offset:-3px}
.fig__frame img{display:block;width:100%;height:auto;cursor:zoom-in}
.fig__frame picture{display:block}
.fig__bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-bottom:1px solid var(--line);background:var(--surface-3);font-style:normal}
.fig__bar b{width:9px;height:9px;border-radius:50%;background:var(--line-strong)}
.fig__bar span{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.fig--term .fig__frame{background:#0B0B0E;border-color:rgba(255,255,255,.12)}
.fig--term .fig__bar{background:#16161A;border-color:rgba(255,255,255,.08)}
.fig--phone .fig__frame{width:min(300px,78%);margin:0 auto;border-radius:34px;border:8px solid #1C1C22;box-shadow:0 0 0 1px var(--line-strong),0 30px 50px -30px rgba(0,0,0,.9)}
.fig figcaption{margin-top:10px;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--dim);text-align:center}
.fig--todo .fig__todo{display:flex;align-items:center;gap:14px;padding:22px 20px;border-radius:var(--r);border:1px dashed var(--line-strong);background:repeating-linear-gradient(135deg,transparent 0 14px,color-mix(in srgb,var(--text) 3%,transparent) 14px 28px);color:var(--muted);font-size:14.5px;line-height:1.45}
.fig--todo .fig__todo svg{width:26px;height:26px;flex:none;color:var(--accent-text)}
.fig--todo .fig__todo b{display:block;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text);margin-bottom:3px}
.prose .split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px;align-items:start;margin:1.2em 0}
.split__text>*+*{margin-top:.8em}
.split__media .fig{margin:0}
@media (max-width:760px){.prose .split{grid-template-columns:1fr}}
.zoom{margin:0;padding:10px}
.zoom img{width:100%;height:auto;border-radius:var(--r-sm)}
.zoom__pan{overflow:auto;border-radius:var(--r-sm)}
@media (max-width:640px){.zoom--wide img{width:auto;max-width:none;height:min(58vh,520px)}}
.zoom figcaption{margin-top:10px;text-align:center;font-family:var(--mono);font-size:12px;color:var(--dim)}
.modal__box:has(.zoom){width:min(1200px,100%);max-height:90vh}
body.show .fig__frame img{cursor:zoom-in}
/* рядом с телефоном тексту отдается все место, кроме ширины самого телефона */
.prose .split:has(.fig--phone){grid-template-columns:minmax(0,1fr) 280px;gap:32px;align-items:center}
.split .fig--phone .fig__frame{width:100%}
@media (max-width:760px){.prose .split:has(.fig--phone){grid-template-columns:1fr}.split .fig--phone .fig__frame{width:min(280px,80%)}}

/* проверка 02.11: телефон и мелочи */
.nw{white-space:nowrap}
/* вкладки профиля, разбора и сообщества на телефоне переносятся, а не уезжают за край */
@media (max-width:640px){.seg{display:flex;flex-wrap:wrap;overflow:visible}.seg a,.seg button{flex:1 1 auto;justify-content:center}}
/* участники: полоска пройденных занятий */
.pips{display:inline-flex;gap:3px}
.pips i{width:14px;height:4px;border-radius:2px;background:var(--surface-3)}
.pips i.on{background:var(--accent)}
/* на сенсорном экране кнопки и пункты не меньше 36–40 px */
@media (pointer:coarse){
  .blk__copy{height:36px;padding:0 14px}
  .toc-mobile .toc a{padding-top:10px;padding-bottom:10px}
  .filters button{height:38px}
  .star{width:40px;height:40px;margin:-4px -4px -4px auto}
  .pal__in kbd{display:none}
}
/* фильтры материалов на телефоне одной строкой с прокруткой вбок */
@media (max-width:640px){
  .filters{flex-wrap:nowrap;overflow-x:auto;margin-inline:-16px;padding-inline:16px;scrollbar-width:none}
  .filters::-webkit-scrollbar{display:none}
  .filters button{flex:none}
}
/* заготовки «Здесь будет скриншот» видит только ведущий */
body:not(.is-lead) .fig--todo{display:none}
body:not(.is-lead) .prose .split:has(.split__media .fig--todo){grid-template-columns:1fr}
h2.sec>a{white-space:nowrap}
.sec__n{font-family:var(--mono);font-weight:500}

/* вход по личной ссылке */
.login__how{display:grid;gap:6px;text-align:left}
.login__how b{font-size:16px}
.invite-note--err{background:var(--red-soft);border-color:color-mix(in srgb,var(--red) 40%,transparent)}

/* управление: участники с личными ссылками */
.padm-add{grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto;align-items:end}
.padm-add .btn{min-height:46px}
@media (max-width:760px){.padm-add{grid-template-columns:1fr}}
.padm-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));margin-top:12px}
.padm{display:grid;gap:14px;align-content:start}
.padm__top{display:flex;gap:12px;align-items:center;min-width:0}
.padm__top>span{min-width:0}
.padm__top b{display:block;font-size:16px;line-height:1.25}
.padm__top small{color:var(--dim);font-size:13px}
.padm__top small a{color:var(--muted)}
.padm__new{color:var(--warm-text)}
.padm__acts{display:flex;flex-wrap:wrap;gap:6px}
.tester{display:grid;gap:14px}
.tester__text{display:grid;gap:6px;max-width:640px}
.errlog{padding:4px 18px}
.errlog__row{display:grid;gap:4px;padding:12px 0;border-top:1px solid var(--line)}
.errlog__row:first-child{border-top:0}
.errlog__row p{font-size:14.5px;overflow-wrap:anywhere}
.drafts{display:grid;gap:10px}
.drafts ul{display:grid;gap:6px;padding-left:18px;list-style:disc}
.ann-list{margin-top:12px;padding:4px 18px}
.ann-list__row{display:flex;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.ann-list__row:first-child{border-top:0}
.ann-list__row>span{flex:1;min-width:0}
.ann-list__row b{display:block;font-size:14.5px}

/* глазами участника: плашка поверх страницы, чтобы ведущий не забыл вернуться */
.viewas{position:fixed;left:50%;bottom:20px;z-index:60;transform:translateX(-50%);display:flex;align-items:center;gap:14px;
  max-width:calc(100% - 32px);padding:8px 8px 8px 16px;border-radius:12px;background:var(--surface-2);border:1px solid var(--warm-line);
  box-shadow:0 18px 36px -16px rgba(0,0,0,.8);font-size:14px;font-weight:600}
.viewas>span{min-width:0}
.viewas .btn{flex:none}
@media (min-width:961px){.viewas{left:calc(50% + 128px)}}
@media (max-width:960px){
  .viewas{bottom:calc(var(--tabs) + 10px + env(safe-area-inset-bottom));width:calc(100% - 24px);font-size:13px}
  body.viewing .main{padding-bottom:calc(var(--tabs) + 110px + env(safe-area-inset-bottom))}
  body.viewing .toast{bottom:calc(var(--tabs) + 84px + env(safe-area-inset-bottom))}
}
body.viewing .follow{bottom:84px}
.table td b{white-space:nowrap}
/* карточка материала: подписи внизу переносятся, а не раздвигают карточку за край */
.guide .win__body{grid-template-columns:minmax(0,1fr)}
.guide .foot{flex-wrap:wrap;row-gap:6px}