/* ==========================================================================
   /developers/ — the Lenduh API docs.
   Three columns under the site nav: contents | prose | sticky code panels.
   Everything is scoped under .docs-bar / .dev-docs so styles.css (its `*`
   reset, `a{color:inherit}`, `section{padding}`, heading faces) can't reach in,
   and nothing here reaches out. Colours are the site's own tokens.
   ========================================================================== */

.developers-page{
  --d-nav-h:72px;
  --d-bar-h:52px;
  --d-sidebar-w:268px;
  --d-link:var(--brand-deep);
  --d-inline-bg:#EEF1EA;
  --d-inline-text:#0B4A26;
  --d-amber:#9A4A06;
  --d-panel:#08211A;
  --d-panel-head:#0C2C22;
  --d-panel-line:rgba(200,241,105,.14);
  --d-panel-shadow:0 1px 2px rgba(8,33,26,.06),0 14px 36px rgba(8,33,26,.12);
}
@media(max-width:980px){.developers-page{--d-nav-h:68px}}

/* A 30,000px reference page jumps instead of gliding: the site-wide smooth scroll animated every
   deep link and contents click across the whole page, and stalled deep links in some browsers. */
html:has(body.developers-page){scroll-behavior:auto}

/* ── Docs bar (sticks under the site nav) ─────────────────────────────── */
.docs-bar{
  position:sticky;top:var(--d-nav-h);z-index:90;
  height:var(--d-bar-h);
  display:flex;align-items:center;gap:18px;
  padding:0 max(var(--gutter),20px);
  background:rgba(251,251,248,.94);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  font-family:var(--font-sans);
}
.docs-bar-title{font:600 12px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--brand-deep)}
.docs-tabs{display:flex;gap:2px}
.docs-tabs a{color:var(--text-2);font-weight:500;font-size:14.5px;padding:7px 12px;border-radius:8px}
.docs-tabs a:hover{background:var(--surface-2);color:var(--text)}
.docs-tabs a.on{color:var(--text);background:var(--surface-2)}
.docs-keys{margin-left:auto;font:600 14px/1 var(--font-sans);color:#fff;background:#0F7238;padding:10px 14px;border-radius:9px;white-space:nowrap}
.docs-keys:hover{background:#0B5A2C}
.docs-menu-btn{display:none;font:600 13px/1 var(--font-sans);background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:8px;padding:8px 10px;cursor:pointer}

/* ── Shell ──────────────────────────────────────────────────────────────── */
.dev-docs{font-family:var(--font-sans);color:var(--text);background:var(--paper)}
.dev-docs [id],.dev-docs section[id]{scroll-margin-top:calc(var(--d-nav-h) + var(--d-bar-h) + 16px)}
.dev-docs .docs-shell{display:grid;grid-template-columns:var(--d-sidebar-w) minmax(0,1fr)}
.dev-docs .sidebar{
  position:sticky;top:calc(var(--d-nav-h) + var(--d-bar-h));
  height:calc(100vh - var(--d-nav-h) - var(--d-bar-h));
  overflow-y:auto;border-right:1px solid var(--line);
  padding:18px 14px 48px;background:var(--paper);
}
.dev-docs .search{position:relative;margin:0 4px 6px}
.dev-docs .search input{width:100%;font:400 14px/1.2 var(--font-sans);color:var(--text);background:var(--surface);border:1px solid var(--line-strong);border-radius:9px;padding:9px 34px 9px 12px}
.dev-docs .search input::placeholder{color:var(--muted)}
.dev-docs .search kbd{position:absolute;right:9px;top:50%;transform:translateY(-50%);font:11px var(--font-mono);color:var(--muted);border:1px solid var(--line-strong);border-radius:5px;padding:1px 6px}
.dev-docs .nav-group h4{font:600 11px/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:22px 10px 8px}
.dev-docs .nav-group ul{list-style:none;display:grid;gap:1px}
.dev-docs .nav-group a{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:8px;color:var(--text-2);font-size:14.5px;line-height:1.35}
.dev-docs .nav-group a:hover{background:var(--surface-2);color:var(--text)}
.dev-docs .nav-group a.active{background:var(--brand-wash);color:var(--brand-deep);font-weight:600}
.dev-docs .nav-group a.sub{padding-left:22px;font-size:14px}
.dev-docs .nav-group .m{font:600 10px/1 var(--font-mono);letter-spacing:.04em;color:var(--brand-deep)}
/* A writing endpoint reads amber in the contents, the same warning as its verb badge. */
.dev-docs .nav-group .m.w{color:#8A4708}
.dev-docs .nav-empty{color:var(--muted);font-size:13.5px;padding:10px}

/* ── Content rows ───────────────────────────────────────────────────────── */
.dev-docs .docs-main{min-width:0}
.dev-docs section.row{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:56px;
  padding:56px 56px 60px;border-top:1px solid var(--line);
}
.dev-docs section.row:first-child{border-top:0}
.dev-docs section.row.solo{grid-template-columns:minmax(0,1fr)}
.dev-docs .prose{max-width:640px;min-width:0}
.dev-docs .side{position:sticky;top:calc(var(--d-nav-h) + var(--d-bar-h) + 20px);align-self:start;display:grid;gap:16px;min-width:0}
.dev-docs .group-head{padding:40px 56px 36px;border-top:1px solid var(--line);background:var(--surface-2)}
.dev-docs .group-head .eyebrow{margin-bottom:8px}
.dev-docs .group-head h2{margin:0}
.dev-docs .group-head p{margin:8px 0 0;max-width:640px;color:var(--text-2)}

.dev-docs .eyebrow{font:600 11.5px/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--brand-deep)}
.dev-docs h1,.dev-docs h2{font-family:var(--font-display);font-weight:600;letter-spacing:-.012em;text-wrap:balance;color:var(--text)}
.dev-docs h1{font-size:clamp(2.1rem,3.4vw,2.8rem);line-height:1.08;margin:12px 0 16px}
.dev-docs h2{font-size:clamp(1.5rem,2.2vw,1.85rem);line-height:1.15;margin:10px 0 14px}
.dev-docs h3{font:650 1.05rem/1.35 var(--font-sans);letter-spacing:0;margin:28px 0 8px;color:var(--text)}
.dev-docs .prose p{margin:0 0 14px;color:var(--text-2);font-size:15.5px;line-height:1.65}
.dev-docs .prose ul,.dev-docs .prose ol{margin:0 0 16px;padding-left:1.25em;color:var(--text-2);font-size:15.5px;line-height:1.65}
.dev-docs .prose li{margin:5px 0}
.dev-docs .prose li::marker{color:var(--muted)}
.dev-docs .lede{font-size:1.12rem;line-height:1.6;color:var(--text-2);margin-bottom:20px}
.dev-docs .prose a,.dev-docs .note a,.dev-docs .table-wrap a{color:var(--d-link);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.dev-docs .prose a:hover,.dev-docs .note a:hover,.dev-docs .table-wrap a:hover{text-decoration-thickness:2px}
.dev-docs .prose code,.dev-docs .table-wrap code,.dev-docs .note code{font-family:var(--font-mono);font-size:.86em;background:var(--d-inline-bg);color:var(--d-inline-text);padding:.12em .4em;border-radius:5px;white-space:nowrap}
.dev-docs .prose strong{color:var(--text);font-weight:600}

.dev-docs .endpoint{display:inline-flex;align-items:center;gap:10px;font:500 14px/1 var(--font-mono);color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:8px 12px 8px 8px;margin:2px 0 16px;max-width:100%;overflow-x:auto}
.dev-docs .verb{font:600 11px/1 var(--font-mono);letter-spacing:.05em;padding:5px 7px;border-radius:6px;background:var(--brand-wash);color:var(--brand-deep)}
/* A verb that CHANGES something reads amber, not brand green — the colour is the warning. */
.dev-docs .verb.w{background:rgba(180,83,9,.11);color:#8A4708}

/* Parameter and attribute lists */
.dev-docs .params{margin:10px 0 18px;border-top:1px solid var(--line)}
.dev-docs .param{padding:13px 0 12px;border-bottom:1px solid var(--line)}
.dev-docs .param dt{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.dev-docs .param dt .name{font:600 13.5px/1.3 var(--font-mono);color:var(--text)}
.dev-docs .param dt .type{font:400 12.5px/1.3 var(--font-mono);color:var(--muted)}
.dev-docs .param dt .flag{font:600 10.5px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dev-docs .param dt .flag.req{color:var(--d-amber)}
.dev-docs .param dd{margin:5px 0 0;color:var(--text-2);font-size:14.5px;line-height:1.6}
.dev-docs .param dd code{font-family:var(--font-mono);font-size:.86em;background:var(--d-inline-bg);color:var(--d-inline-text);padding:.12em .4em;border-radius:5px}
.dev-docs .param dd a{color:var(--d-link);text-decoration:underline;text-underline-offset:3px}
.dev-docs .enum{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:8px 0 2px;font-size:14px}
.dev-docs .enum code{justify-self:start}

/* Tables */
.dev-docs .table-wrap{overflow-x:auto;margin:6px 0 18px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.dev-docs table{border-collapse:collapse;width:100%;font-size:14.2px}
.dev-docs th,.dev-docs td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text-2)}
.dev-docs th{font:600 11px/1.2 var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);background:var(--surface-2)}
.dev-docs tr:last-child td{border-bottom:0}
.dev-docs td.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text)}

/* Callouts */
.dev-docs .note{border:1px solid var(--line-strong);background:var(--surface);border-radius:10px;padding:12px 14px;margin:4px 0 18px;font-size:14.5px;color:var(--text-2);line-height:1.6}
.dev-docs .note.tip{background:var(--brand-wash);border-color:transparent}
.dev-docs .note strong{color:var(--text)}
.dev-docs .note p{margin:0}

.dev-docs .steps{counter-reset:step;list-style:none;padding:0!important;display:grid;gap:14px;margin:6px 0 20px}
.dev-docs .steps>li{counter-increment:step;position:relative;padding-left:42px;margin:0}
.dev-docs .steps>li::before{content:counter(step);position:absolute;left:0;top:1px;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;font:600 12.5px/1 var(--font-mono);color:var(--brand-deep);background:var(--brand-wash)}
.dev-docs .steps strong{display:block;color:var(--text);margin-bottom:2px}

/* ── Code panels (always on ink, like the site's dark bands) ─────────────── */
.dev-docs .panel{background:var(--d-panel);color:#E6EFE9;border-radius:12px;overflow:hidden;box-shadow:var(--d-panel-shadow);border:1px solid var(--d-panel-line);min-width:0}
.dev-docs .panel-head{display:flex;align-items:flex-end;gap:10px;padding:0 8px 0 14px;background:var(--d-panel-head);border-bottom:1px solid var(--d-panel-line);flex-wrap:wrap;min-height:42px}
.dev-docs .panel-title{display:flex;align-items:center;gap:8px;font:500 12.5px/1 var(--font-mono);color:#C3D2C8;padding:14px 0 13px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dev-docs .panel-title .verb{background:rgba(200,241,105,.13);color:#C8F169}
.dev-docs .panel-title .verb.w{background:rgba(251,191,36,.14);color:#FBBF24}
.dev-docs .tabs{display:flex;margin-left:auto;overflow-x:auto}
.dev-docs .tabs button{font:500 12px/1 var(--font-mono);color:#93A79B;background:none;border:0;border-bottom:2px solid transparent;padding:14px 9px 12px;cursor:pointer;white-space:nowrap}
.dev-docs .tabs button:hover{color:#E6EFE9}
.dev-docs .tabs button[aria-selected="true"]{color:#C8F169;border-bottom-color:#C8F169}
.dev-docs .tabs button .s4{color:#F2C06B}
.dev-docs .tabs button .s5{color:#F29B9B}
.dev-docs .copy{font:500 11.5px/1 var(--font-mono);color:#C3D2C8;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:6px 8px;margin:0 0 8px 4px;cursor:pointer;align-self:center}
.dev-docs .copy:hover{color:#fff;border-color:rgba(200,241,105,.4)}
.dev-docs .panel pre{margin:0;padding:16px 18px 18px;overflow:auto;max-height:560px;font:400 12.8px/1.68 var(--font-mono);color:#E6EFE9;tab-size:2}
.dev-docs .panel pre code{font:inherit;background:none;padding:0;color:inherit;white-space:pre}
.dev-docs .panel .foot{font:400 12px/1.5 var(--font-sans);color:#93A79B;padding:10px 16px 12px;border-top:1px solid var(--d-panel-line)}
.dev-docs .panel .foot code{font-family:var(--font-mono);color:#C3D2C8}
.dev-docs .kv{margin:0;padding:14px 16px 16px;display:grid;gap:12px}
.dev-docs .kv div{display:grid;gap:4px}
.dev-docs .kv dt{font:600 10.5px/1 var(--font-mono);letter-spacing:.09em;text-transform:uppercase;color:#93A79B}
.dev-docs .kv dd{margin:0;font:500 13.5px/1.5 var(--font-mono);color:#E6EFE9;overflow-wrap:anywhere}
.dev-docs .ep-list{list-style:none;margin:0;padding:10px 8px 12px;display:grid;gap:2px}
.dev-docs .ep-list a{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:8px;padding:7px 8px;border-radius:7px;color:#E6EFE9;font:400 13px/1.3 var(--font-mono)}
.dev-docs .ep-list a:hover{background:rgba(255,255,255,.05)}
.dev-docs .ep-list .verb{justify-self:start;background:rgba(200,241,105,.13);color:#C8F169}
.dev-docs .ep-list .verb.w{background:rgba(251,191,36,.14);color:#FBBF24}
.dev-docs .ep-list .ev{justify-self:start;font:600 10px/1 var(--font-mono);color:#93A79B;padding:5px 0}

/* highlight.js tokens, on the ink ground */
.dev-docs .hljs-comment,.dev-docs .hljs-quote{color:#7F978A;font-style:italic}
.dev-docs .hljs-keyword,.dev-docs .hljs-selector-tag{color:#C8F169}
.dev-docs .hljs-string,.dev-docs .hljs-regexp,.dev-docs .hljs-template-string{color:#EBD48F}
.dev-docs .hljs-number,.dev-docs .hljs-literal{color:#F4AE84}
.dev-docs .hljs-attr,.dev-docs .hljs-property,.dev-docs .hljs-attribute{color:#9AD8B4}
.dev-docs .hljs-title,.dev-docs .hljs-built_in{color:#B9E0FF}
.dev-docs .hljs-variable,.dev-docs .hljs-template-variable,.dev-docs .hljs-params,.dev-docs .hljs-subst{color:#E6EFE9}
.dev-docs .hljs-meta{color:#93A79B}
.dev-docs .hljs-section,.dev-docs .hljs-name{color:#C8F169}

.dev-docs .docs-foot{border-top:1px solid var(--line);padding:24px 56px 40px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 24px;font:400 12.5px/1.5 var(--font-mono)}

.dev-docs :focus-visible,.docs-bar :focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media(max-width:1280px){
  .dev-docs section.row{grid-template-columns:minmax(0,1fr);gap:28px}
  .dev-docs .side{position:static;max-width:720px}
  .dev-docs .prose{max-width:720px}
}
@media(max-width:980px){.docs-tabs{display:none}}
@media(max-width:900px){
  .docs-menu-btn{display:inline-block}
  .docs-bar{gap:12px;padding:0 16px}
  .dev-docs .docs-shell{grid-template-columns:minmax(0,1fr)}
  .dev-docs .sidebar{
    position:fixed;z-index:95;left:0;
    top:calc(var(--d-nav-h) + var(--d-bar-h));
    height:calc(100% - var(--d-nav-h) - var(--d-bar-h));
    width:min(320px,88vw);
    /* Closed: off-screen AND hidden, so no shadow bleeds in and its links take no focus. */
    transform:translateX(-102%);visibility:hidden;
    transition:transform .22s ease,visibility 0s linear .22s;
  }
  .dev-docs .sidebar.open{transform:none;visibility:visible;transition:transform .22s ease;box-shadow:0 20px 60px rgba(8,33,26,.25)}
  .dev-docs section.row,.dev-docs .group-head{padding:36px 16px 40px}
  .dev-docs .docs-foot{padding:24px 16px 40px}
}
@media(max-width:480px){
  .docs-keys{padding:9px 11px;font-size:13px}
  .dev-docs .enum{grid-template-columns:1fr;gap:2px 0}
  .dev-docs .enum code{margin-top:8px}
}
@media(prefers-reduced-motion:reduce){.dev-docs .sidebar{transition:none}}