/* Гайды и редакторы модов — поверх app.css (оглавление сбоку, таблицы параметров, код) */
.doc{display:grid;grid-template-columns:230px minmax(0,1fr);gap:44px;padding-top:28px;align-items:start}
.toc{position:sticky;top:calc(var(--topbar) + 20px);display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--line);max-height:calc(100vh - var(--topbar) - 40px);overflow-y:auto;padding-bottom:12px}
.toc .ttl{font:400 14px var(--display);letter-spacing:.06em;color:var(--text);padding:0 14px 12px}
.toc a{color:var(--muted);font-size:13.5px;padding:5px 14px;border-left:2px solid transparent;margin-left:-1px;line-height:1.35}
.toc a:hover{color:var(--text);border-left-color:var(--line3)}
.toc a.on{color:var(--accent);border-left-color:var(--accent)}
.toc a.sub{padding-left:26px;font-size:12.5px}
.doc-main{min-width:0;display:flex;flex-direction:column;gap:56px}
.doc-hero{display:flex;flex-direction:column;gap:16px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.doc-hero h1{font-size:clamp(30px,4.6vw,46px)}
.doc-hero .lead{font-size:16.5px}
.doc-hero .row{gap:10px}
.doc-sec{display:flex;flex-direction:column;gap:16px;scroll-margin-top:calc(var(--topbar) + 20px)}
.doc-sec>h2{display:flex;align-items:center;gap:12px;font-size:23px}
.doc-sec>h2::before{content:"";width:3px;height:20px;background:var(--accent);border-radius:2px;flex:none}
.doc-sec h3{font:600 13px/1.3 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:10px 0 0;scroll-margin-top:calc(var(--topbar) + 20px)}
.doc-sec>p,.doc-sec li{max-width:76ch;color:var(--text2)}
.doc-sec p b,.doc-sec li b{color:var(--text)}
.doc-sec ul,.doc-sec ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.doc-sec li::marker{color:var(--accent)}
code,.k{font-family:var(--mono);font-size:.9em}
.doc-sec p code,.doc-sec li code,.doc-sec td code,.param code,.callout code,.feat code,.file code{background:var(--raise);border:1px solid var(--line);padding:1px 6px;border-radius:4px;color:var(--accent)}
kbd{display:inline-block;min-width:24px;padding:1px 7px;border-radius:5px;border:1px solid var(--line3);border-bottom-width:2px;background:var(--raise2);font:600 12.5px var(--mono);color:var(--text);text-align:center}
.callout{display:flex;gap:12px;border:1px solid var(--line2);background:var(--raise);border-radius:9px;padding:14px 18px;max-width:80ch;color:var(--text2);font-size:14.5px}
.callout>.i{flex:none;margin-top:3px;color:var(--accent)}
.callout.ok{border-color:rgba(52,209,191,.35);background:var(--ok-dim)}.callout.ok>.i{color:var(--ok)}
.callout.warn{border-color:rgba(245,154,60,.4);background:rgba(245,154,60,.08)}.callout.warn>.i{color:var(--warn)}
.callout b{color:var(--text)}
.feats{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.feat{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border:1px solid var(--line2);border-radius:var(--r);background:var(--surface)}
.feat .h{display:flex;align-items:center;gap:10px;font:400 16px var(--display);letter-spacing:.02em}
.feat .h .i,.feat .h .gi{color:var(--accent);width:20px;height:20px}
.feat p{color:var(--text2);font-size:14px;margin:0}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;counter-reset:st}
.steps>li{counter-increment:st;display:grid;grid-template-columns:32px minmax(0,1fr);gap:14px;max-width:80ch;color:var(--text2)}
.steps>li::before{content:counter(st);font:400 15px/30px var(--display);color:#16110A;background:var(--accent);width:30px;height:30px;text-align:center;border-radius:7px}
.steps>li b{color:var(--text)}
.path{font:13.5px var(--mono);color:var(--text);background:var(--raise);border:1px solid var(--line);border-radius:7px;padding:10px 14px;overflow-x:auto;white-space:nowrap}
.tree{border:1px solid var(--line2);border-radius:var(--r);background:var(--surface);overflow:hidden}
.tree .f{display:grid;grid-template-columns:minmax(210px,290px) minmax(0,1fr);gap:16px;padding:11px 16px;border-top:1px solid var(--line);align-items:baseline}
.tree .f:first-child{border-top:0}
.tree .f .k{color:var(--accent);font-size:13.5px}
.tree .f .k.dir{color:var(--text)}
.tree .f .k .auto{margin-left:6px}
.tree .f span{color:var(--text2);font-size:14px}
.tag{display:inline-block;font:700 10px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;border:1px solid currentColor;border-radius:4px;padding:3px 6px;vertical-align:2px;white-space:nowrap}
.tag.ok{color:var(--ok)}.tag.warn{color:var(--warn)}.tag.mut{color:var(--muted)}.tag.acc{color:var(--accent)}
.params{border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.params .grp{padding:10px 18px;background:var(--raise);border-top:1px solid var(--line);font:600 11.5px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.params .grp:first-child{border-top:0}
.param{display:grid;grid-template-columns:minmax(190px,250px) 120px minmax(0,1fr);gap:16px;padding:13px 18px;border-top:1px solid var(--line);align-items:baseline}
.param .k{color:var(--accent);font-size:13.5px;word-break:break-word}
.param .def{font:13px var(--mono);color:var(--text);font-variant-numeric:tabular-nums}
.param .def i{font-style:normal;color:var(--muted);font-family:var(--body);font-size:12px;display:block;margin-top:2px}
.param .d{color:var(--text2);font-size:14.5px}
.param .d small{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.codebox{position:relative;border:1px solid var(--line2);background:#0B0D11;border-radius:9px}
.codebox pre{margin:0;padding:16px 20px;overflow-x:auto;font:13px/1.65 var(--mono);color:#C9D1D9}
.codebox .copy{position:absolute;top:9px;right:9px;font:600 12px var(--body);color:var(--text);background:var(--raise);border:1px solid var(--line2);border-radius:6px;padding:5px 10px;cursor:pointer}
.codebox .copy:hover{border-color:var(--accent);color:var(--accent)}
.codebox .copy.done{color:var(--ok);border-color:var(--ok)}
.jk{color:#F2B544}.js{color:#9DD9A5}.jn{color:#8CC8F5}.jc{color:#5C6773}
.linefmt{display:flex;flex-wrap:wrap;gap:0;font:15px var(--mono);border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;background:#0B0D11}
.linefmt span{padding:14px 14px;border-right:1px solid var(--line);color:var(--text)}
.linefmt span:last-child{border-right:0}
.linefmt span b{display:block;font:600 10.5px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.tbl2{overflow-x:auto;border:1px solid var(--line2);border-radius:var(--r);background:var(--surface)}
.tbl2 table{border-collapse:collapse;width:100%;font-size:14px}
.tbl2 th,.tbl2 td{text-align:left;padding:10px 14px;border-top:1px solid var(--line);vertical-align:top;color:var(--text2)}
.tbl2 th{font:600 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-top:0;background:var(--raise);white-space:nowrap}
.tbl2 td:first-child{color:var(--text);white-space:nowrap}
.gi{display:inline-block;width:24px;height:24px;flex:none;background:currentColor;-webkit-mask:url(/assets/guides/skufy-trader/icons.webp) no-repeat;mask:url(/assets/guides/skufy-trader/icons.webp) no-repeat}
.icon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.icon-grid div{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font:12.5px var(--mono);color:var(--text2)}
.icon-grid .gi{color:var(--accent);width:22px;height:22px}
.kinds{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.kinds div{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line2);border-radius:9px;background:var(--surface)}
.kinds .gi{color:var(--accent)}
.kinds b{display:block;font:600 13px var(--mono);color:var(--text)}
.kinds small{color:var(--muted);font-size:12.5px}
.shot{margin:0;border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;background:#0E1116}
.shot img{width:100%;height:auto}
.shot figcaption{padding:10px 14px;border-top:1px solid var(--line);color:var(--muted);font-size:13.5px}
.shots2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.atabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.atab{display:flex;flex-direction:column;gap:10px;padding:16px 18px;border:1px solid var(--line2);border-radius:var(--r);background:var(--surface)}
.atab .n{font:400 15px var(--display);letter-spacing:.05em;color:var(--accent);display:flex;align-items:center;gap:10px}
.atab .n em{font:600 11px var(--mono);font-style:normal;color:#16110A;background:var(--accent);border-radius:5px;padding:2px 7px}
.atab ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px;font-size:14px;color:var(--text2)}
dl.faq2{margin:0;display:flex;flex-direction:column;gap:6px;max-width:84ch}
dl.faq2 details{border:1px solid var(--line2);border-radius:9px;background:var(--surface)}
dl.faq2 summary{list-style:none;cursor:pointer;padding:13px 16px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:10px}
dl.faq2 summary::-webkit-details-marker{display:none}
dl.faq2 summary .i{margin-left:auto;color:var(--muted);transition:transform .2s}
dl.faq2 details[open] summary .i{transform:rotate(180deg);color:var(--accent)}
dl.faq2 .a{padding:0 16px 14px;color:var(--text2);font-size:14.5px;display:flex;flex-direction:column;gap:8px}
@media (max-width:980px){
  .doc{grid-template-columns:1fr;gap:26px}
  .toc{position:static;flex-direction:row;flex-wrap:wrap;border-left:0;gap:6px;max-height:none}
  .toc .ttl{width:100%;padding:0 0 4px}
  .toc a{border:1px solid var(--line2);border-radius:6px;margin:0;padding:4px 10px}
  .toc a.sub{display:none}
  .param{grid-template-columns:1fr;gap:4px}
  .tree .f{grid-template-columns:1fr;gap:2px}
  .shots2{grid-template-columns:1fr}
}
.shots2{align-items:start}.shot.wide{grid-column:1/-1}