/* ===== Ginastaroff Gaming Neon (UI/UX Pro Max) ===== */

:root {
  --gold: #a78bfa;
  --gold-soft: rgba(124, 58, 237, 0.18);
  --ash: #0f0f23;
  --bone: #e2e8f0;
}

body {
  font-family: var(--font-body);
  font-weight: 500;
  color: var(--ink);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 90;
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}

::selection {
  background: rgba(124, 58, 237, 0.4);
  color: #fff;
}

/* Chrome — keep Gaming tokens from styles.css; light polish only */
.sidebar {
  border-right: 1px solid rgba(76, 29, 149, 0.45);
  background:
    linear-gradient(180deg, rgba(10, 10, 28, 0.96), rgba(15, 15, 35, 0.92)),
    radial-gradient(400px 200px at 0% 0%, rgba(124, 58, 237, 0.14), transparent 70%);
  backdrop-filter: blur(18px);
}

.nav__item.is-active .nav__glyph {
  color: #fff;
}

.topbar__logout:hover {
  border-color: rgba(244, 63, 94, 0.5);
  background: rgba(244, 63, 94, 0.12);
}

.window {
  border-radius: var(--radius);
  border: 1px solid rgba(76, 29, 149, 0.4);
  background:
    linear-gradient(180deg, rgba(124, 58, 237, 0.08), transparent 26%),
    linear-gradient(145deg, rgba(30, 28, 53, 0.96), rgba(15, 15, 35, 0.98));
  box-shadow: var(--shadow);
  clip-path: none;
}

.window::before {
  background: linear-gradient(90deg, transparent, rgba(167, 139, 250, 0.7), transparent);
}

.window:not(.window--bare)::after {
  background:
    radial-gradient(480px 260px at 92% -6%, rgba(124, 58, 237, 0.16), transparent 60%),
    radial-gradient(420px 260px at -6% 108%, rgba(244, 63, 94, 0.1), transparent 60%);
}

.window__bar {
  border-bottom: 1px solid rgba(76, 29, 149, 0.35);
}

.window__title {
  font-family: var(--font-display);
  letter-spacing: 0.06em;
  font-size: 1.05rem;
}

.window--bare {
  background: #0a0a18;
  border-color: rgba(76, 29, 149, 0.4);
}

