/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:22px 0}
.faq summary{cursor:pointer;font-size:1.125rem;font-weight:600;letter-spacing:-.015em;display:flex;justify-content:space-between;gap:20px;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--accent);font-family:var(--mono);font-weight:400}
.faq details[open] summary::after{content:"\2212"}
.faq p{color:var(--fg-2);max-width:74ch;margin-top:12px}


/* ---------- integrations: shared ---------- */
.pbs{display:flex;flex-wrap:wrap;gap:6px}
.pb{display:inline-flex;align-items:center;height:22px;padding:0 7px;border:1px solid var(--line-2);border-radius:5px;font-family:var(--mono);font-size:.6875rem;letter-spacing:.01em;color:var(--fg-2);white-space:nowrap}
.pb--main{border-color:rgba(79,107,255,.55);color:#c3ccff;background:rgba(79,107,255,.10)}
.lg{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex:none;border:1px solid var(--line-2);border-radius:8px;font-family:var(--mono);font-size:.75rem;font-weight:500;color:var(--fg-2);background:rgba(255,255,255,.02)}
.lg img{width:22px;height:22px;object-fit:contain}
.section-h{display:grid;gap:18px;margin-bottom:clamp(36px,4.5vw,64px)}
@media (min-width:900px){.section-h--split{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:end}}
.panel{border:1px solid var(--line-2);border-radius:var(--r);background:#0d0320;overflow:hidden;min-width:0}
.code__head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:0 10px 0 16px;border-bottom:1px solid var(--line)}
.code__file{font-family:var(--mono);font-size:.75rem;color:var(--fg-3)}
.code__tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.code__tabs::-webkit-scrollbar{display:none}
.code__tab{flex:none;height:32px;padding:0 10px;border-radius:6px;font-family:var(--mono);font-size:.75rem;color:var(--fg-3)}
.code__tab:hover{color:#fff}
.code__tab[aria-selected="true"]{color:#fff;background:var(--s2)}
.copy{flex:none;height:30px;padding:0 10px;border:1px solid var(--line-2);border-radius:6px;font-family:var(--mono);font-size:.75rem;color:var(--fg-2)}
.copy:hover{color:#fff;border-color:rgba(255,255,255,.32)}
.copy.is-done{color:#c3ccff;border-color:var(--accent)}
pre.code{margin:0;padding:18px 18px 20px;overflow-x:auto;font-size:.8125rem;line-height:1.7;color:#e9e7f2;tab-size:2;-webkit-overflow-scrolling:touch}
pre.code code{font-family:var(--mono)}
.t-s{color:#a9b6ff}
.t-c{color:rgba(255,255,255,.4)}
.t-l{color:rgba(255,255,255,.5)}

/* ---------- hub hero ---------- */
.ih{padding-block:clamp(56px,7vw,112px) clamp(64px,8vw,120px)}
.ih .display{max-width:12ch}
.ih__grid{display:grid;gap:44px;margin-top:clamp(36px,4.5vw,64px)}
@media (min-width:1040px){.ih__grid{grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:64px;align-items:start}}
.ih__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.ih__facts{margin-top:40px;border-top:1px solid var(--line)}
.ih__facts li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:.9375rem;color:var(--fg-2)}
.ih__facts b{color:#fff;font-weight:600;font-variant-numeric:tabular-nums;font-size:1.0625rem}

/* ---------- switchboard ---------- */
.sb__tabs{display:flex;gap:2px;padding:8px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.sb__tabs::-webkit-scrollbar{display:none}
.sb__tab{flex:none;height:36px;padding:0 13px;border-radius:var(--r-sm);font-size:.875rem;font-weight:600;letter-spacing:-.01em;color:var(--fg-3);transition:color .15s var(--ease),background-color .15s var(--ease)}
.sb__tab:hover{color:#fff}
.sb__tab[aria-selected="true"]{color:#fff;background:var(--s2)}
.sb__map{padding:20px 20px 4px}
.sb__map svg{width:100%;height:auto;overflow:visible}
.sb .in{fill:none;stroke:rgba(255,255,255,.26);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.sb .hub-node{fill:#fff}
.sb .out{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linecap:round}
.sb .route{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1.4;transition:stroke .25s var(--ease)}
.sb .route.is-on{stroke:var(--accent);stroke-width:2.2;stroke-dasharray:6 7;animation:sbflow .8s linear infinite}
@keyframes sbflow{to{stroke-dashoffset:-13}}
.sb .pnode{fill:rgba(255,255,255,.22);transition:fill .25s var(--ease)}
.sb .pnode.is-on{fill:var(--accent)}
.sb .plabel{font-family:var(--mono);font-size:13px;fill:rgba(255,255,255,.46);transition:fill .25s var(--ease)}
.sb .plabel.is-on{fill:#fff}
.sb .tail{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linecap:round}
.sb .dest rect{fill:rgba(79,107,255,.16);stroke:var(--accent);stroke-width:1.2}
.sb .dest text{font-family:var(--font);font-size:13.5px;font-weight:600;fill:#fff;letter-spacing:-.01em}
.sb .dest{transition:transform .35s var(--ease)}
.sb__code{border-top:1px solid var(--line)}
.sb pre.code{min-height:calc(9 * 1.7em + 38px)}
.sb pre .ln{display:block;min-height:1.7em;animation:lnin .32s var(--ease) both;animation-delay:calc(var(--i) * 45ms)}
@keyframes lnin{from{opacity:0;transform:translateX(-6px)}}
.sb__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 20px;padding:14px 18px;border-top:1px solid var(--line);font-size:.875rem;color:var(--fg-3)}
.sb__foot b{color:#fff;font-weight:600}
.sb__foot span+span{margin-left:18px}
@media (max-width:560px){.sb__map{display:none}.sb__foot span+span{margin-left:12px}}

/* ---------- directory ---------- */
.dir__bar{display:grid;gap:14px;padding-bottom:6px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{height:36px;padding:0 14px;border:1px solid var(--line-2);border-radius:999px;font-size:.875rem;font-weight:600;color:var(--fg-2);transition:background-color .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease)}
.chip:hover{color:#fff;border-color:rgba(255,255,255,.34)}
.chip[aria-pressed="true"]{background:#fff;color:#0b001f;border-color:#fff}
.chips--paths .chip{height:32px;padding:0 12px;font-family:var(--mono);font-size:.75rem;font-weight:500}
.chips--paths .chip[aria-pressed="true"]{background:var(--accent-fill);color:#fff;border-color:var(--accent-fill)}
.dir__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px}
.dir__label{font-family:var(--mono);font-size:.75rem;color:var(--fg-4);margin-right:4px}
.search{position:relative;flex:1 1 280px;max-width:420px}
.search input{width:100%;height:44px;padding:0 14px 0 40px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:rgba(255,255,255,.03);color:#fff;font:inherit;font-size:.9375rem}
.search input::placeholder{color:var(--fg-4)}
.search input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--fg-4)}
.dir__count{font-family:var(--mono);font-size:.75rem;color:var(--fg-3)}
.dir__empty{padding:40px 0;color:var(--fg-2)}
.dir__empty button{color:var(--accent);font-weight:600}
.grp{margin-top:56px}
.grp__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 24px;margin-bottom:18px}
.grp__head h3{font-size:1.5rem;font-weight:600;letter-spacing:-.025em}
.grp__head p{color:var(--fg-3);font-size:.9375rem}
.hub{display:grid;grid-template-columns:1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media (min-width:640px){.hub{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.hub{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1280px){.hub--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.hc{display:flex;flex-direction:column;gap:12px;min-width:0;padding:22px 22px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background-color .15s var(--ease)}
.hc:hover{background:rgba(255,255,255,.025)}
.hc__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.hc h4{font-size:1.1875rem;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.hc:hover h4{color:#c3ccff}
.hc p{color:var(--fg-2);font-size:.9375rem;line-height:1.5}
.hc__foot{margin-top:auto;padding-top:6px;font-family:var(--mono);font-size:.75rem;color:var(--fg-4)}

/* ---------- ways in ---------- */
.ways{border-top:1px solid var(--line)}
.way{display:grid;gap:16px 48px;padding:32px 0;border-bottom:1px solid var(--line)}
@media (min-width:980px){.way{grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,4fr)}}
.way h3{font-size:1.375rem;font-weight:600;letter-spacing:-.02em;margin-top:12px}
.way__what{color:var(--fg-2);max-width:54ch}
.way__uses{margin-top:14px;font-size:.875rem;color:var(--fg-3);line-height:1.6}
.way__uses a{color:var(--fg-2);text-decoration:underline;text-decoration-color:rgba(255,255,255,.25);text-underline-offset:3px}
.way__uses a:hover{color:#fff}
.way dl{display:grid;gap:12px;margin:0}
.way dt{font-family:var(--mono);font-size:.75rem;color:var(--fg-4)}
.way dd{margin:3px 0 0;font-size:.9375rem;color:#fff}
.way .tlink{font-size:.9375rem}

/* ---------- stacks ---------- */
.stacks{display:grid;gap:14px}
@media (min-width:900px){.stacks{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stack{display:grid;gap:12px;align-content:start;padding:30px;border:1px solid var(--line-2);border-radius:var(--r);background:#0d0320}
.stack h3{font-size:1.375rem;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.stack p{color:var(--fg-2)}
.chain{display:flex;flex-wrap:wrap;align-items:center;row-gap:10px;margin-top:10px}
.chain li{display:flex;align-items:center}
.chain li+li::before{content:"";width:20px;height:1.5px;background:var(--accent);margin:0 6px}
.chain a,.chain span{display:inline-flex;align-items:center;height:32px;padding:0 11px;border:1px solid var(--line-2);border-radius:6px;font-family:var(--mono);font-size:.75rem;color:#fff;white-space:nowrap}
.chain a{border-color:rgba(79,107,255,.5)}
.chain a:hover{background:rgba(79,107,255,.14)}

/* ---------- managed (paper) ---------- */
.section--paper .h2{color:#000}
.section--paper .lead{color:var(--ink-2)}
.section--paper .lead b{color:#000}
.dests{display:grid;margin-top:8px;border-top:1px solid var(--ink-line)}
@media (min-width:700px){.dests{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px}}
.dests>*{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:22px 0;border-bottom:1px solid var(--ink-line);font-size:clamp(1.35rem,2.3vw,1.95rem);font-weight:600;letter-spacing:-.03em;line-height:1.1;color:#000}
.dests a:hover{color:var(--accent-fill)}
.dests small{font-family:var(--mono);font-size:.6875rem;font-weight:400;letter-spacing:0;color:var(--ink-3);white-space:nowrap}
.mfacts{display:grid;gap:28px;margin-top:56px}
@media (min-width:900px){.mfacts{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}}
.mfacts h3{font-size:1.0625rem;font-weight:650;letter-spacing:-.01em;color:#000}
.mfacts p{margin-top:6px;color:var(--ink-2);font-size:.9375rem}

/* ---------- detail ---------- */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px;font-size:.875rem;color:var(--fg-3)}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--fg-4)}
.crumbs a:hover{color:#fff}
.dh{padding-block:clamp(44px,5.5vw,88px) clamp(64px,8vw,120px)}
.dh__grid{display:grid;gap:44px}
@media (min-width:1080px){.dh__grid{grid-template-columns:minmax(0,10fr) minmax(0,11fr);gap:60px;align-items:start}}
.dh__id{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.dh__id .lg{width:46px;height:46px;font-size:.875rem;border-radius:10px}
.dh h1{font-weight:600;letter-spacing:-.042em;line-height:.98;font-size:clamp(2.5rem,5.2vw,4.6rem);text-wrap:balance}
.dh .lead{margin-top:24px}
.meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:34px 0 0;border-top:1px solid var(--line)}
.meta>div{padding:14px 16px 14px 0;border-bottom:1px solid var(--line);min-width:0}
.meta dt{font-family:var(--mono);font-size:.75rem;color:var(--fg-4)}
.meta dd{margin:5px 0 0;font-size:.9375rem;color:#fff}
.dh__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
@media (min-width:1080px){.dh .panel{position:sticky;top:102px}}
.route{display:grid;margin-top:4px}
@media (min-width:900px){.route{grid-template-columns:repeat(4,minmax(0,1fr))}}
.rt{position:relative;padding:24px 24px 26px 0;border-top:1.5px solid var(--line-2)}
.rt::before{content:"";position:absolute;top:-5.5px;left:0;width:9px;height:9px;background:rgba(255,255,255,.4);transform:rotate(45deg)}
.rt--io::before,.rt--path::before,.rt--tool::before{background:var(--accent)}
.rt--io,.rt--path{border-top-color:var(--accent)}
.rt .k{display:block}
.rt h3{margin-top:10px;font-size:1.1875rem;font-weight:600;letter-spacing:-.02em}
.rt p{margin-top:6px;font-family:var(--mono);font-size:.8125rem;color:var(--fg-3);overflow-wrap:anywhere}
.route__alt{margin-top:22px;color:var(--fg-3);font-size:.9375rem}
.route__alt a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);text-underline-offset:3px}
.uses{display:grid;border-top:1px solid var(--line)}
@media (min-width:920px){.uses{grid-template-columns:repeat(3,minmax(0,1fr))}}
.use{padding:28px 0 32px;border-bottom:1px solid var(--line)}
@media (min-width:920px){.use{padding-right:28px}.use+.use{padding-left:28px;border-left:1px solid var(--line)}}
.use h3{font-size:1.25rem;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.use p{margin-top:10px;color:var(--fg-2)}
.ex{margin-top:18px;padding:12px 14px;border-left:2px solid var(--accent);background:var(--s1);font-family:var(--mono);font-size:.8125rem;line-height:1.6;color:#e9e7f2}
.setup{display:grid;gap:48px}
@media (min-width:980px){.setup{grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:80px}}
.steps{border-top:1px solid var(--line);counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;padding:20px 0;border-bottom:1px solid var(--line);font-size:1.0625rem;line-height:1.55}
.steps li::before{content:counter(s);font-family:var(--mono);font-size:.8125rem;color:var(--accent);padding-top:4px}
.steps code,.facts code{font-size:.84em;padding:2px 6px;border-radius:4px;background:var(--s2);color:#fff;overflow-wrap:anywhere}
.docs h3{font-size:1rem;font-weight:600;margin-bottom:10px}
.docs ul{border-top:1px solid var(--line)}
.docs a{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);font-weight:600;font-size:.9375rem}
.docs a::after{content:"↗";color:var(--accent);font-weight:400}
.docs a:hover{color:#c3ccff}
.facts{margin-top:40px}
.facts h3{font-size:1rem;font-weight:600;margin-bottom:10px}
.facts li{display:grid;gap:4px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.9375rem;color:var(--fg-2)}
.facts li span:first-child{font-family:var(--mono);font-size:.75rem;color:var(--fg-4)}
.facts ul{border-top:1px solid var(--line)}
.faq-wrap{max-width:920px}

.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.meta dd .al,.facts li span.pl{display:block}
.meta dd .al+.al{margin-top:3px}
.meta dd b,.facts b{font-weight:500;color:var(--fg-3);font-family:var(--mono);font-size:.75rem;margin-right:6px}
.sb__foot span{white-space:nowrap}
@media (max-width:640px){.dir__bar .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}.dir__bar .chips::-webkit-scrollbar{display:none}.dir__label{flex:none;align-self:center}.chip{flex:none}}