:root{
  --gray-800: oklch(27.8% 0.033 256.848);
  --gray-700: oklch(37.3% 0.034 259.733);
  --gray-600: oklch(44.6% 0.03 256.802);
  --gray-500: oklch(55.1% 0.027 264.364);
  --gray-400: oklch(70.7% 0.022 261.325);
  --gray-200: oklch(92.8% 0.006 264.531);
}

html { -webkit-text-size-adjust: 100%; }
body { margin:0; color:var(--gray-800); font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; }

main{ 
  max-width:42rem;margin-left:auto; margin-right:auto;padding-left:1rem; padding-right:1rem;padding-top:3rem; padding-bottom:3rem;line-height:1.625; 
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
}
.mb-20{ margin-bottom:5rem; }
.mb-8{ margin-bottom:2rem; }
.mb-4{ margin-bottom:1rem; }
.space-x-6 > * + *{ margin-left:1.5rem; }
.space-x-3 > * + *{ margin-left:.75rem; }
.space-x-1 > * + *{ margin-left:.25rem; }
.space-y-6 > * + *{ margin-top:1.5rem; }

/* Typography scale */
.text-2xl{ font-size:1.5rem; line-height:2rem; }
.text-xl{ font-size:1.25rem; line-height:1.75rem; }
.text-sm{ font-size:.875rem; line-height:1.25rem; }
.text-xs{ font-size:.75rem; line-height:1rem; }

/* Text colors */
.text-gray-800{ color:var(--gray-800); }
.text-gray-700{ color:var(--gray-700); }
.text-gray-600{ color:var(--gray-600); }
.text-gray-500{ color:var(--gray-500); }
.text-gray-400{ color:var(--gray-400); }

hr { width: 100%; border: 0; border-top: 1px solid var(--gray-200); }

a{
  color: inherit;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:4px;
  transition:all .15s cubic-bezier(.4,0,.2,1);
}
a:hover{ text-decoration:none; }

article{ color:var(--gray-800); }
article :where(pre, blockquote, table, figure){ margin: 1rem 0; }
h1,h2,h3,h4 { line-height:1.25; font-weight:400; margin:1.5rem 0 1rem; }
article h1{ font-size:2rem; }
article h2{ font-size:1.5rem; }
article h3{ font-size:1.25rem; font-weight:500; }
article h4{ font-size:1.125rem; font-weight:500; }
article a{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
article code{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
  font-size: .875em;
  padding: .125rem .25rem;
}
article pre{
  padding:1rem; border-radius:.5rem; overflow:auto;
  background:#0b1020; color:#e6edf3;
}
article blockquote{
  border-left: 3px solid var(--gray-200);
  padding-left:.75rem; color:var(--gray-700); font-style:italic;
}
article img, article video{ max-width:100%; height:auto; border-radius:.5rem; margin-left:auto; margin-right:auto; display:block; }
article ul{ padding-left:1.25rem; list-style:disc; }
article ol{ padding-left:1.25rem; list-style:lower-roman; }
article hr{ border:0; border-top:1px solid var(--gray-200); margin:2rem 0; }
article table{ width:100%; border-collapse:collapse; font-size:0.95em; }
article th, article td{ border:1px solid var(--gray-200); padding:.5rem .75rem; text-align:left; }

article-sm :where(p, ul, ol, pre, blockquote){ margin:.875rem 0; }
article-sm{ font-size:0.95rem; }
article{ max-width:none; }

footer { padding-top: 2rem; }
footer p{ margin:0; }

ul, ol {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
li { margin: 0; } 
li p { margin-top: 0.5rem; }

#logo {
  font-size:1.875rem; line-height:2.25rem;
  margin-bottom:1.5rem; 
}