:root{
  --bg:#0a0a0c; --bg-elev:#141418; --panel:#16161c; --panel-2:#1b1b22;
  --line:#26262e; --line-bright:#34343e;
  --text:#e7ebef; --dim:#8a94a0; --faint:#5a626b;
  --teal:#4dd0c4; --violet:#9b6bff; --cyan:#00e5ff; --amber:#ffb74d;
  --green:#3ddc84; --warn:#e8a33d; --red:#d23b2e;
  --display:'Archivo',system-ui,sans-serif;
  --body:'IBM Plex Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --wrap:820px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);color:var(--text);font-family:var(--body);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;
}
a{color:var(--teal)}
a:hover{color:#7fe0d6}
::selection{background:var(--teal);color:#04140f}

nav{
  position:sticky;top:0;z-index:50;
  background:rgba(10,10,12,.82);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:20px;height:56px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;color:var(--text)}
.brand small{font-family:var(--mono);font-weight:400;color:var(--dim);font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.nav-back{margin-left:auto;font-family:var(--mono);font-size:13px;color:var(--dim)}
.nav-back:hover{color:var(--teal)}

main{max-width:var(--wrap);margin:0 auto;padding:48px 24px 96px}
h1{font-family:var(--display);font-size:clamp(28px,4vw,38px);font-weight:800;letter-spacing:-.02em;margin-bottom:20px;color:var(--text)}
h2{font-family:var(--display);font-size:24px;font-weight:700;margin:40px 0 14px;padding-top:20px;border-top:1px solid var(--line);letter-spacing:-.01em}
h1+h2, h1 + p + h2{border-top:none;padding-top:0}
h3{font-family:var(--display);font-size:18px;font-weight:600;margin:26px 0 10px}
p{margin:14px 0;color:var(--text)}
p, li{color:#c7ced6}
ul,ol{margin:14px 0 14px 22px}
li{margin:6px 0}
strong{color:var(--text)}
code{
  font-family:var(--mono);font-size:.88em;background:var(--panel-2);
  border:1px solid var(--line);border-radius:4px;padding:1px 6px;color:var(--teal);
}
pre{
  background:var(--panel);border:1px solid var(--line);border-radius:10px;
  padding:16px 18px;overflow-x:auto;margin:18px 0;
}
pre code{background:none;border:none;padding:0;color:#c7ced6;font-size:13px;line-height:1.55}
blockquote{
  border-left:3px solid var(--teal);padding:2px 18px;margin:18px 0;color:var(--dim);
}
table{border-collapse:collapse;width:100%;margin:20px 0;font-size:14.5px}
th,td{border:1px solid var(--line);padding:8px 12px;text-align:left}
th{background:var(--panel);color:var(--text);font-family:var(--mono);font-size:12px;letter-spacing:.04em;text-transform:uppercase}
td{color:#c7ced6}
hr{border:none;border-top:1px solid var(--line);margin:32px 0}
.doc-foot{
  margin-top:56px;padding-top:24px;border-top:1px solid var(--line);
  color:var(--faint);font-size:13px;font-family:var(--mono);
}