@import url('/static/legacy-home-preview.css');
@import url('/static/legacy-home-game-detail.css');
@import url('/static/legacy-home-dialogs.css');
@import url('/static/legacy-home-lower.css');
@import url('/static/legacy-home-faq.css');
@import url('/static/legacy-home-sticky-header.css');
@import url('/static/legacy-home-mobile.css');
@import url('/static/legacy-home-infographics.css');
@import url('/static/legacy-home-corporate.css');
@import url('/static/legacy-home-questions-stream.css');
@import url('/static/legacy-home-footer.css');
@import url('/static/legacy-home-about.css');
@import url('/static/legacy-home-benefits.css');
@import url('/static/legacy-roboto.css');

/* Production `style.css` registers this exact file under the dashed LC
   alias.  Keep that source family here too: `Code Pro Black` is a different
   legacy alias and Chrome falls back to a light system face for the Cyrillic
   home headings when it is used in this cascade. */
@font-face { font-family: 'Code-Pro-Black-LC'; src: url('/static/site-fonts/Code-Pro-Black.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Myriad Pro'; src: url('/static/site-fonts/MyriadProRegular.woff') format('woff'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Myriad Pro'; src: url('/static/site-fonts/MyriadProSemiBold.woff') format('woff'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Myriad Pro'; src: url('/static/site-fonts/MyriadProBold.woff') format('woff'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'MyriadPro'; src: url('/static/site-fonts/MyriadProRegular.woff') format('woff'); font-weight: 400; font-display: swap; }

/* Production `style.css` sets the public body in Roboto.  Code Pro remains
   the display face, while the separately authored imported components keep
   their explicit legacy fonts where they have one. */
.legacy-home-v1 { overflow-x: clip; font-family: Roboto, Arial, sans-serif; }
.legacy-home-v1 #legacy-main { overflow-x: clip; }
/* The imported preview layer correctly clips the decorative hero artwork,
   but its unconditional overflow also cut off the legacy city-picker footer.
   While the picker is open, let the shared source panel overlap the next
   section exactly as it does on /home_games. */
.legacy-home-v1 .legacy-promo:has(#choose_city:not([hidden])) { overflow:visible; }
/* Legacy AOS never blocks the first rendered content.  The FastAPI port keeps
   every source block available even when IntersectionObserver is unavailable
   or delayed (for example in a slow mobile browser or visual audit capture). */
.legacy-home-v1 .legacy-reveal,
.legacy-home-v1 .legacy-reveal.is-visible { opacity: 1 !important; transform: none !important; transition: none !important; }
/* Local equivalent of the `aos.css` rules used by production `index.php`.
   Motion is opt-in only after the local controller is running, so a slow or
   scriptless browser never receives hidden page content. */
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos] {
  opacity: 0 !important;
  transition-property: opacity, transform !important;
  transition-duration: .4s !important;
  transition-delay: 0s !important;
  transition-timing-function: ease !important;
}
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos].is-visible {
  opacity: 1 !important;
  transform: none !important;
  transition-delay: var(--legacy-aos-delay, 0ms) !important;
}
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos-delay="50"] { --legacy-aos-delay: 50ms; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos-delay="100"] { --legacy-aos-delay: 100ms; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos-delay="200"] { --legacy-aos-delay: 200ms; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos-delay="300"] { --legacy-aos-delay: 300ms; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos-delay="400"] { --legacy-aos-delay: 400ms; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='fade-right'] { transform: translate3d(-100px, 0, 0) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='fade-left'] { transform: translate3d(100px, 0, 0) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='fade-up'] { transform: translate3d(0, 100px, 0) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='fade-up-right'] { transform: translate3d(-100px, 100px, 0) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='fade-up-left'] { transform: translate3d(100px, 100px, 0) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='fade-down-right'] { transform: translate3d(-100px, -100px, 0) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='fade-down-left'] { transform: translate3d(100px, -100px, 0) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='zoom-in'] { transform: scale(.6) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='zoom-in-up'] { transform: translate3d(0, 100px, 0) scale(.6) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='zoom-in-right'] { transform: translate3d(-100px, 0, 0) scale(.6) !important; }
html.legacy-motion-ready .legacy-home-v1 [data-legacy-aos='zoom-out-up'] { transform: translate3d(0, 100px, 0) scale(1.2) !important; }
/* The four-part diagram is a single legacy composition.  It must never be
   captured or exposed half-faded while a scroll observer is catching up;
   source AOS is decorative here, not a prerequisite for reading it. */
html.legacy-motion-ready .legacy-home-v1 .legacy-infographics .legacy-reveal,
html.legacy-motion-ready .legacy-home-v1 .legacy-infographics [data-legacy-aos] {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
.legacy-home-v1 .legacy-wrap { width: min(1200px, calc(100% - 30px)); }
.legacy-home-v1 .legacy-promo { min-height: 795px; padding: 120px 0 150px; }
.legacy-home-v1 .legacy-header { position: absolute; top: 0; left: 0; z-index: 2; display: block; width: 100%; max-width: none; padding: 0; }
.legacy-home-v1 .legacy-header { font-family: Roboto, Arial, sans-serif; }
.legacy-home-v1 .legacy-header__menu { display: flex; flex: none; align-items: flex-start; justify-content: space-between; gap: 20px; width: min(1360px, calc(100% - 30px)); margin: 0 auto; padding: 25px 30px; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.legacy-home-v1 .legacy-header__nav { display: flex; flex: none; align-items: flex-start; gap: 0; }
.legacy-home-v1 .legacy-header__nav > a { margin-right: 32px; color: #fff; font-size: 18px; font-weight: 400; line-height: 41px; white-space: nowrap; }
.legacy-home-v1 .legacy-header__nav > a.is-active { font-weight: 700; }
.legacy-home-v1 .legacy-menu-toggle { width: 29px; height: 41px; margin-right: 43px; padding: 0; background: url('/static/site-assets/legacy-icon-menu.svg') center / 29px 19px no-repeat; }
.legacy-home-v1 .legacy-menu-toggle span:not(.legacy-visually-hidden) { display: none; }
.legacy-home-v1 .legacy-header__details { display: flex; align-items: flex-start; gap: 0; }
.legacy-home-v1 .legacy-header__city { display: block; padding: 0 0 2px; border-bottom: 1px solid #fafafa; border-radius: 0; color: #fff; font-size: 18px; font-weight: 400; line-height: 1.2; text-align: left; }
.legacy-home-v1 .legacy-header__city > span:last-child { display: none; }
.legacy-home-v1 .legacy-city-picker { position: relative; }
.legacy-home-v1 .legacy-city-picker::before { position: absolute; top: 0; left: -30px; width: 16px; height: 23px; content: ''; background: url('/static/site-assets/legacy-icon-location.svg') center / contain no-repeat; }
.legacy-home-v1 .legacy-header__city::after { display: block; margin-top: 2px; color: rgba(255,255,255,.8); content: 'выбрать свой город'; font-size: 14px; font-weight: 400; }
.legacy-home-v1 .legacy-header__contacts { display: flex; align-items: flex-start; gap: 0; padding: 0; border: 0; color: #fff; text-align: left; }
.legacy-home-v1 .legacy-header__contacts > a:first-child { position: relative; display: inline-block; margin-left: 70px; color: #fff; font-size: 18px; font-weight: 400; line-height: 33px; text-decoration: none; }
.legacy-home-v1 .legacy-header__contacts > a:first-child::before { position: absolute; top: 10px; left: -30px; width: 21px; height: 14px; content: ''; background: url('/static/site-assets/legacy-icon-mail.svg') center / contain no-repeat; }
.legacy-home-v1 .legacy-header__contacts > a { font-size: 20px; }
.legacy-home-v1 .legacy-header__contacts > div { margin-left: 80px; }
.legacy-home-v1 .legacy-header__contacts .legacy-header__phone { position: relative; display: inline-block; margin: 0 0 5px; color: #fff; font-size: 20px; font-weight: 400; line-height: 1.2; }
.legacy-home-v1 .legacy-header__contacts .legacy-header__phone span { position: absolute; left: -40px; display: grid; width: 32px; height: 32px; margin: -2px 0 0; place-items: center; border-radius: 50%; color: #fff; background: #9bc322; font-size: 16px; }
.legacy-home-v1 .legacy-header__contacts .legacy-header__phone span>img{display:block;width:16px;height:19px}
.legacy-home-v1 .legacy-header__phone-note { display: block; color: rgba(255,255,255,.8); font-size: 14px; font-weight: 400; }
.legacy-home-v1 .legacy-promo__content { display: flex; align-items: flex-start; min-height: 525px; width: min(1200px, calc(100% - 30px)); }
.legacy-home-v1 .legacy-promo__mascot { flex: 0 0 410px; align-self: flex-start; margin: 0 200px 0 100px; }
.legacy-home-v1 .legacy-promo__mascot img { width: 100%; max-width: none; margin: 0; transform: none; }
.legacy-home-v1 .legacy-promo__copy { position: relative; flex: 0 1 auto; padding: 120px 0 0; text-align: center; }
.legacy-home-v1 .legacy-promo__copy h1 { max-width: none; margin: 0 0 50px; font-family: 'Code-Pro-Black-LC', sans-serif; font-size: 50px; font-weight: 400; letter-spacing: 0; line-height: 1.2; text-align: left; }
.legacy-home-v1 .legacy-promo__copy h1 span { padding-left: 70px; font-size: 100px; font-weight: 400; }
.legacy-home-v1 .legacy-promo__copy p { margin-bottom: 60px; padding-left: 20px; font-size: 24px; font-weight: 400; line-height: 1.15; }
.legacy-home-v1 .legacy-promo__actions.home-buttons { display: block; width: auto; margin: 0; }
.legacy-home-v1 .legacy-promo__actions.home-buttons .home-buttons__button { display: inline-flex; width: 100%; max-width: 190px; min-width: 0; justify-content: center; margin: 0 5px 1px; padding: 20px 0; border-radius: 28px; color: #18181f; background: #fcea1c; font-size: 16px; font-weight: 400; line-height: 18.4px; text-align: center; text-decoration: none; text-transform: uppercase; box-shadow: none; }
.legacy-home-v1 .legacy-promo__actions.home-buttons .home-buttons__button:hover { box-shadow: 0 0 6px #fcea1c; }
.legacy-home-v1 .legacy-promo__home-link { position: absolute; bottom: -50px; left: 50%; width: auto; margin: 0; font-size: 18px; font-weight: 400; white-space: nowrap; transform: translateX(-50%); }
.legacy-home-v1 .legacy-promo__socials { position: absolute; right: 0; bottom: -86px; left: 0; display: flex; width: max-content; margin: 0 auto; align-items: center; justify-content: center; gap: 9px; }
.legacy-home-v1 .legacy-promo__social { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(255,255,255,.72); border-radius: 50%; color: #fff; font-size: 9px; font-weight: 700; line-height: 1; text-decoration: none; transition: color .16s ease, background-color .16s ease, transform .16s ease; }
.legacy-home-v1 .legacy-promo__social .legacy-fa-brand { font-size: 16px; }
.legacy-home-v1 .legacy-promo__social:hover, .legacy-home-v1 .legacy-promo__social:focus-visible { color: #302509; background: var(--legacy-yellow); transform: translateY(-2px); outline: none; }
.legacy-home-v1 .legacy-types { padding: 0; }
.legacy-home-v1 .legacy-types h2 { margin: 0; padding: 21px 0; font-family: 'Code-Pro-Black-LC', sans-serif; font-size: 34px; font-weight: 400; }
.legacy-home-v1 .legacy-types__row { gap: 0; background: #2f2e42; }
.legacy-home-v1 .legacy-type { min-height: 140px; padding: 0; background: #2f2e42; cursor: pointer; }
.legacy-home-v1 .legacy-type--all { background: #3a3851; }
.legacy-home-v1 .legacy-type.is-active { background: #3a3851; }
.legacy-home-v1 .legacy-type__filter { position: absolute; inset: 0; display: grid; width: 100%; min-height: 100%; place-items: center; align-content: start; gap: 7px; padding: 20px 5px 44px; border: 0; color: #fff; background: transparent; font: inherit; text-align: center; cursor: pointer; }
.legacy-home-v1 .legacy-type img { width: auto; height: 60px; }
.legacy-home-v1 .legacy-type--all img { height: 100px; }
.legacy-home-v1 .legacy-type strong { font-size: .9em; font-weight: 400; }
/* Keep the control in the visual midpoint between the type label and the
   ticket rail.  It is lower than the former FastAPI position, but does not
   overlap the rail and clip its text. */
.legacy-home-v1 .legacy-type__more { position: absolute; bottom: 5px; left: 50%; min-width: 100px; padding: 7px 13px; border: 0; border-radius: 15px; color: #302509; background: var(--legacy-type, var(--legacy-yellow)); font: inherit; font-size: 10px; font-weight: 700; text-transform: uppercase; cursor: pointer; transform: translateX(-50%); }
.legacy-home-v1 .legacy-type__more:hover, .legacy-home-v1 .legacy-type__more:focus-visible { background: linear-gradient(90deg, var(--legacy-type, var(--legacy-yellow)), var(--legacy-type-secondary, var(--legacy-type, var(--legacy-yellow)))); outline: 2px solid #fff; outline-offset: 2px; }
.legacy-home-v1 .legacy-type__filter:focus-visible { outline: 3px solid var(--legacy-yellow); outline-offset: -4px; }
.legacy-home-v1 .legacy-ticket[hidden] { display: none !important; }
/* Slick's source track starts at the left edge.  Centring a short list
   moves even the current (selected) first ticket into the middle. */
.legacy-home-v1 .legacy-tickets { justify-content: flex-start; }
.legacy-home-v1 .legacy-carousel__arrow--placeholder { visibility: hidden; pointer-events: none; }
.legacy-home-v1 .legacy-skip-link { position: fixed; z-index: 50; top: 8px; left: 8px; width: auto; height: auto; padding: 9px 13px; clip: auto; clip-path: none; color: #302509; background: var(--legacy-yellow); transform: translateY(-160%); }
.legacy-home-v1 .legacy-skip-link:focus-visible { transform: translateY(0); }
.legacy-home-v1 .legacy-header a:focus-visible, .legacy-home-v1 .legacy-header button:focus-visible, .legacy-home-v1 .legacy-footer a:focus-visible { outline: 3px solid var(--legacy-yellow); outline-offset: 4px; }
.legacy-home-v1 .legacy-home-v1__media-fallback { position: static; display: grid; width: 72px; height: 72px; place-items: center; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; color: var(--legacy-yellow); font-size: 32px; }
.legacy-home-v1 .legacy-lower-gallery__track a.is-active { display: block; }
.legacy-home-v1 .legacy-lower-gallery__controls { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.legacy-home-v1 .legacy-lower-gallery__controls button { min-width: 44px; min-height: 44px; border: 1px solid currentColor; border-radius: 50%; color: inherit; background: transparent; font: inherit; cursor: pointer; }
.legacy-home-v1 .legacy-lower-gallery__controls button:disabled { opacity: .35; cursor: default; }
.legacy-home-v1 .legacy-lower-feature { border: 0; color: inherit; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.legacy-home-v1 .legacy-lower-feature:focus-visible, .legacy-home-v1 .legacy-lower-gallery__controls button:focus-visible { outline: 2px solid var(--legacy-yellow); outline-offset: 3px; }
.legacy-home-v1 .legacy-infographic-dialog { width: min(900px, calc(100vw - 20px)); max-height: calc(100vh - 40px); margin: 20px auto; padding: 0; border: 0; color: #2f2e42; background: transparent; }
.legacy-home-v1 .legacy-infographic-dialog::backdrop { background: rgba(47,46,66,.8); }
.legacy-home-v1 .legacy-infographic-dialog__box { position: relative; overflow: auto; max-height: inherit; padding: 30px; border: 0; background: #fff; }
.legacy-home-v1 .legacy-infographic-dialog__close { position: absolute; top: 15px; right: 15px; z-index: 3; display: grid; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; place-items: center; color: #8e8daf; background: #e7e7ee; font-size: 20px; cursor: pointer; }
.legacy-home-v1 .legacy-infographic-dialog h2 { margin: 0 38px 5px 0; color: #2f2e42; font-size: 22px; font-weight: 600; line-height: normal; text-transform: uppercase; }
.legacy-home-v1 .legacy-type-dialog { width: min(760px, calc(100% - 32px)); max-height: min(720px, calc(100vh - 32px)); padding: 0; border: 0; color: #5d5c75; background: transparent; }
.legacy-home-v1 .legacy-type-dialog::backdrop { background: rgba(20, 17, 30, .72); }
.legacy-home-v1 .legacy-type-dialog__box { position: relative; max-height: inherit; overflow: auto; padding: 42px 36px 36px; border: 3px solid var(--legacy-yellow); background: #fff; }
.legacy-home-v1 .legacy-type-dialog__close { position: absolute; top: 9px; right: 12px; width: 36px; height: 36px; border: 0; border-radius: 50%; color: #302f40; background: #f0eff5; font: inherit; font-size: 26px; cursor: pointer; }
.legacy-home-v1 .legacy-type-dialog h2 { margin: 0 35px 20px 0; color: #302f40; font-size: clamp(24px, 4vw, 38px); text-transform: uppercase; }
.legacy-home-v1 .legacy-type-dialog__tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 22px; }
.legacy-home-v1 .legacy-type-dialog__tabs button { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; min-width: 98px; min-height: 74px; padding: 8px; border: 0; color: #8e8daf; background: transparent; font: inherit; cursor: pointer; }
.legacy-home-v1 .legacy-type-dialog__tabs button[aria-selected="true"] { color: #e94e1b; background: #f6f6f9; }
.legacy-home-v1 .legacy-type-dialog__tabs img { width: auto; height: 36px; margin-bottom: 4px; object-fit: contain; }
.legacy-home-v1 .legacy-type-dialog [role="tabpanel"] { font-size: 18px; line-height: 1.45; text-align: center; }
.legacy-home-v1 .legacy-type-dialog [role="tabpanel"] ul { display: inline-block; max-width: 600px; padding: 0; text-align: left; list-style-position: inside; }
.legacy-home-v1 .legacy-home-v1__empty { padding: 30px; color: rgba(255,255,255,.72); text-align: center; }
.legacy-home-v1 iframe { max-width: 100%; }

/* Source `style.css` narrows `.center-wrapper` from 1360px to 1200px at
   1520px.  The home header is still a safe semantic port, so translate the
   source's 45px mail + 25px/40px phone spacing to its wrapper-free DOM. */
@media only screen and (max-width: 1520px) {
  .legacy-home-v1 .legacy-header__menu { width: min(1200px, calc(100% - 30px)); }
  .legacy-home-v1 .legacy-header__contacts > a:first-child { margin-left: 45px; }
  .legacy-home-v1 .legacy-header__contacts > div { margin-left: 65px; }
}

/* A 1366px desktop has the same amount of usable visual space as the source
   viewed at its customary 90% browser zoom.  Keep the source composition,
   but apply that compact scale in CSS so that the opening game types and all
   contact controls remain in the actual 100% viewport. */
@media screen and (min-width: 1011px) and (max-width: 1400px) {
  .legacy-home-v1 .legacy-header__menu { gap: 0; padding: 20px 15px; }
  .legacy-home-v1 .legacy-header__nav > a { margin-right: 16px; font-size: 16px; line-height: 33px; }
  .legacy-home-v1 .legacy-menu-toggle { height: 33px; margin-right: 25px; }
  .legacy-home-v1 .legacy-header__city { font-size: 17px; }
  .legacy-home-v1 .legacy-header__contacts > a:first-child { margin-left: 35px; font-size: 16px; line-height: 29px; }
  .legacy-home-v1 .legacy-header__contacts > div { margin-left: 35px; }
  .legacy-home-v1 .legacy-header__contacts .legacy-header__phone { font-size: 17px; }
  .legacy-home-v1 .legacy-header__contacts .legacy-header__phone span { left: -35px; width: 29px; height: 29px; }
  .legacy-home-v1 .legacy-header__phone-note { font-size: 12px; }
  .legacy-home-v1 .legacy-promo { min-height: 630px; padding: 90px 0 75px; }
  .legacy-home-v1 .legacy-promo__content { min-height: 465px; }
  .legacy-home-v1 .legacy-promo__mascot { flex-basis: 360px; margin: 0 150px 0 80px; }
  .legacy-home-v1 .legacy-promo__copy { padding-top: 80px; }
  .legacy-home-v1 .legacy-promo__copy h1 { margin-bottom: 40px; font-size: 45px; }
  .legacy-home-v1 .legacy-promo__copy h1 span { font-size: 90px; }
  .legacy-home-v1 .legacy-promo__copy p { margin-bottom: 35px; font-size: 22px; }
  .legacy-home-v1 .legacy-promo__actions.home-buttons .home-buttons__button { max-width: 175px; padding: 16px 0; }
  .legacy-home-v1 .legacy-promo__socials { bottom: -82px; }
}

/* `style.css` keeps the contact information in the desktop header until
   767px, but at 1010px its navigation has already become the fixed hamburger.
   Preserve those two independent source breakpoints instead of treating the
   768–1010px range as a scaled desktop header. */
@media screen and (min-width: 768px) and (max-width: 1010px) {
  .legacy-home-v1 .legacy-header__menu { width: calc(100% - 30px); padding: 15px 0; }
  .legacy-home-v1 .legacy-header__nav > a { display: none; }
  .legacy-home-v1 .legacy-menu-toggle { position: fixed; top: 5px; left: 10px; z-index: 402; width: 50px; height: 50px; margin: 0; background-size: 29px 19px; }
  .legacy-home-v1 .legacy-header__details { margin-left: auto; }
  .legacy-home-v1 .legacy-city-picker { padding-left: 30px; }
  .legacy-home-v1 .legacy-city-picker::before { left: 0; }
  .legacy-home-v1 .legacy-header__city { font-size: 16px; }
  .legacy-home-v1 .legacy-header__city::after { font-size: 12px; }
  .legacy-home-v1 .legacy-header__contacts > a:first-child { margin-left: 45px; font-size: 15px; }
  .legacy-home-v1 .legacy-header__contacts > div { margin-left: 25px; padding-left: 40px; }
  .legacy-home-v1 .legacy-header__contacts .legacy-header__phone { font-size: 16px !important; }
  .legacy-home-v1 .legacy-header__phone-note { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .legacy-home-v1 .legacy-reveal,
  .legacy-home-v1 [data-legacy-aos] { opacity: 1 !important; transform: none !important; transition: none !important; }
}

@media screen and (max-width: 1024px) {
  .legacy-home-v1 .legacy-wrap, .legacy-home-v1 .legacy-header__menu, .legacy-home-v1 .legacy-promo__content { width: min(980px, calc(100% - 30px)); }
  .legacy-home-v1 .legacy-promo { min-height: auto; padding: 15vw 0 13vw; }
  .legacy-home-v1 .legacy-promo__content { min-height: 0; }
  .legacy-home-v1 .legacy-promo__mascot { flex: 0 0 34vw; max-width: 34vw; margin: 0 50px 0 0; }
  .legacy-home-v1 .legacy-promo__copy { padding-top: 13vw; }
  .legacy-home-v1 .legacy-promo__copy h1 { margin-bottom: 3.5vw; font-size: 4vw; }
  .legacy-home-v1 .legacy-promo__copy h1 span { font-size: 9vw; }
  .legacy-home-v1 .legacy-promo__copy p { margin-bottom: 6vw; padding-left: 3vw; font-size: 2.2vw; line-height: 1.15; text-align: left; }
  /* Source `.promo-rightside` does not grow in this range, while
     `.home-buttons` stays a normal centred block with inline controls. */
  .legacy-home-v1 .legacy-promo__copy { flex: 0 1 auto; }
  .legacy-home-v1 .legacy-promo__actions.home-buttons { display: block; text-align: center; }
  .legacy-home-v1 .legacy-promo__actions a { max-width: 150px; padding: 15px 0; font-size: 14px; }
  .legacy-home-v1 .legacy-promo__actions.home-buttons .home-buttons__button { width: 150px; max-width: 150px; padding: 15px 0; font-size: 14px; }
}

@media screen and (max-width: 767px) {
  .legacy-home-v1 .legacy-wrap, .legacy-home-v1 .legacy-header__menu, .legacy-home-v1 .legacy-promo__content { width: calc(100% - 32px); }
  .legacy-home-v1 .legacy-header__menu { align-items: flex-start; padding: 15px 0; }
  .legacy-home-v1 .legacy-header__nav > a { display: none; }
  .legacy-home-v1 .legacy-menu-toggle { margin-right: 0; }
  .legacy-home-v1 .legacy-header__details { margin-left: auto; }
  .legacy-home-v1 .legacy-header__contacts { display: none; }
  .legacy-home-v1 .legacy-promo { padding-top: 110px; }
  .legacy-home-v1 .legacy-promo__content { display: block; padding-top: 0; }
  .legacy-home-v1 .legacy-promo__mascot { position: absolute; right: -36px; bottom: 0; width: 63vw; max-width: none; margin: 0; opacity: .38; }
  .legacy-home-v1 .legacy-promo__copy { padding: 36px 0 80px; }
  .legacy-home-v1 .legacy-promo__copy h1 { margin-bottom: 34px; padding-right: 0; font-size: 25px; text-align: center; }
  .legacy-home-v1 .legacy-promo__copy h1 span { padding-left: 125px; font-size: 45px; }
  .legacy-home-v1 .legacy-promo__copy p { margin-bottom: 28px; padding: 0; font-size: 14px; text-align: center; }
  .legacy-home-v1 .legacy-promo__actions.home-buttons { display: grid; width: 100%; gap: 10px; }
  .legacy-home-v1 .legacy-promo__actions.home-buttons .home-buttons__button { max-width: none; margin: 0; padding: 10px 0; font-size: 13px; }
  .legacy-home-v1 .legacy-promo__home-link { bottom: -30px; font-size: 13px; }
  .legacy-home-v1 .legacy-types h2 { padding: 20px 0; font-size: 27px; }
}

/* The runtime legacy header uses the original picker and scroll states. */
.legacy-home-v1 .legacy-promo__overlay { background-image: radial-gradient(circle at center, #b90901, #fb3509); opacity: .7; }
.legacy-home-v1 .legacy-city-picker__panel { top: 60px; right: -30px; width: 750px; min-width: 350px; min-height: 200px; padding: 0; overflow: hidden; border: 0; border-radius: 0; background: #fff; color: #2f2e42; box-shadow: 0 0 100px 50px rgba(0,0,0,.2); }
.legacy-home-v1 .legacy-city-picker__title { display: flex; align-items: center; justify-content: space-between; margin: 0; padding: 30px 30px 15px; color: #2f2e42; font-size: 24px; font-weight: 300; letter-spacing: 0; text-transform: none; }
.legacy-home-v1 .legacy-city-picker__title button { padding: 0; border: 0; color: #cac9d9; background: transparent; font: inherit; font-size: 24px; line-height: 1; cursor: pointer; }
.legacy-home-v1 .legacy-city-picker__content { padding: 30px 30px 0; overflow-y: auto; }
.legacy-home-v1 .legacy-city-picker__panel, .legacy-home-v1 .legacy-city-picker__title, .legacy-home-v1 .legacy-city-picker__content, .legacy-home-v1 .legacy-city-picker__columns, .legacy-home-v1 .legacy-city-picker__column, .legacy-home-v1 .legacy-city-picker__country, .legacy-home-v1 .legacy-city-picker__link, .legacy-home-v1 .legacy-city-picker__footer { text-align: left; }
.legacy-home-v1 .legacy-city-picker__columns { display: flex; flex-wrap: wrap; justify-content: flex-start; margin-top: -30px; }
.legacy-home-v1 .legacy-city-picker__column { flex: 1 1 33.3%; box-sizing: border-box; padding: 20px; }
.legacy-home-v1 .legacy-city-picker__column:first-child { padding-left: 0; }
.legacy-home-v1 .legacy-city-picker__column:last-child { padding-right: 0; }
.legacy-home-v1 .legacy-city-picker__country { margin-top: 15px; color: #acabc4; font-size: 18px; font-weight: 300; text-transform: uppercase; }
.legacy-home-v1 .legacy-city-picker__country:first-child { margin-top: 0; }
.legacy-home-v1 .legacy-city-picker__country::after { display: block; width: 50%; margin-top: 5px; border-bottom: 3px solid #fafafa; content: ''; }
.legacy-home-v1 .legacy-city-picker__link { display: block; padding: 4px 0; color: #2f2e42; font-size: 14px; font-weight: 400; line-height: 1.2; text-decoration: none; }
.legacy-home-v1 .legacy-city-picker__link { text-align: left; }
.legacy-home-v1 .legacy-city-picker__link:hover, .legacy-home-v1 .legacy-city-picker__link:focus-visible { background: transparent; color: #2f2e42; text-decoration: underline; outline: none; }
.legacy-home-v1 .legacy-city-picker__link.is-active { background: transparent; font-weight: 600; }
.legacy-home-v1 .legacy-city-picker__link[aria-current="location"] { font-weight: 600; }
.legacy-home-v1 .legacy-city-picker__link span { display: none; }
.legacy-home-v1 .legacy-ticket__aside span { transform: rotate(180deg); }
.legacy-home-v1 .legacy-game-detail__secondary-actions > a { display: inline-flex; align-items: center; gap: 10px; padding: 0; color: #5a587e; background: transparent; font-size: 0; text-transform: none; }
.legacy-home-v1 .legacy-game-detail__secondary-actions > a::before { display: inline-grid; width: 40px; height: 40px; place-items: center; border-radius: 50%; background: #f0f0f0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a587e' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.8'%3E%3Ccircle cx='18' cy='5' r='2.5'/%3E%3Ccircle cx='6' cy='12' r='2.5'/%3E%3Ccircle cx='18' cy='19' r='2.5'/%3E%3Cpath d='m8.2 10.8 7.5-4.3M8.2 13.2l7.5 4.3'/%3E%3C/svg%3E") center / 18px no-repeat; content: ''; }
.legacy-home-v1 .legacy-game-detail__secondary-actions > a::after { display: inline-block; min-width: 122px; padding-left: 28px; color: #e53018; content: 'Поделиться игрой\Aможно тут'; font-size: 12px; font-weight: 700; line-height: 1.2; text-align: left; text-transform: uppercase; white-space: pre; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 24' fill='none' stroke='%23e53018' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.4'%3E%3Cpath d='M24 12H4m8-8-8 8 8 8'/%3E%3C/svg%3E") left center / 24px auto no-repeat; }
.legacy-home-v1 .legacy-city-picker__footer { display: flex; align-items: center; justify-content: space-between; margin: 0; padding: 30px; border: 0; color: #71707d; background: #fafafa; font-size: 20px; }
.legacy-home-v1 .legacy-city-picker__footer a { display: inline-block; padding: 10px 20px; border-radius: 20px; color: #302509; background: #fcea1c; font-size: 20px; font-weight: 600; text-decoration: none; text-transform: uppercase; }
.legacy-home-v1 .legacy-types__schedule-mobile { display: none; }

/* `style.css` keeps `.games-list-wrap` as a single flex rail through the
   1024px source breakpoint.  The schedule CTA moves above the carousel in
   that same range; it is not a <=767px-only mobile feature. */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .legacy-home-v1 .legacy-types__row { display: flex; justify-content: flex-start; overflow: visible; }
  .legacy-home-v1 .legacy-type { min-width: 90px; flex: 1 1 90px; }
  .legacy-home-v1 .legacy-types__schedule-mobile { display: block; margin: 0; padding: 21px 0 18px; color: var(--legacy-yellow); font-size: 14px; font-weight: 600; text-align: center; text-decoration: none; text-transform: uppercase; }
  .legacy-home-v1 .legacy-types__schedule-mobile span { margin-left: 5px; font-size: 18px; }
  .legacy-home-v1 .legacy-tickets__schedule { display: none; }
  .legacy-home-v1 .legacy-afisha { padding-top: 20px; }
}

/* Slick switches to two source slides below 920px.  Its single current
   ticket is consequently half of the centred list, not the 300px desktop
   card left over from the native carousel grid. */
@media screen and (min-width: 768px) and (max-width: 919px) {
  .legacy-home-v1 .legacy-games-carousel { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .legacy-home-v1 .legacy-games-carousel > .legacy-carousel__arrow { display: none; }
  .legacy-home-v1 .legacy-ticket { flex: 0 0 50%; max-width: 50%; }
}

@media only screen and (min-width: 1011px) {
  .legacy-home-v1 .legacy-header.is-sticky { position: fixed; top: 0; left: 0; width: 100%; padding: 0; transform: translateY(0); background: #201f2d; z-index: 401; animation: legacy-home-v1-header-show .22s ease-out; }
  .legacy-home-v1 .legacy-header.is-sticky .legacy-header__menu { padding-top: 15px; padding-bottom: 15px; background: transparent; box-shadow: none; }
}

@keyframes legacy-home-v1-header-show {
  from { opacity: 0; transform: translateY(-12px); }
  to { opacity: 1; transform: translateY(0); }
}

@media screen and (max-width: 1010px) {
  .legacy-home-v1 .legacy-city-picker__panel { right: 0; width: 94%; min-width: 0; margin: 0; }
}

@media screen and (max-width: 767px) {
  /* The fixed city sheet belongs to the header stacking context.  Keep that
     context above the type rail, otherwise the last viewport rows leak
     through the open sheet despite the panel itself having a z-index. */
  .legacy-home-v1 .legacy-header { z-index: 403; }
  .legacy-home-v1 .legacy-header__menu { position: relative; display: flex; justify-content: flex-end; width: 100%; padding: 5px 15px; }
  .legacy-home-v1 .legacy-header__nav { flex: 0 0 auto; }
  .legacy-home-v1 .legacy-menu-toggle { position: fixed; top: 5px; left: 5px; z-index: 402; width: 50px; height: 50px; margin: 0; background-size: 29px 19px; }
  .legacy-home-v1 .legacy-header.is-sticky .legacy-menu-toggle { background-color: #201f2d; }
  .legacy-home-v1 .legacy-header__details { flex: 0 0 auto; margin-left: auto; }
  .legacy-home-v1 .legacy-city-picker::before { left: -30px; }
  .legacy-home-v1 .legacy-header__city { padding-right: 42px; font-size: 17px; }
  .legacy-home-v1 .legacy-header__contacts { display: block; margin-left: 40px; }
  .legacy-home-v1 .legacy-header__contacts > a:first-child { display: none; }
  .legacy-home-v1 .legacy-header__contacts > div { margin-left: 0; }
  .legacy-home-v1 .legacy-header__contacts .legacy-header__phone { display: inline-block; width: auto; height: auto; margin: 0 0 2px; overflow: visible; font-size: 18px; white-space: nowrap; }
  .legacy-home-v1 .legacy-header__contacts .legacy-header__phone span { position: absolute; left: -37px; width: 28px; height: 28px; margin: -1px 0 0; font-size: 16px; }
  .legacy-home-v1 .legacy-header__phone-note { display: block; font-size: 11px; white-space: nowrap; }
  /* Source `style.css`: the <=767px rule changes only padding-top, so the
     preceding 1024px `13vw` bottom padding remains 65px at the 500px
     mobile viewport used by the legacy capture. */
  .legacy-home-v1 .legacy-promo { min-height: 0; padding: 110px 0 65px; }
  .legacy-home-v1 .legacy-promo__content { display: block; width: 100%; min-height: 0; padding: 0 15px; }
  .legacy-home-v1 .legacy-promo__mascot { position: static; width: 50%; max-width: 50%; margin: 0 auto; opacity: 1; }
  .legacy-home-v1 .legacy-promo__mascot img { width: 100%; margin: 0; transform: none; }
  .legacy-home-v1 .legacy-promo__copy { padding: 50px 0 0; }
  .legacy-home-v1 .legacy-promo__copy h1 { margin-bottom: 15px; padding-right: 0; font-size: 25px; line-height: 1.2; text-align: center; }
  .legacy-home-v1 .legacy-promo__copy h1 span { padding-left: 125px; font-size: 45px; }
  .legacy-home-v1 .legacy-promo__copy p { margin-bottom: 6vw; padding: 0; font-size: 14px; text-align: center; }
  .legacy-home-v1 .legacy-promo__actions.home-buttons { display: flex; width: auto; gap: 0; }
  .legacy-home-v1 .legacy-promo__actions.home-buttons .home-buttons__button { width: 150px; max-width: 150px; min-width: 0; margin: 0 5px; padding: 15px 0; font-size: 14px; font-weight: 400; }
  .legacy-home-v1 .legacy-promo__home-link { bottom: -34px; font-size: 13px; font-weight: 400; }
  .legacy-home-v1 .legacy-types { padding: 0; }
  .legacy-home-v1 .legacy-types h2 { padding: 20px 0; font-size: 40px; }
  .legacy-home-v1 .legacy-types__row { display: flex; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
  .legacy-home-v1 .legacy-types__row::-webkit-scrollbar { display: none; }
  .legacy-home-v1 .legacy-type { flex: 0 0 126px; min-height: 140px; padding: 20px 5px; }
  .legacy-home-v1 .legacy-type img { height: 60px; }
  .legacy-home-v1 .legacy-type--all img { height: 100px; }
  .legacy-home-v1 .legacy-type strong { font-size: .9em; font-weight: 400; }
  /* Source mobile breakpoint keeps the button just above the following rail. */
  .legacy-home-v1 .legacy-type__more { bottom: 0; }
  .legacy-home-v1 .legacy-types__schedule-mobile { display: block; margin: 0; padding: 21px 0 18px; color: var(--legacy-yellow); font-size: 14px; font-weight: 600; text-align: center; text-decoration: none; text-transform: uppercase; }
  .legacy-home-v1 .legacy-types__schedule-mobile span { margin-left: 5px; font-size: 18px; }
  .legacy-home-v1 .legacy-tickets__schedule { display: none; }
  .legacy-home-v1 .legacy-city-picker__panel { position: fixed; top: 0; right: 0; bottom: auto; left: 0; display: flex; width: 100%; height: 100vh; min-height: 100vh; max-height: 100vh; flex-direction: column; overflow: hidden; }
  /* The full-screen picker is flex only while it is open.  This explicit
     selector is needed because the mobile display declaration is more
     specific than the user-agent `[hidden] { display: none }` rule. */
  .legacy-home-v1 .legacy-city-picker__panel[hidden] { display: none; }
  .legacy-home-v1 .legacy-city-picker__panel { height: 100dvh; min-height: 100dvh; max-height: 100dvh; padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
  .legacy-home-v1 .legacy-city-picker__title { padding: 20px 15px 15px; color: #9290a5; font-size: 14px; font-weight: 700; text-transform: uppercase; }
  .legacy-home-v1 .legacy-city-picker__content { min-height: 0; flex: 1 1 auto; padding: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .legacy-home-v1 .legacy-city-picker__columns { display: block; margin: 0; }
  .legacy-home-v1 .legacy-city-picker__column { padding: 0; }
  .legacy-home-v1 .legacy-city-picker__column:empty { display: none; }
  .legacy-home-v1 .legacy-city-picker__country { margin: 0; padding: 15px; color: #9290a5; background: #fafafa; font-size: 14px; font-weight: 700; }
  .legacy-home-v1 .legacy-city-picker__country:first-child { margin: 0; }
  .legacy-home-v1 .legacy-city-picker__country::after { display: none; }
  .legacy-home-v1 .legacy-city-picker__link { padding: 15px 30px; border-bottom: 1px solid #f9f9f9; font-size: 16px; }
  .legacy-home-v1 .legacy-city-picker__link.is-active { background: transparent; }
  .legacy-home-v1 .legacy-city-picker__footer { display: block; flex: 0 0 auto; padding: 20px 15px; font-size: 16px; }
  .legacy-home-v1 .legacy-city-picker__footer a { margin-top: 12px; font-size: 16px; }
}

/* A 320px phone cannot accommodate the two-line city label, its pin and the
   call-to-action phone text side by side.  Keep both controls usable and
   source-shaped, but collapse the explanatory second line at this breakpoint
   instead of letting the city selector escape underneath the hamburger. */
@media screen and (max-width: 360px) {
  .legacy-home-v1 .legacy-header__city { padding-right: 0; font-size: 15px; }
  .legacy-home-v1 .legacy-header__city::after { display: none; }
  .legacy-home-v1 .legacy-city-picker::before { left: -20px; }
  .legacy-home-v1 .legacy-header__contacts { margin-left: 40px; }
}