.btn {
  border-radius: 8px;
  clip-path: none;
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.btn--primary {
  color: #fff;
  background: linear-gradient(120deg, #7c3aed, #a78bfa);
  box-shadow: 0 14px 34px rgba(124, 58, 237, 0.32);
}

.btn--blood {
  color: #fff;
  background: linear-gradient(120deg, #f43f5e, #e11d48);
  box-shadow: 0 14px 34px rgba(244, 63, 94, 0.32);
}

.btn--blood:hover,
.btn--primary:hover {
  box-shadow: 0 16px 40px rgba(124, 58, 237, 0.4);
  filter: brightness(1.05);
}

.btn--ghost,
.btn--ghost-light {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(167, 139, 250, 0.3);
}

.btn--ghost-light:hover,
.btn--ghost:hover {
  border-color: rgba(167, 139, 250, 0.65);
  background: rgba(124, 58, 237, 0.12);
}

.field input,
.field textarea,
.cab-form input,
.cab-form textarea {
  border-radius: 8px !important;
  background: rgba(10, 10, 24, 0.85) !important;
  border: 1px solid rgba(76, 29, 149, 0.45) !important;
  color: var(--ink) !important;
  font-family: var(--font-body);
}

.field input:focus,
.field textarea:focus {
  border-color: rgba(124, 58, 237, 0.7) !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.2);
}

/* Home luxury */
.home-v2__bg {
  opacity: 0.5;
  filter: saturate(0.85) contrast(1.08) brightness(0.85);
}

.home-v2__veil {
  background:
    linear-gradient(105deg, rgba(7, 7, 8, 0.94) 0%, rgba(7, 7, 8, 0.72) 42%, rgba(7, 7, 8, 0.45) 100%),
    linear-gradient(0deg, rgba(7, 7, 8, 0.97) 0%, transparent 42%),
    radial-gradient(700px 340px at 78% 18%, rgba(124, 58, 237, 0.16), transparent 62%);
}

.home-hero__brand {
  font-family: var(--font-display);
  font-size: clamp(3rem, 8vw, 5.2rem);
  letter-spacing: 0.08em;
  background: linear-gradient(90deg, #f8fafc, #7c3aed 50%, #6d28d9);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 18px 40px rgba(0, 0, 0, 0.55));
  text-shadow: none;
}

.home-hero__title {
  font-family: var(--font-display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  color: var(--accent-2);
  font-weight: 500;
}

.home-hero__lead {
  font-family: var(--font-body);
  font-size: 1.08rem;
  color: rgba(247, 241, 230, 0.72);
}

.home-hero__visual::before {
  background: radial-gradient(ellipse, rgba(124, 58, 237, 0.35), transparent 70%);
}

.home-live {
  border: 1px solid rgba(124, 58, 237, 0.22);
  border-radius: 20px;
  background:
    linear-gradient(160deg, rgba(18, 18, 22, 0.94), rgba(10, 10, 12, 0.96)),
    radial-gradient(500px 180px at 15% 0%, rgba(124, 58, 237, 0.12), transparent 60%);
  box-shadow: var(--shadow);
  clip-path: none;
}

.home-live__kicker {
  color: var(--gold);
  font-family: var(--font-display);
  letter-spacing: 0.2em;
}

.home-live__head h2,
.home-ways h2,
.home-top-drops__head h2,
.home-socials__text h2,
.bolt-h1,
.cab-inv-title {
  font-family: var(--font-display);
  letter-spacing: 0.06em;
  font-weight: 600;
}

.home-live__open {
  border-bottom-color: rgba(124, 58, 237, 0.5);
}

.home-way {
  border-radius: 16px;
  border: 1px solid rgba(124, 58, 237, 0.16);
  background:
    linear-gradient(160deg, rgba(20, 20, 26, 0.9), rgba(10, 10, 12, 0.92));
  clip-path: none;
}

.home-way:hover {
  border-color: rgba(167, 139, 250, 0.55);
  background: rgba(28, 24, 14, 0.92);
  box-shadow: 0 16px 36px rgba(124, 58, 237, 0.14);
}

.home-social {
  border-radius: 14px;
  border: 1px solid rgba(124, 58, 237, 0.16);
  background: rgba(12, 12, 16, 0.75);
  clip-path: none;
}

.home-social--tg .home-social__mark,
.home-social--tw .home-social__mark {
  background: rgba(124, 58, 237, 0.12);
  color: var(--gold);
  border-radius: 10px;
}

.home-social:hover {
  border-color: rgba(124, 58, 237, 0.45);
  background: rgba(24, 22, 14, 0.8);
}

.bolt-page__veil,
.bolt-page__veil--blood {
  background:
    linear-gradient(160deg, rgba(7, 7, 8, 0.9), rgba(14, 14, 18, 0.78)),
    radial-gradient(700px 300px at 70% 10%, rgba(124, 58, 237, 0.14), transparent 60%) !important;
}

.bolt-badge {
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.1);
  border: 1px solid rgba(124, 58, 237, 0.35);
  font-family: var(--font-display);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--accent-2);
}

.mg-card,
.case-card,
.bolt-nav-card,
.skin-card {
  border-radius: 16px !important;
  border: 1px solid rgba(124, 58, 237, 0.14) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

.mg-card:hover,
.case-card:hover,
.bolt-nav-card:hover {
  border-color: rgba(124, 58, 237, 0.45) !important;
  box-shadow: 0 20px 48px rgba(124, 58, 237, 0.12);
}

.cab-tabs__btn.is-on,
.cab-tabs__btn.is-active {
  background: linear-gradient(120deg, rgba(124, 58, 237, 0.22), rgba(167, 139, 250, 0.1)) !important;
  border-color: rgba(124, 58, 237, 0.45) !important;
  color: #fff !important;
}

.cab-hero__ava {
  border-color: rgba(124, 58, 237, 0.5) !important;
  box-shadow: 0 12px 28px rgba(124, 58, 237, 0.18);
}

.case-tape,
.case-reel,
.home-top-tape {
  border-color: rgba(124, 58, 237, 0.16) !important;
}

.ghoul-title__red,
.r-legendary {
  color: var(--accent-2) !important;
  text-shadow: 0 0 20px rgba(124, 58, 237, 0.25);
}

.ghoul-kicker,
.bolt-sub {
  color: rgba(124, 58, 237, 0.75);
  font-family: var(--font-display);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-size: 0.72rem;
  font-weight: 600;
}

.case-theme--tokyo-ghoul .bolt-page__veil,
.case-theme--cyberpunk .bolt-page__veil,
.case-theme--one-piece .bolt-page__veil {
  background:
    linear-gradient(160deg, rgba(7, 7, 8, 0.88), rgba(14, 14, 18, 0.72)),
    radial-gradient(700px 300px at 70% 10%, rgba(124, 58, 237, 0.12), transparent 60%) !important;
}
