/**
 * Mrrssy Cookie Notification: banner styles.
 *
 * Settings are printed inline as CSS custom properties on #mcn-banner:
 * --mcn-l-* light colors, --mcn-d-* dark colors, sizes, padding, radius and durations.
 * Tip for custom CSS: start selectors with #mcn-banner so they win over these defaults.
 */

.mcn-banner[hidden],
.mcn-overlay[hidden] {
	display: none !important;
}

/* Base ------------------------------------------------------------------ */

.mcn-banner {
	--mcn-bg: var(--mcn-l-bg, #ffffff);
	--mcn-text: var(--mcn-l-text, #1f2937);
	--mcn-link: var(--mcn-l-link, #2563eb);
	--mcn-btn-bg: var(--mcn-l-btn-bg, #111827);
	--mcn-btn-text: var(--mcn-l-btn-text, #ffffff);
	--mcn-btn-border: var(--mcn-l-btn-border, var(--mcn-btn-bg));
	--mcn-border: var(--mcn-l-border, #e5e7eb);

	/* Direction used by "slide" and "bounce": 1 = from/to below, -1 = from/to above. */
	--mcn-dir: 1;
	--mcn-slide-dist: 28px;

	position: fixed;
	z-index: var(--mcn-z, 99999);
	display: block;
	box-sizing: border-box;
	width: calc(100% - (var(--mcn-offset, 20px) * 2));
	max-width: var(--mcn-max-width, 420px);
	margin: 0;
	padding: var(--mcn-pad-y, 16px) var(--mcn-pad-x, 18px);
	background: var(--mcn-bg);
	color: var(--mcn-text);
	border: 1px solid var(--mcn-border);
	border-radius: var(--mcn-radius, 12px);
	font-size: var(--mcn-font-size, 14px);
	font-weight: 400;
	line-height: 1.5;
	text-align: left;
	opacity: 0;
	transform-origin: center center;
	container-type: inline-size;
	container-name: mcn;
}

.mcn-banner.mcn-visible {
	opacity: 1;
}

.mcn-banner:focus {
	outline: none;
}

.mcn-banner *,
.mcn-banner *::before,
.mcn-banner *::after {
	box-sizing: border-box;
}

/* Dark mode: forced, or automatic from the visitor's browser / OS setting. */
.mcn-banner.mcn-theme-dark {
	--mcn-bg: var(--mcn-d-bg, #111827);
	--mcn-text: var(--mcn-d-text, #e5e7eb);
	--mcn-link: var(--mcn-d-link, #93c5fd);
	--mcn-btn-bg: var(--mcn-d-btn-bg, #f9fafb);
	--mcn-btn-text: var(--mcn-d-btn-text, #111827);
	--mcn-btn-border: var(--mcn-d-btn-border, var(--mcn-btn-bg));
	--mcn-border: var(--mcn-d-border, #374151);
}

@media (prefers-color-scheme: dark) {
	.mcn-banner.mcn-theme-auto {
		--mcn-bg: var(--mcn-d-bg, #111827);
		--mcn-text: var(--mcn-d-text, #e5e7eb);
		--mcn-link: var(--mcn-d-link, #93c5fd);
		--mcn-btn-bg: var(--mcn-d-btn-bg, #f9fafb);
		--mcn-btn-text: var(--mcn-d-btn-text, #111827);
		--mcn-btn-border: var(--mcn-d-btn-border, var(--mcn-btn-bg));
		--mcn-border: var(--mcn-d-border, #374151);
	}
}

/* Fonts */
.mcn-banner.mcn-font-inherit {
	font-family: inherit;
}

.mcn-banner.mcn-font-system {
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.mcn-banner.mcn-font-web {
	font-family: var(--mcn-font-family, inherit);
}

.mcn-banner.mcn-shadow {
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.14), 0 2px 6px rgba(0, 0, 0, 0.08);
}

/* Positions ------------------------------------------------------------- */

.mcn-banner.mcn-pos-bottom-left {
	left: var(--mcn-offset, 20px);
	bottom: var(--mcn-offset, 20px);
}

.mcn-banner.mcn-pos-bottom-right {
	right: var(--mcn-offset, 20px);
	bottom: var(--mcn-offset, 20px);
}

.mcn-banner.mcn-pos-bottom-center {
	left: 0;
	right: 0;
	bottom: var(--mcn-offset, 20px);
	margin-left: auto;
	margin-right: auto;
}

.mcn-banner.mcn-pos-top-left {
	--mcn-dir: -1;
	left: var(--mcn-offset, 20px);
	top: var(--mcn-offset, 20px);
}

.mcn-banner.mcn-pos-top-right {
	--mcn-dir: -1;
	right: var(--mcn-offset, 20px);
	top: var(--mcn-offset, 20px);
}

.mcn-banner.mcn-pos-top-center {
	--mcn-dir: -1;
	left: 0;
	right: 0;
	top: var(--mcn-offset, 20px);
	margin-left: auto;
	margin-right: auto;
}

.mcn-banner.mcn-pos-center {
	--mcn-slide-dist: 40px;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	height: -moz-fit-content;
	height: fit-content;
	max-height: calc(100% - (var(--mcn-offset, 20px) * 2));
	overflow: auto;
}

/* Admin bar spacing for top positions when logged in. */
body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-top-left,
body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-top-right,
body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-top-center {
	top: calc(var(--mcn-offset, 20px) + 32px);
}

body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-bar-top {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-top-left,
	body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-top-right,
	body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-top-center {
		top: calc(var(--mcn-offset, 20px) + 46px);
	}

	body.admin-bar:not(.wp-admin) .mcn-banner.mcn-pos-bar-top {
		top: 46px;
	}
}

/* Inner layout ---------------------------------------------------------- */

.mcn-banner .mcn-inner {
	display: flex;
	gap: 12px 18px;
	margin: 0;
	padding: 0;
}

.mcn-banner.mcn-layout-stacked .mcn-inner {
	flex-direction: column;
}

.mcn-banner.mcn-layout-inline .mcn-inner {
	flex-direction: row;
	align-items: center;
}

.mcn-banner.mcn-layout-inline .mcn-text {
	flex: 1 1 auto;
	min-width: 0;
}

.mcn-banner .mcn-actions {
	display: flex;
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
}

/* Button alignment: stacked layout. */
.mcn-banner.mcn-layout-stacked.mcn-btn-left .mcn-actions {
	justify-content: flex-start;
}

.mcn-banner.mcn-layout-stacked.mcn-btn-center .mcn-actions {
	justify-content: center;
}

.mcn-banner.mcn-layout-stacked.mcn-btn-right .mcn-actions {
	justify-content: flex-end;
}

.mcn-banner.mcn-layout-stacked.mcn-btn-full .mcn-actions .mcn-button {
	width: 100%;
}

/* Button alignment: inline layout. */
.mcn-banner.mcn-layout-inline.mcn-btn-left .mcn-actions {
	order: -1;
}

.mcn-banner.mcn-layout-inline.mcn-btn-center .mcn-inner {
	justify-content: center;
}

.mcn-banner.mcn-layout-inline.mcn-btn-center .mcn-text {
	flex: 0 1 auto;
}

/* Narrow banners switch the inline layout to a column. */
@container mcn (max-width: 520px) {
	.mcn-banner.mcn-layout-inline .mcn-inner {
		flex-direction: column;
		align-items: stretch;
	}

	.mcn-banner.mcn-layout-inline .mcn-actions {
		order: 0;
		justify-content: flex-end;
	}

	.mcn-banner.mcn-layout-inline.mcn-btn-left .mcn-actions {
		justify-content: flex-start;
	}

	.mcn-banner.mcn-layout-inline.mcn-btn-center .mcn-actions {
		justify-content: center;
	}

	.mcn-banner.mcn-layout-inline.mcn-btn-full .mcn-actions .mcn-button {
		width: 100%;
	}
}

/* Text ------------------------------------------------------------------ */

.mcn-banner .mcn-text {
	margin: 0;
	padding: 0;
	color: var(--mcn-text);
	font-size: inherit;
	line-height: inherit;
}

.mcn-banner .mcn-message p {
	margin: 0 0 0.5em;
}

.mcn-banner .mcn-message p:last-child {
	margin-bottom: 0;
}

.mcn-banner .mcn-text a {
	color: var(--mcn-link);
	text-decoration: underline;
	text-underline-offset: 2px;
	box-shadow: none;
	background: none;
}

.mcn-banner .mcn-text a:hover,
.mcn-banner .mcn-text a:focus {
	color: var(--mcn-link);
	text-decoration-thickness: 2px;
}

.mcn-banner .mcn-text a:focus-visible {
	outline: 2px solid var(--mcn-link);
	outline-offset: 2px;
	border-radius: 2px;
}

.mcn-banner .mcn-policy-link {
	white-space: nowrap;
}

/* Button ---------------------------------------------------------------- */

.mcn-banner .mcn-actions .mcn-button {
	-webkit-appearance: none;
	appearance: none;
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	min-width: 0;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: var(--mcn-btn-pad-y, 10px) var(--mcn-btn-pad-x, 22px);
	font-family: inherit;
	font-size: inherit;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: normal;
	text-transform: none;
	text-decoration: none;
	text-shadow: none;
	white-space: nowrap;
	color: var(--mcn-btn-text);
	background: var(--mcn-btn-bg);
	border: var(--mcn-btn-border-w, 1px) solid var(--mcn-btn-border);
	border-radius: var(--mcn-btn-radius, 8px);
	box-shadow: none;
	cursor: pointer;
	transform-origin: center center;
	transition: opacity 0.2s ease, transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

/* Re-assert colors on hover/focus so theme button styles cannot take over. */
.mcn-banner .mcn-actions .mcn-button:hover,
.mcn-banner .mcn-actions .mcn-button:focus {
	color: var(--mcn-btn-text);
	background: var(--mcn-btn-bg);
	border-color: var(--mcn-btn-border);
	box-shadow: none;
}

.mcn-banner .mcn-actions .mcn-button:focus-visible {
	outline: 2px solid var(--mcn-link);
	outline-offset: 2px;
}

.mcn-banner .mcn-actions .mcn-button:active {
	transform: scale(0.97);
}

/* Style presets (radius and padding come from the settings for every preset) */

/* Minimal: outlined button that fills on hover (border color and width come from the settings) */
.mcn-banner.mcn-style-minimal .mcn-actions .mcn-button {
	color: var(--mcn-btn-bg);
	background: transparent;
}

.mcn-banner.mcn-style-minimal .mcn-actions .mcn-button:hover,
.mcn-banner.mcn-style-minimal .mcn-actions .mcn-button:focus {
	color: var(--mcn-btn-text);
	background: var(--mcn-btn-bg);
	border-color: var(--mcn-btn-border);
}

/* Frosted glass */
.mcn-banner.mcn-style-glass {
	background: var(--mcn-bg);
	background: color-mix(in srgb, var(--mcn-bg) 74%, transparent);
	-webkit-backdrop-filter: blur(14px) saturate(160%);
	backdrop-filter: blur(14px) saturate(160%);
	border-color: color-mix(in srgb, var(--mcn-border) 70%, transparent);
}

/* Accent edge */
.mcn-banner.mcn-style-accent {
	border-left: 4px solid var(--mcn-btn-bg);
}

/* Full width bars (after the presets so they win) ----------------------- */

.mcn-banner.mcn-pos-bar-bottom,
.mcn-banner.mcn-pos-bar-top {
	--mcn-slide-dist: 100%;
	left: 0;
	right: 0;
	width: 100%;
	max-width: none;
	border-left: 0;
	border-right: 0;
}

.mcn-banner.mcn-pos-bar-bottom {
	bottom: 0;
	border-bottom: 0;
	border-radius: var(--mcn-radius, 12px) var(--mcn-radius, 12px) 0 0;
}

.mcn-banner.mcn-pos-bar-top {
	--mcn-dir: -1;
	top: 0;
	border-top: 0;
	border-radius: 0 0 var(--mcn-radius, 12px) var(--mcn-radius, 12px);
}

.mcn-banner.mcn-is-bar .mcn-inner {
	max-width: 1200px;
	margin: 0 auto;
}

.mcn-banner.mcn-style-accent.mcn-pos-bar-bottom {
	border-top: 4px solid var(--mcn-btn-bg);
}

.mcn-banner.mcn-style-accent.mcn-pos-bar-top {
	border-bottom: 4px solid var(--mcn-btn-bg);
}

/* Button hover animations ---------------------------------------------- */

.mcn-banner.mcn-hover-fade .mcn-actions .mcn-button:hover {
	opacity: 0.85;
}

.mcn-banner.mcn-hover-lift .mcn-actions .mcn-button:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}

.mcn-banner.mcn-hover-grow .mcn-actions .mcn-button:hover {
	transform: scale(1.06);
}

.mcn-banner.mcn-hover-shrink .mcn-actions .mcn-button:hover {
	transform: scale(0.94);
}

.mcn-banner.mcn-hover-glow .mcn-actions .mcn-button:hover {
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--mcn-btn-bg) 30%, transparent), 0 0 18px color-mix(in srgb, var(--mcn-btn-bg) 45%, transparent);
}

.mcn-banner.mcn-hover-shine .mcn-actions .mcn-button::after {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.45), transparent);
	transform: skewX(-20deg);
	pointer-events: none;
}

.mcn-banner.mcn-hover-shine .mcn-actions .mcn-button:hover::after {
	animation: mcn-hover-shine 0.7s ease;
}

.mcn-banner.mcn-hover-wobble .mcn-actions .mcn-button:hover {
	animation: mcn-hover-wobble 0.6s ease;
}

.mcn-banner.mcn-hover-pulse .mcn-actions .mcn-button:hover {
	animation: mcn-hover-pulse 0.9s ease-in-out infinite;
}

@keyframes mcn-hover-shine {
	from { left: -75%; }
	to { left: 125%; }
}

@keyframes mcn-hover-wobble {
	0%, 100% { transform: rotate(0); }
	20% { transform: rotate(-4deg); }
	40% { transform: rotate(3deg); }
	60% { transform: rotate(-2deg); }
	80% { transform: rotate(1deg); }
}

@keyframes mcn-hover-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.06); }
}

/* Entrance animations --------------------------------------------------- */

.mcn-banner.mcn-entering {
	animation-duration: var(--mcn-in-dur, 400ms);
	animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
	animation-fill-mode: both;
}

.mcn-banner.mcn-in-fade { animation-name: mcn-in-fade; }
.mcn-banner.mcn-in-slide { animation-name: mcn-in-slide; }
.mcn-banner.mcn-in-slide-up { animation-name: mcn-in-slide-up; }
.mcn-banner.mcn-in-slide-down { animation-name: mcn-in-slide-down; }
.mcn-banner.mcn-in-slide-left { animation-name: mcn-in-slide-left; }
.mcn-banner.mcn-in-slide-right { animation-name: mcn-in-slide-right; }
.mcn-banner.mcn-in-zoom { animation-name: mcn-in-zoom; }
.mcn-banner.mcn-in-pop { animation-name: mcn-in-pop; animation-timing-function: ease-out; }
.mcn-banner.mcn-in-bounce { animation-name: mcn-in-bounce; animation-timing-function: ease-out; }
.mcn-banner.mcn-in-flip { animation-name: mcn-in-flip; }
.mcn-banner.mcn-in-blur { animation-name: mcn-in-blur; }

@keyframes mcn-in-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes mcn-in-slide {
	from { opacity: 0; transform: translateY(calc(var(--mcn-dir) * var(--mcn-slide-dist))); }
	to { opacity: 1; transform: none; }
}

@keyframes mcn-in-slide-up {
	from { opacity: 0; transform: translateY(48px); }
	to { opacity: 1; transform: none; }
}

@keyframes mcn-in-slide-down {
	from { opacity: 0; transform: translateY(-48px); }
	to { opacity: 1; transform: none; }
}

@keyframes mcn-in-slide-left {
	from { opacity: 0; transform: translateX(64px); }
	to { opacity: 1; transform: none; }
}

@keyframes mcn-in-slide-right {
	from { opacity: 0; transform: translateX(-64px); }
	to { opacity: 1; transform: none; }
}

@keyframes mcn-in-zoom {
	from { opacity: 0; transform: scale(0.85); }
	to { opacity: 1; transform: none; }
}

@keyframes mcn-in-pop {
	0% { opacity: 0; transform: scale(0.6); }
	55% { opacity: 1; transform: scale(1.06); }
	75% { transform: scale(0.97); }
	100% { opacity: 1; transform: none; }
}

@keyframes mcn-in-bounce {
	0% { opacity: 0; transform: translateY(calc(var(--mcn-dir) * 70px)); }
	55% { opacity: 1; transform: translateY(calc(var(--mcn-dir) * -12px)); }
	75% { transform: translateY(calc(var(--mcn-dir) * 5px)); }
	90% { transform: translateY(calc(var(--mcn-dir) * -2px)); }
	100% { opacity: 1; transform: none; }
}

@keyframes mcn-in-flip {
	from { opacity: 0; transform: perspective(900px) rotateX(calc(var(--mcn-dir) * -75deg)); }
	to { opacity: 1; transform: perspective(900px) rotateX(0); }
}

@keyframes mcn-in-blur {
	from { opacity: 0; filter: blur(12px); transform: scale(1.04); }
	to { opacity: 1; filter: blur(0); transform: none; }
}

/* Exit animations ------------------------------------------------------- */

.mcn-banner.mcn-leaving {
	animation-duration: var(--mcn-out-dur, 300ms);
	animation-timing-function: cubic-bezier(0.55, 0, 1, 0.45);
	animation-fill-mode: both;
	pointer-events: none;
}

.mcn-banner.mcn-out-fade { animation-name: mcn-out-fade; }
.mcn-banner.mcn-out-slide { animation-name: mcn-out-slide; }
.mcn-banner.mcn-out-slide-up { animation-name: mcn-out-slide-up; }
.mcn-banner.mcn-out-slide-down { animation-name: mcn-out-slide-down; }
.mcn-banner.mcn-out-slide-left { animation-name: mcn-out-slide-left; }
.mcn-banner.mcn-out-slide-right { animation-name: mcn-out-slide-right; }
.mcn-banner.mcn-out-zoom { animation-name: mcn-out-zoom; }
.mcn-banner.mcn-out-pop { animation-name: mcn-out-pop; animation-timing-function: ease-in; }
.mcn-banner.mcn-out-flip { animation-name: mcn-out-flip; }
.mcn-banner.mcn-out-blur { animation-name: mcn-out-blur; }
.mcn-banner.mcn-out-drop { animation-name: mcn-out-drop; animation-timing-function: ease-in; }

@keyframes mcn-out-fade {
	from { opacity: 1; }
	to { opacity: 0; }
}

@keyframes mcn-out-slide {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: translateY(calc(var(--mcn-dir) * var(--mcn-slide-dist))); }
}

@keyframes mcn-out-slide-up {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: translateY(-48px); }
}

@keyframes mcn-out-slide-down {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: translateY(48px); }
}

@keyframes mcn-out-slide-left {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: translateX(-64px); }
}

@keyframes mcn-out-slide-right {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: translateX(64px); }
}

@keyframes mcn-out-zoom {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: scale(0.85); }
}

@keyframes mcn-out-pop {
	0% { opacity: 1; transform: none; }
	30% { opacity: 1; transform: scale(1.05); }
	100% { opacity: 0; transform: scale(0.5); }
}

@keyframes mcn-out-flip {
	from { opacity: 1; transform: perspective(900px) rotateX(0); }
	to { opacity: 0; transform: perspective(900px) rotateX(calc(var(--mcn-dir) * 75deg)); }
}

@keyframes mcn-out-blur {
	from { opacity: 1; filter: blur(0); transform: none; }
	to { opacity: 0; filter: blur(12px); transform: scale(1.04); }
}

@keyframes mcn-out-drop {
	0% { opacity: 1; transform: none; }
	20% { opacity: 1; transform: translateY(-8px) rotate(-2deg); }
	100% { opacity: 0; transform: translateY(160px) rotate(8deg); }
}

/* Idle (attention) animations ------------------------------------------ */
/* Applied to the banner or the button by banner.js, then repeated on a timer. */

.mcn-idle-wiggle { animation: mcn-idle-wiggle 0.5s ease both; }
.mcn-idle-shake { animation: mcn-idle-shake 0.6s ease both; }
.mcn-idle-pulse { animation: mcn-idle-pulse 0.7s ease-in-out both; }
.mcn-idle-bounce { animation: mcn-idle-bounce 0.8s ease both; }
.mcn-idle-tada { animation: mcn-idle-tada 1s ease both; }
.mcn-idle-swing { animation: mcn-idle-swing 1s ease both; transform-origin: top center; }
.mcn-idle-heartbeat { animation: mcn-idle-heartbeat 1s ease-in-out both; }
.mcn-idle-jello { animation: mcn-idle-jello 0.9s ease both; }
.mcn-idle-glow { animation: mcn-idle-glow 1.2s ease-out both; }
.mcn-idle-float { animation: mcn-idle-float 2.4s ease-in-out both; }

/* Matches the wiggle on webuyuseditequipment.net: +5deg then -5deg. */
@keyframes mcn-idle-wiggle {
	0% { transform: rotate(0deg); }
	25% { transform: rotate(5deg); }
	75% { transform: rotate(-5deg); }
	100% { transform: rotate(0deg); }
}

@keyframes mcn-idle-shake {
	0%, 100% { transform: translateX(0); }
	15% { transform: translateX(-6px); }
	30% { transform: translateX(6px); }
	45% { transform: translateX(-5px); }
	60% { transform: translateX(5px); }
	75% { transform: translateX(-2px); }
	90% { transform: translateX(2px); }
}

@keyframes mcn-idle-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.04); }
}

@keyframes mcn-idle-bounce {
	0%, 100% { transform: translateY(0); }
	30% { transform: translateY(-12px); }
	50% { transform: translateY(0); }
	70% { transform: translateY(-5px); }
	85% { transform: translateY(0); }
}

@keyframes mcn-idle-tada {
	0%, 100% { transform: scale(1) rotate(0); }
	10%, 20% { transform: scale(0.96) rotate(-3deg); }
	30%, 50%, 70%, 90% { transform: scale(1.04) rotate(3deg); }
	40%, 60%, 80% { transform: scale(1.04) rotate(-3deg); }
}

@keyframes mcn-idle-swing {
	0%, 100% { transform: rotate(0); }
	20% { transform: rotate(6deg); }
	40% { transform: rotate(-4deg); }
	60% { transform: rotate(3deg); }
	80% { transform: rotate(-2deg); }
}

@keyframes mcn-idle-heartbeat {
	0%, 100% { transform: scale(1); }
	15% { transform: scale(1.06); }
	30% { transform: scale(1); }
	45% { transform: scale(1.06); }
	70% { transform: scale(1); }
}

@keyframes mcn-idle-jello {
	0%, 100% { transform: none; }
	22% { transform: skewX(-8deg) skewY(-2deg); }
	44% { transform: skewX(5deg) skewY(1.5deg); }
	66% { transform: skewX(-2.5deg) skewY(-0.6deg); }
	88% { transform: skewX(1deg) skewY(0.3deg); }
}

@keyframes mcn-idle-glow {
	0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--mcn-btn-bg) 55%, transparent); }
	100% { box-shadow: 0 0 0 14px color-mix(in srgb, var(--mcn-btn-bg) 0%, transparent); }
}

@keyframes mcn-idle-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-7px); }
}

/* Scroll lock (optional, while the banner is showing) ------------------ */

html.mcn-scroll-locked,
html.mcn-scroll-locked body {
	overflow: hidden !important;
	overscroll-behavior: none;
}

/* Overlay --------------------------------------------------------------- */

.mcn-overlay {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 99998;
	background: var(--mcn-ov-bg, rgba(15, 23, 42, 0.5));
	-webkit-backdrop-filter: blur(var(--mcn-ov-blur, 0px));
	backdrop-filter: blur(var(--mcn-ov-blur, 0px));
	opacity: 0;
	transition: opacity 0.3s ease;
}

.mcn-overlay.mcn-visible {
	opacity: 1;
}

/* Accessibility and print ----------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.mcn-banner,
	.mcn-banner *,
	.mcn-banner *::after,
	.mcn-overlay {
		animation: none !important;
		transition: none !important;
	}

	.mcn-banner .mcn-actions .mcn-button:hover,
	.mcn-banner .mcn-actions .mcn-button:active {
		transform: none !important;
	}
}

@media print {
	.mcn-banner,
	.mcn-overlay {
		display: none !important;
	}
}