/**
 * Manual AdSense top-scroll: ordinary content before the masthead, phones only.
 *
 * It is intentionally not fixed or sticky. An empty, capped or still-pending
 * request has zero height; a filled response opens to the creative's own height,
 * pushes the header down and then scrolls away with the document.
 *
 * A filled band is three stacked rows inside one wrapper — disclosure, creative,
 * reader note — plus a dismiss control positioned into the note's row. Both the
 * note and the control are publisher UI: they live outside the <ins>, they are
 * drawn in the site's own colours and typography so they can never be mistaken
 * for part of the creative, and neither one exists until AdSense has confirmed
 * an ad. Nothing here resizes, crops, moves or covers the creative itself.
 */

body.go-verge > .go-adsense-topscroll {
	position: relative;
	box-sizing: border-box;
	inline-size: 100%;
	max-inline-size: 100%;
	margin: 0 !important;
	padding: 0;
	border: 0;
	background: transparent;
	line-height: 0;
	/*
	 * `color-scheme: dark` was declared here and removed on 13/08/2026.
	 *
	 * It propagates into embedded documents that do not declare their own, which
	 * includes the ad frame: the theme was telling the creative what colour
	 * scheme to render in. The band's own dark surface is set with `background`
	 * below, which affects the box we own and nothing inside it.
	 */
}

body.go-verge > .go-adsense-topscroll.is-ad-not-requested,
body.go-verge > .go-adsense-topscroll.is-ad-unfilled,
body.go-verge > .go-adsense-topscroll.is-ad-failed {
	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;
}

/* Keep a measurable width for AdSense without exposing a blank band. */
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: block !important;
	visibility: hidden !important;
	inline-size: 100% !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;
	contain: none !important;
	pointer-events: none !important;
}

