/* UPGIFT, тема «Ночной зал» (по рефам заказчика): нейтральный чёрный с сеткой и световыми шипами по краям,
   шрифт Onest вместо Dela Gothic, глянцевые кнопки с «губой», яркие карточки игр.
   Включается классом .th2 на <html> (app.js). Без класса файл ничего не меняет. */

html.th2 {
  --velvet-0: #08080b; --velvet-1: #0f0f13; --velvet-2: #18181e; --velvet-3: #22222a; --velvet-4: #2e2e38;
  --line: rgba(255, 255, 255, .07); --line-2: rgba(255, 255, 255, .12);
  --satin: #ffffff; --satin-2: #b6b6c4; --satin-3: #7b7b8b;
  --font-display: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
}
html.th2, html.th2 body { background: #0b0b0f; }

/* сетка помельче, мягкие размытые точки («боке») и редкие мелкие звёзды, лёгкая виньетка */
.th2 body::before {
  background:
    radial-gradient(7px 7px at 35% 96%, rgba(255, 255, 255, .08), transparent),
    radial-gradient(8px 8px at 97% 85%, rgba(255, 255, 255, .05), transparent),
    radial-gradient(6px 6px at 34% 85%, rgba(255, 255, 255, .05), transparent),
    radial-gradient(5px 5px at 17% 49%, rgba(255, 255, 255, .09), transparent),
    radial-gradient(5px 5px at 51% 71%, rgba(255, 255, 255, .05), transparent),
    radial-gradient(7px 7px at 34% 3%, rgba(255, 255, 255, .07), transparent),
    radial-gradient(6px 6px at 38% 25%, rgba(255, 255, 255, .09), transparent),
    radial-gradient(5px 5px at 12% 19%, rgba(255, 255, 255, .09), transparent),
    radial-gradient(5px 5px at 19% 2%, rgba(255, 255, 255, .05), transparent),
    radial-gradient(5px 5px at 30% 23%, rgba(255, 255, 255, .07), transparent),
    radial-gradient(5px 5px at 43% 27%, rgba(255, 255, 255, .07), transparent),
    radial-gradient(5px 5px at 91% 27%, rgba(255, 255, 255, .09), transparent),
    radial-gradient(5px 5px at 5% 48%, rgba(255, 255, 255, .09), transparent),
    radial-gradient(5px 5px at 21% 35%, rgba(255, 255, 255, .05), transparent),
    radial-gradient(5px 5px at 41% 79%, rgba(255, 255, 255, .05), transparent),
    radial-gradient(7px 7px at 89% 92%, rgba(255, 255, 255, .08), transparent),
    radial-gradient(4px 4px at 42% 47%, rgba(255, 255, 255, .08), transparent),
    radial-gradient(6px 6px at 92% 42%, rgba(255, 255, 255, .07), transparent),
    radial-gradient(6px 6px at 63% 92%, rgba(255, 255, 255, .07), transparent),
    radial-gradient(4px 4px at 35% 4%, rgba(255, 255, 255, .08), transparent),
    radial-gradient(6px 6px at 5% 72%, rgba(255, 255, 255, .09), transparent),
    radial-gradient(5px 5px at 51% 76%, rgba(255, 255, 255, .05), transparent),
    radial-gradient(1.3px 1.3px at 24% 30%, rgba(255, 255, 255, .28), transparent),
    radial-gradient(1.1px 1.1px at 63% 18%, rgba(255, 255, 255, .23), transparent),
    radial-gradient(1.2px 1.2px at 77% 52%, rgba(255, 255, 255, .23), transparent),
    radial-gradient(1px 1px at 35% 72%, rgba(255, 255, 255, .20), transparent),
    radial-gradient(1.2px 1.2px at 91% 88%, rgba(255, 255, 255, .23), transparent),
    radial-gradient(140% 90% at 50% 45%, transparent 55%, rgba(0, 0, 0, .55) 100%),
    linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px) 0 0 / 24px 24px;
}
/* «шипы» света по левому и правому краю (как у рефа): короткие тусклые клинья, направлены к центру экрана,
   светлее у края и тают к острию (не отвлекают от игры); расставляет их скрипт в index.html под размер экрана */
