/**
 * AdSense Top Scroll — shell inspired by the behaviour of Clever Topscroll.
 *
 * Mobile only. The publisher-owned shell sits before the header, uses the full
 * browser width, reserves exactly 294px on eligible page views, pushes the
 * document down, and scrolls away with the page. It is never fixed/sticky.
 *
 * Google creative safety: the requested 300x250 box is never resized or covered
 * by publisher UI. The notice and close control share a 44px publisher rail
 * below the creative, never over it. No-fill keeps the same shell with house content,
 * so request, fill and terminal states cannot move the header.
 */

:root {
	--go-topscroll-base-height: 294px;
	--go-topscroll-rail-height: 44px;
	--go-topscroll-creative-height: 250px;
}

body.go-verge > .go-adsense-topscroll {
	position: relative;
	z-index: 5;
	box-sizing: border-box;
	inline-size: 100%;
	max-inline-size: 100%;
	block-size: 0;
	min-block-size: 0;
	margin: 0 !important;
	padding: 0;
	border: 0;
	background: #f3f4f5;
	line-height: 0;
	overflow: hidden;
	clip-path: inset(0);
	transition: block-size .5s ease, min-block-size .5s ease;
}

body.go-verge > .go-adsense-topscroll.is-ad-not-requested,
body.go-verge > .go-adsense-topscroll.is-ad-unfilled:not(.go-ad-slot--has-fallback),
body.go-verge > .go-adsense-topscroll.is-ad-failed:not(.go-ad-slot--has-fallback) {
	display: none !important;
	visibility: hidden !important;
	inline-size: 0 !important;
	block-size: 0 !important;
	min-block-size: 0 !important;
	max-block-size: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	overflow: hidden !important;
	pointer-events: none !important;
}

/*
 * Pre-paint reservation. Unlike the reference's late 30vh insertion, the exact
 * 294px contract exists before the request and before the first paint.
 * The reservation only exists when the early frequency/device gate predicts an
 * eligible Top Scroll page view (html.go-topscroll-reserve).
 */
html.go-topscroll-reserve body.go-verge > .go-adsense-topscroll.is-ad-not-requested:not([data-go-ad-reason^="gated-"]):not([data-go-ad-reason="device-ineligible"]):not([data-go-ad-reason="duplicate-slot"]),
html.go-topscroll-reserve body.go-verge > .go-adsense-topscroll.is-ad-preparing,
html.go-topscroll-reserve body.go-verge > .go-adsense-topscroll.is-ad-preparing[data-go-ad-near-viewport="1"] {
	display: grid !important;
	visibility: visible !important;
	grid-template-rows: var(--go-topscroll-creative-height) var(--go-topscroll-rail-height);
	grid-template-columns: 74px minmax(0, 1fr) 44px;
	inline-size: 100% !important;
	block-size: var(--go-topscroll-base-height) !important;
	min-block-size: var(--go-topscroll-base-height) !important;
	max-block-size: var(--go-topscroll-base-height) !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: #f3f4f5 !important;
	overflow: hidden !important;
	clip-path: inset(0);
	contain: none !important;
	pointer-events: none !important;
}

/* Measurable request state without an unconditional blank block. */
body.go-verge > .go-adsense-topscroll.is-ad-preparing,
body.go-verge > .go-adsense-topscroll.is-ad-preparing[data-go-ad-near-viewport="1"] {
	inline-size: 100% !important;
}

body.go-verge > .go-adsense-topscroll.is-ad-filled {
	display: grid !important;
	visibility: visible !important;
	grid-template-rows: var(--go-topscroll-creative-height) var(--go-topscroll-rail-height);
	grid-template-columns: 74px minmax(0, 1fr) 44px;
	align-items: stretch;
	justify-items: center;
	inline-size: 100% !important;
	block-size: var(--go-topscroll-base-height) !important;
	min-block-size: var(--go-topscroll-base-height) !important;
	max-block-size: var(--go-topscroll-base-height) !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: #f3f4f5 !important;
	overflow: hidden !important;
	clip-path: inset(0);
	contain: none !important;
	pointer-events: auto;
	transition: block-size .35s ease, min-block-size .35s ease;
}

/* No-fill/failure becomes house content inside the same immutable shell. */
body.go-verge > .go-adsense-topscroll.go-ad-slot--has-fallback.is-ad-unfilled,
body.go-verge > .go-adsense-topscroll.go-ad-slot--has-fallback.is-ad-failed {
	display: grid !important;
	visibility: visible !important;
	grid-template-rows: var(--go-topscroll-creative-height) var(--go-topscroll-rail-height);
	grid-template-columns: 74px minmax(0, 1fr) 44px;
	inline-size: 100% !important;
	block-size: var(--go-topscroll-base-height) !important;
	min-block-size: var(--go-topscroll-base-height) !important;
	max-block-size: var(--go-topscroll-base-height) !important;
	margin: 0 !important;
	padding: 0 !important;
	background: #15171c !important;
	overflow: hidden !important;
	pointer-events: auto !important;
}

