/* Minimal docs UI (no frameworks) */
:root{
  --bg:#0A0D12;
  --panel:#0F131B;
  --border:#1C2330;
  --text:#E7EEF9;
  --muted:#7A8BB0;
  --link:#5FB4FF;
  --link_hover:#7EC4FF;
  --code:#0B1020;
}
*{ box-sizing:border-box; }
html,body{ height:100%; margin:0; font-family:ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial; background:var(--bg); color:var(--text); }
a{ color:var(--link); text-decoration:none; }
a:hover{ text-decoration:underline; }
.app{ display:flex; min-height:100vh; }
.sidebar{ width:320px; background:var(--panel); border-right:1px solid var(--border); padding:16px; position:sticky; top:0; height:100vh; overflow:auto; }
.brand{ font-weight:700; font-size:18px; margin-bottom:12px; }
.brand-link{ color:var(--text); }
.nav-group{ margin:14px 0; }
.nav-title{ color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; margin:8px 0; }
.nav-link{ display:block; padding:8px 10px; border-radius:10px; color:var(--text); }
.nav-link.active{ background:#131a26; border:1px solid var(--border); }
.main{ flex:1; padding:24px; }
.content{ max-width:980px; }
.footer{ margin-top:40px; color:var(--muted); font-size:12px; padding:20px 0; border-top:1px solid var(--border); }
.muted{ color:var(--muted); }
.grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.card{ background:var(--panel); border:1px solid var(--border); border-radius:16px; padding:16px; }
code{ background:rgba(255,255,255,.06); padding:2px 6px; border-radius:8px; }
pre.code{ background:var(--code); border:1px solid var(--border); border-radius:16px; padding:14px; overflow:auto; }
pre.code code{ background:transparent; padding:0; }
table{ width:100%; border-collapse:collapse; margin:12px 0 22px; }
th,td{ border-bottom:1px solid var(--border); padding:10px 8px; vertical-align:top; }
th{ text-align:left; color:var(--muted); font-weight:600; font-size:12px; letter-spacing:.05em; text-transform:uppercase; }
.badge{ display:inline-block; padding:3px 10px; border-radius:999px; border:1px solid var(--border); font-size:12px; }
.badge.method{ background:#101a2b; }
li.op{ margin:10px 0; }
.code-tabs{ display:flex; gap:8px; margin:12px 0; }
.tab{ cursor:pointer; padding:8px 12px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--text); }
.tab.active{ background:#131a26; }
.hidden{ display:none; }
.md h1,.md h2,.md h3{ margin:16px 0 8px; }
.md p{ line-height:1.6; margin:10px 0; }
.md ul{ margin:10px 0 10px 18px; }
@media (max-width: 900px){
  .sidebar{ display:none; }
  .grid{ grid-template-columns:1fr; }
}
/* Main grid with right TOC */
.main-grid{
  display:grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 22px;
  align-items:start;
}

.right{ position:relative; }

.aside-toc{
  position: sticky;
  top: 18px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px 14px;
}

.toc-title{
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 10px;
}

.toc-links{ display:flex; flex-direction:column; gap:6px; }
.toc-link{ display:block; padding:6px 8px; border-radius:10px; color: var(--muted); }
.toc-link:hover{ color: var(--text); background:#131a26; text-decoration:none; }
.toc-link.active{ color: var(--text); background:#131a26; border:1px solid var(--border); }
.toc-link.toc-h3{ margin-left: 10px; font-size: 13px; }

/* Sticky operation header */
.op-header{
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  padding: 12px 0 14px;
  margin-bottom: 18px;
  display:flex;
  gap: 12px;
  align-items:flex-start;
}

.op-title{ min-width:0; }
.op-path code{ font-size: 16px; }
.op-summary{ margin-top: 6px; }

/* Responsive: hide right TOC on small screens */
@media (max-width: 1100px){
  .main-grid{ grid-template-columns: 1fr; }
  .right{ display:none; }
}

/* Schema box */
.schema-box{
  border: 1px solid var(--border);
  background: var(--panel);
  border-radius: 16px;
  padding: 10px 12px;
  margin: 10px 0 18px;
}
.schema-box summary{
  cursor: pointer;
  color: var(--text);
  font-weight: 600;
  padding: 6px 4px 10px;
}
.schema-box .schema-title{ font-size: 14px; }
pre.schema{ margin: 8px 0 6px; }

/* Pills like in old docs */
.pill{ display:inline-block; padding:3px 10px; border-radius:999px; font-size:12px; border:1px solid var(--border); }
.pill-red{ background:#2a1418; color:#ff9aa6; }
.pill-gray{ background:#151a24; color:var(--muted); }

.row-details summary{ cursor:pointer; }
.row-details summary::-webkit-details-marker{ display:none; }
.row-details summary:before{ content:"▸ "; color:var(--muted); }
.row-details[open] summary:before{ content:"▾ "; }

.example-box{
  background: var(--panel);
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
}
.example-head{
  padding:10px 12px;
  border-bottom:1px solid var(--border);
  background:#0d111a;
}
.status-pill{
  display:inline-block;
  padding:4px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:#0f1a2a;
  color: var(--link);
  font-weight:700;
  font-size:12px;
}
.badge.lts{ background:#132016; color:#9cf2b1; }

.params-table{ table-layout: fixed; width:100%; }
.params-table th:nth-child(1),
.params-table td:nth-child(1){ width: 34%; }
.params-table th:nth-child(2),
.params-table td:nth-child(2){ width: 14%; }
.params-table th:nth-child(3),
.params-table td:nth-child(3){ width: 18%; }
.params-table th:nth-child(4),
.params-table td:nth-child(4){ width: 34%; }
.params-table td{ word-break: break-word; }
.nav-tree summary{ list-style:none; cursor:pointer; }
.nav-tree summary::-webkit-details-marker{ display:none; }
.nav-sublink{
  display:block;
  margin-left: 10px;
  padding: 8px 10px;
  border-radius: 12px;
  color: var(--muted);
}
.nav-sublink:hover{ background:#131a26; color: var(--text); text-decoration:none; }
.nav-sublink.active{ background:#131a26; border:1px solid var(--border); color: var(--text); }
.nav-sublink code{ font-size: 12px; }
.main-grid{
  display:grid;
  grid-template-columns: minmax(0,1fr) 600px;
  gap: 22px;
  align-items:start;
}

.right{
  position: relative;
}

.right-sticky{
  position: sticky;
  top: 18px;
  display:flex;
  flex-direction:column;
  gap: 14px;
}

.panel{
  background: var(--panel);
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
}

.panel-h{
  padding:10px 12px;
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.panel-title{
  font-weight:700;
  font-size: 13px;
  letter-spacing:.02em;
}

@media (max-width: 1200px){
  .main-grid{ grid-template-columns: 1fr; }
  .right{ display:none; }
}
.admin-form input, .admin-form textarea{
  width:100%;
  background: var(--panel);
  border:1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  color: var(--text);
  margin: 6px 0 14px;
}

.admin-actions{ display:flex; gap:10px; align-items:center; margin-top:10px; }
.admin-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:12px;
  border:1px solid var(--border);
  background:#131a26; color: var(--text);
  font-weight:700;
}
.btn:hover{ text-decoration:none; opacity:.95; }
.btn-ghost{ background: transparent; }
.btn-danger{ background:#2a1418; border-color:#3a1a22; color:#ff9aa6; }

.admin-cards{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:16px; margin-top: 14px; }
.admin-card{ padding:16px; display:block; }
.admin-card:hover{ text-decoration:none; background:#131a26; }


/* Markdown extras */
.md hr{
  border:0;
  border-top:1px solid var(--border);
  margin: 18px 0;
}
.md blockquote{
  margin: 14px 0;
  padding: 10px 12px;
  border-left: 3px solid var(--border);
  background: rgba(255,255,255,.03);
  border-radius: 10px;
}
.md blockquote p{ margin: 0 0 8px; }
.md blockquote p:last-child{ margin-bottom:0; }

.md .md-img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius: 12px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.02);
}

.md table.md-table{
  width:100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 12px 0 18px;
  border:1px solid var(--border);
  border-radius: 12px;
  overflow:hidden;
  background: var(--panel);
}
.md table.md-table th,
.md table.md-table td{
  text-align:left;
  padding: 10px 12px;
  border-bottom:1px solid var(--border);
  vertical-align: top;
}
.md table.md-table thead th{
  font-weight:700;
  background: rgba(255,255,255,.03);
}
.md table.md-table tr:last-child td{ border-bottom:0; }