/* ===========================================================
   Container rules.

   app.css is scoped to .tfs-root at build time, so nothing can
   reach the theme. What remains here is the box itself and the
   few layers that were written as position:fixed for a
   standalone page.
   =========================================================== */

.tfs-root {
	height: auto;                /* app.css inherits body's 100% */
	min-height: 0;
	position: relative;
	isolation: isolate;          /* keeps the z-index:-1 layers inside */
	overflow: hidden;            /* clips the decorative layers */
	contain: paint;              /* containing block for any fixed child */
	border-radius: 20px;
	margin: 28px 0;
}

/* page-wide layers become container-local */
.tfs-root .bg-canvas,
.tfs-root .aurora,
.tfs-root .grid-floor,
.tfs-root .scanline-global,
.tfs-root .floaters,
.tfs-root .confetti {
	position: absolute;
}

/* the pointer spotlight is viewport-based, so it has no meaning here */
.tfs-root .spotlight { display: none; }

/* the ticker flows at the end of the box rather than floating over the site */
.tfs-root .ticker {
	position: static;
	width: 100%;
	margin-top: 22px;
	border-radius: 0;
}

.tfs-root .app { min-height: 0; padding: 26px 16px 0; }
.tfs-root .stage { flex: 1 0 auto; }

/* the rewarded-ad overlay genuinely must cover the viewport */
.tfs-root .ad-overlay { position: fixed; z-index: 100000; }

@media (max-width: 640px) {
	.tfs-root { border-radius: 14px; margin: 18px 0; }
}