/**
 * Front-end earnings tool (shortcode / block). Tune for theme contrast on real pages.
 */
/* Do NOT set overflow-x: hidden on html here — WP `alignfull` uses negative margins / 100vw; hiding
 * overflow clips that breakout and cuts off the left edge of the page. */
html:has(.distrokid-ea-public--alignfull) {
	scrollbar-gutter: stable;
}
/*
 * Shell matches admin dashboard intent: .wrap.distrokid-ea-wrap { max-width: none; width: 100%; }
 * No fixed max-width here — theme column + body.distrokid-ea-public-page rules below supply width.
 */
.distrokid-ea-public {
	--distrokid-ea-pub-border: #dadce0;
	--distrokid-ea-pub-muted: #5f6368;
	--distrokid-ea-pub-text: #202124;
	--distrokid-ea-pub-bg: #fff;
	--distrokid-ea-pub-accent: #1a73e8;
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
	padding: 0 0.75rem 1rem;
	color: var(--distrokid-ea-pub-text);
	font-size: 0.9375rem;
	line-height: 1.5;
}

/* Like admin: body.distrokid-earnings-dashboard-page #wpbody-content { max-width: none; width: 100%; } */
body.distrokid-ea-public-page .entry-content,
body.distrokid-ea-public-page #primary .entry-content,
body.distrokid-ea-public-page .site-main .entry-content,
body.distrokid-ea-public-page .content-area .entry-content {
	max-width: none !important;
	width: 100% !important;
}

body.distrokid-ea-public-page .wp-block-post-content {
	max-width: none !important;
}

body.distrokid-ea-public-page main .wp-block-group__inner-container:has(.distrokid-ea-public),
body.distrokid-ea-public-page .wp-block-group__inner-container:has(.distrokid-ea-public) {
	max-width: none !important;
	width: 100% !important;
}

/**
 * “Alignfull” without vw margins: FSE themes add `has-global-padding` so `50%` in
 * `calc(50% - 50vw)` is based on the *padded* content width while vw is the full viewport — that
 * mismatch caused horizontal page scroll and lopsided edges. We strip horizontal padding on common
 * wrappers below, then fill that space at 100% with safe-area padding on the tool root only.
 */
.distrokid-ea-public.distrokid-ea-public--alignfull {
	position: relative;
	width: 100%;
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
	padding-left: max(1rem, env(safe-area-inset-left, 0px));
	padding-right: max(1rem, env(safe-area-inset-right, 0px));
	box-sizing: border-box;
	isolation: isolate;
}

/* Block themes (TT4/TT5): undo horizontal padding on wrappers that contain the tool */
.entry-content:has(.distrokid-ea-public--alignfull),
.wp-block-post-content:has(.distrokid-ea-public--alignfull),
.wp-block-group.alignfull:has(.distrokid-ea-public--alignfull) {
	padding-left: 0 !important;
	padding-right: 0 !important;
	padding-inline: 0 !important;
}

/*
 * Core / TT5: `.entry-content.alignfull` (and similar) get margin-left/right calc(50% - 50vw) and
 * width: 100vw to break out. That shifts the whole column left of the viewport; combining it with
 * html overflow-x hidden (removed above) or other rules looked like “content clipped on the left”.
 * Reset those breakout margins so the column stays in normal flow; the tool still uses full column width.
 */
.alignfull:has(.distrokid-ea-public--alignfull) {
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	left: auto !important;
	right: auto !important;
	transform: none !important;
}

/* Let the tool span the constrained column width (WP applies max-width to direct children). */
.entry-content:has(.distrokid-ea-public--alignfull) .distrokid-ea.distrokid-ea-public,
.wp-block-post-content:has(.distrokid-ea-public--alignfull) .distrokid-ea.distrokid-ea-public {
	max-width: none !important;
	width: 100% !important;
}

/* FSE / block: shortcode wrapper often sets max-width on the wrapper, not our root */
.wp-block-shortcode:has(.distrokid-ea-public--alignfull),
.wp-block-html:has(.distrokid-ea-public--alignfull) {
	max-width: none !important;
	width: 100%;
}

/* Allow horizontal overflow so the breakout is not clipped by the post column */
.entry-content:has(.distrokid-ea-public--alignfull),
.post-content:has(.distrokid-ea-public--alignfull),
.site-content:has(.distrokid-ea-public--alignfull),
article:has(.distrokid-ea-public--alignfull),
main:has(.distrokid-ea-public--alignfull) {
	overflow-x: visible;
}

/* Common group inner caps (Twenty Twenty–Twenty Five, etc.) */
.wp-block-group .wp-block-group__inner-container:has(.distrokid-ea-public--alignfull) {
	max-width: none !important;
	width: 100%;
}