/* Publisher rail below the ad: disclosure left, notice centre, close right. */
body.go-verge > .go-adsense-topscroll > .go-ad-slot__label {
	display: none;
}

body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__label,
html.go-topscroll-reserve body.go-verge > .go-adsense-topscroll.is-ad-preparing > .go-ad-slot__label,
html.go-topscroll-reserve body.go-verge > .go-adsense-topscroll.is-ad-not-requested:not([data-go-ad-reason^="gated-"]):not([data-go-ad-reason="device-ineligible"]) > .go-ad-slot__label {
	display: flex !important;
	visibility: visible;
	grid-row: 2;
	grid-column: 1;
	align-items: center;
	justify-self: stretch;
	box-sizing: border-box;
	inline-size: 100%;
	block-size: var(--go-topscroll-rail-height);
	margin: 0;
	padding: 0 0 0 max(10px, env(safe-area-inset-left, 0px));
	border: 0;
	color: #7c8088;
	background: #f3f4f5;
	font-family: inherit;
	font-size: 9px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: .04em;
	text-align: left;
	text-transform: none;
}

/* Keep the pre-fill disclosure geometrically present but visually silent. */
html.go-topscroll-reserve body.go-verge > .go-adsense-topscroll:not(.is-ad-filled) > .go-ad-slot__label {
	color: transparent;
}

body.go-verge > .go-adsense-topscroll > ins.go-ad-unit {
	grid-row: 1;
	grid-column: 1 / -1;
	align-self: center;
	justify-self: center;
	box-sizing: border-box;
	inline-size: 300px !important;
	min-inline-size: 300px !important;
	max-inline-size: 300px !important;
	block-size: var(--go-topscroll-creative-height) !important;
	min-block-size: var(--go-topscroll-creative-height) !important;
	max-block-size: var(--go-topscroll-creative-height) !important;
	margin: 0 auto;
	padding: 0;
}

/* Exact-size AdSense code: computed 300x250 before adsbygoogle reads the slot. */
html.go-topscroll-reserve body.go-verge > .go-adsense-topscroll:not(.is-ad-dismissed):not(.is-ad-unfilled):not(.is-ad-failed) > ins.go-ad-unit,
body.go-verge > .go-adsense-topscroll.is-ad-filled > ins.go-ad-unit {
	display: inline-block !important;
	inline-size: 300px !important;
	min-inline-size: 300px !important;
	max-inline-size: 300px !important;
	block-size: var(--go-topscroll-creative-height) !important;
	min-block-size: var(--go-topscroll-creative-height) !important;
	max-block-size: var(--go-topscroll-creative-height) !important;
}

/* Reader notice shares the bottom rail and never overlaps the creative. */
body.go-verge > .go-adsense-topscroll > .go-ad-slot__notice {
	display: none !important;
}

body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__notice {
	display: flex !important;
	visibility: visible;
	grid-row: 2;
	grid-column: 2;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	inline-size: 100%;
	block-size: var(--go-topscroll-rail-height);
	margin: 0;
	padding: 0 4px;
	background: #f3f4f5;
	color: #62666d;
	font-family: inherit;
	font-size: 10px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
}

body.go-verge > .go-adsense-topscroll.is-ad-filled:not(.is-ad-dismissed) > .go-ad-slot__dismiss {
	display: grid !important;
	place-items: center;
	position: absolute;
	z-index: 8;
	inset-block-start: var(--go-topscroll-creative-height);
	inset-inline-end: max(0px, env(safe-area-inset-right, 0px));
	inline-size: 44px;
	block-size: 44px;
	min-inline-size: 44px;
	min-block-size: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: #62666d;
	cursor: pointer;
}

body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__dismiss svg {
	inline-size: 17px;
	block-size: 17px;
}

body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__dismiss:hover,
body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__dismiss:focus-visible {
	background: rgba(0, 0, 0, .07);
	color: #111318;
	outline: 2px solid rgba(66, 26, 255, .35);
	outline-offset: 1px;
}