body.go-verge > .go-adsense-topscroll.is-ad-filled {
	display: grid !important;
	visibility: visible !important;
	grid-template-columns: minmax(0, 1fr);
	justify-items: center;
	inline-size: 100% !important;
	block-size: auto !important;
	min-block-size: 0 !important;
	max-block-size: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: var(--overdrive-canvas-dark, #0b0712) !important;
	overflow: visible !important;
	contain: none !important;
	pointer-events: auto;
}

/*
 * Dismissed, and it has to be spelled out here.
 *
 * The controller adds `is-ad-dismissed` but deliberately keeps `is-ad-filled` —
 * a confirmed creative stays confirmed for the page view. The component sheet
 * collapses a dismissed slot with `.go-ad-slot.is-ad-dismissed`, which is two
 * classes and loses to the three-class filled rule above even with !important on
 * both. Without this, tapping the close button would set every attribute
 * correctly and change nothing on screen.
 */
body.go-verge > .go-adsense-topscroll.is-ad-dismissed,
body.go-verge > .go-adsense-topscroll.is-ad-filled.is-ad-dismissed {
	display: none !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;
	background: transparent !important;
	overflow: hidden !important;
	pointer-events: none !important;
}

/*
 * Disclosure. The band used to carry none at all, which made it the only unit on
 * the site whose only disclosure was an aria-label — invisible to the reader who
 * can see it. It is deliberately quiet: 9px, muted, centred, so it reads as a
 * caption on the band rather than as a headline competing with the creative.
 */
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 {
	display: block;
	justify-self: stretch;
	inline-size: 100%;
	margin: 0;
	padding-block: 5px 3px;
	color: rgba(246, 247, 241, .42);
	font-family: inherit;
	font-size: 9px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: .18em;
	text-align: center;
	text-transform: uppercase;
}

/*
 * The <ins> gets a measurable width BEFORE the request and nothing after it.
 *
 * These declarations carried `!important` and an `iframe` rule sat under them
 * squaring off Google's frame. Both are gone as of 13/08/2026. AdSense writes
 * its own width and height onto this element once the auction answers, and an
 * `inline-size: 100% !important` overrides that answer for the rest of the page
 * view — the theme deciding how wide a creative it did not sell should be drawn.
 *
 * Width still needs to exist at request time or AdSense reads availableWidth=0
 * and burns the slot's one request. That is already guaranteed twice over
 * without touching the rendered box: the renderer prints
 * `style="display:block;width:100%;min-width:1px"` inline on the element, and
 * go-ads-component.css gives every non-fixed unit the same box. Neither is
 * `!important`, so the auction's answer wins the moment it arrives.
 */
body.go-verge > .go-adsense-topscroll > ins {
	margin: 0 auto;
	padding: 0;
}

/* =========================================================================
   Reader note

   The one unit on the site that moves the entire page down before the reader
   has read a word. Without an explanation the honest reading of that moment is
   "the article did not load", and the reader leaves — which costs far more than
   the impression is worth. So the band says, in the site's voice, what happened
   and where the article is.

   It exists only under a confirmed creative. There is no state in which a note
   explains an ad that is not there.
   ========================================================================= */

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

body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__notice {
	display: block;
	position: relative;
	justify-self: stretch;
	box-sizing: border-box;
	inline-size: 100%;
	/* The control lane on the right is reserved, so the copy never reflows. */
	padding-block: 12px 14px;
	padding-inline:
		calc(16px + env(safe-area-inset-left, 0px))
		calc(54px + env(safe-area-inset-right, 0px));
	border-block-start: 1px solid rgba(246, 247, 241, .12);
	/* One flat surface a shade above the canvas. No gradient, no tint, no glow. */
	background: #14101f;
	text-align: start;
}

/*
 * One solid brand rule along the bottom edge, doing two jobs: it closes the
 * advertising band, and it is the line the masthead then sits on. The first
 * version faded this to transparent, which read as an effect applied to the
 * block; a solid rule reads as the paper's own edge.
 */
body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__notice::after {
	content: '';
	position: absolute;
	inset-block-end: 0;
	inset-inline: 0;
	block-size: 2px;
	background: var(--overdrive-electric-lime, #d8ff38);
	pointer-events: none;
}

/*
 * Salutation, then message. A letter, not a component.
 *
 * The salutation carries the weight and the message sits quieter underneath it,
 * which is the hierarchy of every note a publication has ever printed to its
 * readers. The first version inverted it — an uppercase letter-spaced lime label
 * with a dot in front, over a heavier white line, plus a chevron that bounced
 * forever. Three ornaments and two competing emphases, which is what made it
 * read as generated rather than written. The copy is the design here: the site's
 * own type, sentence case, no tracking, no colour on the words. The only lime in
 * the block is the rule at the bottom.
 */
body.go-verge > .go-adsense-topscroll .go-ad-slot__notice-title {
	display: block;
	margin: 0 0 3px;
	color: var(--overdrive-soft-cloud, #f6f7f1);
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -.015em;
}

body.go-verge > .go-adsense-topscroll .go-ad-slot__notice-body {
	display: block;
	color: rgba(246, 247, 241, .70);
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0;
	/*
	 * Balanced, not pretty. `pretty` only protects the last line from becoming an
	 * orphan; this string breaks into two lines on every phone in use, and what
	 * it needs is for both of them to be roughly the same length.
	 */
	text-wrap: balance;
}

/* =========================================================================
   Dismiss control

   The shared component parks this button 56px ABOVE its wrapper, which is right
   for a unit in the middle of the page and impossible for this one: 56px above
   the first element of the document is off-screen. It moves into the note's
   right-hand lane instead — below the creative, never over it, never between
   the reader and the ad, with the lane's width reserved by the note's padding
   so revealing the control cannot shift a single character of the copy.

   It is also revealed on `is-ad-filled` rather than on `is-ad-dismiss-ready`.
   The 2.5s viewability handshake is there to stop a reader dismissing an ad
   before it was ever seen; at the very top of the document the ad is on screen
   at first paint, and a band the reader cannot close yet is exactly the kind of
   trap this control exists to prevent. AdSense counted the impression at
   render, so closing it afterwards costs nothing.
   ========================================================================= */

body.go-verge > .go-adsense-topscroll.is-ad-filled:not(.is-ad-dismissed) > .go-ad-slot__dismiss {
	display: grid;
	inset-block-start: auto;
	inset-block-end: 11px;
	inset-inline-end: max(10px, env(safe-area-inset-right, 0px));
	inline-size: 38px;
	block-size: 38px;
	min-inline-size: 38px;
	min-block-size: 38px;
	border: 1px solid rgba(246, 247, 241, .26);
	border-radius: 999px;
	background: rgba(246, 247, 241, .10);
	box-shadow: none;
	color: var(--overdrive-soft-cloud, #f6f7f1);
}

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 {
	border-color: var(--overdrive-electric-lime, #d8ff38);
	background: rgba(216, 255, 56, .16);
	color: var(--overdrive-electric-lime, #d8ff38);
}

/*
 * The visual control is 38px so it fits the note's lane, but the touch target is
 * not: this expands the tappable area to the 44px minimum without adding a pixel
 * to the layout. The extra area grows away from the creative — down and to the
 * right — so it can never overlap the ad.
 */
body.go-verge > .go-adsense-topscroll.is-ad-filled > .go-ad-slot__dismiss::before {
	content: '';
	position: absolute;
	inset: -3px -3px -6px -6px;
	border-radius: inherit;
}

/*
 * Header contract, unchanged and deliberately so.
 *
 * The note is the last ROW of the wrapper, not a sibling of it, which is the
 * whole reason it was built that way: the dismiss control has to be inside the
 * wrapper for the controller's `closest()` lookup to find its slot, and keeping
 * the note in there too means this adjacency — the rule that stops a gap opening
 * between the band and the masthead — still describes two adjacent elements.
 */
body.go-verge > .go-adsense-topscroll + .go-header,
body.go-verge > .go-adsense-topscroll + .go-header--editorial {
	margin-block-start: 0 !important;
}

/* =========================================================================
   Desktop

   Removed from the layout entirely above the phone breakpoint. The auction is
   already blocked there by `data-go-ad-mobile-only` in go-ads-controller.js and
   by the quota runtime's own viewport guard; this is the third and last line,
   and it is the one that guarantees no measurable box survives if either script
   fails to load.

   Same specificity as the state rules above and later in the file, because
   `body.go-verge > .go-adsense-topscroll.is-ad-filled` would otherwise outrank a
   plain `display: none` on the wrapper and re-open the band at 1280px.
   ========================================================================= */

@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;
	}
}

/*
 * There is no `prefers-reduced-motion` block here because there is no motion.
 * The note fades in from nothing and a chevron bounced under it until 13/08/2026;
 * both were removed with the rest of the ornament, which is a better answer to
 * the preference than honouring it.
 */

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