:root {
  color-scheme: dark;
  --bg: #030405;
  --bg-2: #08090d;
  --ink: #f6f7ef;
  --muted: #a9b1bd;
  --soft: #737b8b;
  --line: rgba(255, 255, 255, 0.13);
  --line-soft: rgba(255, 255, 255, 0.07);
  --panel: rgba(16, 17, 22, 0.84);
  --panel-2: rgba(22, 23, 31, 0.74);
  --lime: #c9ff2c;
  --blue: #6cc8ff;
  --amber: #ffb561;
  --red: #ff5f64;
  --violet: #9d7bff;
  --shadow: 0 34px 120px rgba(0, 0, 0, 0.68);
  --radius: 8px;
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Microsoft YaHei", sans-serif;
}

* {
  box-sizing: border-box;
  letter-spacing: 0;
}

html {
  overflow-x: hidden;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    linear-gradient(120deg, rgba(108, 200, 255, 0.08), transparent 22rem),
    linear-gradient(250deg, rgba(201, 255, 44, 0.055), transparent 24rem),
    var(--bg);
  background-size: 72px 72px, 72px 72px, auto, auto, auto;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 18%),
    repeating-linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.022) 0,
      rgba(255, 255, 255, 0.022) 1px,
      transparent 1px,
      transparent 6px
    );
  opacity: 0.58;
}