/* Follow-up acceptance layer for the public site, 14.09.2026.
   Keep this layer after every route-specific legacy stylesheet. It owns the
   shared density, promo rail and CTA interaction contract without changing
   the browser viewport or applying a root transform. */
:root {
  --public-followup-density: .8;
  --public-followup-content: 1040px;
  --public-followup-shell: 1088px;
  --public-followup-promo-bg: #2f2e42;
  --public-followup-cta-ease: cubic-bezier(.2, .8, .2, 1);
}

.legacy-public .public-promo-benefits {
  position: relative;
  isolation: isolate;
  width: 100%;
  margin: 0;
  overflow: hidden;
  background: var(--public-followup-promo-bg);
}

.legacy-public .public-promo-benefits > .center-wrapper {
  position: relative;
  z-index: 1;
  width: min(var(--public-followup-content), calc(100% - 30px));
  max-width: var(--public-followup-content);
  margin: 0 auto;
}

.legacy-public .public-promo-benefits .game-benefits {
  position: relative;
  margin: 0;
  padding: 45px 0 5px;
  background: transparent;
}

.legacy-public .public-promo-benefits .game-benefits-item { margin-bottom: 45px; }
.legacy-public .public-promo-benefits .game-benefits-item__image span { height: 225px; }
.legacy-public .public-promo-benefits .game-benefits-item__title { font-size: 22px; }
.legacy-public .public-promo-benefits .legacy-benefits__grid { position: relative; z-index: 1; padding-top: 45px; }

.legacy-public .public-cta {
  transition: transform .2s var(--public-followup-cta-ease),
    box-shadow .2s var(--public-followup-cta-ease),
    filter .2s var(--public-followup-cta-ease);
}

.legacy-public .public-cta:hover:not(:disabled),
.legacy-public .public-cta:focus-visible {
  filter: brightness(1.04);
  transform: var(--public-cta-base-transform, translateX(0)) translateY(-2px);
}