/* Core block alignment (merged on dynamic block wrapper) */
.distrokid-ea-public.alignfull,
.wp-block-distrokid-earnings-analytics-earnings.alignfull {
	max-width: none !important;
	width: 100%;
}

.distrokid-ea-public *,
.distrokid-ea-public *::before,
.distrokid-ea-public *::after {
	box-sizing: border-box;
}

.distrokid-ea-public-box {
	background: var(--distrokid-ea-pub-bg);
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 8px;
	padding: 0.75rem 1rem;
	margin-bottom: 0.75rem;
}

/* Hero: empty state = narrow, centered; after data loads = full width of shell */
.distrokid-ea-public-hero {
	margin-bottom: 0.5rem;
}

.distrokid-ea-public-hero-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
}

.distrokid-ea-public:not(.distrokid-ea-public--has-data) .distrokid-ea-public-hero-inner .distrokid-ea-public-box {
	margin-bottom: 0;
}

/* Wide enough for upload + action buttons on one row when the viewport allows */
.distrokid-ea-public:not(.distrokid-ea-public--has-data) .distrokid-ea-public-privacy,
.distrokid-ea-public:not(.distrokid-ea-public--has-data) .distrokid-ea-public-toolbar {
	width: 100%;
	max-width: min(100%, 46rem);
}

.distrokid-ea-public:not(.distrokid-ea-public--has-data) .distrokid-ea-public-privacy p {
	text-align: center;
}

.distrokid-ea-public-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.75rem 1rem;
}

.distrokid-ea-public--has-data .distrokid-ea-public-hero-inner {
	align-items: stretch;
}

.distrokid-ea-public--has-data .distrokid-ea-public-privacy,
.distrokid-ea-public--has-data .distrokid-ea-public-toolbar {
	max-width: none;
}

/* Keep upload + action cluster visually grouped and centered (empty + with data). */
.distrokid-ea-public--has-data .distrokid-ea-public-toolbar {
	justify-content: center;
}

.distrokid-ea-public-upload {
	flex: 0 0 auto;
}

.distrokid-ea-public-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin: 0;
}

/* Prefer one row for the utility buttons; wrap only on small widths. */
@media (min-width: 36rem) {
	.distrokid-ea-public-actions {
		flex-wrap: nowrap;
	}
}

.distrokid-ea-public-actions .button[disabled] {
	opacity: 0.55;
	cursor: not-allowed;
}

.distrokid-ea-public-privacy p {
	margin: 0;
	font-size: 0.875rem;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-public-file-label {
	cursor: pointer;
	display: inline-block;
	margin: 0;
}

.distrokid-ea-public-file {
	position: absolute;
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	z-index: -1;
}

.distrokid-ea-public-file-btn {
	display: inline-block;
	padding: 0.5rem 1rem;
	background: var(--distrokid-ea-pub-accent);
	color: #fff;
	border-radius: 6px;
	font-weight: 500;
	font-size: 0.875rem;
}

.distrokid-ea-public-file-btn:hover {
	filter: brightness(1.05);
}

.distrokid-ea-public-msgs {
	margin: 0.5rem 0;
	font-size: 0.875rem;
}

.distrokid-ea-public-msg-warn {
	color: #b06000;
}

.distrokid-ea-public-msg-err {
	color: #c5221f;
}

.distrokid-ea-pub-explore-details {
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 8px;
	padding: 0.5rem 0.65rem;
	margin-bottom: 0.75rem;
	background: var(--distrokid-ea-pub-bg);
}

.distrokid-ea-pub-explore-summary {
	cursor: pointer;
	font-weight: 500;
	font-size: 0.9375rem;
}

.distrokid-ea-pub-explore-inner {
	padding-top: 0.35rem;
}

.distrokid-ea-pub-map-summary-wrap {
	margin-bottom: 0.75rem;
}

.distrokid-ea-pub-map-month-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	margin: 0.35rem 0 0.5rem;
	flex-wrap: wrap;
}

.distrokid-ea-pub-map-month-label {
	font-size: 0.875rem;
	font-weight: 500;
	min-width: 8rem;
	text-align: center;
}

.distrokid-ea-pub-map-month-prev,
.distrokid-ea-pub-map-month-next {
	min-width: 2.25rem;
}

.distrokid-ea-pub-plotly-inner--summary {
	min-height: 320px;
}

.distrokid-ea-pub-plotly-country-map--summary {
	min-height: 300px;
}

/*
 * 16 KPIs = 2×8 on wide viewports. Do not use auto-fill/minmax — themes often win specificity and
 * variable track counts produced 6+4 rows. Scoped to .distrokid-ea.distrokid-ea-public + !important
 * so generic theme grid rules cannot collapse this to six columns.
 */
.distrokid-ea.distrokid-ea-public .distrokid-ea-public-kpis {
	display: grid !important;
	grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
	grid-auto-flow: row !important;
	gap: 0.5rem;
	margin: 0 0 1rem;
}

