/* ═══════════════════════════════════════════════════════════════
   AIMLSE Documentation
   Dark, matching the landing page (design-system.css): #0a0a0a base,
   #d4a017 accent, Inter / Space Grotesk / JetBrains Mono. The page used
   to be a white "paper" theme, which clashed with the rest of the site.
   The token names are kept so every rule below re-themes in place.
   ═══════════════════════════════════════════════════════════════ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  /* "paper" is now the dark surface ladder */
  --paper:#0a0a0a; --paper-1:#141414; --paper-2:#1a1a1a; --paper-3:#242424;
  --line:#2a2a2a; --line-soft:#1f1f1f;
  /* "ink" is now light text on dark */
  --ink:#ffffff; --ink-2:#d2d2d2; --ink-dim:#aaaaaa;
  --brass:#d4a017; --brass-bright:#f0c040; --brass-dim:rgba(212,160,23,0.35); --brass-deep:#f0c040;
  --brass-glow:rgba(212,160,23,0.28);
  --code-bg:#141414; --code-bg-2:#1a1a1a; --code-line:#2a2a2a; --code-text:#e8e8e8; --code-dim:#888888;
  --patina:#22c55e; --err:#ef4444;
  --mono:'JetBrains Mono', ui-monospace, Menlo, monospace;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  /* Flat accent — the old five-stop metallic gradient is gone. */
  --gold-grad:#d4a017;
  --shadow-sm:0 1px 2px rgba(0,0,0,0.3);
  --shadow-md:0 12px 32px rgba(0,0,0,0.5);
  --toc-w:248px; --maxw:1200px;
}

html { scroll-behavior:smooth; }
body {
  font-family:var(--sans); background:var(--paper); color:var(--ink-2);
  -webkit-font-smoothing:antialiased; line-height:1.7; overflow-x:hidden;
}
body::after {
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,0.02) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 80% 50% at 50% 0%, #000 0%, transparent 72%);
}
::selection { background:rgba(212,160,23,0.25); color:#0a0a0a; }
a { color:var(--brass); text-decoration:none; }
a:hover { text-decoration:underline; }

/* ── Top bar ── */
.docs-nav {
  position:fixed; top:0; left:0; right:0; height:62px; z-index:50;
  display:flex; align-items:center; gap:20px; padding:0 26px;
  background:rgba(10,10,10,0.8); backdrop-filter:blur(18px) saturate(140%);
  border-bottom:1px solid var(--line);
}
.wordmark {
  font-family:var(--mono); font-weight:700; font-size:17px; letter-spacing:0.26em; text-transform:uppercase;
  color:var(--brass);
}
.wordmark sup { font-size:8px; color:var(--ink-dim); letter-spacing:0; margin-left:3px; }
.docs-tag {
  font-family:var(--mono); font-size:10px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--ink-dim); border:1px solid var(--line); border-radius:100px; padding:4px 10px;
}
.docs-nav-right { margin-left:auto; display:flex; align-items:center; gap:10px; }
.docs-nav-right a { font-family:var(--mono); font-size:12px; color:var(--ink-2); padding:8px 14px; border-radius:8px; }
.docs-nav-right a:hover { color:var(--ink); background:var(--paper-2); text-decoration:none; }
.docs-nav-right .cta {
  color:#241a00; background:var(--gold-grad); font-weight:700;
  box-shadow:0 2px 14px rgba(212,160,23,0.28);
}
.docs-nav-right .cta:hover { background:var(--brass-bright); }

.menu-btn {
  display:none; width:40px; height:40px; border:1px solid var(--line); border-radius:9px;
  background:var(--paper-1); color:var(--brass); font-size:18px; cursor:pointer;
}

/* ── Shell ── */
.docs-shell {
  max-width:var(--maxw); margin:62px auto 0; padding:0 26px;
  display:grid; grid-template-columns:var(--toc-w) 1fr; gap:48px; position:relative; z-index:1;
}

/* ── TOC ── */
.toc {
  position:sticky; top:62px; align-self:start; height:calc(100vh - 62px);
  overflow-y:auto; padding:38px 0 60px;
}
.toc-group { margin-bottom:26px; }
.toc-group-title {
  font-family:var(--mono); font-size:10px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--brass); margin-bottom:12px; padding-left:14px;
}
.toc a {
  display:block; font-family:var(--mono); font-size:12.5px; color:var(--ink-dim);
  padding:7px 14px; border-left:2px solid var(--line); transition:all 0.2s;
}
.toc a:hover { color:var(--ink); border-left-color:var(--brass-dim); text-decoration:none; }
.toc a.active { color:var(--brass); border-left-color:var(--brass); background:var(--paper-1); }

/* ── Article ── */
.doc { padding:44px 0 120px; max-width:760px; min-width:0; }
.doc-hero { margin-bottom:50px; padding-bottom:34px; border-bottom:1px solid var(--line); }
.doc-eyebrow {
  font-family:var(--mono); font-size:11px; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--brass); margin-bottom:16px;
}
.doc-hero h1 { font-family:var(--mono); font-weight:700; font-size:clamp(30px,5vw,44px); letter-spacing:-0.02em; color:var(--ink); line-height:1.1; margin-bottom:14px; }
.doc-hero p { font-size:17px; color:var(--ink-dim); max-width:60ch; }

