/* OS Toolkit – Like. Barvy přebírá z webu (--o-*), jdou přepsat přes --ost-like-*. */
.ost-like-wrap {
	--_ink: var(--ost-like-ink, var(--o-ink, currentColor));
	--_bg: var(--ost-like-bg, var(--o-bg, #fff));
	--_line: var(--ost-like-line, var(--o-line-strong, rgba(127, 127, 127, .35)));
	--_accent: var(--ost-like-accent, var(--o-accent, #ff3b1f));
	--_ease: var(--o-ease-out, cubic-bezier(.16, 1, .3, 1));
	position: relative;
	display: inline-block;
	margin: 2em 0 0;
	font-family: inherit;
}
.ost-like {
	display: inline-flex;
	align-items: center;
	gap: .55em;
	padding: .6em 1.05em .6em .9em;
	border: 1px solid var(--_line);
	border-radius: 999px;
	background: transparent;
	color: var(--_ink);
	font: inherit;
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
	transition: border-color .25s, background-color .25s, transform .2s var(--_ease);
}
.ost-like:hover { border-color: var(--_ink); }
.ost-like:active { transform: scale(.96); }
.ost-like:focus-visible { outline: 2px solid var(--_accent); outline-offset: 2px; }
.ost-like-icon svg { width: 100%; height: 100%; display: block; fill: inherit; stroke: inherit; overflow: visible; }
span.ost-like-icon, i.ost-like-icon { display: inline-block; flex: none; transition: color .2s; }
.ost-like-wrap.is-liked .ost-like-icon { color: var(--_accent); }
.ost-like-icon { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; transition: fill .2s, stroke .2s; overflow: visible; }
.ost-like-wrap.is-liked .ost-like-icon { fill: var(--_accent); stroke: var(--_accent); }
.ost-like.is-pop .ost-like-icon { animation: ost-like-pop .5s var(--_ease); }
.ost-like-count { font-variant-numeric: tabular-nums; opacity: .6; padding-left: .55em; border-left: 1px solid var(--_line); }
@keyframes ost-like-pop { 0% { transform: scale(1); } 30% { transform: scale(1.35); } 60% { transform: scale(.9); } 100% { transform: scale(1); } }

/* Hláška – stejný styl jako hlášky u loga v patičce */
.ost-like-msg {
	position: absolute;
	left: 0;
	top: calc(100% + 12px);
	width: max-content;
	max-width: min(460px, 80vw);
	padding: 9px 12px;
	border-radius: 6px;
	background: var(--_ink);
	color: var(--_bg);
	font-size: 12px;
	line-height: 1.45;
	opacity: 0;
	transform: translateY(-4px);
	transition: opacity .3s, transform .45s var(--_ease);
	pointer-events: none;
	z-index: 9;
}
.ost-like-msg:empty { display: none; }
.ost-like-msg.on { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.ost-like.is-pop .ost-like-icon { animation: none; }
	.ost-like-msg { transition: opacity .2s; transform: none; }
}