@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@600;700;800&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --ink:#15171C;
  --ink-raised:#1C2027;
  --ink-line: rgba(242,239,233,0.10);
  --paper:#F2EFE9;
  --paper-dim: rgba(242,239,233,0.62);
  --paper-faint: rgba(242,239,233,0.38);
  --signal:#FF8A3D;
  --signal-dim: rgba(255,138,61,0.16);
  --slate:#8B93A1;
  --radius: 3px;
  --maxw: 1040px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:'IBM Plex Sans', sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:'Archivo', sans-serif;
  font-weight:800;
  letter-spacing:-0.01em;
  margin:0;
  color:var(--paper);
}
a{color:var(--signal); text-decoration:none;}
a:hover{text-decoration:underline;}
a:focus-visible, button:focus-visible{outline:2px solid var(--signal); outline-offset:3px;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}

.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12.5px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--signal);
  display:flex;
  align-items:center;
}
.eyebrow::before{
  content:"";
  width:7px; height:7px;
  background:var(--signal);
  border-radius:50%;
  display:inline-block;
  margin-right:10px;
}

nav{
  position:sticky; top:0; z-index:10;
  background:rgba(21,23,28,0.88);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--ink-line);
}
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:64px;}
.brand{
  font-family:'Archivo', sans-serif;
  font-weight:800;
  font-size:18px;
  color:var(--paper);
  display:flex; align-items:center;
}
.brand .dot{width:9px; height:9px; background:var(--signal); border-radius:1px; transform:rotate(45deg); margin-right:9px;}
nav .links{font-size:14.5px; color:var(--paper-dim);}
nav .links a{color:var(--paper-dim); margin-left:28px;}

footer{
  border-top:1px solid var(--ink-line);
  padding:36px 0 48px;
  margin-top:80px;
}
footer .wrap{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; row-gap:18px;}
footer .legal{font-size:13.5px; color:var(--paper-faint);}
footer .legal a{color:var(--paper-dim); margin-right:18px;}
footer .legal a:last-child{margin-right:0;}

.page-header{padding:64px 0 8px;}
.page-header h1{font-size:34px;}
.page-header .updated{font-family:'IBM Plex Mono', monospace; font-size:13px; color:var(--slate); margin-top:10px;}

.doc{padding:36px 0 40px; max-width:720px;}
.doc h2{font-size:19px; margin-top:40px; margin-bottom:12px; color:var(--paper);}
.doc p, .doc li{color:var(--paper-dim); font-size:15.5px;}
.doc ul{padding-left:20px;}
.doc strong{color:var(--paper);}

@media (max-width:640px){
  nav .links{display:none;}
  .page-header h1{font-size:27px;}
}