/* ============================================================
   /guide — интерактивная документация. App UI register (DESIGN.md).
   Standalone stylesheet: /guide загружает только этот файл, без
   redesign.css/app.css — все базовые токены объявлены здесь заново.
   Apple-минимализм, нейтральная база, зелёный #1DB954 точечно.
   ============================================================ */

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}

:root{
  --bg:#F5F5F4; --paper:#FFFFFF; --tint:#ECECEA;
  --ink:#1A1A18; --ink-soft:#55554F; --ink-mute:#8A8A82;
  --line:#E3E3E0; --line-strong:#CFCFC9;
  --green:#1DB954; --green-hover:#1AA34A;
  /* заливка + светлый текст на зелёных интерактивных элементах (кнопки/чипы/чек-бокс/
     копи-состояние): DESIGN.md/решение владельца 24.07.2026 — на зелёном только светлый
     текст, никогда тёмный. Тон углублён относительно --green, чтобы белый текст проходил
     WCAG AA (4.5:1) — плоский #1DB954 с белым текстом даёт только ~2.6:1. */
  --green-strong:#14823B; --green-strong-hover:#116F32;
  --on-green:#FFFFFF;
  --font-ui:-apple-system,BlinkMacSystemFont,"SF Pro Text","Avenir Next","Segoe UI",Roboto,sans-serif;

  --r-card:14px; --r-input:12px; --r-pop:16px; --r-pill:999px;
  --sh-xs:0 1px 2px rgba(26,26,24,.05);
  --sh-sm:0 2px 8px rgba(26,26,24,.09);
  --sh-lg:0 10px 30px rgba(26,26,24,.14);
  --glass-fill:rgba(255,255,255,.72);
  --glass-border:rgba(255,255,255,.7);

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px;

  --header-h:64px;
  --header-offset:80px;
}

@media(max-width:879px){
  :root{ --header-h:58px; --header-offset:112px }
}

[hidden]{display:none!important}

html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

body{
  background:var(--bg); color:var(--ink); font-family:var(--font-ui);
  font-size:15.5px; line-height:1.5; -webkit-font-smoothing:antialiased;
}

a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol,dl,dd{margin:0;padding:0;list-style:none}
h1,h2,h3,p{margin:0}
img{display:block;max-width:100%}

:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(29,185,84,.38)}
button:focus-visible,a:focus-visible{border-radius:8px}

/* ── Топбар: стеклянный, липкий ── */
.g-topbar{
  position:sticky; top:0; z-index:40; height:var(--header-h);
  display:flex; align-items:center; gap:var(--s5);
  padding:0 var(--s6);
  background:var(--glass-fill);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid var(--glass-border);
  box-shadow:var(--sh-xs);
}
.g-back{
  display:inline-flex; align-items:center; gap:6px;
  font-size:14px; font-weight:600; color:var(--ink-soft);
  padding:8px 10px 8px 6px; border-radius:10px; flex:0 0 auto;
  transition:color .15s,background .15s;
}
.g-back svg{width:18px;height:18px;flex:0 0 auto}
.g-back:hover{color:var(--ink);background:var(--tint)}
.g-title{
  font-size:14px; font-weight:700; letter-spacing:-.01em; color:var(--ink);
  flex:0 0 auto; padding-left:var(--s4); border-left:1px solid var(--line);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:200px;
}
.g-search-wrap{position:relative; margin-left:auto; width:100%; max-width:280px}
.g-search-ic{
  position:absolute; left:12px; top:50%; transform:translateY(-50%);
  width:16px; height:16px; color:var(--ink-mute); pointer-events:none;
}
#g-search{
  width:100%; height:40px; border-radius:var(--r-input);
  border:1.5px solid var(--line); background:var(--paper);
  padding:0 14px 0 36px; font:inherit; font-size:14px; color:var(--ink);
  transition:border-color .15s,box-shadow .15s;
}
#g-search::placeholder{color:var(--ink-mute)}
#g-search:hover{border-color:var(--line-strong)}
#g-search:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(29,185,84,.18)}
#g-search::-webkit-search-cancel-button{cursor:pointer}
.g-search-count{
  position:absolute; right:0; top:calc(100% + 6px);
  font-size:12px; font-weight:600; color:var(--ink-soft);
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-pill);
  padding:5px 12px; box-shadow:var(--sh-sm); white-space:nowrap; z-index:41;
}
@media(max-width:640px){
  .g-topbar{padding:0 var(--s4); gap:var(--s3)}
  .g-title{display:none}
  .g-back span{display:none}
}

