/* Sphoton docs — /docs */
:root{
--navy:#0A1628;--navy-deep:#06101E;--panel:#10233D;
--purple:#5B4FCF;--purple-lt:#7F77DD;
--teal:#0D9E72;--teal-br:#16C990;
--ink:#FAFAF9;--grey:#9FB0C4;--grey-dim:#63768c;
--cert:#0D9E72;--stale:#FFB300;--draft:#9B89E8;--conflict:#EF5350;
--line:rgba(159,176,196,.13);--line-str:rgba(159,176,196,.24);
--disp:"Bricolage Grotesque",sans-serif;--body:"Montserrat",sans-serif;--mono:"JetBrains Mono",monospace;--brand:"Michroma",sans-serif;
--bar:56px;--side:274px;--toc:214px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--ink);font-family:var(--body);font-size:15.5px;line-height:1.72;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;letter-spacing:-.03em;line-height:1.12;margin:0}
p{margin:0}
a{color:var(--purple-lt);text-decoration:none;transition:color .2s}
a:hover{color:var(--ink)}
img{max-width:100%;display:block}
svg{display:block}
code,kbd{font-family:var(--mono)}
::selection{background:rgba(91,79,207,.4)}
:focus-visible{outline:2px solid var(--purple-lt);outline-offset:3px;border-radius:5px}
.bgwash{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(90% 50% at 82% -10%,rgba(91,79,207,.15),transparent 60%),radial-gradient(60% 40% at 0% 100%,rgba(13,158,114,.07),transparent 60%)}

/* ---------- top bar ---------- */
.topbar{position:fixed;top:0;left:0;right:0;height:var(--bar);z-index:40;display:flex;align-items:center;gap:16px;padding:0 22px;background:rgba(6,16,30,.82);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:9px;flex:none}
.logo .atom{width:24px;height:24px;flex:none}
.logo .word{font-family:var(--brand);font-size:14px;letter-spacing:-1px;color:var(--ink)}
.logo .docs{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--grey-dim);border-left:1px solid var(--line-str);padding-left:9px;margin-left:3px}
.tb-sp{flex:1}
.search{position:relative;width:min(320px,38vw)}
.search input{width:100%;background:rgba(19,42,73,.55);border:1px solid var(--line-str);border-radius:9px;padding:9px 12px 9px 34px;color:var(--ink);font-family:var(--body);font-size:13.5px}
.search input::placeholder{color:var(--grey-dim)}
.search input:focus{outline:none;border-color:var(--purple-lt);background:rgba(19,42,73,.8)}
.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--grey-dim)}
.search kbd{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--grey-dim);border:1px solid var(--line);border-radius:4px;padding:2px 5px}
.tb-links{display:flex;align-items:center;gap:6px;flex:none}
.tb-links a{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--grey);padding:8px 11px;border-radius:8px;white-space:nowrap}
.tb-links a:hover{color:var(--ink);background:rgba(159,176,196,.07)}
.tb-links a.cta{color:#fff;background:var(--purple);font-family:var(--body);font-weight:600;font-size:13px;letter-spacing:0;padding:9px 15px;box-shadow:0 0 0 1px rgba(127,119,221,.5),0 10px 24px -14px rgba(91,79,207,.9)}
.tb-links a.cta:hover{background:#675bdd}
.burger{display:none;width:34px;height:34px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--grey);place-items:center}

/* ---------- shell ---------- */
.shell{position:relative;z-index:1;display:grid;grid-template-columns:var(--side) minmax(0,1fr) var(--toc);gap:0;max-width:1560px;margin:0 auto;padding-top:var(--bar)}
.side{position:sticky;top:var(--bar);align-self:start;height:calc(100vh - var(--bar));overflow-y:auto;padding:26px 18px 60px 22px;border-right:1px solid var(--line);scrollbar-width:thin}
.side::-webkit-scrollbar{width:6px}
.side::-webkit-scrollbar-thumb{background:rgba(159,176,196,.18);border-radius:3px}
.sgroup+.sgroup{margin-top:22px}
.sgroup>h4{font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--grey-dim);margin-bottom:9px;padding-left:11px}
.side a{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--grey);padding:6px 11px;border-radius:7px;line-height:1.4}
.side a:hover{color:var(--ink);background:rgba(159,176,196,.06)}
.side a.on{color:var(--ink);background:rgba(91,79,207,.16);box-shadow:inset 0 0 0 1px rgba(127,119,221,.34)}
.side a .dot{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.35;flex:none}
.side a.on .dot{background:var(--purple-lt);opacity:1;box-shadow:0 0 8px var(--purple-lt)}
.side a.hide{display:none}
.side .nores{font-family:var(--mono);font-size:11.5px;color:var(--grey-dim);padding:8px 11px;display:none}
.side.empty .nores{display:block}

