/* ===========================================================================
 * HERO GAME HOST
 *
 * Positioning for the <canvas id="hero-game"> that lives inside
 * .header-hero. The canvas fills the hero slot as a backdrop; hero text
 * stacks above it with z-index. Split out from site-header.css so the
 * game's embed styling is a self-contained concern: swapping the hero
 * backdrop from the game to something else (static image, video, etc.)
 * would only touch this file.
 *
 * The canvas's own rendering is entirely JS-driven (see
 * brickbreaker/js/main.js mountGame); this CSS only positions and sizes
 * the element, which brickbreaker's ResizeObserver picks up to resize
 * its internal draw buffer.
 * ===========================================================================
 */

.hero-game {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  display: block;
  cursor: crosshair;
}

/* Game disabled — init-time (?noGame) or runtime (quality governor tier 0).
   Hero title text sits above at its own z-index and stays visible on the
   dark header background. */
body.no-game .hero-game {
  display: none;
}