.cl-ai-popup-layer {
	--promo-accent: #f97316;
	--promo-accent-deep: #9a3f0b;
	--promo-surface: #fffaf6;
	--promo-card: #fff;
	--promo-text: #181310;
	--promo-muted: #75675f;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	transition: opacity .3s ease;
	z-index: 99980;
}

.cl-ai-popup-layer.is-visible {
	opacity: 1;
	pointer-events: auto;
}

.cl-ai-popup-layer.is-leaving { opacity: 0; }

.cl-ai-popup-layer__backdrop {
	background: rgba(20, 14, 10, .2);
	inset: 0;
	opacity: 0;
	position: absolute;
	transition: opacity .4s ease;
}

.cl-ai-popup-layer.is-visible .cl-ai-popup-layer__backdrop { opacity: 1; }

.cl-ai-popup-layer.is-theme-dark {
	--promo-surface: #17191c;
	--promo-card: #202329;
	--promo-text: #f8f7f4;
	--promo-muted: #c7c4bd;
}

.cl-ai-popup-layer .cl-ai-float {
	background: radial-gradient(circle at 92% 5%, color-mix(in srgb, var(--promo-accent) 17%, transparent), transparent 10rem), var(--promo-surface);
	border: 1px solid color-mix(in srgb, var(--promo-accent) 48%, var(--promo-card));
	border-radius: 26px;
	bottom: auto;
	box-shadow: 0 32px 90px rgba(17, 12, 9, .32), 0 0 0 1px color-mix(in srgb, var(--promo-accent) 12%, transparent);
	color: var(--promo-text);
	left: 50%;
	max-width: 410px;
	opacity: 0;
	padding: 1.5rem;
	right: auto;
	top: 50%;
	transform: translate(-50%, -44%) scale(.88) rotateX(7deg);
	transform-origin: center;
	transition: opacity .3s ease, transform .5s cubic-bezier(.16, 1, .3, 1);
	width: calc(100% - 32px);
	z-index: 2;
}

.cl-ai-popup-layer .cl-ai-float.is-visible {
	animation: cl-ai-popup-breathe 4.5s 1.2s ease-in-out infinite;
	opacity: 1;
	transform: translate(-50%, -50%) scale(1) rotateX(0);
}

.cl-ai-popup-layer .cl-ai-float.is-leaving {
	animation: none;
	opacity: 0;
	transform: translate(-50%, -46%) scale(.94);
}

.cl-ai-popup-layer .cl-ai-float::before,
.cl-ai-popup-layer .cl-ai-float::after {
	border: 1px solid color-mix(in srgb, var(--promo-accent) 35%, transparent);
	border-radius: 32px;
	content: "";
	inset: -9px;
	opacity: 0;
	pointer-events: none;
	position: absolute;
}

.cl-ai-popup-layer.is-visible .cl-ai-float::before { animation: cl-ai-popup-ring 1.25s .35s ease-out; }
.cl-ai-popup-layer.is-visible .cl-ai-float::after { animation: cl-ai-popup-ring 1.25s .58s ease-out; }

.cl-ai-popup-layer .cl-ai-float__close {
	background: var(--promo-card);
	border-color: color-mix(in srgb, var(--promo-accent) 38%, transparent);
	color: var(--promo-muted);
	height: 38px;
	right: -10px;
	top: -10px;
	transition: background .2s ease, color .2s ease, transform .2s ease;
	width: 38px;
}

.cl-ai-popup-layer .cl-ai-float__close:hover {
	background: var(--promo-accent);
	color: #fff;
	transform: rotate(8deg) scale(1.06);
}

.cl-ai-popup-layer .cl-ai-float__avatar {
	background: color-mix(in srgb, var(--promo-text) 94%, var(--promo-accent));
	border-radius: 16px;
	height: 58px;
	width: 58px;
}