@media (max-width: 900px) {
	.distrokid-ea.distrokid-ea-public .distrokid-ea-public-kpis {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 520px) {
	.distrokid-ea.distrokid-ea-public .distrokid-ea-public-kpis {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

.distrokid-ea-public-results:not([hidden]) .distrokid-ea.distrokid-ea-public .distrokid-ea-public-kpis {
	margin-top: 0.35rem;
}

.distrokid-ea-public-kpi {
	min-width: 0;
	background: var(--distrokid-ea-pub-bg);
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 8px;
	padding: 0.5rem 0.65rem;
}

.distrokid-ea-public-kpi-val {
	display: block;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.2;
}

.distrokid-ea-public-kpi-lbl {
	display: block;
	font-size: 0.75rem;
	color: var(--distrokid-ea-pub-muted);
	margin-top: 0.25rem;
}

/* Fixed 4-column chart rows on desktop (matches premade layout: 4-up, then map band, etc.). */
.distrokid-ea-pub-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
	margin-bottom: 0.75rem;
	align-items: stretch;
}

/* Full-width rows for treemaps (readable small tiles; not confined to one grid column). */
.distrokid-ea-pub-grid > .distrokid-ea-pub-card-wide {
	grid-column: 1 / -1;
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

/* One full-width row with exactly four column units (e.g. two 1-col + one 2-col) before full-width treemaps. */
.distrokid-ea-pub-grid > .distrokid-ea-pub-grid-quad-row {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
	align-items: stretch;
	min-width: 0;
}

.distrokid-ea-pub-grid-quad-row > .distrokid-ea-pub-card--span-2 {
	grid-column: span 2;
	min-width: 0;
}

.distrokid-ea-pub-grid--charts-map {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Tracks (1 col) + map (3 cols) after store share moved to premade quad row. */
.distrokid-ea-pub-grid--charts-map > .distrokid-ea-pub-map-card {
	grid-column: span 3;
}

.distrokid-ea-pub-map-card {
	min-width: 0;
}

.distrokid-ea-pub-map-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 0.5rem 1rem;
}

.distrokid-ea-pub-map-metric-wrap {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	font-size: 0.8125rem;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-pub-map-metric-wrap select {
	font-size: 0.875rem;
	min-width: 10rem;
}

.distrokid-ea-pub-plotly-inner {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow: hidden;
}

.distrokid-ea-pub-plotly-country-map {
	width: 100%;
	max-width: 100%;
	min-height: 280px;
}

@media (max-width: 900px) {
	.distrokid-ea-pub-grid:not(.distrokid-ea-pub-grid--charts-map) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.distrokid-ea-pub-grid--charts-map {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.distrokid-ea-pub-grid--charts-map > .distrokid-ea-pub-map-card {
		grid-column: span 2;
	}

	.distrokid-ea-pub-grid-quad-row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.distrokid-ea-pub-grid-quad-row > .distrokid-ea-pub-card--span-2 {
		grid-column: span 2;
	}
}

@media (max-width: 520px) {
	.distrokid-ea-pub-grid:not(.distrokid-ea-pub-grid--charts-map) {
		grid-template-columns: 1fr;
	}

	.distrokid-ea-pub-grid--charts-map {
		grid-template-columns: 1fr;
	}

	.distrokid-ea-pub-grid--charts-map > .distrokid-ea-pub-map-card {
		grid-column: span 1;
	}

	.distrokid-ea-pub-grid-quad-row {
		grid-template-columns: 1fr;
	}

	.distrokid-ea-pub-grid-quad-row > .distrokid-ea-pub-card--span-2 {
		grid-column: span 1;
	}
}

.distrokid-ea-pub-card {
	background: var(--distrokid-ea-pub-bg);
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 8px;
	padding: 0.5rem 0.65rem;
	margin-bottom: 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.distrokid-ea-public-charts {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.distrokid-ea-pub-card-wide {
	width: 100%;
	margin-bottom: 0;
}

/* Premade chart ↔ scrollable data table (fixed card height; no layout jump) */
.distrokid-ea-public .screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.distrokid-ea-pub-card-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 0.35rem 0.75rem;
}

.distrokid-ea-pub-card-head .distrokid-ea-pub-title {
	margin-bottom: 0;
	flex: 1;
	min-width: 8rem;
}

.distrokid-ea-pub-map-head .distrokid-ea-pub-viz-toggle {
	flex-shrink: 0;
	align-self: center;
}

.distrokid-ea-pub-viz-toggle {
	display: inline-flex;
	gap: 2px;
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 6px;
	padding: 2px;
	background: #f8f9fa;
}

.distrokid-ea-pub-viz-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	margin: 0;
	border: none;
	border-radius: 4px;
	background: transparent;
	color: var(--distrokid-ea-pub-muted);
	cursor: pointer;
	line-height: 0;
}

.distrokid-ea-pub-viz-btn:hover,
.distrokid-ea-pub-viz-btn:focus-visible {
	background: #e8eaed;
	color: var(--distrokid-ea-pub-text);
	outline: none;
}

.distrokid-ea-pub-viz-btn.is-active {
	background: var(--distrokid-ea-pub-bg);
	color: var(--distrokid-ea-pub-accent);
	box-shadow: 0 0 0 1px var(--distrokid-ea-pub-border);
}

.distrokid-ea-pub-viz-shell {
	position: relative;
	flex-shrink: 0;
	min-width: 0;
}

.distrokid-ea-pub-viz-pane--chart {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

/* Must not use display:flex by default — without [hidden] or this rule, the data layer
 * stacks above the chart (absolute + white bg) and hides all visuals. */
.distrokid-ea-pub-viz-pane--data {
	position: absolute;
	inset: 0;
	display: none !important;
	flex-direction: column;
	overflow-x: auto;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 0.25rem 0.35rem;
	background: var(--distrokid-ea-pub-bg);
}

.distrokid-ea-pub-viz-shell--show-data .distrokid-ea-pub-viz-pane--chart {
	display: none !important;
}

.distrokid-ea-pub-viz-shell--show-data .distrokid-ea-pub-viz-pane--data {
	display: flex !important;
}

.distrokid-ea-pub-viz-pane--chart > .distrokid-ea-pub-chart {
	flex: 1;
	min-height: 0;
}

.distrokid-ea-pub-viz-pane--chart > .distrokid-ea-pub-plotly-country-map {
	flex: 1;
	min-height: 0;
	width: 100%;
}

.distrokid-ea-pub-viz-shell--line {
	height: 300px;
	min-height: 300px;
}

.distrokid-ea-pub-viz-shell--hbar {
	height: clamp(260px, 38vmin, 420px);
	min-height: 260px;
}

.distrokid-ea-pub-viz-shell--hbar-tall {
	height: clamp(300px, 48vmin, 520px);
	min-height: 300px;
}

.distrokid-ea-pub-viz-shell--doughnut {
	height: 280px;
	min-height: 260px;
}

.distrokid-ea-pub-viz-shell--treemap {
	min-height: 360px;
	height: clamp(360px, 52vmin, 600px);
}

.distrokid-ea-pub-viz-shell--tall {
	height: 320px;
	min-height: 320px;
}

.distrokid-ea-pub-viz-shell--plotly-summary {
	min-height: 320px;
	height: clamp(320px, 42vmin, 520px);
}

.distrokid-ea-pub-viz-shell--plotly-monthly {
	min-height: 280px;
	height: clamp(280px, 36vmin, 420px);
}

.distrokid-ea-pub-scroll .distrokid-ea-pub-viz-shell--tall {
	min-height: 320px;
}

.distrokid-ea-pub-viz-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.8125rem;
}

.distrokid-ea-pub-viz-table th,
.distrokid-ea-pub-viz-table td {
	border: 1px solid var(--distrokid-ea-pub-border);
	padding: 0.3rem 0.45rem;
	text-align: left;
	vertical-align: top;
}

.distrokid-ea-pub-viz-table th {
	background: #f1f3f4;
	font-weight: 500;
	position: sticky;
	top: 0;
	z-index: 1;
}

.distrokid-ea-pub-viz-empty {
	margin: 0.5rem;
	font-size: 0.8125rem;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-pub-title {
	font-size: 0.9375rem;
	font-weight: 500;
	margin: 0 0 0.35rem;
}

.distrokid-ea-pub-chart {
	position: relative;
	flex: 1;
	min-width: 0;
}

.distrokid-ea-pub-chart--line {
	min-height: 300px;
	height: 300px;
}

.distrokid-ea-pub-chart--hbar {
	min-height: 280px;
	height: clamp(260px, 38vmin, 420px);
}

.distrokid-ea-pub-chart--hbar-tall {
	min-height: 340px;
	height: clamp(300px, 48vmin, 520px);
}

.distrokid-ea-pub-chart--doughnut {
	min-height: 260px;
	height: 280px;
}

.distrokid-ea-pub-chart-tall {
	height: 320px;
	min-height: 320px;
	min-width: min(100%, 720px);
}

.distrokid-ea-pub-chart-treemap {
	position: relative;
	flex: 1;
	min-height: 300px;
	width: 100%;
}

.distrokid-ea-pub-plotly-fallback {
	margin: 0.75rem 0;
	font-size: 0.8125rem;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-pub-explore-presets {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem 0.5rem;
	margin: 0.35rem 0 0.75rem;
	font-size: 0.8125rem;
}

.distrokid-ea-pub-explore-presets-lbl {
	font-weight: 500;
	color: var(--distrokid-ea-pub-muted);
	margin-right: 0.25rem;
}

.distrokid-ea-pub-explore-presets .button {
	font-size: 0.8125rem;
	padding: 0.2rem 0.5rem;
	min-height: 0;
	line-height: 1.35;
}

.distrokid-ea-pub-explore-controls {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.65rem 1rem;
	margin: 0.5rem 0 0.75rem;
}

.distrokid-ea-pub-explore-field {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	font-size: 0.8125rem;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-pub-explore-field select {
	min-width: 11rem;
	font-size: 0.875rem;
}

.distrokid-ea-pub-explore-field--check {
	flex-direction: row;
	align-items: center;
	gap: 0.35rem;
}

.distrokid-ea-pub-explore-field--check .distrokid-ea-pub-explore-lbl {
	margin: 0;
}

.distrokid-ea-pub-explore-field--num input.small-text {
	max-width: 8rem;
}

.distrokid-ea-pub-explore-field--adv select {
	min-width: 12rem;
}

.distrokid-ea-pub-explore-filters {
	margin: 0.25rem 0 0.75rem;
}

.distrokid-ea-pub-explore-filter-hint {
	margin: 0 0 0.35rem;
	font-size: 0.75rem;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-pub-explore-filters-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.65rem 1rem;
}

.distrokid-ea-pub-explore-filter-col {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	font-size: 0.8125rem;
	color: var(--distrokid-ea-pub-muted);
	min-width: 0;
}

.distrokid-ea-pub-explore-filter-col select {
	width: 100%;
	min-height: 8rem;
	font-size: 0.8125rem;
}

.distrokid-ea-pub-explore-view-row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.65rem 1rem;
	margin: 0.35rem 0 0.5rem;
}

.distrokid-ea-pub-explore-view-row > .distrokid-ea-pub-explore-lbl {
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--distrokid-ea-pub-muted);
	width: 100%;
	margin: 0;
}

.distrokid-ea-pub-explore-view-icons {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.15rem;
	padding: 0.2rem;
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 6px;
	background: var(--distrokid-ea-pub-bg);
}

.distrokid-ea-pub-explore-view-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0.35rem 0.4rem;
	border: none;
	border-radius: 4px;
	background: transparent;
	color: #444;
	cursor: pointer;
	line-height: 0;
}

.distrokid-ea-pub-explore-view-btn:hover {
	background: rgba(0, 0, 0, 0.05);
}

.distrokid-ea-pub-explore-view-btn.is-active {
	background: #e8f0fe;
	color: #1a73e8;
}

.distrokid-ea-pub-explore-view-btn:focus-visible {
	outline: 2px solid #1a73e8;
	outline-offset: 1px;
}

.distrokid-ea-pub-explore-export-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 0.65rem;
	margin: 0.35rem 0 0.5rem;
}

.distrokid-ea-pub-explore-bar-scroll {
	overflow-x: auto;
	max-width: 100%;
	-webkit-overflow-scrolling: touch;
}

.distrokid-ea-pub-explore-out {
	min-height: 280px;
	position: relative;
}

.distrokid-ea-pub-explore-out .distrokid-ea-pub-chart--line {
	height: 300px;
	min-height: 280px;
}

.distrokid-ea-pub-explore-out .distrokid-ea-pub-chart--hbar {
	min-height: 280px;
	height: clamp(280px, 42vmin, 520px);
}

.distrokid-ea-pub-explore-out .distrokid-ea-pub-explore-treemap-wrap {
	min-height: 280px;
	height: clamp(300px, 42vmin, 480px);
}

@media (max-width: 900px) {
	.distrokid-ea-pub-explore-filters-grid {
		grid-template-columns: 1fr;
	}
}

.distrokid-ea-pub-explore-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.8125rem;
	margin-top: 0.35rem;
}

.distrokid-ea-pub-explore-table th,
.distrokid-ea-pub-explore-table td {
	border: 1px solid var(--distrokid-ea-pub-border);
	padding: 0.35rem 0.5rem;
	text-align: left;
}

.distrokid-ea-pub-explore-table th {
	background: #f8f9fa;
	font-weight: 500;
}

.distrokid-ea-pub-explore-note {
	font-size: 0.75rem;
	color: var(--distrokid-ea-pub-muted);
	margin: 0 0 0.35rem;
}

.distrokid-ea-pub-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	max-width: 100%;
}

.distrokid-ea-pub-hint {
	margin: 0.35rem 0 0;
	font-size: 0.75rem;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-block-editor-placeholder {
	padding: 1rem;
	border: 1px dashed var(--distrokid-ea-pub-border, #ccc);
	border-radius: 8px;
	background: var(--distrokid-ea-pub-bg, #fff);
}

/* Visible build id for screenshots + support (paired with console [DistroKid EA] line). */
.distrokid-ea-public-version {
	margin: 1rem 0 0;
	padding-top: 0.5rem;
	border-top: 1px solid var(--distrokid-ea-pub-border);
	font-size: 0.6875rem;
	line-height: 1.4;
	color: var(--distrokid-ea-pub-muted);
	text-align: center;
	letter-spacing: 0.02em;
}

/* Pro PDF options modal (V2-4) */
.distrokid-ea-pro-pdf-modal[hidden] {
	display: none !important;
}

.distrokid-ea-pro-pdf-modal {
	position: fixed;
	inset: 0;
	z-index: 100001;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: max(1rem, env(safe-area-inset-top, 0px)) max(1rem, env(safe-area-inset-right, 0px))
		max(1rem, env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-left, 0px));
	box-sizing: border-box;
}

.distrokid-ea-pro-pdf-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(32, 33, 36, 0.45);
	backdrop-filter: blur(2px);
}

.distrokid-ea-pro-pdf-modal__panel {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 32rem;
	max-height: min(92vh, 44rem);
	overflow: auto;
	margin: 0;
	padding: 1.25rem 1.35rem 1.35rem;
	background: var(--distrokid-ea-pub-bg);
	color: var(--distrokid-ea-pub-text);
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 12px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
	box-sizing: border-box;
}

.distrokid-ea-pro-pdf-modal__close {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	margin: 0;
	padding: 0.35rem 0.55rem;
	font: inherit;
	font-size: 0.8125rem;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	color: var(--distrokid-ea-pub-muted);
	cursor: pointer;
}

.distrokid-ea-pro-pdf-modal__close:hover,
.distrokid-ea-pro-pdf-modal__close:focus-visible {
	color: var(--distrokid-ea-pub-text);
	border-color: var(--distrokid-ea-pub-border);
	outline: none;
}

.distrokid-ea-pro-pdf-modal__title {
	margin: 0 2.25rem 0.35rem 0;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.3;
}

.distrokid-ea-pro-pdf-modal__lead {
	margin: 0 0 1rem;
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-pro-pdf-modal__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.65rem 0.75rem;
	margin-bottom: 1rem;
}

@media (max-width: 520px) {
	.distrokid-ea-pro-pdf-modal__grid {
		grid-template-columns: 1fr;
	}
}

.distrokid-ea-pro-pdf-modal__field--full {
	grid-column: 1 / -1;
}

.distrokid-ea-pro-pdf-modal__field {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	min-width: 0;
}

.distrokid-ea-pro-pdf-modal__lbl {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--distrokid-ea-pub-text);
}

.distrokid-ea-pro-pdf-modal__input,
.distrokid-ea-pro-pdf-modal__file {
	font: inherit;
	font-size: 0.875rem;
	padding: 0.45rem 0.55rem;
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 8px;
	background: var(--distrokid-ea-pub-bg);
	color: var(--distrokid-ea-pub-text);
	box-sizing: border-box;
	max-width: 100%;
}

.distrokid-ea-pro-pdf-modal__input:focus {
	outline: none;
	border-color: var(--distrokid-ea-pub-accent);
	box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.2);
}

.distrokid-ea-pro-pdf-modal__check {
	display: flex;
	align-items: flex-start;
	gap: 0.35rem;
	font-size: 0.8125rem;
	line-height: 1.35;
	grid-column: 1 / -1;
}

.distrokid-ea-pro-pdf-modal__check input {
	margin-top: 0.2rem;
	flex-shrink: 0;
}

.distrokid-ea-pro-pdf-modal__logo-remove {
	margin-top: 0.35rem;
	align-self: flex-start;
}

.distrokid-ea-pro-pdf-modal__logo-preview {
	margin-top: 0.35rem;
	max-height: 56px;
}

.distrokid-ea-pro-pdf-modal__logo-preview img {
	display: block;
	max-height: 56px;
	max-width: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.distrokid-ea-pro-pdf-modal__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0.5rem;
	margin-top: 0.25rem;
}

@media print {
	.distrokid-ea-pro-pdf-modal {
		display: none !important;
	}
}

/* Commerce paywall (V2-2): fixed overlay so it works inside alignfull / shortcode roots. */
.distrokid-ea-commerce-wall[hidden] {
	display: none !important;
}

.distrokid-ea-commerce-wall {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: max(1rem, env(safe-area-inset-top, 0px)) max(1rem, env(safe-area-inset-right, 0px))
		max(1rem, env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-left, 0px));
	box-sizing: border-box;
}