/* ── Layout: сайдбар + контент ── */
.g-layout{
  max-width:1260px; margin:0 auto;
  display:flex; align-items:flex-start; gap:var(--s7);
  padding:0 var(--s6);
}
@media(max-width:879px){
  .g-layout{flex-direction:column; align-items:stretch; gap:0; padding:0}
}

.g-sidebar{
  position:sticky; top:var(--header-offset);
  flex:0 0 216px; width:216px;
  display:flex; flex-direction:column; gap:1px;
  padding:var(--s6) 0 var(--s7);
  max-height:calc(100vh - var(--header-offset));
  overflow-y:auto;
}
.g-sidebar a{
  font-size:13.5px; font-weight:600; color:var(--ink-soft);
  padding:9px var(--s4) 9px 14px; border-radius:10px;
  border-left:2px solid transparent;
  transition:color .15s,background .15s,border-color .15s;
}
.g-sidebar a:hover{color:var(--ink); background:var(--tint)}
.g-sidebar a.active{color:var(--ink); border-left-color:var(--green); background:rgba(29,185,84,.07)}

@media(max-width:879px){
  .g-sidebar{
    position:sticky; top:var(--header-h); z-index:35; width:100%; flex:none; min-width:0;
    flex-direction:row; gap:8px; max-height:none; overflow-x:auto; overflow-y:hidden;
    padding:10px var(--s4); background:var(--glass-fill);
    -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
    border-bottom:1px solid var(--glass-border);
    scroll-snap-type:x proximity; -ms-overflow-style:none; scrollbar-width:none;
  }
  .g-sidebar::-webkit-scrollbar{display:none}
  .g-sidebar a{
    flex:0 0 auto; scroll-snap-align:start; white-space:nowrap;
    border-left:0; border:1.5px solid var(--line); border-radius:var(--r-pill);
    background:var(--paper); padding:11px 16px; min-height:44px; display:flex; align-items:center;
  }
  .g-sidebar a:hover{background:var(--paper); border-color:var(--line-strong)}
  .g-sidebar a.active{border-color:var(--green); background:rgba(29,185,84,.09); color:var(--ink)}
}

.g-content{flex:1; min-width:0; padding-bottom:var(--s7)}
@media(max-width:879px){ .g-content{padding:0 var(--s4)} }

/* ── Секции: ритм, счётчик, разделители ── */
.g-content{counter-reset:g-sec}
.g-section{counter-increment:g-sec; padding:var(--s7) 0; scroll-margin-top:var(--header-offset)}
.g-section:first-of-type{padding-top:var(--s6)}
.g-section + .g-section{border-top:1px solid var(--line)}
.g-section > *{margin:0}
.g-section > * + *{margin-top:var(--s5)}
.g-section h3 + *{margin-top:var(--s3)}
.g-section > h3,.g-section h3.g-scenario-group{margin-top:var(--s7)!important}

.g-section > h1:first-child,.g-section > h2:first-child{position:relative; padding-left:0}
.g-section > h1:first-child::before,.g-section > h2:first-child::before{
  content:counter(g-sec,decimal-leading-zero); display:block;
  font-size:12px; font-weight:700; letter-spacing:.12em; color:var(--ink-mute);
  margin-bottom:var(--s2);
}
.g-section h1{font-size:clamp(28px,4vw,42px); font-weight:700; letter-spacing:-.02em; line-height:1.1; color:var(--ink)}
.g-section h2{font-size:clamp(22px,2.6vw,28px); font-weight:700; letter-spacing:-.015em; line-height:1.2; color:var(--ink)}
.g-section h3{font-size:18px; font-weight:700; letter-spacing:-.01em; color:var(--ink)}
.g-lead{font-size:17px; line-height:1.65; color:var(--ink-soft); max-width:68ch}
.g-section p{font-size:15.5px; line-height:1.7; color:var(--ink-soft); max-width:68ch}
.g-section p strong,.g-section li strong{color:var(--ink); font-weight:700}
.g-section a:not(.g-open):not(.g-chip):not(.g-copy):not(.g-btn){
  color:var(--ink); font-weight:600; text-underline-offset:3px;
  text-decoration:underline; text-decoration-color:var(--line-strong);
  transition:text-decoration-color .15s;
}
.g-section a:not(.g-open):not(.g-chip):not(.g-copy):not(.g-btn):hover{text-decoration-color:var(--green)}

