/* elevenlabs.providers.sgit.ai — one stylesheet, self-hosted, no imports.
   Tokens, type and component idioms are taken from the sgit.ai house stylesheet
   so this subdomain reads as part of the estate. Nothing here is borrowed from
   the vendor: no ElevenLabs logo, wordmark or brand colour appears on this site. */

:root{
  --bg:#faf9f5; --panel:#ffffff; --panel2:#f2f0e9; --line:#e5e1d5; --line2:#d5d0c2;
  --fg:#1c1d21; --dim:#5c5f66; --dim2:#8a8d94; --ink:#34363c;
  --accent:#0f766e; --accent-dk:#115e59; --yellow:#a16207; --warm:#b45309;
  --green:#15803d; --blue:#0369a1; --red:#b91c1c;
  --term-bg:#0d1117; --term-green:#3fb950; --term-red:#f85149; --term-cyan:#58a6ff;
  --term-yellow:#d29922; --term-dim:#8b949e;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --serif:ui-serif,Georgia,"Times New Roman",serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --measure:960px; --wide:1360px;
  --shadow:0 1px 2px rgba(28,29,33,.05),0 4px 14px rgba(28,29,33,.04);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:16px;line-height:1.65}
a{color:var(--accent-dk);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{line-height:1.2;letter-spacing:-.015em}
code,pre,kbd{font-family:var(--mono)}
p code,li code,td code,.note code,.doc code{overflow-wrap:anywhere;background:var(--panel2);border:1px solid var(--line);
  border-radius:4px;padding:.08em .35em;font-size:.84em;color:#24343f}
pre code{background:none;border:0;border-radius:0;padding:0;font-size:inherit;color:inherit}
pre{background:var(--term-bg);color:#c9d1d9;border-radius:10px;padding:.9rem 1.1rem;overflow-x:auto;
  font-size:.8rem;line-height:1.6;box-shadow:var(--shadow)}
pre.shell{color:var(--term-green)}
.dim{color:var(--dim)} .small{font-size:.85rem} .nowrap{white-space:nowrap}

/* ---------- nav ---------- */
nav.site{position:sticky;top:0;z-index:50;background:rgba(250,249,245,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
nav.site .row{max-width:var(--wide);margin:0 auto;display:flex;align-items:center;gap:.7rem;padding:.7rem 1.1rem;flex-wrap:wrap}
nav.site .brand{font-weight:800;font-size:.95rem;color:var(--fg);letter-spacing:-.02em;white-space:nowrap}
nav.site .brand span{color:var(--accent);font-weight:600}
nav.site a.nl{color:var(--dim);font-size:.82rem;padding:0 .1rem}
nav.site a.nl.here{color:var(--fg);font-weight:600}
nav.site a.nl:hover{color:var(--fg);text-decoration:none}
/* Two-level nav: hover for a mouse, focus-within for a keyboard, a click toggle for
   touch. Every group label is a link to a real page, so the menu is a shortcut and
   never the only door. */
nav.site .ni{position:relative}
nav.site .ni-has > .nl{display:inline-flex;align-items:center;gap:.25rem}
nav.site .caret{font-size:.55em;opacity:.55;transition:transform .15s ease}
nav.site .sub{position:absolute;left:-.7rem;top:100%;min-width:12rem;z-index:60;background:var(--panel);
  border:1px solid var(--line);border-radius:10px;box-shadow:0 6px 24px rgba(28,29,33,.13);padding:.4rem;
  display:none;flex-direction:column;gap:.05rem}
nav.site .ni-has:hover > .sub,nav.site .ni-has:focus-within > .sub,nav.site .ni-has.open > .sub{display:flex}
nav.site .ni-has:hover .caret,nav.site .ni-has.open .caret{transform:rotate(180deg)}
nav.site .sub a.sl{display:block;padding:.36rem .6rem;border-radius:6px;font-size:.83rem;color:var(--dim);white-space:nowrap}
nav.site .sub a.sl:hover{background:var(--panel2);color:var(--fg);text-decoration:none}
nav.site .sub a.sl.here{color:var(--accent-dk);font-weight:600}
nav.site .gh{margin-left:auto;border:1px solid var(--line2);border-radius:6px;padding:.28rem .7rem;color:var(--fg);
  font-size:.78rem;white-space:nowrap;background:var(--panel)}
nav.site .gh:hover{border-color:var(--accent);text-decoration:none}
nav.site .parent{font-size:.72rem;color:var(--dim);border:1px solid var(--line);border-radius:99px;
  padding:.14rem .6rem;white-space:nowrap;background:var(--panel)}
nav.site .parent:hover{border-color:var(--accent);color:var(--fg);text-decoration:none}
nav.site .parent b{color:var(--accent-dk);font-weight:700}
a.ver{font-family:var(--mono);font-size:.68rem;color:var(--dim2);border:1px solid var(--line);border-radius:99px;
  padding:.14rem .55rem;white-space:nowrap}
a.ver:hover{color:var(--accent-dk);border-color:var(--accent);text-decoration:none}
table.vers td.vnum{font-family:var(--mono);font-weight:700;color:var(--accent-dk);white-space:nowrap}
table.vers td{font-size:.85rem}
.stage-pill{font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-dk);
  border:1px solid rgba(15,118,110,.35);background:rgba(15,118,110,.07);border-radius:99px;padding:.15rem .55rem}
.nav-items{display:contents}
.nav-toggle{display:none}
@media (max-width:900px){
  nav.site .row{position:relative;gap:.6rem}
  .nav-toggle{display:block;margin-left:auto;order:3;background:var(--panel);border:1px solid var(--line2);border-radius:6px;
    padding:.3rem .7rem;font:600 .78rem/1 var(--sans);color:var(--fg);cursor:pointer}
  nav.site .gh{order:4;margin-left:0}
  .nav-items{display:none;order:5;width:100%;flex-direction:column;gap:.1rem;padding:.5rem 0 .3rem;
    border-top:1px solid var(--line);margin-top:.4rem}
  nav.site.open .nav-items{display:flex}
  nav.site .ni > .nl{display:block;padding:.42rem .2rem;font-size:.95rem}
  nav.site .caret{display:none}
  nav.site .sub{position:static;display:flex;flex-direction:column;border:0;box-shadow:none;
    background:none;padding:0 0 .3rem .9rem;min-width:0;gap:0}
  nav.site .sub a.sl{padding:.3rem .2rem;font-size:.86rem}
}

.disclosure-strip{background:var(--panel2);border-bottom:1px solid var(--line);font-size:.76rem;color:var(--dim)}
.disclosure-strip .row{max-width:var(--wide);margin:0 auto;padding:.4rem 1.1rem}
.disclosure-strip b{color:var(--ink)}
.disclosure-strip a{color:var(--accent-dk)}
footer.site .licence{font-size:.72rem;color:var(--dim2);margin-top:.8rem}
.irrev{color:var(--red)}
table.grants h4,main.doc h4.grant-layer{margin:1.2rem 0 .3rem}

/* ---------- document ---------- */
main.doc{max-width:var(--measure);margin:0 auto;padding:2.2rem 1.4rem 3rem}
main.doc.doc-wide{max-width:1180px}
main.doc .crumb{font-size:.75rem;color:var(--dim2);margin-bottom:.8rem}
main.doc .crumb a{color:var(--dim)}
main.doc h1{font-family:var(--serif);font-size:clamp(1.9rem,4vw,2.5rem);color:#101114;margin:.2rem 0 .8rem}
main.doc h2{font-family:var(--serif);font-size:1.5rem;color:#101114;margin:2.4rem 0 .7rem;scroll-margin-top:76px;
  padding-top:.6rem;border-top:1px solid var(--line)}
main.doc h3{font-size:1.03rem;color:#101114;margin:1.7rem 0 .5rem;scroll-margin-top:76px}
main.doc h4{font-size:.92rem;color:#101114;margin:1.2rem 0 .4rem}
main.doc .lead{color:var(--ink);font-size:1.14rem;line-height:1.6}
main.doc p,main.doc li{color:var(--ink);font-size:.98rem}
main.doc ul,main.doc ol{padding-left:1.3rem}
main.doc li{margin:.3rem 0}
main.doc blockquote{margin:1.2rem 0;padding:.2rem 0 .2rem 1rem;border-left:3px solid var(--line2);color:var(--dim)}
main.doc hr{border:0;border-top:1px solid var(--line);margin:2rem 0}
table{width:100%;border-collapse:collapse;font-size:.88rem;margin:1.1rem 0;background:var(--panel);
  border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:var(--shadow)}
th{background:var(--panel2);text-align:left;padding:.55rem .8rem;font-size:.7rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--dim);font-weight:600}
td{padding:.55rem .8rem;border-top:1px solid var(--line);vertical-align:top;line-height:1.5;color:var(--ink)}
td b,th b{color:#101114}
.tablewrap{overflow-x:auto;margin:1.1rem 0}
.tablewrap table{margin:0}
.prov{font-size:.78rem;color:var(--dim);background:var(--panel2);border:1px solid var(--line);border-radius:8px;
  padding:.5rem .8rem;margin:0 0 1.2rem}
.note{border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--panel);border-radius:0 10px 10px 0;
  padding:.85rem 1.05rem;font-size:.9rem;color:var(--ink);margin:1.2rem 0;box-shadow:var(--shadow)}
.warnbox{border:1px solid var(--line);border-left:3px solid var(--warm);background:var(--panel);border-radius:0 10px 10px 0;
  padding:.85rem 1.05rem;font-size:.9rem;color:var(--ink);margin:1.2rem 0;box-shadow:var(--shadow)}
.note b,.warnbox b{color:#101114}
.note p:first-child,.warnbox p:first-child{margin-top:0}
.note p:last-child,.warnbox p:last-child{margin-bottom:0}
.pagenav{display:flex;justify-content:space-between;gap:1rem;margin-top:3rem;padding-top:1.1rem;
  border-top:1px solid var(--line);font-size:.85rem}
.toc{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:.8rem 1rem;margin:1.4rem 0 2rem;
  box-shadow:var(--shadow);font-size:.85rem}
.toc b{display:block;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);margin-bottom:.4rem}
.toc a{display:inline-block;margin:.12rem .8rem .12rem 0;color:var(--accent-dk)}

/* ---------- verification chips ---------- */
.chip{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.04em;border-radius:99px;
  padding:.1rem .5rem;border:1px solid;white-space:nowrap;vertical-align:.08em;text-transform:uppercase}
a.chip:hover{text-decoration:none;filter:brightness(.94)}
.st-v{color:#0b5e57;background:rgba(15,118,110,.10);border-color:rgba(15,118,110,.35)}
.st-m{color:#14622f;background:rgba(21,128,61,.10);border-color:rgba(21,128,61,.32)}
.st-d{color:#3f4854;background:rgba(71,85,105,.10);border-color:rgba(71,85,105,.3)}
.st-s{color:#8f4308;background:rgba(180,83,9,.10);border-color:rgba(180,83,9,.35)}
.st-u{color:#7d4c06;background:rgba(161,98,7,.12);border-color:rgba(161,98,7,.35)}
.st-p{color:#075985;background:rgba(3,105,161,.10);border-color:rgba(3,105,161,.3)}
.chips{display:flex;gap:.3rem;flex-wrap:wrap;margin:.4rem 0}

/* ---------- stat tiles (§8 gets the visual weight) ---------- */
.tiles{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin:1.3rem 0}
.tiles .tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1rem 1.1rem;box-shadow:var(--shadow)}
.tiles .tile b{display:block;font-family:var(--serif);font-size:2rem;color:#101114;line-height:1.1;letter-spacing:-.02em}
.tiles .tile span{display:block;font-size:.78rem;color:var(--dim);margin-top:.3rem;line-height:1.45}
.tiles .tile em{display:block;font-style:normal;font-size:.7rem;color:var(--dim2);margin-top:.35rem}
.tiles-sm .tile b{font-size:1.4rem}
.tiles-sm{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.tile.hot{border-left:4px solid var(--warm)}
.tile.cool{border-left:4px solid var(--accent)}

/* ---------- failure cards (§9) ---------- */
.fails{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin:1.3rem 0}
.fail{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--red);border-radius:10px;
  padding:1rem 1.1rem;box-shadow:var(--shadow)}
.fail.ok{border-left-color:var(--green)}
.fail.open{border-left-color:var(--yellow)}
.fail h3{margin:.1rem 0 .5rem;font-size:1rem;color:#101114}
.fail p{margin:.4rem 0;font-size:.88rem}
.fail p:last-child{margin-bottom:0}
.fail .who{font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim2)}

/* ---------- cards ---------- */
.cards{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:1.3rem 0}
.cards-tight{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1rem 1.1rem;display:block;
  color:var(--fg);box-shadow:var(--shadow)}
a.card:hover{border-color:var(--accent);text-decoration:none}
.card .tag{font-size:.62rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--warm)}
.card h3{margin:.25rem 0 .4rem;font-size:.98rem;color:#101114}
.card p{margin:0 0 .3rem;font-size:.83rem;color:var(--dim);line-height:1.5}
.card .go{display:inline-block;margin-top:.5rem;font-size:.76rem;color:var(--accent-dk);font-weight:600}

/* ---------- comparison / ledger tables ---------- */
table.cmp td,table.cmp th{text-align:center}
table.cmp th:first-child,table.cmp td:first-child,table.cmp th:nth-child(2),table.cmp td:nth-child(2),
table.cmp th:last-child,table.cmp td:last-child{text-align:left}
table.cmp td .vnote{display:block;font-size:.7rem;color:var(--dim);line-height:1.35;margin-top:.2rem}
.v{font-size:1.05rem;font-weight:700}
.v-yes{color:var(--green)} .v-no{color:var(--dim2)} .v-never{color:var(--red)} .v-spec{color:var(--warm)} .v-na{color:var(--dim2)}
.legend .v{font-size:.9rem}
table.ledger td:first-child{width:52%}
table.grants td{font-size:.85rem}
/* a capability tuple is three short tokens; breaking `endpoint` across two lines
   makes a table of them unreadable */
table.grants td code{overflow-wrap:normal;white-space:nowrap}
table.grants th:nth-child(-n+3),table.grants td:nth-child(-n+3){white-space:nowrap}

/* ---------- labs ---------- */
.lab{margin:1.6rem 0}
.lab section{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1rem 1.15rem;
  margin:.8rem 0;box-shadow:var(--shadow)}
.lab h2{font-family:var(--sans);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--accent-dk);
  margin:0 0 .7rem;border:0;padding:0}
.lab .grid2{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.lab .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
@media (max-width:760px){.lab .grid2,.lab .grid3{grid-template-columns:1fr}}
.lab label{display:block;font-size:.72rem;color:var(--dim);margin:.6rem 0 .2rem;font-weight:600;letter-spacing:.02em}
.lab label.inline{display:inline-flex;align-items:center;gap:.4rem;margin-right:1rem}
.lab input[type=text],.lab input[type=password],.lab input[type=number],.lab select,.lab textarea{
  width:100%;background:#fdfdfb;color:var(--fg);border:1px solid var(--line2);border-radius:6px;padding:.45rem .6rem;
  font:inherit;font-size:.9rem}
.lab textarea{min-height:110px;resize:vertical;line-height:1.5}
.lab textarea.mono,.lab input.mono{font-family:var(--mono);font-size:.78rem}
.lab input[type=range]{width:100%}
.lab .row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.lab .row.fill > *{flex:1}
button,.btn{background:var(--accent-dk);color:#fff;border:0;border-radius:6px;padding:.5rem .9rem;font:inherit;
  font-size:.85rem;font-weight:600;cursor:pointer}
button:hover{background:var(--accent)}
button.secondary{background:var(--panel2);color:var(--fg);border:1px solid var(--line2)}
button.secondary:hover{background:#e9e6dc}
button.danger{background:#fff;color:var(--red);border:1px solid rgba(185,28,28,.3)}
button:disabled{opacity:.45;cursor:default}
.lab .status{font-size:.82rem;color:var(--dim);margin-top:.6rem;min-height:1.3em}
.lab .status.ok{color:var(--green)} .lab .status.err{color:var(--red)} .lab .status.warn{color:var(--warm)}
.lab .log{font-family:var(--mono);font-size:.72rem;white-space:pre-wrap;color:var(--dim);background:var(--term-bg);
  border-radius:8px;padding:.7rem .85rem;max-height:220px;overflow:auto}
.lab .log{color:#a9b4c0}
.lab .kv{display:grid;grid-template-columns:auto 1fr;gap:.2rem .9rem;font-size:.83rem}
.lab .kv b{color:var(--dim);font-weight:500}
.lab .est{font-size:.82rem;color:var(--dim)} .lab .est b{color:var(--fg)}
.lab audio{width:100%;margin-top:.5rem}
.lab .samplechips{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.4rem}
.lab .samplechips span{font-size:.72rem;background:var(--panel2);border:1px solid var(--line);padding:.15rem .5rem;
  border-radius:99px;cursor:pointer}
.lab .samplechips span:hover{border-color:var(--accent)}
.words{line-height:2.1;font-size:1.02rem;padding:.4rem 0}
.words span{padding:.1rem .15rem;border-radius:4px;transition:background .08s}
.words span.on{background:var(--accent);color:#fff}
.words span.past{color:var(--dim2)}
.bar{position:relative;background:var(--panel2);border-radius:4px;height:.85rem;min-width:60px}
.bar i{position:absolute;left:0;top:0;bottom:0;background:var(--accent);border-radius:4px;opacity:.75}
.bar.bad i{background:var(--red)}
.bar.timeline{display:block;width:100%;height:.8rem}
.bar.timeline i{border-radius:3px}
.bar b{position:absolute;right:.3rem;top:-.05rem;font-size:.66rem;color:var(--fg);font-weight:600}
.keybar{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--yellow);border-radius:10px;
  padding:.85rem 1.05rem;box-shadow:var(--shadow);margin:1.2rem 0}
.keybar .ttl{font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:var(--yellow);font-weight:700}
.keybar .keys{display:flex;gap:.4rem;flex-wrap:wrap;margin:.5rem 0}
.keybar .keys .k{font-size:.75rem;border:1px solid var(--line2);background:var(--panel2);border-radius:99px;
  padding:.2rem .6rem;cursor:pointer;display:inline-flex;gap:.4rem;align-items:center}
.keybar .keys .k.active{border-color:var(--accent);background:rgba(15,118,110,.08);color:var(--accent-dk);font-weight:600}
.keybar .keys .k x{color:var(--dim2);font-style:normal;cursor:pointer}
.keybar .keys .k x:hover{color:var(--red)}
.keybar p{margin:.4rem 0 0;font-size:.8rem;color:var(--dim)}
.patternbox{border:1px solid var(--line);border-left:4px solid var(--warm);background:var(--panel);border-radius:0 10px 10px 0;
  padding:.9rem 1.1rem;box-shadow:var(--shadow);margin:1.2rem 0}
.patternbox .ttl{font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:var(--warm);font-weight:700}
.patternbox p{margin:.45rem 0 0;font-size:.87rem;color:var(--ink)}
.patternbox p:last-child{margin-bottom:0}
.beforeafter{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin:1.2rem 0}
@media (max-width:760px){.beforeafter{grid-template-columns:1fr}}
.beforeafter .ba{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1rem 1.1rem;box-shadow:var(--shadow)}
.beforeafter .ba.now{border-top:4px solid var(--warm)}
.beforeafter .ba.then{border-top:4px solid var(--accent)}
.beforeafter h4{margin:.1rem 0 .5rem;font-size:.95rem;color:#101114}
.beforeafter pre{font-size:.72rem;margin:.5rem 0 0}

/* ---------- the ask pane ----------
   The default tier is a local matcher, so this must look usable with no key at all.
   The key panel is deliberately plain: it is a trust decision, not a feature. */
.netchat{margin:1.6rem 0 2rem;border:1px solid var(--line);border-radius:12px;background:var(--panel);
  box-shadow:var(--shadow);overflow:hidden}
.nc-head{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;padding:.7rem .95rem;
  border-bottom:1px solid var(--line);background:var(--panel2)}
.nc-head b{font-size:.95rem;color:var(--fg)}
.nc-mode{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);
  border:1px solid var(--line);border-radius:999px;padding:.1rem .5rem}
.nc-mode.on{color:var(--accent-dk);border-color:var(--accent)}
.nc-log{max-height:420px;overflow-y:auto;padding:.9rem .95rem;display:grid;gap:.75rem}
.nc-msg p{margin:0 0 .4rem;font-size:.88rem;line-height:1.6}
.nc-msg p:last-child{margin-bottom:0}
.nc-you{justify-self:end;max-width:85%;background:var(--panel2);border:1px solid var(--line);
  border-radius:10px 10px 2px 10px;padding:.45rem .7rem}
.nc-you p{font-weight:600}
.nc-bot{max-width:95%}
.nc-egs{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.55rem}
.nc-eg{font:inherit;font-size:.78rem;color:var(--accent-dk);background:transparent;cursor:pointer;
  border:1px solid var(--line);border-radius:999px;padding:.22rem .6rem}
.nc-eg:hover{border-color:var(--accent)}
.nc-hits{display:grid;gap:.4rem;margin-top:.5rem}
.nc-hit{display:grid;gap:.12rem;padding:.5rem .7rem;border:1px solid var(--line);border-radius:8px;
  text-decoration:none;background:var(--panel2)}
a.nc-hit:hover{border-color:var(--accent);text-decoration:none}
.nc-hit b{font-family:var(--mono);font-size:.76rem;color:var(--accent-dk)}
.nc-hit-thesis{font-size:.84rem;color:var(--fg);line-height:1.5}
.nc-hit-why{font-size:.72rem;color:var(--dim)}
.nc-err{color:var(--warm)}
.nc-form{display:flex;gap:.5rem;padding:.7rem .95rem;border-top:1px solid var(--line)}
.nc-input{flex:1;font:inherit;font-size:.88rem;padding:.45rem .65rem;border:1px solid var(--line2);
  border-radius:8px;background:var(--bg);color:var(--fg)}
.nc-input:focus{outline:none;border-color:var(--accent)}
.nc-send{font:inherit;font-size:.85rem;font-weight:600;padding:.45rem 1rem;border-radius:8px;
  border:1px solid var(--accent);background:var(--accent-dk);color:#fff;cursor:pointer}
.nc-foot{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.15rem .95rem .8rem}
.nc-keytoggle{font:inherit;font-size:.78rem;color:var(--accent-dk);background:transparent;border:0;
  padding:0;cursor:pointer;text-decoration:underline}
.nc-keypanel{padding:.2rem .95rem .95rem;border-top:1px dashed var(--line)}
.nc-keypanel p{font-size:.82rem;color:var(--ink)}

/* ---------- footer ---------- */
footer.site{border-top:1px solid var(--line);margin-top:3rem;padding:2.2rem 0 1rem;background:var(--panel2)}
footer.site .cols{max-width:var(--wide);margin:0 auto;padding:0 1.1rem;display:grid;gap:1.6rem;grid-template-columns:2fr 1fr 1fr 1fr}
@media (max-width:940px){footer.site .cols{grid-template-columns:1fr 1fr}}
@media (max-width:640px){footer.site .cols{grid-template-columns:1fr}}
footer.site h4{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);margin:0 0 .6rem}
footer.site a{display:block;color:var(--dim);font-size:.82rem;padding:.15rem 0}
footer.site .brandline{font-weight:800;color:var(--fg)}
footer.site .brandline span{color:var(--accent);font-weight:600}
footer.site p{color:var(--dim);font-size:.78rem;line-height:1.6;max-width:460px}
footer.site .nonaff{color:var(--ink)}
footer.site .verline{font-family:var(--mono);font-size:.72rem;color:var(--dim2);margin-top:.6rem}
footer.site .verline a{display:inline;color:var(--accent-dk);padding:0}
footer.site .footnote{max-width:var(--wide);margin:1.4rem auto 0;padding:1rem 1.1rem 0;border-top:1px solid var(--line)}
footer.site .footnote p{max-width:none;font-size:.76rem}

/* ================================================================= *
 *  ungovr.providers.sgit.ai — additions to the house stylesheet
 *
 *  THE LOAD-BEARING RULE IS IN THE JOIN GRAPH BELOW, and it is the
 *  vault's acceptance test 5: a node says two different things about
 *  itself and they must not share a visual channel.
 *
 *    ORIGIN           (ung: / akn: / sg:)  -> BORDER STYLE and SHAPE
 *    ASSERTION CLASS  (asserted/inferred)  -> COLOUR
 *
 *  Hue is already spent on assertion class, so origin cannot also use
 *  it. Somebody checking this work checks that separation first, which
 *  is why it is stated here rather than only in the markup.
 * ================================================================= */

/* ---------- a headline tile ---------- */
.tiles .tile.tile-big{border-left:4px solid var(--warm)}
.tiles .tile.tile-big b{font-size:2.9rem}
@media (max-width:640px){.tiles .tile.tile-big{grid-column:span 1}}

/* ---------- numeric and monospace table cells ---------- */
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--mono);font-size:.82rem;white-space:nowrap}
td.num.warn{color:var(--warm);font-weight:700}
.mono{font-family:var(--mono)}
.breakall{word-break:break-all}
.trunc{color:var(--dim)}
.retr td{vertical-align:top;padding-top:.4rem;padding-bottom:.4rem}
.retr .st-ok{color:var(--green);font-weight:700}
.retr .st-warn{color:var(--warm);font-weight:700}
.retr .st-bad{color:var(--red);font-weight:700}

/* ---------- the query shown beside its result ---------- */
pre.q{background:var(--term-bg);color:var(--term-cyan);border-radius:10px;padding:1rem 1.1rem;
  font-family:var(--mono);font-size:.78rem;line-height:1.65;overflow-x:auto;white-space:pre-wrap}

/* ---------- the release history table ---------- */
.releases td.vnum{font-family:var(--mono);font-weight:700;color:var(--accent-dk);white-space:nowrap}

/* ---------- open-the-vault card ---------- */
.card-open{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--accent);
  border-radius:0 12px 12px 0;padding:1.15rem 1.3rem;margin:1.4rem 0;box-shadow:var(--shadow)}
.card-open h3{margin:.2rem 0 .5rem;font-size:1.15rem}
.card-open p{margin:.4rem 0}
.card-open .mono a{font-family:var(--mono);font-size:.78rem;color:var(--accent-dk)}

/* ---------- the seven-step join ---------- */
.legend-box{background:var(--panel2);border:1px solid var(--line);border-radius:10px;
  padding:.85rem 1.05rem;font-size:.82rem;color:var(--ink);margin:1.3rem 0;line-height:1.7}
.legend-box .key{display:inline-block;width:1.5rem;height:1.05rem;vertical-align:-.18em;margin-right:.25rem;
  background:var(--panel);border:1px solid var(--line2)}
/* the legend swatches carry ORIGIN only, so they differ by border style */
.legend-box .key.o-ung{border-left:5px solid var(--ink);border-radius:0}
.legend-box .key.o-akn{border-left:5px double var(--ink);border-radius:0 4px 4px 0}
.legend-box .key.o-sg{border-left:5px dashed var(--ink);border-radius:0 10px 10px 0}

ol.steps{list-style:none;margin:1.5rem 0;padding:0;display:grid;gap:.75rem}
.step{display:flex;gap:.95rem;background:var(--panel);border:1px solid var(--line);
  padding:1rem 1.15rem;box-shadow:var(--shadow)}

/*  ORIGIN -> border style + corner shape. No colour in these three rules.  */
.step.o-ung{border-left-width:5px;border-left-style:solid;border-radius:0}
.step.o-akn{border-left-width:5px;border-left-style:double;border-radius:0 8px 8px 0}
.step.o-sg {border-left-width:5px;border-left-style:dashed;border-radius:0 14px 14px 0}

/*  ASSERTION CLASS -> colour. No border style or radius in these two rules.  */
.step.a-asserted{border-left-color:var(--accent)}
.step.a-inferred{border-left-color:var(--warm);background:linear-gradient(90deg,rgba(180,83,9,.045),var(--panel) 42%)}

.step .stepno{flex:0 0 1.9rem;height:1.9rem;display:grid;place-items:center;font-family:var(--mono);
  font-size:.82rem;font-weight:700;color:var(--dim);background:var(--panel2);border:1px solid var(--line2)}
/* the step number repeats the origin shape, so the channel survives a greyscale print */
.step.o-ung .stepno{border-radius:0}
.step.o-akn .stepno{border-radius:4px}
.step.o-sg  .stepno{border-radius:99px}
.step .stepbody{min-width:0}
.step h4{margin:.15rem 0 .35rem;font-size:1.02rem}
.step p{margin:.3rem 0;font-size:.88rem;color:var(--ink);line-height:1.6}
.step .steptype{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;font-size:.72rem}
.step .steptype code{font-size:.72rem;color:var(--dim);word-break:break-all}
.step .oc,.step .ac{display:inline-block;font-size:.62rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;border-radius:99px;padding:.06rem .45rem;border:1px solid}
/* the origin chip is neutral by design — colour here would duplicate the other channel */
.step .oc{color:var(--dim);background:var(--panel2);border-color:var(--line2)}
.step.a-asserted .ac{color:#0b5e57;background:rgba(15,118,110,.10);border-color:rgba(15,118,110,.35)}
.step.a-inferred .ac{color:#8f4308;background:rgba(180,83,9,.12);border-color:rgba(180,83,9,.40)}
.step .prov{margin-top:.55rem;padding-top:.5rem;border-top:1px dashed var(--line2);
  font-family:var(--mono);font-size:.71rem;color:var(--dim);line-height:1.75;word-break:break-word}
.step .prov span{display:inline-block;min-width:5.2rem;color:var(--dim2)}
.step .prov a{color:var(--accent-dk)}

td.edge{font-size:.78rem;font-weight:700}
td.edge.a-asserted{color:var(--accent-dk)}
td.edge.a-inferred{color:var(--warm)}

@media (max-width:560px){
  .step{flex-direction:column;gap:.5rem}
  .step .stepno{flex:0 0 auto;width:1.9rem}
}

/* ---------- the live vault embed ---------- */
/* The estate's component builds its own frames; these rules only give them room.
   The area is deliberately wider than the text column, because the vault browser
   is a full working surface rather than a figure. */
.sgv-uiembed{margin:1.4rem 0;display:grid;gap:1rem}
.sgv-uiembed iframe{width:100%;min-height:560px;border:1px solid var(--line2);
  border-radius:10px;background:var(--panel);box-shadow:var(--shadow)}
.sgv-uiembed > div{min-width:0}

/* ---------- the deck viewer: real 16:9 slides ---------- */
/* One slide is 1200x675 — the estate's deck shape, the same geometry the PDFs are
   printed at, so the page and the PDF cannot drift. The page adds chrome around
   them; slides.html is the same markup with the chrome removed. */
.dsub{color:var(--dim);font-size:.92rem;margin:.1rem 0 1rem}
.dbar{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin:0 0 1.4rem;
  background:var(--panel2);border:1px solid var(--line);border-radius:11px;padding:.7rem .9rem}
.dbar button,.dbar a.btn-raw,.dbar a.btn-pdf{font-family:inherit;font-size:.82rem;font-weight:650;
  border-radius:7px;padding:.4rem .8rem;cursor:pointer;border:1px solid var(--line2);
  background:var(--panel);color:var(--ink);text-decoration:none}
.dbar .btn-present{background:var(--accent-dk);color:#fff;border-color:var(--accent-dk)}
.dbar .btn-present:hover{background:var(--accent)}
.dbar a.btn-pdf{background:var(--fg);color:#fff;border-color:var(--fg)}
.dbar a.btn-pdf:hover{background:#000;text-decoration:none}
.dbar button:focus-visible,.dbar a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.dbar .dhash{font-size:.74rem;color:var(--dim2);margin-left:auto}
.deckwrap{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr);gap:2rem;align-items:start}
.drail{position:sticky;top:4.4rem;background:var(--panel);border:1px solid var(--line);
  border-radius:11px;padding:.55rem;box-shadow:var(--shadow)}
a.drow{display:flex;gap:.5rem;padding:.42rem .5rem;border-radius:7px;font-size:.81rem;color:var(--ink)}
a.drow:hover{background:var(--panel2);text-decoration:none}
a.drow.here{background:var(--accent-dk);color:#fff}
a.drow .dnum{font-family:var(--mono);font-size:.72rem;color:var(--dim2);flex:0 0 auto;padding-top:.1rem}
a.drow.here .dnum{color:rgba(255,255,255,.7)}
.drailfoot{font-size:.71rem;color:var(--dim2);line-height:1.5;margin:.5rem .5rem 0;padding-top:.5rem;
  border-top:1px solid var(--line)}
.deckbody{min-width:0}

/* the slide itself */
.slide{position:relative;width:1200px;height:675px;max-width:100%;
  background:var(--bg);border:1px solid var(--line);border-radius:12px;
  padding:3.2rem 3.4rem 2.6rem;margin:0 auto 1.2rem;box-shadow:var(--shadow);
  display:flex;flex-direction:column;overflow:hidden;scroll-margin-top:4.6rem}
.seyebrow{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dim2);
  font-weight:700;margin-bottom:.7rem}
.seyebrow span{font-weight:400;letter-spacing:.08em}
/* Both selectors, deliberately. `main.doc h2` carries a serif face and a top rule
   and out-specifies a bare `.slide h2`, so on the page the slide title picked up a
   line above it and a different typeface from the very same markup in the PDF —
   which is the one thing sharing a renderer between the two was supposed to stop. */
.slide h2, main.doc .slide h2{font-family:var(--sans);font-weight:800;font-size:2.15rem;
  line-height:1.12;letter-spacing:-.025em;color:var(--fg);
  margin:0 0 1.1rem;border:0;padding:0;max-width:22ch;scroll-margin-top:0}
.slide.split h2, main.doc .slide.split h2{max-width:15ch}
.scols{display:flex;gap:2.2rem;flex:1;min-height:0}
.sbody{flex:1;min-width:0;font-size:1.02rem;line-height:1.62;overflow:hidden}
.sbody > *:first-child{margin-top:0}
.sbody p{margin:0 0 .7rem}
.sbody table{font-size:.84rem}
.sbody .tablewrap{overflow:visible}
.slide.split .sbody{flex:0 0 52%}
figure.shot{margin:0;flex:1;min-width:0;display:flex;flex-direction:column;gap:.5rem}
/* The image takes its natural height and does not grow. Letting it flex to fill the
   column left a wide, short image — a terminal capture is 1400x268 — sitting in a
   tall box with most of the box empty below it. */
figure.shot img{width:100%;height:auto;border:1px solid var(--line2);border-radius:8px;
  box-shadow:0 2px 10px rgba(28,29,33,.09);object-fit:contain;object-position:top center;
  min-height:0;max-height:100%;flex:0 1 auto;align-self:flex-start;background:var(--panel)}
figure.shot figcaption{font-size:.78rem;color:var(--dim);line-height:1.45}
.sfoot{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  margin-top:auto;padding-top:1rem;border-top:1px solid var(--line);
  font-size:.76rem;color:var(--dim2)}
.sfoot a{color:inherit}
.sfoot a.sread{font-weight:650;color:var(--accent-dk)}
.slide.off{display:none}
.notes{margin:-.4rem auto 1.6rem;max-width:1200px;padding:.7rem .9rem;background:var(--panel2);
  border-radius:8px;border-left:3px solid var(--line2);font-size:.85rem;color:var(--dim);line-height:1.6}
.notes b{color:var(--ink)}
body.nonotes .notes{display:none}

/* 1199, not 1300: when Chromium prints, the media query is evaluated against the
   PAGE width — 1200px — so a 1300px breakpoint turned every PDF slide into the
   narrow layout, stacking the columns and clipping the screenshot to its nav bar.
   The slide is 1200px wide, so the responsive rules must start below that. */
@media (max-width:1199px){
  .slide{width:100%;height:auto;min-height:0;padding:2rem 2rem 1.6rem}
  .slide h2, main.doc .slide h2{font-size:1.6rem;max-width:none}
  .scols{flex-direction:column;gap:1.2rem}
  .slide.split .sbody{flex:1 1 auto}
  figure.shot img{max-height:none}
}
@media (max-width:820px){
  .deckwrap{grid-template-columns:1fr}
  .drail{position:static}
  .dbar .dhash{margin-left:0;width:100%}
}
@media print{
  .drail,.dbar,.dsub,.notes{display:none}
  .deckwrap{display:block}
  .slide{break-after:page;box-shadow:none;border:0}
}

/* ---------- the pack reader: a rail, a document, and the bytes ---------- */
/* Built to sgit.ai/briefs/markdown-and-file-viewers: raw is always available for
   every file, the reader is an ADDITION rather than a replacement, and the tree
   comes from a build-time manifest. So the raw link sits ABOVE the document, not
   in a footnote under it, and the hash is on every row of the rail. */
.rawbar{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin:1.1rem 0 1.4rem;
  background:var(--panel2);border:1px solid var(--line);border-radius:11px;padding:.85rem 1rem}
.rawbar span{font-size:.83rem;color:var(--dim);max-width:70ch;line-height:1.55}
.rawbar span b{color:var(--ink)}
.packwrap{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:2rem;align-items:start}
.prail{position:sticky;top:4.4rem;background:var(--panel);border:1px solid var(--line);
  border-radius:11px;padding:.6rem;box-shadow:var(--shadow)}
.prailhead{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--dim2);
  padding:.35rem .5rem .5rem;font-weight:700}
a.prow{display:block;padding:.34rem .5rem;border-radius:7px;font-size:.78rem;color:var(--ink)}
a.prow:hover{background:var(--panel2);text-decoration:none}
a.prow.here{background:var(--accent-dk);color:#fff}
a.prow .pname{display:block;font-family:var(--mono);word-break:break-word;line-height:1.35}
a.prow .phash{display:block;font-family:var(--mono);font-size:.63rem;color:var(--dim2);margin-top:.05rem}
a.prow.here .phash{color:rgba(255,255,255,.72)}
.prailfoot{font-size:.7rem;color:var(--dim2);line-height:1.5;margin:.5rem .5rem 0;padding-top:.5rem;
  border-top:1px solid var(--line)}
.packdoc{min-width:0}
.packdoc h1{font-size:1.6rem;margin:.2rem 0 1rem}
.packnav{display:flex;justify-content:space-between;gap:1rem;margin:1.8rem 0 .6rem;
  font-size:.85rem;font-weight:600}
.packfoot{font-size:.8rem;color:var(--dim);border-top:1px solid var(--line);padding-top:.9rem;
  max-width:80ch}

@media (max-width:820px){
  .packwrap{grid-template-columns:1fr}
  .prail{position:static}
}

/* ---------- the vault picker: seven cards, one stage ---------- */
/* Seven vaults booting at once is a worse demonstration than one booting well, so
   the cards are a selector rather than seven embeds. Nothing is fetched until one
   is picked, which is why /estate/ can carry more vaults than /vault/ and still
   make a smaller claim about what it contacts. */
.picker{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));margin:1.3rem 0 1.6rem}
.vcard{display:flex;flex-direction:column;gap:.45rem;background:var(--panel);border:1px solid var(--line);
  border-radius:11px;padding:.85rem .95rem;box-shadow:var(--shadow)}
.vcard.on{border-color:var(--accent);box-shadow:0 0 0 2px rgba(15,118,110,.14),var(--shadow)}
.vcard > b{font-size:.94rem;letter-spacing:-.01em}
.vcard > span{font-size:.83rem;color:var(--dim);line-height:1.5}
.vcard .vact{display:flex;align-items:center;gap:.7rem;margin-top:auto;padding-top:.5rem}
.vcard button.vopen{background:var(--accent-dk);color:#fff;font-family:inherit;font-weight:650;font-size:.82rem;
  border:0;border-radius:7px;padding:.42rem .8rem;cursor:pointer}
.vcard button.vopen:hover{background:var(--accent)}
.vcard button.vopen:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.vcard.on button.vopen{background:var(--ink)}
.vcard a.vtab{font-size:.78rem;color:var(--dim);font-weight:600}
.stage{margin:0 0 1.6rem;min-height:5rem}
.stage-idle{background:var(--panel2);border:1px dashed var(--line2);border-radius:11px;
  padding:.9rem 1.1rem;font-size:.87rem;color:var(--dim);margin:0}
.stage-idle b{color:var(--ink)}
.stage-now{font-size:.82rem;color:var(--dim);margin:0 0 .2rem;text-transform:uppercase;letter-spacing:.06em}
.stage-now b{color:var(--fg);text-transform:none;letter-spacing:0;font-size:.95rem}

/* ---------- open-in-a-new-tab bar, above the embed ---------- */
/* The frame is the demo; the new tab is where the graph canvas actually has room.
   So the button is the first thing under the title, not a footnote under the frame. */
.openbar{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin:1.1rem 0 1rem}
.openbar span{font-size:.87rem;color:var(--dim);max-width:56ch}
.openbar span b{color:var(--ink)}
a.btn-open{display:inline-block;background:var(--accent-dk);color:#fff;font-weight:650;
  font-size:.95rem;padding:.7rem 1.15rem;border-radius:9px;text-decoration:none;
  box-shadow:var(--shadow);white-space:nowrap}
a.btn-open:hover{background:var(--accent);text-decoration:none}
a.btn-open:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

@media print{
  nav.site,.pagenav,.keybar,button{display:none}
  body{background:#fff} .card,.tile,.fail,section{box-shadow:none}
}

/* ---------- the offers (store.sgit.ai) ----------
   Four tiers and two add-ons, rendered from data/offers.yml. The card gives the
   price the visual weight the stat tiles give a number, because the price IS the
   number on this site — and gives the state chip a line of its own directly under
   it, because on four of the six the honest thing to say about the price is that
   the thing behind it is not finished. A card that hides that line is the whole
   failure mode of a store page. */
.offers{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin:1.4rem 0}
.offer{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1.05rem 1.15rem 1.15rem;
  box-shadow:var(--shadow);display:flex;flex-direction:column}
.offer-head{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;
  border-bottom:1px solid var(--line);padding-bottom:.55rem;margin-bottom:.7rem}
.offer-tier{font-size:.68rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--dim2)}
.offer-price{font-family:var(--serif);font-size:1.5rem;line-height:1;color:#101114;letter-spacing:-.02em;
  white-space:nowrap}
.offer-q{font-size:1.02rem;line-height:1.35;margin:0 0 .5rem;letter-spacing:-.01em}
.offer-gets{margin:0 0 .7rem;font-size:.9rem;color:var(--ink)}
.offer-state{margin:0 0 .7rem;font-size:.82rem;color:var(--dim);line-height:1.55;
  border-left:3px solid var(--line2);padding-left:.7rem}
.offer-rail{margin:0 0 .9rem;font-size:.78rem;color:var(--dim)}
.offer-rail b{color:var(--ink)}
.offer-cta{margin-top:auto;display:inline-block;font-size:.82rem;font-weight:600;border:1px solid var(--line2);
  border-radius:8px;padding:.4rem .75rem;text-align:center;background:var(--panel2)}
a.offer-cta:hover{border-color:var(--accent);text-decoration:none}
.offer-cta-off{color:var(--dim2);background:transparent;border-style:dashed;font-weight:500}

/* Two more claim states than the sibling sites carry, because this one has two
   more ways for a thing behind a price to be unfinished. */
.st-b{color:#075985;background:rgba(3,105,161,.10);border-color:rgba(3,105,161,.3)}
.st-x{color:#8f1d1d;background:rgba(185,28,28,.09);border-color:rgba(185,28,28,.32)}

/* What holds a document out of the dev packs area. */
.hold{display:inline-block;font-size:.68rem;font-weight:700;color:#8f1d1d;background:rgba(185,28,28,.08);
  border:1px solid rgba(185,28,28,.3);border-radius:5px;padding:.05rem .38rem;white-space:nowrap;margin:0 .2rem .2rem 0}
