:root {
  --nf-ink: #f7f7fb;
  --nf-paper: #090a0f;
  --nf-pink: #ff267e;
  --nf-cyan: #38d5c5;
  --nf-yellow: #ff267e;
  --nf-line: #2b2e3a;
}

body {
  color: #f7f7fb;
  background: #090a0f;
  background-image: radial-gradient(circle at 84% 4%, rgba(255,38,126,.11), transparent 29%);
}
.nf-skipline { color: #fff; background: #ff267e; }
.nf-mast {
  height: 82px;
  position: sticky;
  top: 0;
  z-index: 12;
  background: rgba(9,10,15,.94);
  border-color: #292c37;
  backdrop-filter: blur(16px);
}
.nf-brand img,
.nf-footer__top > a img { filter: none; }
.nf-menu { color: #d3d6df; }
.nf-menu a:hover { color: #fff; }
.nf-lang,
.nf-outline { color: #f7f7fb; border-color: #484c5b; background: rgba(255,255,255,.02); }
.nf-enter,
.nf-action {
  color: #fff;
  background: #ff267e;
  border-color: #ff267e;
  box-shadow: 0 10px 28px rgba(255,38,126,.20);
}
.nf-lang:hover,
.nf-outline:hover { border-color: #ff267e; }

.nf-stage {
  background: linear-gradient(135deg, #0d0f16 0%, #11131c 58%, #18111b 100%);
  border-color: #292c37;
  overflow: hidden;
}
.nf-stage__grid { min-height: 590px; }
.nf-marker { color: #38d5c5; letter-spacing: .08em; }
.nf-stage h1 { color: #fff; letter-spacing: -.035em; }
.nf-lead { color: #c6c9d3; }
.nf-stage__visual {
  min-height: 520px;
  display: grid;
  place-items: end center;
  background:
    radial-gradient(circle at 50% 50%, rgba(56,213,197,.16), transparent 30%),
    radial-gradient(circle at 50% 76%, rgba(255,38,126,.33), transparent 45%);
}
.nf-stage__visual::before {
  content: "";
  position: absolute;
  inset: 44px 16px 16px;
  border: 1px solid rgba(255,38,126,.45);
  border-radius: 28px;
}
.nf-stage__visual img { position: relative; z-index: 1; }
.nf-stage__visual figcaption {
  z-index: 2;
  color: #dfe1e8;
  background: rgba(9,10,15,.88);
  border: 1px solid #353844;
  border-radius: 7px;
}

.nf-ticker { color: #dfe1e8; background: #10121a; border-bottom: 1px solid #292c37; }
.nf-ticker span,
.nf-ticker b { color: #38d5c5; }

.nf-catalog { color: #f7f7fb; background: #10121a; border-color: #292c37; }
.nf-catalog__head button { color: #fff; border-color: #454958; background: #171923; }
.nf-catalog__head button:hover { border-color: #ff267e; }
.nf-reel { scrollbar-color: #ff267e #171923; }
.nf-game {
  color: #f7f7fb;
  background: #171923;
  border-color: #30333f;
  border-radius: 12px;
  overflow: hidden;
  transition: transform .22s, border-color .22s, box-shadow .22s;
}
.nf-game:hover { transform: translateY(-4px); border-color: #ff267e; box-shadow: 0 16px 36px rgba(0,0,0,.34); }
.nf-game__image b { border-radius: 7px; }

.nf-reading { color: #f7f7fb; background: #090a0f; }
.nf-index { border-top-color: #ff267e; }
.nf-index p,
.nf-copy h2,
.nf-copy h3 { color: #fff; }
.nf-index__link { color: #b9bdca; border-color: #2e313c; }
.nf-index__link:hover { color: #fff; }
.nf-copy p,
.nf-copy li { color: #c4c7d2; }
.nf-copy a { color: #72e5d9; }
.nf-data-table { color: #daddE6; background: #12141c; }
.nf-data-table th,
.nf-data-table td { border-color: #343744; }
.nf-data-table th { color: #fff; background: #24202b; }

.nf-promo {
  color: #f7f7fb;
  background:
    radial-gradient(circle at 24% 55%, rgba(255,38,126,.22), transparent 36%),
    #11131b;
  border-color: #30333f;
}
.nf-promo__grid img {
  border-radius: 18px;
  background: radial-gradient(circle, rgba(56,213,197,.12), transparent 62%);
}
.nf-promo p { color: #c4c7d2; }

.nf-faq { color: #f7f7fb; background: #0d0f15; }
.nf-faq details { background: #151721; border-color: #30333f; border-radius: 10px; }
.nf-faq details p { color: #bfc3cf; }
.nf-faq summary::marker { color: #ff267e; }

.nf-footer { color: #d7dae4; background: #06070b; border-top: 1px solid #292c37; }
.nf-footer__top { border-color: #30333f; }
.nf-studios img { opacity: .72; filter: grayscale(1) brightness(2.2); }
.nf-footer p { color: #9fa4b2; }
.nf-footer small { color: #737987; }

.nf-not-found { color: #f7f7fb; background: radial-gradient(circle at 50% 25%, rgba(255,38,126,.16), transparent 38%), #090a0f; }
.nf-not-found p { color: #ff267e; }
.nf-not-found span { color: #bfc3cf; }
.nf-not-found a { color: #72e5d9; }

@media (max-width: 850px) {
  .nf-stage__visual { min-height: 360px; }
}
@media (max-width: 540px) {
  .nf-mast { height: 68px; }
  .nf-stage__visual { min-height: 190px; }
  .nf-stage__visual::before { inset: 12px; border-radius: 18px; }
}