.bg-spikes { display: none; }
.th2 body::after { display: none; }
.th2 .bg-spikes { display: block; position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.bg-spikes i {
  position: absolute; transform-origin: 0 50%;
  background: linear-gradient(90deg, rgba(230, 234, 245, .15) 0%, rgba(230, 234, 245, .05) 50%, rgba(230, 234, 245, 0) 100%);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

/* шапка */
.th2 .top { background: linear-gradient(#0b0b0f 78%, rgba(11, 11, 15, 0)); }
.th2 .logo { font-weight: 800; letter-spacing: 0; }
.th2 .logo b { font-weight: 800; }
.th2 .wallet { background: rgba(24, 24, 30, .88); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.th2 .wallet__sum { font-weight: 800; }
.th2 .top .avatar { box-shadow: 0 0 0 2px #2a2a34, 0 6px 14px -6px #000; }

/* кнопки: глянец сверху, «губа» снизу, нажатие опускает кнопку */
.th2 .btn { border-radius: 16px; }
.th2 .btn--primary {
  text-transform: none; letter-spacing: 0; font-size: 16px;
  background: linear-gradient(180deg, #5c9dff 0%, #2f6bff 58%, #2a60f0 100%);
  box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, .45), 0 4px 0 #1b3eaa, 0 16px 24px -12px rgba(47, 107, 255, .85);
}
.th2 .btn--primary:active { transform: translateY(3px); box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, .45), 0 1px 0 #1b3eaa; }
.th2 .btn--primary[disabled] {
  background: linear-gradient(180deg, #2b2b34, #24242c); color: #6f6f7e;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 4px 0 #141419;
}
.th2 .btn--ghost {
  background: linear-gradient(180deg, #2c2c35, #24242c);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 4px 0 #131318;
}
.th2 .btn--ghost:active { transform: translateY(3px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 #131318; }

.th2 .chip {
  border-radius: 11px; color: #dcdce6;
  background: linear-gradient(180deg, #2c2c35, #24242c);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09), 0 3px 0 #131318;
}
.th2 .chip.on { color: #fff; background: linear-gradient(180deg, #5c9dff, #2f6bff); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 3px 0 #1b3eaa; }

.th2 .seg { border-radius: 16px; background: #131318; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); }
.th2 .seg button { border-radius: 12px; }
.th2 .seg button.on { background: linear-gradient(180deg, #34343e, #2a2a33); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13), 0 6px 14px -8px #000; }
.th2 .field { background: #131318; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07); }

.th2 .catnav button { background: #18181e; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07); }
.th2 .catnav button.on { background: linear-gradient(180deg, #5c9dff, #2f6bff); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 3px 0 #1b3eaa; }

/* карточки кейсов: нейтральный корпус, цвет темы кейса остаётся в свечении */
.th2 .case {
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(255, 255, 255, .06), transparent 62%),
    radial-gradient(95% 78% at 50% 34%, var(--c2, #2b1260), transparent 80%),
    linear-gradient(180deg, #1b1b22 0%, #141419 100%);
}

/* баннер-карусель: яркие слайды, как карточки игр */
.th2 .hero { border-radius: 26px; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .18), 0 20px 34px -24px #000; }
.th2 .hero__slide--rtp { --hbg: radial-gradient(70% 100% at 84% 60%, rgba(255, 255, 255, .28), transparent 62%), linear-gradient(160deg, #4b95ff 0%, #2b63f2 55%, #2140c8 100%); }
.th2 .hero__slide--upgrade { --hbg: radial-gradient(70% 100% at 84% 60%, rgba(255, 255, 255, .26), transparent 62%), linear-gradient(160deg, #7cf26e 0%, #3fd34c 52%, #1ca53b 100%); }
.th2 .hero__slide--contract { --hbg: radial-gradient(70% 100% at 84% 60%, rgba(255, 255, 255, .26), transparent 62%), linear-gradient(160deg, #ff4a3d 0%, #ff5f2b 55%, #ff8d1e 100%); }
.th2 .hero__slide--ref { --hbg: radial-gradient(70% 100% at 84% 60%, rgba(255, 255, 255, .26), transparent 62%), linear-gradient(160deg, #ff7cf6 0%, #dc3fe2 55%, #9b25cb 100%); }
.th2 .hero__slide--derby { --hbg: radial-gradient(70% 100% at 84% 60%, rgba(255, 255, 255, .26), transparent 62%), linear-gradient(160deg, #b67bff 0%, #7a3cf0 55%, #5521c8 100%); }

/* нижняя панель */
.th2 .dock, .th2 .dock__me { background: rgba(18, 18, 23, .88); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), inset 0 0 0 1px rgba(255, 255, 255, .06), 0 16px 34px -14px #000; }
.th2 .dock { border-radius: 26px; }
.th2 .dock::before { border-radius: 20px; background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .06)); }
.th2 .dock__tab { color: #6c6c7b; }
.th2 .dock__tab.on { color: #fff; }
.th2 .dock__tab.on svg { color: #fff; filter: none; }
.th2 .dock__me.on { box-shadow: inset 0 0 0 2px #fff, 0 16px 34px -14px #000; }

/* прочее */
.th2 .sheet { background: #111116; }
.th2 .reveal { background: rgba(6, 6, 9, .88); }
.th2 .backline__btn { background: #18181e; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.th2 .ph {
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(61, 141, 255, .2), transparent 55%),
    linear-gradient(160deg, #1c1c24 0%, #15151b 60%, #111116 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09), 0 24px 40px -30px #000;
}

/* заголовки: Onest 800 вместо Dela Gothic (сгенерировано из app.css) */
.th2 .boot__mark,
.th2 .logo,
.th2 .h-display,
.th2 .h-section,
.th2 .hero__ttl,
.th2 .hero__neon b,
.th2 .cat-head h2,
.th2 .case__title,
.th2 .casehead__title,
.th2 .reveal__title,
.th2 .reveal__value,
.th2 .reveal__stamp,
.th2 .reveal__lost,
.th2 .wheel__chance,
.th2 .slot__sum,
.th2 .ctm__b em,
.th2 .pod b,
.th2 .card3__meta b,
.th2 .ct-panel__sum b,
.th2 .ct-stat b,
.th2 .invsum b,
.th2 .ph__name,
.th2 .ph__sum b,
.th2 .pwd__sum,
.th2 .rpromo__ttl,
.th2 .rhero__ttl,
.th2 .rearn__l b,
.th2 .rstats b,
.th2 .rtier__now b,
.th2 .rtier__step b,
.th2 .rsteps li::before,
.th2 .rempty b,
.th2 .dep-bonus > b,
.th2 .rake__ttl,
.th2 .chip3--face b,
.th2 .rake__bar-l b,
.th2 .fcr__ttl,
.th2 .sheet__title,
.th2 .empty b,
.th2 .dr-promo__txt b,
.th2 .dr-head b,
.th2 .dr-lane__info b,
.th2 .dr-fin__name span,
.th2 .dr-fin__sum,
.th2 .dr-sec__title,
.th2 .bw-strike,
.th2 .bw-king b,
.th2 .bw-king strong,
.th2 .bw-res__tag,
.th2 .bw-res__sum,
.th2 .gift__lvl,
.th2 .en-lvl,
.th2 .en-empty,
.th2 .en-pop,
.th2 .en-burn b,
.th2 .en-info b,
.th2 .en-max,
.th2 .en-pick__title,
.th2 .en-promo__art b,
.th2 .en-note b,
.th2 .br-win b,
.th2 .br-lose b,
.th2 .pb__title,
.th2 .isheet__name,
.th2 .ar-head b,
.th2 .ar-win__card h2 { font-weight: 800; letter-spacing: -.01em; }