.g-note{
  max-width:68ch; font-size:14px; line-height:1.6; color:var(--ink-soft);
  background:var(--tint); border-left:3px solid var(--line-strong);
  border-radius:0 10px 10px 0; padding:var(--s3) var(--s4);
}

/* Простой список тезисов (.g-points) — используется в нескольких секциях */
.g-points{display:flex; flex-direction:column; gap:var(--s3); max-width:68ch}
.g-points > li{
  font-size:15px; line-height:1.6; color:var(--ink-soft);
  padding-left:var(--s4); position:relative;
}
.g-points > li::before{
  content:""; position:absolute; left:0; top:.65em; width:6px; height:6px;
  border-radius:50%; background:var(--line-strong);
}

/* Нумерованный «путь» (.g-path) и sos-шаги — общий рецепт круглых номеров */
.g-path,.g-sos-steps{
  display:flex; flex-direction:column; gap:var(--s5); max-width:68ch;
  counter-reset:g-step;
}
.g-path > li,.g-sos-steps > li{
  counter-increment:g-step; position:relative; padding-left:40px;
  font-size:15px; line-height:1.65; color:var(--ink-soft);
}
.g-path > li::before,.g-sos-steps > li::before{
  content:counter(g-step); position:absolute; left:0; top:0;
  width:28px; height:28px; border-radius:50%;
  border:1.5px solid var(--line-strong); color:var(--ink-soft);
  font-size:13px; font-weight:700; font-family:var(--font-ui);
  display:flex; align-items:center; justify-content:center;
}

/* ============================================================
   Схема «Веб / Агенты / Память» — примитивные SVG-пиктограммы
   ============================================================ */
.g-scheme{
  display:flex; align-items:stretch; gap:var(--s4);
  padding:var(--s5) 0;
}
.g-scheme-node{
  flex:1; min-width:0; background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r-card); box-shadow:var(--sh-xs);
  padding:var(--s5) var(--s4); display:flex; flex-direction:column; gap:10px;
  position:relative;
}
.g-scheme-node .g-scheme-ic{width:34px;height:34px;color:var(--ink-mute);flex:0 0 auto}
.g-scheme-node:first-child .g-scheme-ic{color:var(--green)}
.g-scheme-node strong{font-size:16px; font-weight:700; color:var(--ink)}
.g-scheme-node span{font-size:13.5px; line-height:1.55; color:var(--ink-soft)}
.g-scheme-arrow{
  flex:0 0 32px; display:flex; align-items:center; justify-content:center; align-self:center;
  color:var(--line-strong);
}
.g-scheme-arrow svg{width:24px;height:24px}
@media(max-width:640px){
  .g-scheme{flex-direction:column; gap:0}
  .g-scheme-arrow{flex:0 0 32px; transform:rotate(90deg)}
}

/* ── Возможности: сетка групп ── */
.g-cap-groups{display:grid; grid-template-columns:1fr 1fr; gap:var(--s4)}
@media(max-width:879px){ .g-cap-groups{grid-template-columns:1fr} }
.g-cap-group{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-card);
  padding:var(--s5); display:flex; flex-direction:column; gap:var(--s3);
}
.g-cap-group h3{font-size:14px; letter-spacing:.02em}
.g-cap-list{display:flex; flex-direction:column; gap:9px}
.g-cap-list > li{font-size:14px; line-height:1.55; color:var(--ink-soft)}
.g-cap-list > li a{
  color:var(--ink); font-weight:600; text-decoration:underline;
  text-decoration-color:var(--line-strong); text-underline-offset:2px;
}
.g-cap-list > li a:hover{text-decoration-color:var(--green)}

