/* ---------- tokens (shared with tikklok.app) ---------- */
:root{
  --canvas:#E7ECF6; --surface:#FFFFFF; --surface-2:#F4F7FC; --line:#D3DCEC;
  --ink:#0B1B33; --ink-2:#48597A; --ink-3:#7B8AA6;
  --blue:#2563EB; --blue-deep:#153FA8; --blue-soft:#DCE6FF; --night:#3B2E8F; --signal:#0E9F6E;
  --shadow:0 1px 2px rgba(11,27,51,.06), 0 10px 30px -18px rgba(11,27,51,.35);
  --radius:14px; --maxw:1180px;
}
[data-theme="night"]{
  --canvas:#080D1B; --surface:#101A31; --surface-2:#16223D; --line:#26334F;
  --ink:#E9EFFC; --ink-2:#A3B2CE; --ink-3:#7185A6;
  --blue:#5B8BFF; --blue-deep:#7FA6FF; --blue-soft:#1C2C51; --night:#A99BFF; --signal:#34D399;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 18px 40px -22px rgba(0,0,0,.9);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--canvas);color:var(--ink);
  font-family:"Instrument Sans",system-ui,-apple-system,sans-serif;
  font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased;
  transition:background .45s ease,color .45s ease;
}
h1,h2,h3,h4{font-family:"Bricolage Grotesque",system-ui,sans-serif;margin:0;letter-spacing:-.028em;line-height:1.06;font-weight:700}
h1{font-size:clamp(2.1rem,4vw,3rem)}
h2{font-size:clamp(1.5rem,2.6vw,2rem);margin:0 0 14px}
h3{font-size:1.18rem;letter-spacing:-.015em;line-height:1.3}
h4{font-size:.95rem;color:var(--ink-2);text-transform:none;margin:22px 0 8px}
p{margin:0 0 14px}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums}
.eyebrow{font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);font-weight:500}
.lede{color:var(--ink-2);font-size:1.06rem;max-width:64ch}

/* ---------- buttons (shared) ---------- */
.btn{display:inline-flex;align-items:center;gap:.5rem;border:1px solid transparent;padding:.6rem 1rem;border-radius:10px;font:600 .9rem/1 "Instrument Sans",sans-serif;cursor:pointer;text-decoration:none;transition:transform .15s ease,background .2s,border-color .2s,box-shadow .2s}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 8px 20px -10px rgba(37,99,235,.8)}
.btn-primary:hover{background:var(--blue-deep);transform:translateY(-1px)}
[data-theme="night"] .btn-primary{color:#05070f}
.btn-ghost{border-color:var(--line);color:var(--ink);background:var(--surface)}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue)}
:focus-visible{outline:2.5px solid var(--blue);outline-offset:3px;border-radius:6px}

/* ---------- header (shared pattern) ---------- */
header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--canvas) 82%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:24px;height:70px;max-width:var(--maxw);margin:0 auto;padding:0 24px}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1;gap:4px}
.brand .name{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.15rem;letter-spacing:-.03em;color:var(--ink)}
.brand small{font-family:"JetBrains Mono",monospace;font-size:.58rem;letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase}
.nav-tools{display:flex;align-items:center;gap:12px;margin-left:auto}
.toggle{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 11px 5px 7px;cursor:pointer;color:var(--ink-2);font:500 .74rem/1 "JetBrains Mono",monospace;letter-spacing:.1em;text-transform:uppercase}
.toggle:hover{border-color:var(--blue)}
.dot{width:11px;height:11px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px var(--blue-soft);transition:background .3s}
[data-theme="night"] .dot{background:var(--night)}

/* ---------- doc layout ---------- */
.doc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;max-width:var(--maxw);margin:0 auto;padding:40px 24px 96px}
.toc{position:sticky;top:94px;align-self:start;font-size:.88rem;max-height:calc(100vh - 120px);overflow:auto}
.toc strong{display:block;font-family:"JetBrains Mono",monospace;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:18px 0 8px;font-weight:500}
.toc strong:first-child{margin-top:0}
.toc a{display:block;color:var(--ink-2);padding:4px 0;text-decoration:none;border-left:2px solid transparent;padding-left:12px;margin-left:-12px}
.toc a:hover{color:var(--blue)}
.toc a.method-link{font-family:"JetBrains Mono",monospace;font-size:.8rem}
.content{min-width:0;max-width:820px}
.content > section{padding:28px 0;border-top:1px solid var(--line)}
.content > section:first-of-type{border-top:0;padding-top:0}

/* intro */
.intro-cta{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 8px}
.baseurl{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0}
.baseurl .u{font-family:"JetBrains Mono",monospace;font-size:.92rem;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 12px;color:var(--ink)}

/* tables */
.tbl{width:100%;border-collapse:collapse;font-size:.9rem;margin:8px 0 4px}
.tbl th,.tbl td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.tbl td:first-child{white-space:nowrap}
.tbl code{white-space:nowrap}

/* code */
code{font-family:"JetBrains Mono",monospace;font-size:.85em;background:var(--surface-2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:var(--ink)}
pre{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:16px 18px;overflow:auto;margin:12px 0}
pre code{background:none;border:0;padding:0;font-size:.82rem;line-height:1.55;color:var(--ink)}

/* endpoint blocks */
.endpoint{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:0;margin:0 0 22px;overflow:hidden}
.endpoint-head{display:flex;gap:12px;align-items:center;padding:15px 20px;background:var(--surface-2);border-bottom:1px solid var(--line);flex-wrap:wrap}
.method{font-family:"JetBrains Mono",monospace;font-weight:700;font-size:.7rem;letter-spacing:.06em;padding:5px 9px;border-radius:6px;background:var(--blue-soft);color:var(--blue-deep)}
.path{font-family:"JetBrains Mono",monospace;font-size:.92rem;color:var(--ink);word-break:break-all}
.path b{color:var(--blue);font-weight:700}
.auth-tag{margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line);border-radius:6px;padding:4px 8px}
.auth-tag.pub{color:var(--signal);border-color:color-mix(in srgb,var(--signal) 40%,var(--line))}
.endpoint-body{padding:18px 20px}
.endpoint-body > p:first-child{margin-top:0}
.endpoint-body h4:first-child{margin-top:0}

.note{background:var(--blue-soft);border:1px solid color-mix(in srgb,var(--blue) 30%,var(--line));border-radius:10px;padding:14px 16px;font-size:.92rem;color:var(--ink);margin:14px 0}
[data-theme="night"] .note{color:var(--ink)}

footer{border-top:1px solid var(--line);padding:36px 0 56px;color:var(--ink-3);font-size:.86rem}
.foot{display:flex;gap:24px;align-items:center;flex-wrap:wrap;max-width:var(--maxw);margin:0 auto;padding:0 24px}
.foot a{color:var(--ink-2)}
.foot .right{margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:.74rem}

@media (max-width:900px){
  .doc{grid-template-columns:1fr;gap:0}
  .toc{position:static;max-height:none;margin-bottom:28px;border-bottom:1px solid var(--line);padding-bottom:20px}
  .content{max-width:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ---------- language switcher ---------- */
.langs{display:inline-flex;gap:2px;align-items:center;font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase}
.langs a{padding:4px 6px;border-radius:6px;color:var(--ink-3);text-decoration:none}
.langs a:hover{color:var(--blue)}
.langs a[aria-current="page"]{color:var(--blue);font-weight:700}