:root {
  color-scheme: dark;
  --void: #030606;
  --panel: rgba(8, 18, 19, 0.9);
  --line: rgba(91, 255, 210, 0.25);
  --line-hot: rgba(0, 245, 255, 0.68);
  --text: #d7fff2;
  --green: #4dff9d;
  --cyan: #00f5ff;
  --amber: #f6b84a;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.62);
}

html {
  background: var(--void);
}

body {
  min-height: 100vh;
  color: var(--text) !important;
  background:
    linear-gradient(rgba(77, 255, 157, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 245, 255, 0.025) 1px, transparent 1px),
    radial-gradient(circle at 14% 16%, rgba(0, 245, 255, 0.15), transparent 28rem),
    radial-gradient(circle at 86% 8%, rgba(246, 184, 74, 0.09), transparent 24rem),
    linear-gradient(135deg, #020505 0%, #061113 48%, #030606 100%) !important;
  background-size: 34px 34px, 34px 34px, auto, auto, auto !important;
  letter-spacing: 0 !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0, rgba(255, 255, 255, 0.035) 1px, transparent 1px, transparent 4px);
  opacity: 0.22;
}

header {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(13, 34, 34, 0.96), rgba(5, 12, 13, 0.92)) !important;
  border-bottom: 1px solid var(--line-hot) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.38), 0 0 30px rgba(0, 245, 255, 0.18) !important;
}

header::before {
  content: "SECURE NODE / FREEZE-HIDEOUT / ACCESS GRANTED";
  display: block;
  margin-bottom: 0.75rem;
  color: var(--amber);
  font: 700 0.72rem/1.4 Consolas, "Courier New", monospace;
}

header h1,
h2 {
  color: var(--cyan) !important;
  text-shadow: 0 0 12px rgba(0, 245, 255, 0.42);
}

h3,
h4,
strong {
  color: var(--green);
}

p,
li {
  line-height: 1.65;
}

a {
  color: var(--cyan);
  text-underline-offset: 0.2em;
}

nav a,
.links a,
a.button,
.button-card,
.discord-button,
.enter-btn {
  border-radius: 6px !important;
  border: 1px solid var(--line-hot) !important;
  background: linear-gradient(180deg, rgba(4, 255, 196, 0.92), rgba(0, 171, 190, 0.92)) !important;
  color: #021011 !important;
  box-shadow: 0 0 18px rgba(0, 245, 255, 0.28) !important;
}

nav a {
  background: rgba(0, 245, 255, 0.08) !important;
  color: var(--text) !important;
  padding: 0.55rem 0.75rem;
  text-transform: uppercase;
  font: 700 0.78rem/1.2 Consolas, "Courier New", monospace;
}

nav a:hover,
.links a:hover,
a.button:hover,
.button-card:hover,
.discord-button:hover,
.enter-btn:hover {
  filter: brightness(1.12);
  box-shadow: 0 0 28px rgba(77, 255, 157, 0.38) !important;
}

.section,
.card,
.subsection,
section,
.terminal {
  background: linear-gradient(180deg, rgba(12, 28, 27, 0.92), rgba(4, 10, 11, 0.92)) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.section::before,
.card::before,
.subsection::before {
  content: ">_";
  color: var(--amber);
  font: 700 0.8rem Consolas, "Courier New", monospace;
}

.subsection {
  border-left: 3px solid var(--green) !important;
}

pre,
code,
.terminal {
  font-family: Consolas, "Courier New", monospace !important;
}

pre,
code {
  color: var(--green) !important;
  background: rgba(1, 8, 8, 0.88) !important;
  border-color: rgba(77, 255, 157, 0.22) !important;
}

footer {
  background: rgba(4, 10, 11, 0.96) !important;
  border-top: 1px solid var(--line) !important;
}

@media (max-width: 720px) {
  body {
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow-x: hidden;
  }

  header {
    padding: 1.25rem 1rem !important;
  }

  header h1 {
    font-size: 1.55rem !important;
  }

  .container,
  .section,
  section {
    width: calc(100% - 24px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 1rem !important;
  }

  .card,
  .button-card {
    width: min(100%, 320px) !important;
  }
}