.khom-float {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 9990;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
	font-family: inherit;
}
.khom-float__btn {
	width: 72px;
	height: 72px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	animation: khom-bob 3.2s ease-in-out infinite;
}
.khom-float__btn img {
	display: block;
	width: 72px;
	height: 72px;
	filter: drop-shadow(0 4px 8px rgba(23, 35, 46, 0.18));
}
.khom-float__btn:focus-visible {
	outline: 3px solid #1f6f5c;
	outline-offset: 4px;
	border-radius: 50%;
}
.khom-float__bubble {
	position: relative;
	width: min(280px, calc(100vw - 32px));
	box-sizing: border-box;
	background: #fff;
	color: #17232e;
	border-radius: 18px 18px 4px 18px;
	padding: 14px 40px 14px 16px;
	box-shadow: 0 6px 24px rgba(23, 35, 46, 0.16);
	font-size: 14px;
	line-height: 1.55;
}
.khom-float__bubble[hidden] { display: none; }
.khom-float__bubble p { margin: 0 0 8px; }
.khom-float__status strong { font-weight: 600; }
.khom-float--good .khom-float__status strong  { color: #1c6b45; }
.khom-float--okay .khom-float__status strong  { color: #7a520c; }
.khom-float--avoid .khom-float__status strong { color: #93302a; }
.khom-float__link {
	display: inline-block;
	color: #1f6f5c;
	font-weight: 600;
	text-decoration: none;
	padding: 4px 0;
}
.khom-float__link:hover { text-decoration: underline; color: #164f42; }
.khom-float__close {
	position: absolute;
	top: 4px;
	right: 4px;
	width: 32px;
	height: 32px;
	border: 0;
	background: transparent;
	color: #5b6873;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	border-radius: 50%;
}
.khom-float__close:hover { background: #eef2f1; }

@keyframes khom-bob {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-6px); }
}
@media (prefers-reduced-motion: reduce) {
	.khom-float__btn { animation: none; }
}
@media (max-width: 480px) {
	.khom-float__btn, .khom-float__btn img { width: 60px; height: 60px; }
}
@media print {
	.khom-float { display: none; }
}
