/* r336 ordered CSS; unchanged declarations. */
/* /assets/home-layout-r208.css */
/* Home only: viewport-height catalogue, wide desktop artwork, raised phone Messenger.
   No timers, event handlers, authentication, prices or game-page layout changes. */
/* r260: picture format selection must not introduce a layout box. The same
   intrinsic image dimensions and existing artwork crops remain authoritative. */
html body.home-page[data-ui-layout] .promo-inner > .promo-picture {display:contents!important}
/* r267: no Clear button; reclaim only its reserved space, not the icon padding. */
html body.home-page[data-ui-layout] #game-search-panel .search-input-row #game-search {
  padding-right:12px!important;
  border-top-right-radius:9px!important;border-bottom-right-radius:9px!important;
}
/* r265: document content stays in its final place on first paint, refresh and
   browser Back. This also neutralizes a restored, unfinished reveal marker.
   Card presses/light, ticker movement and Menu/account Glass are independent. */
html body.home-page[data-ui-layout][data-ui-layout][data-ui-layout] :is(.promo-inner,#game-search-panel) {
  animation:none!important;transform:none!important;translate:none!important;
  rotate:none!important;scale:none!important;opacity:1!important;
}
@media(max-width:1023px){
  html body.home-page[data-ui-layout] > main {
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:max-content minmax(0,1fr)!important;gap:16px!important;
    /* Reuse the existing height lock through keyboard opening AND dismissal. */
    height:calc(var(--ht-home-height,100dvh) - var(--ht-top-stack-height) - 24px - env(safe-area-inset-bottom,0px))!important;
    min-height:440px!important;max-height:none!important;
    margin:12px auto calc(12px + env(safe-area-inset-bottom,0px))!important;
    padding:0 12px!important;box-sizing:border-box!important;
  }
  html body.home-page[data-ui-layout] > main > .promo {margin:0 auto!important}
  html body.home-page[data-ui-layout] > main > .catalog {
    display:flex!important;flex-direction:column!important;min-height:0!important;
    height:100%!important;max-height:none!important;box-sizing:border-box!important;
  }
  html body.home-page[data-ui-layout] .catalog > .search-stage {flex:0 0 auto!important}
  html body.home-page[data-ui-layout] #catalog-scroll {
    flex:1 1 0!important;min-height:0!important;height:auto!important;max-height:none!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    /* Prevent the empty rubber-band gap seen when pulling past the first/last
       app row. Keep native list scrolling and horizontal navigation intact. */
    overscroll-behavior-y:none!important;
  }
  html body.home-page[data-ui-layout] #catalog-scroll .game > small {
    white-space:nowrap!important;flex-shrink:0!important;max-width:100%;box-sizing:border-box!important;
  }
  /* Keep the chosen raised position, without the obsolete lower Install-banner spacer.
     Only the visible label/icon take pointer hits; the transparent gap passes through. */
  html body.home-page[data-ui-layout] .home-overlay-dock {
    inset:auto 12px calc(64px + env(safe-area-inset-bottom,0px)) 12px!important;
    padding-bottom:0!important;pointer-events:none!important;
  }
  html body.home-page[data-ui-layout][data-ui-layout]:has(#catalog-scroll) .home-overlay-dock > .page-support {
    pointer-events:none!important;
  }
  html body.home-page[data-ui-layout] .home-overlay-dock > .page-support > :is(span,.ht-emoji) {
    pointer-events:auto!important;
  }
}
@media(max-width:350px){html body.home-page[data-ui-layout] > main {padding:0 10px!important}}
@media(min-width:1024px){
  html body.home-page[data-ui-layout] > main {
    margin:4px auto 12px!important;gap:4px!important;
  }
  html body.home-page[data-ui-layout] > main > .promo {
    width:100%!important;max-width:none!important;height:clamp(238px,25.5vw,300px)!important;
    padding:0!important;margin:0!important;justify-self:stretch!important;
  }
  html body.home-page[data-ui-layout] > main > .promo > .promo-inner {
    width:100%!important;max-width:none!important;height:100%!important;min-height:0!important;
    flex:1 1 auto!important;box-sizing:border-box!important;
  }
  html body.home-page[data-ui-layout] > main > .promo > .promo-inner > .brand-banner,
  html body.home-page[data-ui-layout] > main > .promo > .promo-inner > .promo-picture > .brand-banner {
    width:100%!important;height:100%!important;aspect-ratio:auto!important;
    object-fit:cover!important;object-position:center!important;
  }
}