.gk98-sp {
	--gk98-sp-accent: #129b63;
	--gk98-sp-bg: #effbf5;
	--gk98-sp-text: #365e4f;
	--gk98-sp-border: #bfe8d4;
	--gk98-sp-font-desktop: 13px;
	--gk98-sp-font-mobile: 12px;
	--gk98-sp-icon-desktop: 20px;
	--gk98-sp-icon-mobile: 18px;
	--gk98-sp-pad-x: 12px;
	--gk98-sp-pad-y: 8px;
	--gk98-sp-radius: 14px;
	--gk98-sp-border-width: 1px;
	--gk98-sp-shadow: .18;
	display: flex;
	width: fit-content;
	max-width: 100%;
	margin-block: 5px 12px;
	box-sizing: border-box;
	direction: rtl;
	font-family: inherit;
	font-size: var(--gk98-sp-font-desktop);
	line-height: 1.65;
	text-align: start;
}

.gk98-sp *,
.gk98-sp *::before,
.gk98-sp *::after {
	box-sizing: border-box;
}

.gk98-sp__surface {
	position: relative;
	display: flex;
	align-items: center;
	gap: 9px;
	width: 100%;
	max-width: 100%;
	padding: var(--gk98-sp-pad-y) var(--gk98-sp-pad-x);
	border: var(--gk98-sp-border-width) solid var(--gk98-sp-border);
	border-radius: var(--gk98-sp-radius);
	color: var(--gk98-sp-text);
	background: var(--gk98-sp-bg);
	box-shadow: 0 9px 26px rgba(21, 69, 50, var(--gk98-sp-shadow));
	overflow: hidden;
}

.gk98-sp__icon {
	position: relative;
	z-index: 1;
	display: inline-grid;
	flex: 0 0 var(--gk98-sp-icon-desktop);
	width: var(--gk98-sp-icon-desktop);
	height: var(--gk98-sp-icon-desktop);
	place-items: center;
	color: #fff;
}

.gk98-sp__icon svg {
	display: block;
	width: 58%;
	height: 58%;
}

.gk98-sp__text {
	position: relative;
	z-index: 1;
	min-width: 0;
	font-size: inherit;
	font-weight: 680;
}

.gk98-sp__count {
	color: var(--gk98-sp-accent);
	font-weight: 900;
	white-space: nowrap;
}

.gk98-sp--align-start { margin-inline-start: 0; margin-inline-end: auto; }
.gk98-sp--align-center { margin-inline: auto; }
.gk98-sp--align-end { margin-inline-start: auto; margin-inline-end: 0; }
.gk98-sp--width-full { width: 100%; }

/* Design 1: calm, compact trust pill. */
.gk98-sp--trust {
	--gk98-sp-accent: #087348;
	--gk98-sp-bg: #effbf5;
	--gk98-sp-text: #365e4f;
	--gk98-sp-border: #c5ead8;
}

.gk98-sp--trust .gk98-sp__surface {
	background: linear-gradient(135deg, var(--gk98-sp-bg), #fff 85%);
}

.gk98-sp--trust .gk98-sp__icon {
	border-radius: 50%;
	background: var(--gk98-sp-accent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--gk98-sp-accent) 10%, transparent);
}

/* Design 2: translucent card with layered light. */
.gk98-sp--glass {
	--gk98-sp-accent: #5a59d9;
	--gk98-sp-bg: rgba(247, 247, 255, .86);
	--gk98-sp-text: #373764;
	--gk98-sp-border: rgba(119, 116, 213, .26);
}

.gk98-sp--glass .gk98-sp__surface {
	padding-inline: calc(var(--gk98-sp-pad-x) + 2px);
	background: linear-gradient(120deg, var(--gk98-sp-bg), rgba(255,255,255,.76));
	box-shadow: 0 14px 34px rgba(54, 50, 122, var(--gk98-sp-shadow));
	backdrop-filter: blur(12px) saturate(145%);
}

.gk98-sp--glass .gk98-sp__surface::before {
	content: '';
	position: absolute;
	inset: -40px auto auto -24px;
	width: 86px;
	height: 86px;
	border-radius: 50%;
	background: color-mix(in srgb, var(--gk98-sp-accent) 22%, transparent);
	filter: blur(5px);
}