/* ── Чек-лист быстрого старта ── */
.g-check-progress{
  display:inline-flex; align-self:flex-start; align-items:center; gap:6px;
  font-size:13px; font-weight:700; color:var(--ink-soft);
  background:var(--tint); border-radius:var(--r-pill); padding:7px 14px;
}
.g-check-progress.all-done{background:var(--green-strong); color:var(--on-green)}
.g-checklist{display:flex; flex-direction:column; max-width:68ch}
.g-checklist > li{
  position:relative; padding:var(--s4) 0 var(--s4) 44px; border-top:1px solid var(--line);
  font-size:15px; line-height:1.6; color:var(--ink-soft);
}
.g-checklist > li:first-child{border-top:0}
.g-checklist > li.done{color:var(--ink-mute)}
.g-checklist > li.done strong{color:var(--ink-soft)}
.g-check-box{
  width:28px; height:28px; flex:0 0 auto;
  position:absolute; left:0; top:var(--s4);
  border-radius:9px; border:1.5px solid var(--line-strong); background:var(--paper);
  transition:background .15s,border-color .15s,transform .1s;
}
.g-check-box:hover{border-color:var(--ink-mute)}
.g-check-box:active{transform:scale(.92)}
.g-check-box[aria-checked="true"]{background:var(--green-strong); border-color:var(--green-strong)}
.g-check-box[aria-checked="true"]::after{
  content:""; position:absolute; left:50%; top:45%; width:6px; height:11px;
  border:solid var(--on-green); border-width:0 2px 2px 0;
  transform:translate(-50%,-55%) rotate(45deg);
}

/* ── Разделы веба: карточки-гриды ── */
.g-view-grid{display:grid; grid-template-columns:1fr 1fr; gap:var(--s4)}
@media(max-width:999px){ .g-view-grid{grid-template-columns:1fr} }
.g-view-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-card);
  box-shadow:var(--sh-xs); padding:var(--s5); display:flex; flex-direction:column; gap:var(--s3);
}
.g-view-card h3{font-size:17px}
.g-view-card p{font-size:14.5px; line-height:1.6; color:var(--ink-soft); max-width:none}
.g-view-card ul{display:flex; flex-direction:column; gap:8px}
.g-view-card ul li{font-size:14px; line-height:1.55; color:var(--ink-soft)}
.g-view-card ul li strong{color:var(--ink)}
.g-open{
  margin-top:auto; align-self:flex-start;
  display:inline-flex; align-items:center; gap:8px;
  background:var(--green-strong); color:var(--on-green); font-weight:700; font-size:13.5px;
  border-radius:var(--r-pill); padding:11px 18px; min-height:44px;
  transition:background .15s,transform .1s;
}
.g-open::after{
  content:""; width:6px; height:6px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(-45deg); margin-left:2px;
}
.g-open:hover{background:var(--green-strong-hover)}
.g-open:active{transform:scale(.97)}

/* ============================================================
   Каталог агентов
   ============================================================ */
.g-agent-filters{display:flex; flex-wrap:wrap; gap:8px}
.g-chip{
  min-height:38px; padding:8px 16px; border-radius:var(--r-pill);
  border:1.5px solid var(--line); background:var(--paper);
  font-size:13.5px; font-weight:600; color:var(--ink-soft);
  transition:background .15s,border-color .15s,color .15s;
}
.g-chip:hover{border-color:var(--line-strong); color:var(--ink)}
.g-chip.active{background:var(--green-strong); border-color:var(--green-strong); color:var(--on-green)}

.g-agent-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:var(--s4);
}
.g-agent-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-card);
  box-shadow:var(--sh-xs); padding:var(--s4) var(--s4) var(--s4);
  display:flex; flex-direction:column; gap:var(--s3);
  transition:box-shadow .15s;
}
.g-agent-card.open{box-shadow:var(--sh-sm)}
.g-agent-head{display:flex; align-items:center; gap:12px}
.g-agent-avatar{
  width:44px; height:44px; border-radius:50%; flex:0 0 auto; object-fit:cover;
  background:var(--tint);
}
.g-agent-initial{
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:17px; font-weight:700; font-family:var(--font-ui);
}
.g-agent-name{font-size:15px; font-weight:700; color:var(--ink)}
.g-agent-cat{font-size:12px; font-weight:600; color:var(--ink-soft); margin-top:2px}
.g-agent-desc{font-size:13.5px; line-height:1.55; color:var(--ink-soft); max-width:none}
.g-agent-more{
  align-self:flex-start; display:inline-flex; align-items:center; gap:6px;
  font-size:13px; font-weight:700; color:var(--green-hover);
  min-height:36px; padding:4px 2px;
}
.g-agent-more::after{
  content:""; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg); transition:transform .2s; margin-top:-3px;
}
.g-agent-card.open .g-agent-more::after{transform:rotate(225deg); margin-top:3px}
.g-agent-details{
  border-top:1px solid var(--line); padding-top:var(--s3);
  display:flex; flex-direction:column; gap:var(--s3);
  font-size:13.5px; color:var(--ink-soft);
}
.g-agent-strength{font-size:13.5px; line-height:1.55; color:var(--ink-soft); max-width:none}
.g-agent-block-title{font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute)}
.g-agent-block-list{display:flex; flex-direction:column; gap:8px; margin-top:8px}
.g-agent-block-list li{font-size:13.5px; line-height:1.5; color:var(--ink-soft)}
.g-agent-service{
  font-size:14px; line-height:1.6; color:var(--ink-soft); max-width:68ch;
}
.g-loading{
  grid-column:1/-1; text-align:center; font-size:14px; color:var(--ink-soft); padding:var(--s6) 0;
}