.distrokid-ea-commerce-wall__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(32, 33, 36, 0.48);
	backdrop-filter: blur(3px);
}

.distrokid-ea-commerce-wall__panel {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 26rem;
	max-height: min(90vh, 36rem);
	overflow: auto;
	margin: 0;
	background: var(--distrokid-ea-pub-bg);
	color: var(--distrokid-ea-pub-text);
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 12px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
	padding: 1.35rem 1.35rem 1.5rem;
	box-sizing: border-box;
}

.distrokid-ea-commerce-wall__close {
	position: absolute;
	top: 0.65rem;
	right: 0.65rem;
	margin: 0;
	padding: 0.35rem 0.6rem;
	font: inherit;
	font-size: 0.8125rem;
	line-height: 1.2;
	color: var(--distrokid-ea-pub-muted);
	background: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	cursor: pointer;
}

.distrokid-ea-commerce-wall__close:hover,
.distrokid-ea-commerce-wall__close:focus-visible {
	color: var(--distrokid-ea-pub-text);
	border-color: var(--distrokid-ea-pub-border);
	outline: none;
}

.distrokid-ea-commerce-wall__title {
	margin: 0 2.5rem 0.5rem 0;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--distrokid-ea-pub-text);
}

.distrokid-ea-commerce-wall__lead,
.distrokid-ea-commerce-wall__fmt,
.distrokid-ea-commerce-wall__restore-hint {
	margin: 0 0 0.75rem;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--distrokid-ea-pub-muted);
}

