:root {
  --bth-magenta: #ff1f8a;
  --bth-lime: #b8ff2c;
  --bth-sky: #37e3ff;
  --bth-ink: #0a0f1e;
  --bth-surface: #111827;
  --bth-text: #e8ebf5;
}

html,
body {
  background: var(--bth-ink);
  color: var(--bth-text);
  font-family: Manrope, system-ui, -apple-system, Segoe UI, Roboto,
    "Helvetica Neue", Arial, sans-serif;
}

.bg-surface {
  background: var(--bth-surface) !important;
}

a {
  color: #ffc4e0;
}
a:hover {
  color: #ffe0f0;
}

.fw-extrabold {
  font-weight: 800;
}

.neon-hero {
  background: radial-gradient(
      900px 420px at 10% -15%,
      rgba(255, 31, 138, 0.42),
      transparent
    ),
    radial-gradient(
      900px 420px at 90% -10%,
      rgba(184, 255, 44, 0.28),
      transparent
    ),
    radial-gradient(
      800px 380px at 50% -10%,
      rgba(55, 227, 255, 0.22),
      transparent
    ),
    var(--bth-surface);
}

.section-ink {
  background: linear-gradient(
    180deg,
    rgba(255, 31, 138, 0.1),
    rgba(184, 255, 44, 0.1)
  );
}

.navbar-dark .navbar-brand {
  color: #fff;
}
.navbar-dark .nav-link {
  color: #cdd5e6;
}
.navbar-dark .nav-link.active,
.navbar-dark .nav-link:hover {
  color: #fff;
}

.card.glass {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 1rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
}

.card-highlight {
  background: linear-gradient(
    180deg,
    rgba(184, 255, 44, 0.18),
    rgba(55, 227, 255, 0.18)
  );
  border: 1px solid rgba(184, 255, 44, 0.45);
  border-radius: 1rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.32);
}

.card-outline {
  background: rgba(255, 255, 255, 0.03);
  border: 1px dashed rgba(255, 31, 138, 0.55);
  border-radius: 1rem;
}

.btn-lime {
  background: var(--bth-lime);
  color: #102400;
  border: none;
}
.btn-lime:hover {
  filter: brightness(1.05);
  color: #0b1a00;
}

.text-neon {
  color: var(--bth-magenta) !important;
}
.text-lime {
  color: var(--bth-lime) !important;
}
.text-sky {
  color: var(--bth-sky) !important;
}

.hp-field {
  position: absolute;
  left: -10000px;
  opacity: 0;
}