/* ============================================================
   Сценарии: копируемые фразы, группы, шаги
   ============================================================ */
.g-scenario-group{
  font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-mute); padding-bottom:var(--s3); border-bottom:1px solid var(--line);
}
.g-scenario{display:flex; flex-direction:column; gap:var(--s3); max-width:68ch}
.g-scenario h3{font-size:17px}
.g-scenario ol{display:flex; flex-direction:column; gap:12px; counter-reset:g-sstep}
.g-scenario ol > li{
  counter-increment:g-sstep; position:relative; padding-left:32px;
  font-size:15px; line-height:1.65; color:var(--ink-soft);
}
.g-scenario ol > li::before{
  content:counter(g-sstep); position:absolute; left:0; top:1px;
  width:22px; height:22px; border-radius:50%; border:1.5px solid var(--line-strong);
  color:var(--ink-soft); font-size:11.5px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}

.g-copy{
  display:inline-flex; align-items:center; gap:6px; vertical-align:middle;
  background:var(--tint); border:1.5px dashed var(--line-strong); border-radius:var(--r-pill);
  padding:5px 12px 5px 10px; margin:2px 0; font-size:14px; font-weight:600; color:var(--ink);
  min-height:32px; transition:background .15s,border-color .15s,color .15s;
}
.g-copy::before{
  content:""; width:13px; height:13px; flex:0 0 auto; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M216,32H88a8,8,0,0,0-8,8V80H40a8,8,0,0,0-8,8V216a8,8,0,0,0,8,8H168a8,8,0,0,0,8-8V176h40a8,8,0,0,0,8-8V40A8,8,0,0,0,216,32ZM160,208H48V96H160Zm48-48H176V88a8,8,0,0,0-8-8H96V48H208Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M216,32H88a8,8,0,0,0-8,8V80H40a8,8,0,0,0-8,8V216a8,8,0,0,0,8,8H168a8,8,0,0,0,8-8V176h40a8,8,0,0,0,8-8V40A8,8,0,0,0,216,32ZM160,208H48V96H160Zm48-48H176V88a8,8,0,0,0-8-8H96V48H208Z'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity:.55;
}
.g-copy:hover{border-color:var(--green); background:var(--paper)}
.g-copy.copied{background:var(--green-strong); border-color:var(--green-strong); border-style:solid; color:var(--on-green)}
.g-copy.copied::before{opacity:1}

.g-agent-block-list .g-copy{display:inline-flex}

/* ── Токены и подключения ── */
.g-token-list{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:10px;
  max-width:none;
}
/* li = вся строка-карточка (ссылка на заголовок + текст пояснения рядом, вне <a> в разметке).
   Не display:flex: заголовок-ссылка и текст пояснения - обычный смешанный инлайн-контент,
   должен переноситься как текст, а не как нерастягивающиеся flex-элементы в ряд. */
.g-token-list > li{
  position:relative; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-input);
  padding:13px 34px 13px var(--s4); font-size:13.5px; line-height:1.5; color:var(--ink-soft); font-weight:500;
  min-height:44px; display:block;
  transition:border-color .15s,box-shadow .15s;
}
.g-token-list > li > a{color:var(--ink); font-weight:700; text-decoration:underline; text-decoration-color:var(--line-strong)}
.g-token-list > li > a:hover{text-decoration-color:var(--green)}
.g-token-list > li::after{
  content:""; position:absolute; right:14px; top:50%; width:7px; height:7px;
  border-right:1.5px solid var(--ink-mute); border-top:1.5px solid var(--ink-mute);
  transform:translateY(-60%) rotate(45deg);
}
.g-token-list > li:hover{border-color:var(--line-strong); box-shadow:var(--sh-xs)}