.doc section { padding-top:34px; margin-top:34px; border-top:1px solid var(--line-soft); scroll-margin-top:84px; }
.doc section:first-of-type { border-top:none; margin-top:0; }
.doc h2 {
  font-family:var(--mono); font-weight:700; font-size:24px; letter-spacing:-0.01em; color:var(--ink);
  margin-bottom:16px; display:flex; align-items:center; gap:12px;
}
.doc h2::before { content:''; width:8px; height:8px; border-radius:2px; background:var(--brass-bright); transform:rotate(45deg); box-shadow:0 0 10px var(--brass-glow); }
.doc h3 { font-family:var(--mono); font-size:15px; color:var(--brass); margin:26px 0 10px; letter-spacing:0.01em; }
.doc p { margin-bottom:14px; }
.doc p code, .doc li code, .doc td code {
  font-family:var(--mono); font-size:12.5px; color:var(--brass-deep);
  background:var(--paper-2); border:1px solid var(--line); border-radius:5px; padding:1px 6px;
}
.doc ul, .doc ol { margin:0 0 16px 4px; padding-left:22px; }
.doc li { margin-bottom:8px; }
.doc ul li::marker { color:var(--brass); }
.doc ol li::marker { color:var(--brass); font-family:var(--mono); }
.doc strong { color:var(--ink); font-weight:600; }

/* code blocks, kept dark */
.code-block {
  background:var(--code-bg); border:1px solid var(--code-line); border-radius:12px; overflow:hidden;
  margin:18px 0; box-shadow:var(--shadow-md);
}
.code-block-bar {
  display:flex; align-items:center; gap:7px; padding:9px 13px; border-bottom:1px solid var(--code-line);
  font-family:var(--mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--code-dim);
}
.code-block-bar i { width:9px; height:9px; border-radius:50%; }
.code-block-bar i:nth-child(1){ background:#c0392b; } .code-block-bar i:nth-child(2){ background:var(--brass-bright); } .code-block-bar i:nth-child(3){ background:#16803a; }
.code-block-bar span { margin-left:auto; }
.code-block pre { padding:16px 18px; overflow-x:auto; }
.code-block code { font-family:var(--mono); font-size:13px; line-height:1.8; color:var(--code-text); white-space:pre; }
.c-com{color:#7d775f;} .c-kw{color:#c8a6ff;} .c-fn{color:#7ee0a6;} .c-nm{color:#f0a6c8;} .c-str{color:#f0c674;} .c-ok{color:#5bd6ab;}

/* callout */
.callout {
  display:flex; gap:13px; padding:16px 18px; border-radius:11px; margin:18px 0;
  background:rgba(212,160,23,0.06); border:1px solid var(--brass-dim);
}
.callout .mark { font-family:var(--mono); color:var(--brass); font-weight:700; flex-shrink:0; }
.callout p { margin:0; font-size:14.5px; color:var(--ink-2); }

/* table */
.doc-table { width:100%; border-collapse:collapse; margin:18px 0; font-size:14px; }
.doc-table th, .doc-table td { text-align:left; padding:11px 14px; border-bottom:1px solid var(--line); }
.doc-table th { font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--brass); }
.doc-table td { color:var(--ink-dim); }
.doc-table tr:hover td { background:var(--paper-1); }

/* method pill */
.m { font-family:var(--mono); font-size:11px; font-weight:700; padding:2px 7px; border-radius:5px; }
.m-get { color:var(--patina); border:1px solid rgba(31,155,120,0.4); }
.m-post { color:var(--brass); border:1px solid var(--brass-dim); }

/* fidelity mini-ladder in docs */
.fl { list-style:none; padding:0; margin:18px 0; }
.fl li { display:grid; grid-template-columns:54px 1fr; gap:14px; padding:14px 0; border-bottom:1px solid var(--line-soft); margin:0; }
.fl b { font-family:var(--mono); font-size:18px; color:var(--brass); }
.fl span { color:var(--ink-dim); font-size:14.5px; }
.fl span em { font-style:normal; color:var(--ink); font-family:var(--mono); font-size:13px; }

.doc-foot { margin-top:50px; padding-top:24px; border-top:1px solid var(--line); font-family:var(--mono); font-size:12px; color:var(--ink-dim); }
.doc-foot a { color:var(--brass); }

/* mobile */
@media (max-width:880px) {
  .docs-shell { grid-template-columns:1fr; gap:0; }
  .menu-btn { display:block; }
  .toc {
    position:fixed; top:62px; left:0; bottom:0; width:280px; height:auto;
    background:rgba(10,10,10,0.98); border-right:1px solid var(--line); padding:24px 0 40px;
    transform:translateX(-100%); transition:transform 0.35s ease; z-index:40; box-shadow:var(--shadow-md);
  }
  .toc.open { transform:translateX(0); }
  .doc { padding:32px 0 90px; }
}
@media (prefers-reduced-motion: reduce) { * { transition:none !important; scroll-behavior:auto !important; } }