:root{
  --bg:#030806;
  --panel:#08120d;
  --line:#15291e;
  --line-bright:#1f4030;
  --green:#2bff9e;
  --green-dim:#18b06b;
  --cyan:#35d0ff;
  --text:#cfe9da;
  --text-bright:#eafff4;
  --muted:#5f8271;
  --muted-panel:#7aa08c;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --sans:'IBM Plex Sans',system-ui,sans-serif;
  --header-h:58px;
}

*{margin:0;padding:0;box-sizing:border-box}

html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 14px)}

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--mono);
  font-size:15px;
  line-height:1.6;
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed;inset:0;z-index:2;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);
  opacity:.35;
}

body::after{
  content:"";
  position:fixed;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(var(--line) 1px,transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:56px 56px;
  opacity:.22;
  mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 0%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 0%,transparent 78%);
}

::selection{background:var(--green);color:#02130a}

a{color:inherit;text-decoration:none}

:focus-visible{outline:2px solid var(--green);outline-offset:2px}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}