.distrokid-ea-commerce-wall__fmt {
	color: var(--distrokid-ea-pub-text);
}

.distrokid-ea-commerce-wall__links {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin: 0 0 1rem;
}

.distrokid-ea-commerce-wall__buy {
	display: inline-block;
	padding: 0.5rem 0.75rem;
	font-size: 0.875rem;
	font-weight: 500;
	text-align: center;
	text-decoration: none;
	color: #fff;
	background: var(--distrokid-ea-pub-accent);
	border-radius: 8px;
	border: 1px solid transparent;
	box-sizing: border-box;
}

.distrokid-ea-commerce-wall__buy:hover,
.distrokid-ea-commerce-wall__buy:focus-visible {
	filter: brightness(1.05);
	outline: 2px solid var(--distrokid-ea-pub-accent);
	outline-offset: 2px;
}

.distrokid-ea-commerce-wall__restore-head {
	margin: 0 0 0.35rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--distrokid-ea-pub-text);
}

.distrokid-ea-commerce-wall__field {
	margin-bottom: 0.65rem;
}

.distrokid-ea-commerce-wall__label {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--distrokid-ea-pub-text);
}

.distrokid-ea-commerce-wall__input {
	width: 100%;
	padding: 0.5rem 0.6rem;
	font: inherit;
	font-size: 0.875rem;
	line-height: 1.4;
	color: var(--distrokid-ea-pub-text);
	background: var(--distrokid-ea-pub-bg);
	border: 1px solid var(--distrokid-ea-pub-border);
	border-radius: 8px;
	box-sizing: border-box;
}