/* ── FAQ / типовые ситуации (details-summary) ── */
.g-faq{display:flex; flex-direction:column; max-width:68ch}
.g-faq details{border-top:1px solid var(--line)}
.g-faq details:first-child{border-top:0}
.g-faq summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:var(--s4);
  padding:var(--s4) 0; font-size:15.5px; font-weight:600; color:var(--ink);
  min-height:44px;
}
.g-faq summary::-webkit-details-marker{display:none}
.g-faq summary::after{
  content:""; flex:0 0 auto; width:9px; height:9px;
  border-right:2px solid var(--ink-mute); border-bottom:2px solid var(--ink-mute);
  transform:rotate(45deg); transition:transform .2s;
}
.g-faq details[open] summary::after{transform:rotate(225deg)}
.g-faq details p{padding-bottom:var(--s4); max-width:none}

/* ── Глоссарий ── */
.g-glossary{display:block}
.g-glossary dt{
  font-weight:700; color:var(--ink); font-size:15px;
  padding-top:var(--s4); border-top:1px solid var(--line);
}
.g-glossary dt:first-child{border-top:0; padding-top:0}
.g-glossary dd{font-size:14.5px; line-height:1.6; color:var(--ink-soft); padding-top:6px; padding-bottom:var(--s4); max-width:68ch}
@media(min-width:720px){
  .g-glossary{display:grid; grid-template-columns:200px 1fr; column-gap:var(--s5)}
  .g-glossary dt{padding-top:var(--s4); border-top:1px solid var(--line)}
  .g-glossary dt:first-child{border-top:0; padding-top:0}
  .g-glossary dd{padding-top:var(--s4); padding-left:0; border-top:1px solid var(--line); max-width:none}
  .g-glossary dt:first-child + dd{border-top:0; padding-top:0}
}

/* ── Футер ── */
.g-footer{
  max-width:1260px; margin:0 auto; padding:var(--s6) var(--s6) var(--s7);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--s3);
  border-top:1px solid var(--line);
}
.g-footer p{font-size:13px; color:var(--ink-soft); max-width:52ch}
.g-footer a{font-size:13px; font-weight:700; color:var(--ink); text-decoration:underline; text-decoration-color:var(--line-strong)}
.g-footer a:hover{text-decoration-color:var(--green)}
@media(max-width:879px){ .g-footer{padding:var(--s5) var(--s4) var(--s6)} }

/* ============================================================
   Поиск: скрытие непопавших блоков
   ============================================================ */
body.g-searching .g-miss{display:none!important}
body.g-searching .g-section-empty{display:none!important}

/* ============================================================
   Встраивание в «Настройки → Гайд» (/guide?embed=1, /rescue?embed=1)
   Раздел веба уже даёт свою шапку и заголовок, поэтому собственный
   топбар страницы прячется, а ссылки наружу открывает верхнее окно.
   ============================================================ */
.g-embed body{background:transparent}
.g-embed .g-topbar{position:static; height:auto; padding:var(--s4) var(--s6) 0; border:0; box-shadow:none;
  background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none}
.g-embed .g-back,.g-embed .g-title{display:none}
.g-embed .g-search-wrap{margin-left:0; max-width:320px}
.g-embed .g-sidebar{top:var(--s4); max-height:calc(100vh - 120px); padding-top:var(--s5)}
.g-embed .g-section{scroll-margin-top:var(--s4)}
.g-embed .g-footer a{display:none}
@media(max-width:879px){
  .g-embed .g-topbar{padding:var(--s3) var(--s4) 0}
  .g-embed .g-sidebar{top:0}
}

/* ============================================================
   /rescue — памятка «если система не открывается»
   ============================================================ */
code{
  font-family:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  font-size:.92em; background:var(--tint); border:1px solid var(--line);
  border-radius:7px; padding:1px 6px; white-space:nowrap;
}