.main{min-width:0;padding:38px clamp(24px,3.4vw,52px) 120px}
.toc{position:sticky;top:var(--bar);align-self:start;height:calc(100vh - var(--bar));overflow-y:auto;padding:34px 22px 60px 8px;scrollbar-width:none}
.toc::-webkit-scrollbar{display:none}
.toc h4{font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--grey-dim);margin-bottom:10px}
.toc a{display:block;font-size:12.5px;color:var(--grey-dim);padding:4px 0 4px 11px;border-left:1px solid var(--line);line-height:1.45}
.toc a:hover{color:var(--grey)}
.toc a.on{color:var(--ink);border-color:var(--purple-lt)}

/* ---------- content ---------- */
.hero{max-width:780px;margin-bottom:44px}
.kick{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--purple-lt);display:block;line-height:1.7}
.kick::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--purple-lt);box-shadow:0 0 10px 2px var(--purple-lt);margin-right:9px;vertical-align:2px}
.hero h1{font-size:clamp(32px,3.8vw,50px);font-weight:800;letter-spacing:-.04em;margin-top:14px;text-wrap:balance}
.hero p{color:var(--grey);font-size:17.5px;margin-top:16px;text-wrap:pretty}
.hero p b{color:var(--ink);font-weight:500}
sec,section{display:block}
.sec{max-width:820px;padding-top:26px;margin-bottom:52px;scroll-margin-top:calc(var(--bar) + 22px)}
.sec>h2{font-size:clamp(25px,2.5vw,33px);font-weight:800;letter-spacing:-.035em;display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.sec>h2 .anchor{font-family:var(--mono);font-size:13px;color:var(--grey-dim);opacity:0;transition:opacity .2s;letter-spacing:0}
.sec>h2:hover .anchor{opacity:1}
.sec>p{color:var(--grey);margin-top:14px;text-wrap:pretty}
.sec>p b,li b{color:var(--ink);font-weight:500}
.sub{margin-top:34px;scroll-margin-top:calc(var(--bar) + 22px)}
.sub>h3{font-size:19.5px;font-weight:600;letter-spacing:-.025em;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sub>p{color:var(--grey);margin-top:11px;text-wrap:pretty}
.lead{font-size:16.5px}
ul.list,ol.list{color:var(--grey);margin:14px 0 0;padding:0 0 0 2px;list-style:none;display:flex;flex-direction:column;gap:10px}
ul.list li{padding-left:20px;position:relative;text-wrap:pretty}
ul.list li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;border-radius:50%;background:var(--purple-lt);opacity:.6}
ol.list{counter-reset:s}
ol.list li{counter-increment:s;padding-left:32px;position:relative;text-wrap:pretty}
ol.list li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:1px;font-family:var(--mono);font-size:11px;color:var(--purple-lt);letter-spacing:.06em}
.stamp{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;padding:3px 7px;border-radius:5px;white-space:nowrap}
.stamp.ok{color:var(--cert);background:rgba(13,158,114,.14);box-shadow:inset 0 0 0 1px rgba(13,158,114,.35)}
.stamp.beta{color:var(--stale);background:rgba(255,179,0,.12);box-shadow:inset 0 0 0 1px rgba(255,179,0,.32)}
.stamp.later{color:var(--grey-dim);background:rgba(159,176,196,.08);box-shadow:inset 0 0 0 1px var(--line)}
.stamp.draft{color:var(--draft);background:rgba(155,137,232,.13);box-shadow:inset 0 0 0 1px rgba(155,137,232,.34)}
.stamp.conf{color:var(--conflict);background:rgba(239,83,80,.12);box-shadow:inset 0 0 0 1px rgba(239,83,80,.34)}
code.c{font-size:13px;color:var(--ink);background:rgba(91,79,207,.14);border:1px solid rgba(127,119,221,.26);border-radius:5px;padding:1.5px 5px}
pre{font-family:var(--mono);font-size:12.5px;line-height:1.75;color:var(--grey);background:rgba(6,16,30,.72);border:1px solid var(--line);border-left:2px solid var(--purple-lt);border-radius:0 10px 10px 0;padding:14px 16px;margin:16px 0 0;overflow-x:auto}
pre .c{color:var(--grey-dim)}
pre .k{color:var(--purple-lt)}
pre .g{color:var(--teal-br)}
pre .s{color:var(--stale)}
.card{border:1px solid var(--line);border-radius:13px;background:rgba(16,35,61,.45);padding:19px 21px;margin-top:16px}
.card>h4{font-size:16.5px;font-weight:600;letter-spacing:-.02em;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.card>p{color:var(--grey);font-size:14.5px;margin-top:9px;text-wrap:pretty}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.grid2 .card{margin-top:0}
.note{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;border:1px solid rgba(127,119,221,.3);border-radius:12px;background:rgba(91,79,207,.08);padding:15px 17px;margin-top:18px}
.note.warn{border-color:rgba(255,179,0,.32);background:rgba(255,179,0,.06)}
.note.good{border-color:rgba(13,158,114,.34);background:rgba(13,158,114,.06)}
.note .ic{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--purple-lt);padding-top:3px}
.note.warn .ic{color:var(--stale)}
.note.good .ic{color:var(--teal-br)}
.note p{color:var(--grey);font-size:14.5px;text-wrap:pretty}
.tbl{width:100%;border-collapse:collapse;margin-top:18px;font-size:14px}
.tbl th{text-align:left;font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--grey-dim);padding:0 12px 9px 0;border-bottom:1px solid var(--line-str)}
.tbl td{padding:11px 12px 11px 0;border-bottom:1px solid var(--line);color:var(--grey);vertical-align:top}
.tbl td b{color:var(--ink);font-weight:500}
.tbl td:first-child{white-space:nowrap}
.kv{display:grid;grid-template-columns:170px 1fr;gap:10px 18px;margin-top:16px;font-size:14.5px}
.kv dt{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--purple-lt);padding-top:3px}
.kv dd{margin:0;color:var(--grey);text-wrap:pretty}
details{border:1px solid var(--line);border-radius:11px;background:rgba(16,35,61,.4);margin-top:10px;overflow:hidden}
details[open]{border-color:rgba(127,119,221,.34);background:rgba(20,40,70,.55)}
summary{cursor:pointer;list-style:none;padding:13px 16px;font-family:var(--disp);font-size:15.5px;font-weight:600;letter-spacing:-.02em;display:flex;align-items:center;gap:10px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";margin-left:auto;font-family:var(--mono);color:var(--purple-lt);font-size:15px}
details[open] summary::after{content:"–"}
details .db{padding:0 16px 15px;color:var(--grey);font-size:14.5px;line-height:1.65;text-wrap:pretty}
.status-legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.shot{border-radius:13px;border:1px solid var(--line-str);background:linear-gradient(180deg,#0e2039,#0a1628);overflow:hidden;margin-top:18px;box-shadow:0 36px 70px -46px rgba(0,0,0,.9),0 0 70px -46px rgba(91,79,207,.5)}
.cap{font-family:var(--mono);font-size:11.5px;color:var(--grey);margin-top:10px;line-height:1.55}
.next{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:34px}
.next a{border:1px solid var(--line);border-radius:12px;padding:15px 17px;color:var(--grey);transition:.2s}
.next a:hover{border-color:rgba(127,119,221,.5);background:rgba(20,40,70,.5);transform:translateY(-2px)}
.next .l{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey-dim);display:block}
.next .t{font-family:var(--disp);font-size:16.5px;font-weight:600;letter-spacing:-.02em;color:var(--ink);display:block;margin-top:6px}
.foot{max-width:820px;margin-top:56px;padding-top:22px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--grey-dim);line-height:1.7;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}

@media(max-width:1240px){:root{--toc:0px}.toc{display:none}.shell{grid-template-columns:var(--side) minmax(0,1fr)}}
@media(max-width:900px){
:root{--side:0px}
.burger{display:grid}
.shell{grid-template-columns:minmax(0,1fr)}
.side{position:fixed;left:0;top:var(--bar);bottom:0;width:290px;z-index:38;background:rgba(6,16,30,.97);backdrop-filter:blur(16px);transform:translateX(-100%);transition:transform .3s cubic-bezier(.2,.8,.2,1);height:auto}
body.nav-open .side{transform:none}
.main{padding:28px 20px 90px}
.search{width:auto;flex:1}
.search kbd,.tb-links a:not(.cta){display:none}
.grid2,.next{grid-template-columns:1fr}
.kv{grid-template-columns:1fr;gap:4px 0}
.kv dd{margin-bottom:10px}
}