/* Boost Boss Developer Docs — master layout (quiet dark, brand-tinted) */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
:root{
  --doc-bg:#0C0C13;          /* quiet page base (no aurora) */
  --doc-panel:#12121B;       /* sidebar / raised */
  --doc-code:#0B0B14;        /* code surface */
  --doc-line:rgba(255,255,255,.08);
  --doc-line-2:rgba(255,255,255,.06);
  --doc-ink:#F4F4F8;
  --doc-soft:rgba(244,244,248,.66);
  --doc-mut:rgba(244,244,248,.45);
  --doc-sidebar:264px;
  --doc-toc:220px;
}
body{font-family:var(--font-body);background:var(--doc-bg);color:var(--doc-soft);-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.65}
a{color:inherit;text-decoration:none}
svg{display:block}
code,kbd{font-family:var(--font-mono)}

/* faint brand tint at very top only — quiet, not aurora */
body::before{content:"";position:fixed;top:0;left:0;right:0;height:320px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 60% 100% at 20% 0%,rgba(255,45,120,.05),transparent 70%)}

/* ---------- Top bar ---------- */
.doc-top{position:sticky;top:0;z-index:40;height:60px;display:flex;align-items:center;gap:20px;padding:0 22px;background:rgba(12,12,19,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--doc-line)}
.doc-brand{display:flex;align-items:center;gap:9px}
.doc-brand svg{width:30px;height:30px}
.doc-brand b{font-family:var(--font-display);font-size:17px;font-weight:700;color:#fff;letter-spacing:-.01em}
.doc-brand span{font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--bb-cyan);border:1px solid rgba(0,255,224,.3);padding:2px 7px;border-radius:5px}
.doc-search{margin-left:8px;flex:0 1 320px;display:flex;align-items:center;gap:9px;height:38px;padding:0 14px;border-radius:9px;background:rgba(255,255,255,.04);border:1px solid var(--doc-line);color:var(--doc-mut);font-size:13.5px;cursor:text}
.doc-search svg{width:16px;height:16px}
.doc-search kbd{margin-left:auto;font-size:11px;background:rgba(255,255,255,.07);border:1px solid var(--doc-line);border-radius:5px;padding:2px 6px;color:var(--doc-mut)}
.doc-top-links{margin-left:auto;display:flex;align-items:center;gap:20px}
.doc-top-links a{font-size:13.5px;font-weight:500;color:var(--doc-soft)}
.doc-top-links a:hover{color:#fff}
.doc-top-cta{font-family:var(--font-body);font-size:13.5px;font-weight:600;color:#fff;background:var(--bb-pink);padding:8px 15px;border-radius:8px}
.doc-top-cta:hover{background:var(--bb-pink-dark)}

/* ---------- Shell grid ---------- */
.doc-shell{display:grid;grid-template-columns:var(--doc-sidebar) minmax(0,1fr) var(--doc-toc);max-width:1500px;margin:0 auto;align-items:start}

/* ---------- Sidebar ---------- */
.doc-side{position:sticky;top:60px;height:calc(100vh - 60px);overflow-y:auto;padding:26px 18px 60px;border-right:1px solid var(--doc-line)}
.doc-side::-webkit-scrollbar{width:8px}.doc-side::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:8px}
.doc-sec{margin-bottom:22px}
.doc-sec-l{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.9px;color:var(--doc-mut);padding:0 12px;margin-bottom:8px}
.doc-side a{display:block;font-size:13.5px;color:var(--doc-soft);padding:7px 12px;border-radius:7px;border-left:2px solid transparent;transition:background .12s,color .12s}
.doc-side a:hover{background:rgba(255,255,255,.04);color:#fff}
.doc-side a.on{background:var(--bb-pink-tint);color:var(--bb-pink);font-weight:600;border-left-color:var(--bb-pink)}
.doc-side a.sub{margin-left:12px;font-size:13px;color:var(--doc-mut)}
.doc-side a.sub:hover{color:#fff}
.doc-side a.sub.on{color:var(--bb-pink)}

/* ---------- Main column ---------- */
.doc-main{min-width:0;padding:34px 52px 80px;max-width:820px}
.doc-crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--doc-mut);margin-bottom:18px;flex-wrap:wrap}
.doc-crumb a:hover{color:var(--bb-pink)}.doc-crumb .sep{opacity:.5}
.doc-h1{font-family:var(--font-display);font-size:36px;font-weight:700;color:#fff;letter-spacing:-.025em;line-height:1.1;margin-bottom:12px}
.doc-sub{font-size:18px;color:var(--doc-soft);line-height:1.6;margin-bottom:14px}
.doc-meta{display:flex;align-items:center;gap:14px;font-size:13px;color:var(--doc-mut);padding-bottom:22px;margin-bottom:30px;border-bottom:1px solid var(--doc-line)}
.doc-pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:100px;background:rgba(0,255,224,.1);color:var(--bb-cyan)}

/* prose */
.prose h2{font-family:var(--font-display);font-size:24px;font-weight:700;color:#fff;letter-spacing:-.01em;margin:42px 0 14px;scroll-margin-top:80px;position:relative}
.prose h3{font-family:var(--font-display);font-size:18px;font-weight:700;color:#fff;margin:30px 0 10px;scroll-margin-top:80px;position:relative}
.prose h2 .anchor,.prose h3 .anchor{position:absolute;left:-24px;top:50%;transform:translateY(-50%);opacity:0;color:var(--bb-pink);transition:opacity .12s;font-weight:400}
.prose h2:hover .anchor,.prose h3:hover .anchor{opacity:1}
.prose p{font-size:15.5px;color:var(--doc-soft);line-height:1.7;margin-bottom:16px}
.prose ul,.prose ol{margin:0 0 16px 22px;font-size:15.5px;color:var(--doc-soft);line-height:1.7}
.prose li{margin-bottom:7px}
.prose strong{color:var(--doc-ink);font-weight:650}
.prose a.link{color:var(--bb-cyan);font-weight:500;border-bottom:1px solid rgba(0,255,224,.3)}
.prose a.link:hover{border-bottom-color:var(--bb-cyan)}
.prose code:not(pre code){font-size:13px;background:rgba(255,255,255,.07);border:1px solid var(--doc-line);border-radius:5px;padding:1px 6px;color:#FF8FB4}

/* ---------- Code block ---------- */
.code{margin:0 0 22px;border-radius:12px;overflow:hidden;border:1px solid var(--doc-line);background:var(--doc-code)}
.code-head{display:flex;align-items:center;gap:4px;padding:8px 10px 0 10px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--doc-line-2)}
.code-tab{font-family:var(--font-body);font-size:12.5px;font-weight:600;color:var(--doc-mut);background:none;border:none;padding:8px 13px;border-radius:7px 7px 0 0;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.code-tab:hover{color:var(--doc-soft)}
.code-tab.on{color:#fff;border-bottom-color:var(--bb-pink)}
.code-copy{margin-left:auto;align-self:center;display:inline-flex;align-items:center;gap:6px;font-family:var(--font-body);font-size:12px;font-weight:600;color:var(--doc-mut);background:rgba(255,255,255,.05);border:1px solid var(--doc-line);border-radius:7px;padding:5px 10px;cursor:pointer;margin-bottom:6px;transition:color .12s,background .12s}
.code-copy:hover{color:#fff;background:rgba(255,255,255,.1)}
.code-copy svg{width:13px;height:13px}
.code-body{position:relative}
.code-body pre{display:none;margin:0;padding:18px 20px;overflow-x:auto;font-family:var(--font-mono);font-size:13px;line-height:1.7;color:#E5E7EB}
.code-body pre.on{display:block}
.code-body pre::-webkit-scrollbar{height:8px}.code-body pre::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:8px}
/* token colors */
.tk{color:#FF8FB4}    /* keyword */
.ts{color:#FFE600}    /* string */
.tc{color:#6B7280;font-style:italic} /* comment */
.tf{color:#00FFE0}    /* function/type */
.tn{color:#9D7AFF}    /* number/const */
.tp{color:#7DD3FC}    /* property */

/* single (no-tab) code block */
.code.simple .code-head{padding-bottom:8px}
.code .lang-badge{font-family:var(--font-mono);font-size:11px;color:var(--doc-mut);padding:8px 13px}

/* ---------- API table ---------- */
.api-tbl{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:14px;border:1px solid var(--doc-line);border-radius:10px;overflow:hidden}
.api-tbl thead th{text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--doc-mut);background:rgba(255,255,255,.03);padding:11px 16px;border-bottom:1px solid var(--doc-line)}
.api-tbl td{padding:12px 16px;border-bottom:1px solid var(--doc-line-2);vertical-align:top;color:var(--doc-soft)}
.api-tbl tr:last-child td{border-bottom:none}
.api-tbl td code{font-family:var(--font-mono);font-size:12.5px;color:#FF8FB4}
.api-tbl .req{font-size:10px;font-weight:700;color:var(--bb-pink);text-transform:uppercase;letter-spacing:.4px}
.api-tbl .opt{font-size:10px;font-weight:700;color:var(--doc-mut);text-transform:uppercase;letter-spacing:.4px}
.method{display:inline-block;font-family:var(--font-mono);font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px}
.method.get{background:rgba(0,255,224,.12);color:var(--bb-cyan)}
.method.post{background:rgba(52,211,153,.14);color:#34D399}
.method.del{background:rgba(248,113,113,.14);color:#F87171}

/* endpoint pill */
.endpoint{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:13.5px;background:var(--doc-code);border:1px solid var(--doc-line);border-radius:9px;padding:11px 14px;margin:0 0 18px;color:#E5E7EB;overflow-x:auto}

/* ---------- Callouts ---------- */
.callout{display:flex;gap:12px;padding:15px 17px;border-radius:10px;margin:0 0 22px;border:1px solid;font-size:14.5px;line-height:1.6}
.callout .ci{flex-shrink:0;width:20px;height:20px;margin-top:1px}
.callout p{margin:0;color:var(--doc-soft)}
.callout strong{color:#fff}
.callout.tip{background:rgba(52,211,153,.07);border-color:rgba(52,211,153,.25)}
.callout.tip .ci{color:#34D399}
.callout.warn{background:rgba(255,230,0,.06);border-color:rgba(255,230,0,.25)}
.callout.warn .ci{color:var(--bb-yellow)}
.callout.info{background:rgba(0,255,224,.06);border-color:rgba(0,255,224,.22)}
.callout.info .ci{color:var(--bb-cyan)}

/* prev / next */
.doc-nav{display:flex;justify-content:space-between;gap:14px;margin-top:46px;padding-top:26px;border-top:1px solid var(--doc-line)}
.doc-nav a{flex:1;display:block;padding:16px 18px;border:1px solid var(--doc-line);border-radius:10px;transition:border-color .12s,background .12s}
.doc-nav a:hover{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.02)}
.doc-nav .dir{font-size:12px;color:var(--doc-mut);margin-bottom:4px}
.doc-nav .ttl{font-family:var(--font-display);font-size:15px;font-weight:600;color:#fff}
.doc-nav .next{text-align:right}

/* ---------- Right TOC ---------- */
.doc-toc{position:sticky;top:60px;height:calc(100vh - 60px);overflow-y:auto;padding:34px 18px 60px}
.doc-toc-l{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.9px;color:var(--doc-mut);margin-bottom:12px}
.doc-toc a{display:block;font-size:13px;color:var(--doc-mut);padding:5px 0 5px 12px;border-left:2px solid var(--doc-line);transition:color .12s,border-color .12s}
.doc-toc a:hover{color:var(--doc-soft)}
.doc-toc a.h3{padding-left:24px;font-size:12.5px}
.doc-toc a.on{color:var(--bb-pink);border-left-color:var(--bb-pink);font-weight:600}

/* ---------- Responsive ---------- */
@media(max-width:1180px){
  .doc-shell{grid-template-columns:var(--doc-sidebar) minmax(0,1fr)}
  .doc-toc{display:none}
}
@media(max-width:860px){
  .doc-shell{grid-template-columns:1fr}
  .doc-side{display:none}
  .doc-main{padding:28px 22px 60px}
  .doc-search{display:none}
}
.copied{color:#34D399!important}