.gk98-sp--glass .gk98-sp__icon {
	border: 1px solid color-mix(in srgb, var(--gk98-sp-accent) 30%, #fff);
	border-radius: calc(var(--gk98-sp-radius) * .65);
	background: linear-gradient(145deg, var(--gk98-sp-accent), #8682ff);
	box-shadow: 0 7px 16px color-mix(in srgb, var(--gk98-sp-accent) 27%, transparent);
}

/* Design 3: editorial, almost frameless line. */
.gk98-sp--minimal {
	--gk98-sp-accent: #0d766e;
	--gk98-sp-bg: transparent;
	--gk98-sp-text: #3f4e4d;
	--gk98-sp-border: #cbd9d8;
}

.gk98-sp--minimal .gk98-sp__surface {
	padding-block: max(4px, calc(var(--gk98-sp-pad-y) - 2px));
	padding-inline: 1px var(--gk98-sp-pad-x);
	border-width: 0 3px 0 0;
	border-color: var(--gk98-sp-accent);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.gk98-sp--minimal .gk98-sp__icon {
	flex-basis: calc(var(--gk98-sp-icon-desktop) - 2px);
	width: calc(var(--gk98-sp-icon-desktop) - 2px);
	height: calc(var(--gk98-sp-icon-desktop) - 2px);
	border-radius: 5px;
	color: var(--gk98-sp-accent);
	background: color-mix(in srgb, var(--gk98-sp-accent) 9%, transparent);
}

.gk98-sp--minimal .gk98-sp__text { font-weight: 590; }

/* Design 4: dark neon gaming badge. */
.gk98-sp--neon {
	--gk98-sp-accent: #74f6c8;
	--gk98-sp-bg: #11172a;
	--gk98-sp-text: #e8fff7;
	--gk98-sp-border: #2c8f79;
}

.gk98-sp--neon .gk98-sp__surface {
	border-radius: min(var(--gk98-sp-radius), 12px);
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--gk98-sp-accent) 8%, transparent), transparent 45%),
		var(--gk98-sp-bg);
	box-shadow: 0 10px 32px rgba(0,0,0,calc(var(--gk98-sp-shadow) + .08)), inset 0 0 22px color-mix(in srgb, var(--gk98-sp-accent) 5%, transparent);
}

.gk98-sp--neon .gk98-sp__surface::after {
	content: '';
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(90deg, transparent 0 23px, rgba(255,255,255,.025) 24px);
	pointer-events: none;
}

.gk98-sp--neon .gk98-sp__icon {
	border: 1px solid var(--gk98-sp-accent);
	border-radius: 6px;
	color: #0c1b17;
	background: var(--gk98-sp-accent);
	box-shadow: 0 0 14px color-mix(in srgb, var(--gk98-sp-accent) 54%, transparent);
}

.gk98-sp--neon .gk98-sp__count {
	text-shadow: 0 0 11px color-mix(in srgb, var(--gk98-sp-accent) 62%, transparent);
}

/* Design 5: bold, warm sales label. */
.gk98-sp--warm {
	--gk98-sp-accent: #b44316;
	--gk98-sp-bg: #fff2da;
	--gk98-sp-text: #70391e;
	--gk98-sp-border: #f1c884;
}

.gk98-sp--warm .gk98-sp__surface {
	padding-inline-end: calc(var(--gk98-sp-pad-x) + 5px);
	border-radius: min(var(--gk98-sp-radius), 10px);
	background: linear-gradient(105deg, var(--gk98-sp-bg), #fffaf0);
	box-shadow: 0 10px 24px rgba(151, 76, 22, var(--gk98-sp-shadow));
}

.gk98-sp--warm .gk98-sp__surface::before {
	content: '';
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: 5px;
	background: var(--gk98-sp-accent);
}

.gk98-sp--warm .gk98-sp__icon {
	border-radius: 50% 50% 50% 12%;
	background: var(--gk98-sp-accent);
	transform: rotate(-7deg);
}

.gk98-sp--warm .gk98-sp__icon svg { transform: rotate(7deg); }

@keyframes gk98-sp-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes gk98-sp-slide {
	from { opacity: 0; transform: translate3d(12px, 0, 0); }
	to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes gk98-sp-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.018); }
}

.gk98-sp--animation-fade { animation: gk98-sp-fade .45s ease both; }
.gk98-sp--animation-slide { animation: gk98-sp-slide .48s cubic-bezier(.2,.7,.25,1) both; }
.gk98-sp--animation-pulse { animation: gk98-sp-pulse 1.8s ease-in-out 1 both; }

@media (min-width: 681px) {
	.gk98-sp--hide-desktop { display: none !important; }
}

@media (max-width: 680px) {
	.gk98-sp {
		font-size: var(--gk98-sp-font-mobile);
		margin-block: 4px 10px;
	}

	.gk98-sp__surface { gap: 7px; }
	.gk98-sp__icon {
		flex-basis: var(--gk98-sp-icon-mobile);
		width: var(--gk98-sp-icon-mobile);
		height: var(--gk98-sp-icon-mobile);
	}

	.gk98-sp--mobile-full { width: 100%; }
	.gk98-sp--hide-mobile { display: none !important; }
	.gk98-sp--glass .gk98-sp__surface { backdrop-filter: blur(8px) saturate(135%); }
	.gk98-sp--warm .gk98-sp__surface { padding-inline-end: var(--gk98-sp-pad-x); }
}

@media (prefers-reduced-motion: reduce) {
	.gk98-sp { animation: none !important; }
}