.legacy-public .public-cta:hover:not(:disabled) { box-shadow: 0 7px 18px rgba(20, 18, 35, .18); }
.legacy-public .public-cta:focus-visible { outline: 3px solid var(--legacy-yellow, #fcea1c); outline-offset: 4px; }
.legacy-public .public-cta:active:not(:disabled) { filter: brightness(.97); transform: var(--public-cta-base-transform, translateX(0)) translateY(1px); }

.legacy-public .public-cta-surface .gifts-promo__btn,
.legacy-public .public-cta-surface .gifts-item__btn {
  transition: transform .2s var(--public-followup-cta-ease),
    box-shadow .2s var(--public-followup-cta-ease),
    filter .2s var(--public-followup-cta-ease);
}

.legacy-public .public-cta-surface .gifts-promo__btn:hover,
.legacy-public .public-cta-surface .gifts-promo__btn:focus-visible,
.legacy-public .public-cta-surface .gifts-item__btn:hover,
.legacy-public .public-cta-surface .gifts-item__btn:focus-visible {
  filter: brightness(1.04);
  transform: translateY(-2px);
}

.legacy-public .public-cta-surface .gifts-promo__btn:focus-visible,
.legacy-public .public-cta-surface .gifts-item__btn:focus-visible {
  outline: 3px solid var(--legacy-yellow, #fcea1c);
  outline-offset: 4px;
}

/* Every source form uses the same register-modal shell.  The legacy root
   created a stacking context below the fixed public header, so its fixed
   holder could receive the right geometry while still losing pointer events
   to the header.  Keep the whole modal context above the shell; the holder
   and box keep their existing internal order. */
.legacy-public .legacy-registration.register-modal {
  position: relative;
  z-index: 1000;
  isolation: isolate;
}

.legacy-public .legacy-registration.register-modal .register-modal__action {
  margin-top: 32px;
}

.legacy-public .legacy-registration.register-modal .register-modal__holder {
  z-index: 1001;
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
}

/* The description is a single introductory block in the purchase form.  The
   source modal's generic rules could leave it constrained by a field column
   on narrow WebKit layouts. */
.legacy-public .legacy-home-game-modal .register-modal__solo {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
}

/* Rasterise both wave edges on an integer-height layer.  This preserves the
   source SVG shapes while avoiding fractional WebKit seams at DPR changes;
   the bottom cover remains the page background rather than a white band. */
.legacy-public .homegames-item::before,
.legacy-public .homegames-item::after {
  height: 9px;
  background-repeat: repeat-x;
  background-size: auto 9px;
  backface-visibility: hidden;
  transform: translateZ(0);
}

.legacy-public .homegames-item::before { top: -1px; }

/* WebKit includes the feature-card shadow in scrollable overflow even when
   `overflow: hidden` clips it visually.  `clip` keeps the shadow and removes
   the false horizontal scroll surface from the ticket itself. */
.legacy-public .homegames-item {
  overflow: hidden;
  overflow: clip;
}

/* Keep the ticket rail and its controls as separate grid tracks.  The source
   41px circles were below the accessible target size and could intrude into a
   card when the available rail became narrow. */
.legacy-public.legacy-home-v1 .legacy-games-carousel {
  grid-template-columns: 48px minmax(0, 1fr) 48px 48px;
  gap: 12px;
}

.legacy-public.legacy-home-v1 .legacy-carousel__arrow {
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
}

@media screen and (min-width: 641px) and (max-width: 1010px) {
  .legacy-public.legacy-home-v1 .legacy-games-carousel {
    grid-template-columns: 48px minmax(0, 1fr) 48px;
  }

  .legacy-public.legacy-home-v1 .legacy-games-carousel > .legacy-carousel__arrow {
    display: block;
  }
}

@media (prefers-reduced-motion: reduce) {
  .legacy-public .legacy-registration.register-modal,
  .legacy-public .legacy-registration.register-modal .register-modal__holder {
    scroll-behavior: auto;
  }
}

/* Preserve the source h2 hierarchy before applying desktop density. The
   franchise adapter enlarged this one title along with unrelated displays. */
.legacy-public .legacy-franchise-source .callback__title {
  font-size: 32px;
  line-height: 36px;
}

/* The visible source controls stay compact; their pointer targets are 44px.
   Align the period pills so the taller search label cannot stretch them. */
.legacy-public .rating-top-left,
.legacy-public .rating-period { align-items: center; }
.legacy-public .rating-search {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
}
.legacy-public .rating-period__btn { position: relative; }
.legacy-public .rating-period__btn::before {
  position: absolute;
  inset-inline: 0;
  top: 50%;
  height: 100%;
  min-height: 44px;
  content: "";
  transform: translateY(-50%);
}

@media screen and (min-width: 1011px) {
  .legacy-public {
    --public-desktop-density: var(--public-followup-density);
    --public-desktop-content: var(--public-followup-content);
    --public-desktop-shell: var(--public-followup-shell);
  }
  .legacy-public .legacy-wrap,
  .legacy-public .center-wrapper { width: min(var(--public-followup-content), calc(100% - 48px)); }

  /* Source dimensions times one density token; do not scale the already
     compact 90% layer or the browser viewport a second time. */
  .legacy-home-v1 .legacy-promo {
    min-height: calc(796px * var(--public-followup-density));
    padding: calc(120px * var(--public-followup-density)) 0 calc(150px * var(--public-followup-density));
  }
  .legacy-home-v1 .legacy-promo__content {
    width: min(var(--public-followup-content), calc(100% - 48px));
    min-height: calc(526px * var(--public-followup-density));
  }
  .legacy-home-v1 .legacy-promo__mascot {
    flex-basis: calc(410px * var(--public-followup-density));
    margin-left: calc(100px * var(--public-followup-density));
    margin-right: calc(200px * var(--public-followup-density));
  }
  .legacy-home-v1 .legacy-promo__copy { padding-top: calc(120px * var(--public-followup-density)); }
  .legacy-home-v1 .legacy-promo__copy h1 {
    margin-bottom: calc(50px * var(--public-followup-density));
    font-size: calc(50px * var(--public-followup-density));
  }
  .legacy-home-v1 .legacy-promo__copy h1 span { font-size: calc(100px * var(--public-followup-density)); }
  .legacy-home-v1 .legacy-promo__copy p {
    margin-bottom: calc(60px * var(--public-followup-density));
    font-size: calc(24px * var(--public-followup-density));
  }
  .legacy-home-v1 .legacy-promo__actions.home-buttons .home-buttons__button {
    max-width: calc(190px * var(--public-followup-density));
    padding: calc(20px * var(--public-followup-density)) 0;
    font-size: calc(16px * var(--public-followup-density));
  }

  .legacy-public .legacy-inner__content {
    width: min(var(--public-followup-content), calc(100% - 48px));
    padding-top: clamp(27px, 4.5vw, 61px);
    padding-bottom: clamp(27px, 4.5vw, 61px);
  }

  .legacy-public .page-top,
  .legacy-public .legacy-inner__page-top {
    padding-top: calc(130px * var(--public-followup-density));
    padding-bottom: calc(100px * var(--public-followup-density));
  }
  .legacy-public .header-body { padding: calc(25px * var(--public-followup-density)) calc(30px * var(--public-followup-density)); }
  .legacy-public .header-menu ul li { margin-right: clamp(8px, calc((100vw - 1100px) / 18), 18px); }
  .legacy-public .header-menu ul li:last-child { margin-right: 0; }
  .legacy-public .header-menu ul li a,
  .legacy-public .header-address__city,
  .legacy-public .header-mail,
  .legacy-public .header-phone__number { font-size: calc(18px * var(--public-followup-density)); }
  .legacy-public .header-address__select,
  .legacy-public .header-phone__text { font-size: calc(14px * var(--public-followup-density)); }
  .legacy-public .page-top h1,
  .legacy-public .legacy-inner__page-top h1 {
    font-size: calc(40px * var(--public-followup-density));
    line-height: calc(45px * var(--public-followup-density));
  }
  .legacy-public .schelude-tabs__btn { height: calc(70px * var(--public-followup-density)); font-size: calc(22px * var(--public-followup-density)); }
  .legacy-public .schedule { padding-top: calc(80px * var(--public-followup-density)); padding-bottom: calc(80px * var(--public-followup-density)); }
  .legacy-public .schelude-top { padding-top: calc(50px * var(--public-followup-density)); padding-bottom: calc(50px * var(--public-followup-density)); }
  .legacy-public .gifts { padding-top: calc(75px * var(--public-followup-density)); padding-bottom: calc(80px * var(--public-followup-density)); }
  .legacy-public .legacy-franchise-source .callback__title {
    font-size: calc(32px * var(--public-followup-density));
    line-height: calc(36px * var(--public-followup-density));
  }
  .legacy-public:has(.legacy-certificates-source) .gifts-item__title {
    font-size: calc(28px * var(--public-followup-density));
    line-height: calc(32.2px * var(--public-followup-density));
  }
  .legacy-public .rating-period__btn {
    padding: calc(11px * var(--public-followup-density)) calc(25px * var(--public-followup-density));
    border-radius: calc(19px * var(--public-followup-density));
    font-size: calc(14px * var(--public-followup-density));
  }
  .legacy-public .rating-period__btn:first-child {
    border-radius: calc(19px * var(--public-followup-density)) 0 0 calc(19px * var(--public-followup-density));
  }
  .legacy-public .rating-period__btn:last-child {
    border-radius: 0 calc(19px * var(--public-followup-density)) calc(19px * var(--public-followup-density)) 0;
  }
  .legacy-public .rating-search__field {
    width: calc(260px * var(--public-followup-density));
    height: calc(38px * var(--public-followup-density));
    padding-inline: calc(20px * var(--public-followup-density));
    border-width: calc(1px * var(--public-followup-density));
    border-radius: calc(19px * var(--public-followup-density));
    font-size: calc(14px * var(--public-followup-density));
  }
  .legacy-public .homegames-body { padding-top: calc(90px * var(--public-followup-density)); }
  .legacy-public .homegames-row { gap: calc(30px * var(--public-followup-density)); }
  .legacy-public .public-promo-benefits .game-benefits { padding-top: calc(50px * var(--public-followup-density)); }
  .legacy-public .public-promo-benefits .game-benefits-item {
    padding-right: calc(30px * var(--public-followup-density));
    padding-left: calc(30px * var(--public-followup-density));
    margin-bottom: calc(50px * var(--public-followup-density));
  }
  .legacy-public .public-promo-benefits .game-benefits-item__image span { height: calc(250px * var(--public-followup-density)); }
  .legacy-public .public-promo-benefits .game-benefits-item__title { font-size: calc(24px * var(--public-followup-density)); }
  .legacy-public .public-promo-benefits .legacy-benefits__grid { padding-top: calc(50px * var(--public-followup-density)); }
}

/* The source switches the search input to a fluid width at 479px. Its new
   label must span that same row rather than shrink to the input's text size. */
@media (max-width: 479px) {
  .legacy-public .rating-search { width: 100%; }
}

@media (max-width: 760px) {
  .legacy-public .public-promo-benefits > .center-wrapper { width: min(100% - 24px, 620px); }
  .legacy-public .public-promo-benefits .game-benefits { padding-top: 32px; }
  .legacy-public .public-promo-benefits .legacy-benefits__grid { padding-top: 32px; }
}

@media (prefers-reduced-motion: reduce) {
  .legacy-public .public-cta,
  .legacy-public .public-cta-surface .gifts-promo__btn,
  .legacy-public .public-cta-surface .gifts-item__btn { transition: none; }
  .legacy-public .public-cta:hover:not(:disabled),
  .legacy-public .public-cta:focus-visible,
  .legacy-public .public-cta:active:not(:disabled) { transform: var(--public-cta-base-transform, none); }
  .legacy-public .public-cta-surface .gifts-promo__btn:hover,
  .legacy-public .public-cta-surface .gifts-promo__btn:focus-visible,
  .legacy-public .public-cta-surface .gifts-item__btn:hover,
  .legacy-public .public-cta-surface .gifts-item__btn:focus-visible { transform: none; }
}