/* =========================================================
   OLD ZOMBIE v16 — «вау»-слой для всех страниц
   Анимации появления, подсветка карточек, стеклянная шапка,
   красивые скроллбары и кнопки. Уважает prefers-reduced-motion.
   ========================================================= */

::selection { background: rgba(168, 85, 255, .45); color: #fff; }
* { scrollbar-width: thin; scrollbar-color: #3a2a5c transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: linear-gradient(#4a2f7a, #2c1d4a); border-radius: 10px; border: 2px solid var(--bg); }
::-webkit-scrollbar-track { background: transparent; }
:focus-visible { outline: 2px solid var(--violet-2); outline-offset: 2px; border-radius: 6px; }

/* Живой фон: медленно плывущие неоновые пятна */
body::before, body::after {
  content: ""; position: fixed; z-index: -1; width: 46vmax; height: 46vmax; border-radius: 50%;
  filter: blur(90px); opacity: .16; pointer-events: none; will-change: transform;
}
body::before { top: -18vmax; right: -12vmax; background: #7a2cff; animation: ozFloatA 26s ease-in-out infinite alternate; }
body::after { bottom: -20vmax; left: -14vmax; background: #c04bff; opacity: .1; animation: ozFloatB 32s ease-in-out infinite alternate; }
@keyframes ozFloatA { to { transform: translate(-8vmax, 10vmax) scale(1.15); } }
@keyframes ozFloatB { to { transform: translate(10vmax, -8vmax) scale(1.2); } }

/* Шапка становится «стеклянной» при прокрутке */
.topbar { transition: background .3s, box-shadow .3s, border-color .3s; }
body.is-scrolled .topbar { background: rgba(8, 11, 19, .78) !important; backdrop-filter: blur(16px) saturate(160%); -webkit-backdrop-filter: blur(16px) saturate(160%); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); border-bottom-color: rgba(168, 85, 255, .18) !important; }

/* Появление блоков при прокрутке */
.oz-reveal { opacity: 0; translate: 0 18px; transition: opacity .6s cubic-bezier(.2, .7, .2, 1) var(--rd, 0s), translate .6s cubic-bezier(.2, .7, .2, 1) var(--rd, 0s), transform .2s, border-color .2s, box-shadow .2s; }
.oz-reveal.in { opacity: 1; translate: 0 0; }

/* Подсветка под курсором для карточек и панелей */
.oz-glow { position: relative; isolation: isolate; }
.oz-glow::after {
  content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(168, 85, 255, .13), transparent 45%);
}
.oz-glow:hover::after { opacity: 1; }
.oz-glow > * { position: relative; z-index: 1; }

/* Панели: мягкая неоновая рамка при наведении */
.panel { transition: border-color .25s, box-shadow .25s, transform .25s; }
.panel:hover { border-color: rgba(168, 85, 255, .22); box-shadow: 0 18px 50px rgba(0, 0, 0, .28), 0 0 0 1px rgba(168, 85, 255, .06); }

/* Кнопки: блик, который проходит по кнопке */
.btn-neon, .btn-violet { position: relative; overflow: hidden; transition: transform .15s, box-shadow .25s, filter .2s; }
.btn-neon::after, .btn-violet::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .28), transparent); transform: skewX(-20deg); transition: left .6s ease;
  pointer-events: none;
}
.btn-neon:hover::after, .btn-violet:hover::after { left: 130%; }
.btn-neon:hover { box-shadow: 0 0 0 1px rgba(210, 150, 255, .4), 0 10px 30px rgba(140, 50, 255, .45); filter: brightness(1.06); }
.btn-neon:active, .btn-violet:active, .btn-ghost-oz:active { transform: scale(.97); }

/* Заголовки страниц с неоновой подчёркивающей линией */
.page-title h1, .top-head h1, .shop15-head h2 { position: relative; }
.page-title h1::after, .top-head h1::after {
  content: ""; display: block; width: 56px; height: 3px; margin-top: 10px; border-radius: 3px;
  background: var(--grad-violet); box-shadow: 0 0 14px rgba(168, 85, 255, .7);
}

/* Статистика: подъём и свечение */
.stat, .inv-card, .pod, .top-head-stats > div { transition: transform .2s, border-color .2s, box-shadow .2s; }
.stat:hover, .inv-card:hover, .top-head-stats > div:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(0, 0, 0, .3); }

/* Таблицы: плавная подсветка строк */
.oz-table tbody tr td { transition: background .2s; }
.oz-table tbody tr:hover td { background: rgba(139, 61, 255, .06) !important; }

/* Ссылки в меню: неоновый акцент */
.sb-sublink, .sb-link { transition: color .2s, background .2s, transform .2s; }
.sb-sublink:hover, .sb-link:hover { transform: translateX(3px); }

/* Уведомление-тост красивее */
.oz-toast { backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }

/* Кнопка «наверх» */
.oz-top-btn {
  position: fixed; right: 18px; bottom: 22px; z-index: 1020; display: grid; place-items: center; width: 46px; height: 46px;
  border-radius: 14px; border: 1px solid var(--line-violet); background: rgba(14, 18, 30, .85); color: #e2c6ff; font-size: 16px;
  backdrop-filter: blur(10px); box-shadow: 0 10px 30px rgba(0, 0, 0, .4); cursor: pointer;
  opacity: 0; transform: translateY(12px) scale(.9); pointer-events: none; transition: .25s;
}
.oz-top-btn.show { opacity: 1; transform: none; pointer-events: auto; }
.oz-top-btn:hover { color: #fff; border-color: var(--violet-2); box-shadow: 0 0 24px rgba(168, 85, 255, .45); }
@media (max-width: 767px) { .oz-top-btn { right: 14px; bottom: calc(92px + env(safe-area-inset-bottom)); width: 42px; height: 42px; } }

/* Бейджи товаров: лёгкая пульсация */
.pc-badge { animation: ozPulse 2.8s ease-in-out infinite; }
@keyframes ozPulse { 50% { box-shadow: 0 0 0 4px rgba(168, 85, 255, .12), var(--shadow-violet); } }

/* Первое место топа — корона светится */
.pod-1 .pod-medal { animation: ozGold 2.4s ease-in-out infinite; }
@keyframes ozGold { 50% { box-shadow: 0 0 22px rgba(255, 200, 70, .75); } }

@media (prefers-reduced-motion: reduce) {
  body::before, body::after, .pc-badge, .pod-1 .pod-medal { animation: none !important; }
  .oz-reveal { opacity: 1 !important; translate: none !important; }
}