/* Команда для терминала: блок с кнопкой «скопировать» справа */
.g-cmd{
  position:relative; max-width:68ch; background:var(--ink); color:#F2F2EF;
  border-radius:var(--r-input); padding:var(--s4) 64px var(--s4) var(--s4);
  font-family:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  font-size:13.5px; line-height:1.7; white-space:pre-wrap; word-break:break-word;
  overflow-wrap:anywhere;
}
.g-cmd .g-cmd-copy{
  position:absolute; top:10px; right:10px;
  font-size:12px; font-weight:700; color:#F2F2EF;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22);
  border-radius:var(--r-pill); padding:6px 12px; min-height:32px;
  font-family:var(--font-ui); transition:background .15s;
}
.g-cmd .g-cmd-copy:hover{background:rgba(255,255,255,.22)}
.g-cmd .g-cmd-copy.done{background:var(--green-strong); border-color:var(--green-strong); color:var(--on-green)}
.g-cmd + .g-cmd{margin-top:var(--s3)}

/* Готовая задача для Claude: длинный текст, который копируют целиком */
.g-task{
  max-width:68ch; background:var(--paper); border:1px solid var(--line);
  border-left:3px solid var(--green); border-radius:0 var(--r-card) var(--r-card) 0;
  padding:var(--s4) var(--s5); box-shadow:var(--sh-xs);
}
.g-task pre{
  margin:0; font-family:var(--font-ui); font-size:14.5px; line-height:1.65;
  color:var(--ink); white-space:pre-wrap; word-break:break-word;
}
.g-task-foot{display:flex; align-items:center; gap:var(--s3); margin-top:var(--s4); flex-wrap:wrap}

/* Кнопки страницы: скачать памятку, открыть отдельно */
.g-btn{
  display:inline-flex; align-items:center; gap:8px; min-height:44px;
  padding:0 var(--s5); border-radius:var(--r-pill);
  font-size:14px; font-weight:700; color:var(--ink);
  background:var(--paper); border:1px solid var(--line-strong); box-shadow:var(--sh-xs);
  transition:background .15s,border-color .15s,transform .1s;
}
.g-btn:hover{background:var(--tint)}
.g-btn:active{transform:translateY(1px)}
.g-btn svg{width:17px;height:17px;flex:0 0 auto}
.g-btn.primary{background:var(--green-strong); border-color:var(--green-strong); color:var(--on-green)}
.g-btn.primary:hover{background:var(--green-strong-hover)}
.g-btn-row{display:flex; flex-wrap:wrap; gap:var(--s3); align-items:center}

/* Предупреждение: то, чего делать нельзя */
.g-warn{
  max-width:68ch; background:#FDF3F2; border:1px solid #F0D3CF;
  border-radius:var(--r-card); padding:var(--s4) var(--s5);
  font-size:14.5px; line-height:1.65; color:#6B2B22;
}
.g-warn strong{color:#5A211A}
.g-warn ul{display:flex; flex-direction:column; gap:var(--s2); margin-top:var(--s3)}
.g-warn li{padding-left:var(--s4); position:relative}
.g-warn li::before{content:""; position:absolute; left:0; top:.6em; width:6px; height:6px;
  border-radius:50%; background:#C2695C}

/* Ссылка в оглавлении, ведущая на другую страницу */
.g-side-out{display:flex; align-items:center; gap:6px}
.g-side-out::after{
  content:""; width:11px; height:11px; flex:0 0 auto; background:currentColor; opacity:.55;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M200,64V168a8,8,0,0,1-16,0V83.31L69.66,197.66a8,8,0,0,1-11.32-11.32L172.69,72H88a8,8,0,0,1,0-16H192A8,8,0,0,1,200,64Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M200,64V168a8,8,0,0,1-16,0V83.31L69.66,197.66a8,8,0,0,1-11.32-11.32L172.69,72H88a8,8,0,0,1,0-16H192A8,8,0,0,1,200,64Z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Скачанный файл открывают без сервера: кнопки, которые там не работают, прячутся */
.g-offline .g-online-only,.g-offline .g-back,.g-offline .g-footer a{display:none!important}
.g-cmd-copy-note{font-size:13px; color:var(--ink-mute)}
/* Во фрейме «Настроек» кнопки страницы дублировали бы кнопки раздела */
.g-embed .g-btn-row{display:none}
.g-offline .g-title{padding-left:0;border-left:0}