/* Shared Infin8 backing for Arcade shells and the customer portal.
   Size against the viewport, never the length of a leaderboard or form. */
body.infin8-surface {
  min-height: 100svh;
  isolation: isolate;
  background: var(--bg, #070910);
}
body.infin8-surface.i8-galaxy { background: var(--bg, #070910); }
body.infin8-surface::before {
  content: "";
  display: block;
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(7,9,16,.72), rgba(7,9,16,.86)),
    url("infin8-texture.webp") center / cover no-repeat;
  opacity: 1;
  mix-blend-mode: normal;
  animation: none;
}
/* The existing motion layer owns the only particle canvas. Play surfaces
   retain data-nebula-field="off" so the backdrop adds no game render loop. */
.infin8-surface > .nebula-canvas { z-index: 0; }
.infin8-surface > :is(main, footer) { position: relative; z-index: 1; }
.infin8-surface > :is(.arcade-header, .board-header, .site-header) {
  background: rgba(7,9,16,.98);
  backdrop-filter: none;
}
.infin8-surface :is(main, section, form)[id] { scroll-margin-top: 112px; }
@media (max-width: 860px) {
  .infin8-surface :is(main, section, form)[id] { scroll-margin-top: 210px; }
}
@media (prefers-reduced-transparency: reduce) {
  body.infin8-surface::before { opacity: .35; }
}
@media print {
  body.infin8-surface::before, .infin8-surface > .nebula-canvas { display: none; }
}
