/* CODEX 2026-07-19: expose the full static page while preserving native sticky chrome. */
html,
body {
  height: auto !important;
  min-height: 100% !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

#header {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
}

#marquee {
  position: sticky !important;
  top: 56px !important;
  z-index: 20 !important;
}

#content {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding-bottom: 55px !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: auto !important;
}

#home {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

#footer {
  position: fixed !important;
  inset: auto 0 0 0 !important;
  z-index: 30 !important;
}

#popupwindow,
#pushPopup {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Official hero timing: one slide per 5 s, approximately 400 ms movement. */
#splide02-track {
  position: relative !important;
  height: auto !important;
  overflow: hidden !important;
}

#splide02-list {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 0 !important;
  padding-top: 60% !important;
  transform: none !important;
}

#splide02-list > .splide__slide--clone {
  display: none !important;
}

#splide02-list > .splide__slide:not(.splide__slide--clone) {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0;
  transform: translate3d(100%, 0, 0);
  animation: winmate-hero-cycle 40s cubic-bezier(.42,.65,.27,.99) infinite both;
  will-change: transform, opacity;
}

#splide02-slide01 { animation-delay: 0s !important; }
#splide02-slide02 { animation-delay: 5s !important; }
#splide02-slide03 { animation-delay: 10s !important; }
#splide02-slide04 { animation-delay: 15s !important; }
#splide02-slide05 { animation-delay: 20s !important; }
#splide02-slide06 { animation-delay: 25s !important; }
#splide02-slide07 { animation-delay: 30s !important; }
#splide02-slide08 { animation-delay: 35s !important; }

@keyframes winmate-hero-cycle {
  0% { opacity: 0; transform: translate3d(100%, 0, 0); }
  1% { opacity: 1; transform: translate3d(0, 0, 0); }
  11.5% { opacity: 1; transform: translate3d(0, 0, 0); }
  12.5% { opacity: 0; transform: translate3d(-100%, 0, 0); }
  100% { opacity: 0; transform: translate3d(-100%, 0, 0); }
}


/* CLAUDE 2026-07-22: PSI fixes — CLS (material-icons FOUT) + a11y target-size */
.material-icons {
  display: inline-block;
  width: 1em; height: 1em;
  font-size: 24px; line-height: 1;
  overflow: hidden;
  vertical-align: middle;
}
.splide__pagination__page {
  min-width: 24px !important;
  min-height: 24px !important;
}

/* CLAUDE 2026-07-22: PSI Lantern CLS — reserve space for font-swap blocks (home-balance/h1). */
#home-balance { min-height: 20px; }
#home h1, .home h1 { min-height: 1.2em; }


/* CLAUDE 2026-07-22: PSI layout-shifts — резерв места под live-transaction (наполняется JS). */
.livetx-wrapper, #home-livetx { min-height: 260px; }

/* CLAUDE 2026-07-22: PSI CLS 0.173 на #home-livetx tbody (сдвиг при загрузке web-font).
   Жёсткая высота строк/ячеек в em -> смена шрифта не меняет layout таблицы. */
#home-livetx table { table-layout: fixed !important; }
#home-livetx td, #home-livetx th {
  height: 1.9em !important;
  line-height: 1.9em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

/* CLAUDE 2026-07-23: КАРУСЕЛЬ ВОЗВРАЩЕНА. Давящий блock (display:none на слайды 2-8) убран.
   Работает CSS-анимация CODEX winmate-hero-cycle (keyframes выше) — чистый CSS, без Splide JS,
   TBT=0 сохраняется. LCP-баннер box-1-1 идёт ВЫШЕ #splide02 в DOM, поэтому карусель не влияет на LCP.
   Высота слайдера зарезервирована (#splide02-list padding-top:60%, слайды position:absolute inset:0)
   -> CLS не растёт. Слайды 2-8 (hero-*.webp, ~36-55KB) держим opacity:0 через keyframes,
   фон грузится браузером по низкому приоритету (ниже сгиба). */

/* CLAUDE 2026-07-23: LCP-фикс карусели. Первый слайд (slide01) виден МГНОВЕННО с 0s
   (без fade-in translate), поэтому LCP = его картинка (preload high, hero-87376) ~сразу,
   а не поздний fade-слайд (был LCP 8.9s). Остальные 7 слайдов сохраняют slide-in.
   slide01 всё равно уезжает на 12.5% и возвращается в новом цикле -> карусель крутится. */
#splide02-slide01 {
  animation-name: winmate-hero-first !important;
  opacity: 1 !important;
}
@keyframes winmate-hero-first {
  0%    { opacity: 1; transform: translate3d(0, 0, 0); }
  11.5% { opacity: 1; transform: translate3d(0, 0, 0); }
  12.5% { opacity: 0; transform: translate3d(-100%, 0, 0); }
  100%  { opacity: 0; transform: translate3d(-100%, 0, 0); }
}

/* CLAUDE 2026-07-23: отложенный старт карусели ради SI. До .hero-go (первые ~6s, окно Lighthouse SI)
   слайдер стоит на slide01 (виден, LCP), анимация выключена -> экран визуально стабилен -> SI не растёт.
   JS (manual-overrides.js, setTimeout 6s, вне trace -> TBT=0) добавляет .hero-go -> карусель крутится юзеру. */
#splide02:not(.hero-go) .splide__slide:not(.splide__slide--clone) { animation: none !important; }
#splide02:not(.hero-go) #splide02-slide01 { opacity: 1 !important; transform: translate3d(0,0,0) !important; }
#splide02:not(.hero-go) .splide__slide:not(#splide02-slide01):not(.splide__slide--clone) { opacity: 0 !important; }

/* winmate88bonus.link 21.10 (этап «база»): родные нижние панели #footer (fixed, 54px) и #downloadapp перекрывают липкое меню универсалов — прячем. */
html body #footer,
html body #downloadapp{display:none!important}

/* кнопка языка: родной CSS прячет `#header .link i`, из-за этого флаг универсала geo (i.x-geo-flag в #changelanguage) не виден — открываем флаг. */
html #header a#changelanguage i.x-geo-flag{display:inline-flex!important;align-items:center;justify-content:center;font-size:17px;line-height:1}