:root {
  color-scheme: dark;
  --ink: #efe3af;
  --ink-soft: #b8ad7a;
  --phosphor: #8aaa42;
  --phosphor-strong: #b3d45f;
  --amber: #e7c25d;
  --black: #050705;
  --panel: rgba(8, 11, 7, 0.88);
  --line: rgba(132, 162, 67, 0.72);
  --muted-line: rgba(132, 162, 67, 0.25);
  --paper: #f4efe2;
  --graphite: #171717;
  --steel: #73808a;
  --signal: #ff6f3d;
  --cyan: #61d6d1;
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: var(--black);
}

body {
  min-height: 100%;
  margin: 0;
  font-family: "Courier New", Consolas, monospace;
  background: var(--black);
  color: var(--ink);
}

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

button,
input,
textarea {
  font: inherit;
}

::selection {
  background: var(--phosphor);
  color: var(--black);
}

.site-noise::before,
.site-noise::after {
  position: fixed;
  inset: 0;
  z-index: 50;
  pointer-events: none;
  content: "";
}

.site-noise::before {
  opacity: 0.13;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.08) 0,
      rgba(255, 255, 255, 0.08) 1px,
      transparent 1px,
      transparent 4px
    );
  mix-blend-mode: screen;
}

.site-noise::after {
  opacity: 0.18;
  background:
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.14), transparent 26%),
    radial-gradient(circle at 70% 80%, rgba(97, 214, 209, 0.1), transparent 24%);
  filter: blur(18px);
}