/* Demanacita v83 — global public rendering performance pass.
   Keep the arcade look while avoiding full-viewport repaints during scroll. */

/* Merge the city, side tint and scanlines into normal page backgrounds.
   The old ::before/::after fixed layers and fixed background forced large repaints on mobile. */
body[data-mode="public"],
body.language-gate-body{
  background-color:var(--arc-bg,#040515)!important;
  background-image:
    repeating-linear-gradient(to bottom,transparent 0 3px,rgba(0,0,0,.09) 3px 4px),
    linear-gradient(90deg,rgba(255,77,148,.04),transparent 28%,transparent 72%,rgba(37,230,221,.04)),
    linear-gradient(rgba(4,5,21,.18),rgba(4,5,21,.18)),
    url('/assets/retro-city-v33.svg')!important;
  background-size:100% 4px,100% 100%,cover,cover!important;
  background-position:0 0,center top,center top,center top!important;
  background-repeat:repeat,no-repeat,no-repeat,no-repeat!important;
  background-attachment:scroll,scroll,scroll,scroll!important;
}
body[data-mode="public"]::before,
body[data-mode="public"]::after,
body.language-gate-body::before,
body.language-gate-body::after{
  display:none!important;
  content:none!important;
}

/* Avoid keeping expensive compositor hints alive when nothing is moving. */
body.v74-mobile .hud-player,
body.v74-mobile .hud-score{
  will-change:auto!important;
}

/* Decorative title effects pause while the page is actively scrolling.
   The die keeps its idle motion during scroll and only pauses when the tab is hidden.
   Actual game animations and the rolling die are untouched. */
body.v83-is-scrolling .immersive-entry-copy h1,
body.v83-is-scrolling .immersive-entry-copy h1::before,
body.v83-page-hidden .immersive-entry-copy h1,
body.v83-page-hidden .immersive-entry-copy h1::before,
body.v83-page-hidden .arcade-die-stage:not(.is-rolling) .arcade-die-cube{
  animation-play-state:paused!important;
}

/* Sections that can become long can skip paint/layout work while off screen. */
@supports (content-visibility:auto){
  body[data-mode="public"] .privacy-card,
  body[data-mode="public"] #bookingPanel .v76-pref-group,
  body[data-mode="public"] #bookingPanel .v76-schedule-grid,
  body[data-mode="public"] .confirmation-card{
    content-visibility:auto;
    contain-intrinsic-size:auto 420px;
  }
}

/* Mobile/coarse pointers benefit most from removing live backdrop blur.
   Backgrounds are already almost opaque, so the visual difference is minimal. */
@media (max-width:820px), (pointer:coarse){
  .site-header,
  .v79-guide-backdrop,
  .v79-game-intro-backdrop{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }

  /* Keep the neon identity, but use smaller blur kernels on decorative glows. */
  .immersive-entry-copy h1::before{
    filter:blur(8px)!important;
  }
  .arcade-die-aura{
    filter:blur(7px)!important;
  }

  /* The fixed dock is a single compositor layer; avoid a large soft shadow repaint. */
  .arcade-dock{
    box-shadow:0 -4px 14px rgba(0,0,0,.22)!important;
  }

  /* Modal surfaces use solid translucency instead of live background sampling. */
  .v79-guide-backdrop{background:rgba(1,2,10,.82)!important}
  .v79-game-intro-backdrop{background:rgba(1,2,10,.84)!important}
}

@media (max-width:520px){
  /* On small phones, keep idle 3D dice motion but lower its compositor burden. */
  .arcade-die-cube{will-change:auto!important}
  .arcade-die-stage.is-rolling .arcade-die-cube{will-change:transform!important}
}

@media (prefers-reduced-motion:reduce){
  .immersive-entry-copy h1,
  .immersive-entry-copy h1::before,
  .arcade-die-stage:not(.is-rolling) .arcade-die-cube{
    animation:none!important;
  }
}