.distrokid-ea-commerce-wall__input:focus {
	outline: none;
	border-color: var(--distrokid-ea-pub-accent);
	box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.2);
}

.distrokid-ea-commerce-wall__submit {
	margin-top: 0.35rem;
	width: 100%;
	padding: 0.55rem 1rem;
	font: inherit;
	font-size: 0.875rem;
	font-weight: 500;
	color: #fff;
	background: var(--distrokid-ea-pub-accent);
	border: none;
	border-radius: 8px;
	cursor: pointer;
}

.distrokid-ea-commerce-wall__submit:disabled {
	opacity: 0.65;
	cursor: not-allowed;
}

.distrokid-ea-commerce-wall__msg {
	min-height: 1.25rem;
	margin-top: 0.75rem;
	font-size: 0.8125rem;
	line-height: 1.45;
	color: #c5221f;
}

/* Shown only in print when bundled demo is active (see @media print block). */
.distrokid-ea-public-print-deny-msg {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* V2-3: screen preview watermark + commerce upsell — hidden on screen, shown when printing real data. */
.distrokid-ea-public-print-watermark,
.distrokid-ea-public-print-commerce-note {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media print {
	.distrokid-ea-commerce-wall {
		display: none !important;
	}

	/* Main print: omit Explore until the user has “touched” it (Apply / preset / reapply). Explore-only print always shows the panel. */
	.distrokid-ea-public:not(.distrokid-ea-public--explore-touched):not(.distrokid-ea-public--print-explore-only)
		.distrokid-ea-pub-explore-details {
		display: none !important;
	}

	.distrokid-ea-public--print-explore-only .distrokid-ea-pub-map-summary-wrap,
	.distrokid-ea-public--print-explore-only .distrokid-ea-public-kpis,
	.distrokid-ea-public--print-explore-only .distrokid-ea-public-charts,
	.distrokid-ea-public--print-explore-only .distrokid-ea-public-msgs {
		display: none !important;
	}

	.distrokid-ea-pub-viz-toggle {
		display: none !important;
	}

	.distrokid-ea-pub-viz-shell--show-data .distrokid-ea-pub-viz-pane--data {
		display: none !important;
	}

	.distrokid-ea-pub-viz-shell--show-data .distrokid-ea-pub-viz-pane--chart {
		display: flex !important;
	}

	.distrokid-ea-pub-viz-pane--chart {
		display: flex !important;
		position: relative !important;
		inset: auto !important;
		overflow: visible !important;
	}

	.distrokid-ea-pub-explore-presets,
	.distrokid-ea-pub-explore-controls,
	.distrokid-ea-pub-explore-filters,
	.distrokid-ea-pub-explore-view-row,
	.distrokid-ea-pub-explore-export-row {
		display: none !important;
	}

	.distrokid-ea-public-hero {
		display: none !important;
	}

	.distrokid-ea-public {
		max-width: none;
		padding-left: 0;
		padding-right: 0;
	}

	.distrokid-ea-public.distrokid-ea-public--alignfull {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding-left: max(0.5rem, env(safe-area-inset-left, 0px));
		padding-right: max(0.5rem, env(safe-area-inset-right, 0px));
	}

	/*
	 * V2-3 — Degraded print (real user data): watermark, no maps / Explore / premade charts,
	 * optional commerce upsell. Explore-only print keeps Explore; still shows watermark.
	 */
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample)
		.distrokid-ea-public-print-watermark {
		display: block !important;
		position: fixed;
		top: 42%;
		left: 50%;
		width: auto;
		height: auto;
		margin: 0;
		padding: 0;
		overflow: visible;
		clip: auto;
		white-space: nowrap;
		transform: translate(-50%, -50%) rotate(-32deg);
		font-size: 56pt;
		font-weight: 600;
		line-height: 1;
		letter-spacing: 0.04em;
		color: #000;
		opacity: 0.11;
		pointer-events: none;
		z-index: 2147483646;
		border: 0;
		text-align: center;
	}

	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample)
		.distrokid-ea-public-print-commerce-note {
		display: block !important;
		position: static;
		width: auto;
		height: auto;
		margin: 1rem 0 0;
		padding: 0.65rem 0.75rem;
		overflow: visible;
		clip: auto;
		white-space: normal;
		font-size: 9.5pt;
		line-height: 1.45;
		color: #202124;
		background: #f8f9fa;
		border: 1px solid #dadce0;
		border-radius: 6px;
		box-sizing: border-box;
	}

	/* Full-page print: strip hero, Explore, maps, and chart grid — KPIs + notes only. */
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample):not(
			.distrokid-ea-public--print-explore-only
		)
		.distrokid-ea-public-hero,
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample):not(
			.distrokid-ea-public--print-explore-only
		)
		.distrokid-ea-public-msgs,
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample):not(
			.distrokid-ea-public--print-explore-only
		)
		.distrokid-ea-pub-explore-details,
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample):not(
			.distrokid-ea-public--print-explore-only
		)
		.distrokid-ea-pub-map-summary-wrap,
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample):not(
			.distrokid-ea-public--print-explore-only
		)
		.distrokid-ea-pub-map-card,
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample):not(
			.distrokid-ea-public--print-explore-only
		)
		.distrokid-ea-public-charts,
	.distrokid-ea-public.distrokid-ea-public--has-data:not(.distrokid-ea-public--bundled-sample):not(
			.distrokid-ea-public--print-explore-only
		)
		.distrokid-ea-public-version {
		display: none !important;
	}

	/* Explore-only print: lighter watermark so Explore stays readable. */
	.distrokid-ea-public.distrokid-ea-public--print-explore-only.distrokid-ea-public--has-data:not(
			.distrokid-ea-public--bundled-sample
		)
		.distrokid-ea-public-print-watermark {
		top: 72%;
		font-size: 36pt;
		opacity: 0.07;
	}

	/* Bundled demo only: hide dashboard from print (e.g. Ctrl+P); show short notice instead. */
	.distrokid-ea-public--bundled-sample.distrokid-ea-public--has-data > *:not(.distrokid-ea-public-print-deny-msg) {
		display: none !important;
	}

	.distrokid-ea-public--bundled-sample.distrokid-ea-public--has-data > .distrokid-ea-public-print-deny-msg {
		display: block !important;
		position: static !important;
		width: auto !important;
		height: auto !important;
		margin: 0 !important;
		padding: 2rem !important;
		overflow: visible !important;
		clip: auto !important;
		white-space: normal !important;
		font-size: 12pt;
		line-height: 1.5;
		color: #000;
		background: #fff;
		text-align: center;
	}
}