/* House content is visually and semantically separate from the ad surface. */
body.go-verge > .go-adsense-topscroll.is-ad-unfilled > ins.go-ad-unit,
body.go-verge > .go-adsense-topscroll.is-ad-failed > ins.go-ad-unit,
body.go-verge > .go-adsense-topscroll.is-ad-unfilled > .go-ad-slot__dismiss,
body.go-verge > .go-adsense-topscroll.is-ad-failed > .go-ad-slot__dismiss {
	display: none !important;
}

body.go-verge > .go-adsense-topscroll > .go-ad-slot__fallback--topscroll {
	display: none;
}

body.go-verge > .go-adsense-topscroll.is-ad-unfilled > .go-ad-slot__fallback--topscroll,
body.go-verge > .go-adsense-topscroll.is-ad-failed > .go-ad-slot__fallback--topscroll {
	display: grid !important;
	grid-row: 1 / 3;
	grid-column: 1 / -1;
	place-content: center;
	box-sizing: border-box;
	inline-size: 100%;
	max-inline-size: none;
	block-size: var(--go-topscroll-base-height);
	margin: 0;
	padding: 30px 24px;
	background: linear-gradient(145deg, #15171c 0%, #20232a 100%);
	color: #f5f7fa;
	font-family: inherit;
	line-height: 1.35;
	text-align: center;
}

body.go-verge > .go-adsense-topscroll .go-ad-slot__fallback--topscroll > .go-ad-slot__fallback-kicker {
	margin: 0 0 13px;
	color: #a9ff3f;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .14em;
	text-transform: uppercase;
}

body.go-verge > .go-adsense-topscroll .go-ad-slot__fallback--topscroll > .go-ad-slot__fallback-link {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
	box-sizing: border-box;
	min-inline-size: min(100%, 260px);
	padding: 20px;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: 8px;
	background: rgba(255, 255, 255, .04);
	color: #f5f7fa;
	text-decoration: none;
}

body.go-verge > .go-adsense-topscroll .go-ad-slot__fallback--topscroll .go-ad-slot__fallback-title {
	font-size: 1.18rem;
	font-weight: 750;
	line-height: 1.25;
	text-wrap: balance;
}

body.go-verge > .go-adsense-topscroll .go-ad-slot__fallback--topscroll .go-ad-slot__fallback-action {
	color: #a9ff3f;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .08em;
	text-transform: uppercase;
}

body.go-verge > .go-adsense-topscroll .go-ad-slot__fallback--topscroll > .go-ad-slot__fallback-link:hover,
body.go-verge > .go-adsense-topscroll .go-ad-slot__fallback--topscroll > .go-ad-slot__fallback-link:focus-visible {
	border-color: #a9ff3f;
	background: rgba(169, 255, 63, .08);
	outline: 2px solid #a9ff3f;
	outline-offset: 3px;
}

/*
 * Close behaviour: first animate the publisher shell to zero, then the runtime
 * adds data-go-topscroll-collapsed=1 and removes it from layout completely.
 */
body.go-verge > .go-adsense-topscroll.is-ad-filled.is-ad-dismissed {
	display: grid !important;
	visibility: hidden !important;
	block-size: 0 !important;
	min-block-size: 0 !important;
	max-block-size: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: hidden !important;
	pointer-events: none !important;
	transition: block-size .35s ease, min-block-size .35s ease, visibility 0s linear .35s;
}

body.go-verge > .go-adsense-topscroll[data-go-topscroll-collapsed="1"] {
	display: none !important;
	inline-size: 0 !important;
	block-size: 0 !important;
	min-block-size: 0 !important;
}

/* Header follows the pushed-down region with no synthetic gap. */
body.go-verge > .go-adsense-topscroll + .go-header,
body.go-verge > .go-adsense-topscroll + .go-header--editorial {
	margin-block-start: 0 !important;
}

/* Mobile-only contract. */
@media (min-width: 768px) {
	body.go-verge > .go-adsense-topscroll,
	body.go-verge > .go-adsense-topscroll.is-ad-filled,
	body.go-verge > .go-adsense-topscroll.is-ad-preparing,
	body.go-verge > .go-adsense-topscroll.is-ad-preparing[data-go-ad-near-viewport="1"] {
		display: none !important;
		visibility: hidden !important;
		inline-size: 0 !important;
		block-size: 0 !important;
		min-block-size: 0 !important;
		max-block-size: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		overflow: hidden !important;
		pointer-events: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.go-verge > .go-adsense-topscroll,
	body.go-verge > .go-adsense-topscroll.is-ad-filled,
	body.go-verge > .go-adsense-topscroll.is-ad-filled.is-ad-dismissed {
		transition: none !important;
	}
}

@media print {
	body.go-verge > .go-adsense-topscroll {
		display: none !important;
	}
}