.cl-ai-popup-layer .cl-ai-float__avatar i {
	animation: cl-ai-online-pulse 1.8s ease-in-out infinite;
	background: color-mix(in srgb, var(--promo-accent) 76%, #21d989);
	border-color: var(--promo-card);
}

.cl-ai-popup-layer .cl-ai-float__head small { color: var(--promo-accent-deep); font-size: .58rem; }
.cl-ai-popup-layer.is-theme-dark .cl-ai-float__head small { color: color-mix(in srgb, var(--promo-accent) 75%, #fff); }
.cl-ai-popup-layer .cl-ai-float__head strong { font-size: 1.08rem; }

.cl-ai-popup-layer .cl-ai-float__offer {
	background: var(--promo-card);
	border-color: color-mix(in srgb, var(--promo-accent) 24%, transparent);
	border-radius: 18px;
	margin: 1.2rem 0;
	padding: .85rem 1rem;
}

.cl-ai-popup-layer .cl-ai-float__offer > strong { font-size: 2.5rem; }
.cl-ai-popup-layer .cl-ai-float__offer sup { color: var(--promo-accent); }
.cl-ai-popup-layer .cl-ai-float__offer > span { border-color: color-mix(in srgb, var(--promo-accent) 26%, transparent); color: var(--promo-muted); font-size: .72rem; }
.cl-ai-popup-layer .cl-ai-float__offer b { color: var(--promo-text); font-size: .8rem; }
.cl-ai-popup-layer .cl-ai-float__features span { background: color-mix(in srgb, var(--promo-accent) 12%, var(--promo-card)); color: var(--promo-accent-deep); font-size: .62rem; }
.cl-ai-popup-layer.is-theme-dark .cl-ai-float__features span { color: color-mix(in srgb, var(--promo-accent) 68%, #fff); }
.cl-ai-popup-layer .cl-ai-float__actions { margin-top: 1.15rem; }
.cl-ai-popup-layer .cl-ai-float__actions a:first-child { background: var(--promo-accent); box-shadow: 0 12px 30px color-mix(in srgb, var(--promo-accent) 30%, transparent); font-size: .78rem; padding: .82rem; }
.cl-ai-popup-layer .cl-ai-float__actions a:first-child:hover { filter: brightness(.94); transform: translateY(-2px); }
.cl-ai-popup-layer .cl-ai-float__actions a:last-child { color: var(--promo-muted); font-size: .7rem; }
.cl-ai-popup-layer--school .cl-ai-float { box-shadow: 0 32px 90px rgba(7, 10, 18, .34), 0 0 0 1px color-mix(in srgb, var(--promo-accent) 20%, transparent); }

@keyframes cl-ai-popup-ring {
	0% { opacity: .75; transform: scale(.96); }
	100% { opacity: 0; transform: scale(1.07); }
}

@keyframes cl-ai-popup-breathe {
	0%, 100% { box-shadow: 0 32px 90px rgba(17, 12, 9, .32), 0 0 0 1px color-mix(in srgb, var(--promo-accent) 12%, transparent); }
	50% { box-shadow: 0 38px 105px rgba(17, 12, 9, .36), 0 0 0 7px color-mix(in srgb, var(--promo-accent) 7%, transparent); }
}

@keyframes cl-ai-online-pulse {
	50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--promo-accent) 0%, transparent); transform: scale(.88); }
}

@media (max-width: 480px) {
	.cl-ai-popup-layer .cl-ai-float { bottom: auto; max-width: calc(100% - 24px); padding: 1.2rem; right: auto; width: calc(100% - 24px); }
	.cl-ai-popup-layer .cl-ai-float__avatar { height: 52px; width: 52px; }
	.cl-ai-popup-layer .cl-ai-float__head strong { font-size: 1rem; }
	.cl-ai-popup-layer .cl-ai-float__actions { align-items: stretch; flex-direction: column; }
	.cl-ai-popup-layer .cl-ai-float__actions a:last-child { text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
	.cl-ai-popup-layer,
	.cl-ai-popup-layer__backdrop,
	.cl-ai-popup-layer .cl-ai-float { transition: none; }
	.cl-ai-popup-layer .cl-ai-float.is-visible,
	.cl-ai-popup-layer .cl-ai-float__avatar i,
	.cl-ai-popup-layer.is-visible .cl-ai-float::before,
	.cl-ai-popup-layer.is-visible .cl-ai-float::after { animation: none; }
}