/* ============================================================
   Split — docs page (docs.html)
   ============================================================ */
.docs{
  display:grid; grid-template-columns:220px minmax(0,1fr); gap:56px;
  padding-top:40px; padding-bottom:96px; align-items:start;
}

/* ---------- table of contents ------------------------------ */
.docs__side{ position:sticky; top:88px; max-height:calc(100vh - 108px); overflow-y:auto; }
.docs__toc{ display:flex; flex-direction:column; gap:2px; border-left:1px solid var(--line); }
.docs__toc-title{
  margin:0 0 8px; padding-left:16px;
  font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);
}
.docs__toc a{
  display:block; padding:6px 12px 6px 16px; margin-left:-1px;
  border-left:2px solid transparent; color:var(--muted); font-size:14.5px;
  transition:color .15s, border-color .15s;
}
.docs__toc a:hover{ color:var(--ink); }
.docs__toc a[aria-current="true"]{ color:var(--ink); border-left-color:var(--accent); }

/* ---------- article ---------------------------------------- */
.docs__body{ max-width:780px; min-width:0; }
.docs__sec{ padding:8px 0 48px; border-bottom:1px solid var(--line); margin-bottom:40px; }
.docs__sec:last-of-type{ border-bottom:0; margin-bottom:0; }
.docs__sec h2{ font-size:clamp(24px,2.8vw,30px); letter-spacing:-.02em; line-height:1.15; margin:0 0 16px; }
.docs__sec h3{ font-size:17px; letter-spacing:-.01em; margin:32px 0 12px; }
.docs__sec > p, .docs__sec .docs__list{ color:var(--ink-2); font-size:16px; line-height:1.65; }
.docs__sec > p{ margin:0 0 14px; }
.docs__sec strong{ color:var(--ink); }
.docs__sec a:not(.btn):not(.tx-link){ color:var(--accent); }
.docs__sec a:not(.btn):not(.tx-link):hover{ text-decoration:underline; }
.docs__sec .method{ margin:4px 0 0; }

.docs__list{ margin:0 0 14px; padding-left:20px; display:flex; flex-direction:column; gap:8px; }
.docs__list li::marker{ color:var(--muted); }
.faq__a .docs__list{ font-size:15.5px; margin:0 0 10px; }

.docs__small{ color:var(--muted) !important; font-size:14px !important; }

.docs__callout{
  margin:20px 0 0; padding:16px 18px; border-radius:var(--radius-sm);
  background:var(--accent-soft); border:1px solid var(--accent-line);
  color:var(--ink-2); font-size:15px; line-height:1.6;
}

/* ---------- how it works strip ----------------------------- */
.docs__flow{
  list-style:none; margin:22px 0 22px; padding:0; counter-reset:f;
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px;
}
.docs__flow li{
  counter-increment:f; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:14px 14px 16px; display:flex; flex-direction:column; gap:4px;
}
.docs__flow li::before{
  content:counter(f); font-family:var(--mono); font-size:12px; color:var(--accent); margin-bottom:2px;
}
.docs__flow b{ color:var(--ink); font-size:15px; }
.docs__flow span{ color:var(--muted); font-size:13.5px; line-height:1.45; }

/* ---------- tables ----------------------------------------- */
.docs__table{ margin:16px 0; padding:6px 18px; overflow-x:auto; }
.docs__table .data-table td, .docs__table .data-table th{ padding-left:0; }
.docs__table .data-table td:last-child, .docs__table .data-table th:last-child{ padding-right:0; }
.docs__table .muted{ color:var(--muted); }

.docs__kv th[scope="row"]{
  width:34%; font-size:14px; font-weight:500; letter-spacing:0; text-transform:none; color:var(--muted);
}
.docs__kv tbody tr:last-child th{ border-bottom:0; }
.docs__kv td{ color:var(--ink); word-break:break-all; }
.docs__kv td.mono{ font-size:13px; }

.docs__addr{ display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }
.docs__addr .tx-link{ word-break:break-all; }
.docs__copy{
  display:inline-grid; place-items:center; width:28px; height:28px; flex:none;
  border:1px solid var(--line); border-radius:6px; background:transparent; color:var(--muted); cursor:pointer;
  transition:color .15s, border-color .15s;
}
.docs__copy:hover{ color:var(--ink); border-color:var(--line-strong); }
.docs__copy:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }

/* ---------- formula ---------------------------------------- */
.docs__formula{ margin:18px 0 16px; overflow-x:auto; }
.docs__defs{ margin:0 0 8px; }

/* ---------- end of article --------------------------------- */
.docs__more{
  margin-top:40px; padding:22px 24px; border-radius:var(--radius);
  background:var(--surface); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.docs__more p{ margin:0; color:var(--ink-2); }
.docs__more a:not(.btn){ color:var(--accent); }

/* ---------- responsive ------------------------------------- */
@media (max-width: 1000px){
  .docs{ grid-template-columns:190px minmax(0,1fr); gap:36px; }
}
@media (max-width: 860px){
  .docs{ grid-template-columns:minmax(0,1fr); gap:24px; padding-top:24px; }
  .docs__side{ position:static; max-height:none; overflow:visible; }
  .docs__toc{
    border-left:0; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
    padding:14px 8px 10px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 8px;
  }
  .docs__toc-title{ grid-column:1 / -1; padding-left:8px; }
  .docs__toc a{ border-left:0; margin-left:0; padding:7px 8px; border-radius:6px; }
  .docs__toc a[aria-current="true"]{ background:rgba(255,255,255,.05); }
  .docs__flow{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px){
  .docs__sec{ padding-bottom:36px; margin-bottom:32px; }
  .docs__sec > p, .docs__sec .docs__list{ font-size:15.5px; }
  .docs__table{ padding:4px 14px; }
  .docs__kv th[scope="row"]{ width:40%; }
  .docs__more{ padding:18px; }
}