/* =========================================================================
 * Predictor community (2026-09-19) — badges, ♥ Follow, the detailed
 * leaderboard rows, predictor profiles and the account-page additions.
 * Markup: inc/psp-community.php, Proace_Badges::html(), Proace_Follows::button(),
 * psp_render_podium() and psp_account_dashboard() in functions.php.
 * Loaded on the homepage, posts, Leaderboard, Predictions and My Account.
 * ======================================================================= */

:root {
	--psp-c-gold: #ffb020;
	--psp-c-ice: #eaf4ff;
	--psp-c-ice-2: rgba( 234, 244, 255, 0.78 );
	--psp-c-ice-3: rgba( 234, 244, 255, 0.55 );
	--psp-c-line: rgba( 255, 255, 255, 0.09 );
	--psp-c-card: rgba( 13, 30, 57, 0.92 );
	--psp-c-heart: #ff5d7a;
	--psp-c-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
	--psp-c-display: 'Outfit', 'PT Sans', sans-serif;
}

.screen-reader-text:not( :focus ) {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}

/* -------------------------------------------------------------------------
 * Badge pill — tier colours escalate subtly; only the top tiers glow.
 * ---------------------------------------------------------------------- */

.proace-badge {
	--b1: #7f93ad;
	--b2: #52637a;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	max-width: 100%;
	padding: 3px 10px 3px 7px;
	border-radius: 999px;
	border: 1px solid color-mix( in srgb, var( --b1 ) 55%, transparent );
	background: linear-gradient( 135deg, color-mix( in srgb, var( --b1 ) 26%, transparent ), color-mix( in srgb, var( --b2 ) 14%, transparent ) );
	color: #ffffff;
	font-family: var( --psp-c-display );
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.01em;
	white-space: nowrap;
	vertical-align: middle;
}

.proace-badge__icon {
	font-size: 1.05em;
	line-height: 1;
}

.proace-badge__name {
	overflow: hidden;
	text-overflow: ellipsis;
}

.proace-badge--sm {
	padding: 2px 8px 2px 6px;
	font-size: 11px;
}

.proace-badge--lg {
	padding: 6px 14px 6px 10px;
	font-size: 14px;
}

.proace-badge--tier-2 { --b1: #4fd1c5; --b2: #1e6b7a; }
.proace-badge--tier-3 { --b1: #3a86e0; --b2: #1e5087; }
.proace-badge--tier-4 { --b1: #ffb020; --b2: #a8680a; }
.proace-badge--tier-5 { --b1: #c77dff; --b2: #5a3a8a; }
.proace-badge--tier-6 { --b1: #6ee7ff; --b2: #3a4ce0; }
.proace-badge--tier-7 { --b1: #ffe066; --b2: #ff6b6b; }

.proace-badge--tier-5,
.proace-badge--tier-6,
.proace-badge--tier-7 {
	box-shadow: 0 0 18px -6px var( --b1 );
}

/* -------------------------------------------------------------------------
 * ♥ Follow button (Proace_Follows::button)
 * ---------------------------------------------------------------------- */

.proace-follow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	min-height: 40px;
	padding: 0 16px;
	border-radius: 999px;
	border: 1px solid rgba( 255, 93, 122, 0.45 );
	background: rgba( 255, 93, 122, 0.08 );
	color: #ffd6de;
	font-family: var( --psp-c-display );
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none !important;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
}

.proace-follow:hover {
	background: rgba( 255, 93, 122, 0.16 );
	border-color: var( --psp-c-heart );
	color: #ffffff;
}

.proace-follow:active {
	transform: scale( 0.96 );
}

.proace-follow:focus-visible {
	outline: 3px solid rgba( 255, 176, 32, 0.8 );
	outline-offset: 2px;
}

.proace-follow__heart {
	flex: none;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.2;
	stroke-linejoin: round;
	transition: fill 0.2s ease, transform 0.2s ease;
}

.proace-follow.is-following {
	/* Deep enough for white text (the lighter pink measured under 3:1). */
	background: linear-gradient( 135deg, #e2385c, #b51d42 );
	border-color: transparent;
	color: #ffffff;
	box-shadow: 0 8px 20px -10px rgba( 255, 93, 122, 0.8 );
}

.proace-follow.is-following .proace-follow__heart {
	fill: currentColor;
}

.proace-follow.is-bump .proace-follow__heart {
	animation: psp-heart-bump 0.45s ease;
}

@keyframes psp-heart-bump {
	0% { transform: scale( 1 ); }
	40% { transform: scale( 1.35 ); }
	100% { transform: scale( 1 ); }
}

.proace-follow.is-error {
	border-color: #ff6b6b;
	animation: psp-shake 0.35s ease;
}

@keyframes psp-shake {
	25% { transform: translateX( -3px ); }
	75% { transform: translateX( 3px ); }
}

.proace-follow__count {
	padding-left: 8px;
	margin-left: 1px;
	border-left: 1px solid currentColor;
	border-left-color: color-mix( in srgb, currentColor 35%, transparent );
	font-family: var( --psp-c-mono );
	font-size: 12px;
	font-weight: 700;
}

.proace-follow--sm {
	min-height: 36px;
	padding: 0 12px;
	gap: 6px;
	font-size: 12.5px;
}

.proace-follow--sm .proace-follow__heart {
	width: 14px;
	height: 14px;
}

/* Own card: just the heart + count, not a button. */
.proace-follow--static {
	cursor: default;
	background: transparent;
	border-color: var( --psp-c-line );
	color: var( --psp-c-ice-2 );
}

.proace-follow--static:hover {
	background: transparent;
	border-color: var( --psp-c-line );
	color: var( --psp-c-ice-2 );
}

.proace-follow--static .proace-follow__heart {
	fill: var( --psp-c-heart );
	stroke: var( --psp-c-heart );
}

/* -------------------------------------------------------------------------
 * Leaderboard page — filters, your position, ranked rows
 * ---------------------------------------------------------------------- */

.cricket-lb .cricket-lb-filters,
.cricket-lb .cricket-lb-you,
.cricket-lb .cricket-lb-toolbar,
.cricket-lb .cricket-lb-list,
.cricket-lb .cricket-lb-pager,
.cricket-lb .cricket-lb-footnote {
	max-width: 1080px;
	margin-left: auto;
	margin-right: auto;
}

.cricket-lb-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 18px;
	margin-bottom: 22px;
}

.cricket-lb-filters .cricket-predictions-tabs {
	margin: 0;
}

.cricket-lb-filters__period {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.cricket-lb-chip {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: 0 14px;
	border-radius: 999px;
	border: 1px solid var( --psp-c-line );
	background: rgba( 6, 16, 34, 0.55 );
	color: var( --psp-c-ice-2 ) !important;
	font-family: var( --psp-c-mono );
	font-size: 12px;
	font-weight: 700;
	text-decoration: none !important;
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.cricket-lb-chip:hover,
.cricket-lb-chip:focus-visible {
	border-color: rgba( 255, 176, 32, 0.6 );
	color: #ffffff !important;
}

.cricket-lb-chip.is-active {
	border-color: var( --psp-c-gold );
	background: rgba( 255, 176, 32, 0.14 );
	color: #ffd27a !important;
}

/* In-place filter swaps (js/cricket-leaderboard.js) */
.cricket-lb-results {
	transition: opacity 0.2s ease;
}

.cricket-lb-results.is-loading {
	opacity: 0.45;
	pointer-events: none;
}

/* Your position */
.cricket-leaderboard-page .cricket-lb-you {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 22px;
	padding: 16px 20px;
	margin-bottom: 26px;
}

.cricket-lb-you__who {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
	flex: 1 1 240px;
	color: inherit !important;
	text-decoration: none !important;
}

.cricket-lb-you__who .cricket-leaderboard-you__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
	min-width: 0;
}

.cricket-leaderboard-page .cricket-lb-you__stats {
	display: grid;
	grid-template-columns: repeat( 6, minmax( 0, auto ) );
	gap: 6px 20px;
	margin-left: auto;
}

.cricket-lb-you__stats span {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.cricket-lb-you__stats b {
	font-family: var( --psp-c-display );
	font-size: 20px;
	font-weight: 800;
	color: #ffffff;
	line-height: 1.1;
}

.cricket-lb-you__stats small {
	font-family: var( --psp-c-mono );
	font-size: 10px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

/* Toolbar */
.cricket-lb-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 16px;
	margin-bottom: 14px;
}

.cricket-lb-toolbar .cricket-leaderboard-search {
	flex: 1 1 280px;
	max-width: 440px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.cricket-lb-toolbar .cricket-leaderboard-search input {
	flex: 1;
	min-width: 0;
	border: 0;
	background: transparent;
	outline: none;
}

.cricket-lb-toolbar__clear {
	font-size: 12px;
	font-weight: 700;
	color: var( --psp-c-gold ) !important;
}

/* Rows: a grid "table" on desktop */
.cricket-lb-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.cricket-lb-row {
	display: grid;
	grid-template-columns: 74px minmax( 210px, 1.7fr ) 92px minmax( 86px, 1fr ) minmax( 86px, 1fr ) minmax( 96px, 1fr ) 200px;
	align-items: center;
	gap: 12px;
	padding: 12px 18px;
	border-radius: 16px;
	border: 1px solid var( --psp-c-line );
	background: var( --psp-c-card );
	color: var( --psp-c-ice-2 );
	transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.cricket-lb-row:not( .cricket-lb-row--head ):hover {
	border-color: rgba( 255, 176, 32, 0.35 );
	transform: translateY( -2px );
	box-shadow: 0 16px 34px -22px rgba( 0, 0, 0, 0.9 );
}

.cricket-lb-row--head {
	padding-top: 2px;
	padding-bottom: 2px;
	border: 0;
	background: transparent;
	font-family: var( --psp-c-mono );
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

.cricket-lb-row.is-you {
	border-color: rgba( 255, 176, 32, 0.55 );
	background:
		radial-gradient( 60% 140% at 0% 50%, rgba( 255, 176, 32, 0.14 ), transparent 70% ),
		var( --psp-c-card );
}

.cricket-lb-row.is-top-1 { border-color: rgba( 255, 197, 61, 0.5 ); }
.cricket-lb-row.is-top-2 { border-color: rgba( 199, 210, 224, 0.45 ); }
.cricket-lb-row.is-top-3 { border-color: rgba( 232, 160, 107, 0.45 ); }

.cricket-lb-row__rank {
	display: flex;
	align-items: center;
	gap: 6px;
}

.cricket-lb-row__rank b {
	font-family: var( --psp-c-display );
	font-size: 18px;
	font-weight: 800;
	color: #ffffff;
}

.cricket-lb-medal {
	font-size: 20px;
	line-height: 1;
}

.cricket-lb-who {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
	color: inherit !important;
	text-decoration: none !important;
}

.cricket-lb-who__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	min-width: 0;
}

.cricket-lb-who__name {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var( --psp-c-display );
	font-size: 16px;
	font-weight: 800;
	color: #ffffff;
}

.cricket-lb-who:hover .cricket-lb-who__name,
.cricket-lb-who:focus-visible .cricket-lb-who__name {
	color: #ffd27a;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.cricket-lb-who__name em {
	margin-left: 4px;
	padding: 1px 6px;
	border-radius: 6px;
	background: rgba( 255, 176, 32, 0.18 );
	font-family: var( --psp-c-mono );
	font-size: 10px;
	font-style: normal;
	color: #ffd27a;
	text-transform: uppercase;
}

.cricket-lb-row__pts {
	display: flex;
	flex-direction: column;
	line-height: 1.1;
}

.cricket-lb-row__pts b {
	font-family: var( --psp-c-display );
	font-size: 24px;
	font-weight: 900;
	color: var( --psp-c-gold );
}

.cricket-lb-row__pts small,
.cricket-lb-stat small {
	font-family: var( --psp-c-mono );
	font-size: 10.5px;
	color: var( --psp-c-ice-3 );
	white-space: nowrap;
}

.cricket-lb-stat {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.cricket-lb-stat b {
	font-family: var( --psp-c-display );
	font-size: 16px;
	font-weight: 800;
	color: #ffffff;
}

.cricket-lb-stat b i {
	font-style: normal;
	font-weight: 600;
	color: var( --psp-c-ice-3 );
}

.cricket-lb-stat--none b {
	color: var( --psp-c-ice-3 );
}

.cricket-lb-row__social {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
}

.cricket-lb-row__profile {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 0 12px;
	border-radius: 999px;
	border: 1px solid var( --psp-c-line );
	color: var( --psp-c-ice-2 ) !important;
	font-size: 12.5px;
	font-weight: 700;
	text-decoration: none !important;
	white-space: nowrap;
}

.cricket-lb-row__profile:hover,
.cricket-lb-row__profile:focus-visible {
	border-color: rgba( 255, 176, 32, 0.6 );
	color: #ffffff !important;
}

.cricket-lb-pager {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 24px;
}

.cricket-lb-footnote {
	margin-top: 26px;
	font-size: 12.5px;
	line-height: 1.6;
	text-align: center;
	color: var( --psp-c-ice-3 );
}

/* Podium additions (shared homepage + Leaderboard page) */
.cricket-podium__place > .proace-badge {
	margin: 2px auto 6px;
}

/* These were <div>s before they became profile links — keep block flow. */
a.cricket-podium__name,
a.cricket-podium__top {
	display: block;
	color: inherit !important;
	text-decoration: none !important;
}

a.cricket-podium__top {
	display: inline-block; /* same as the original .cricket-podium__top div */
}

a.cricket-podium__name:hover,
a.cricket-podium__name:focus-visible {
	color: #ffd27a !important;
}

.cricket-podium__follow {
	display: flex;
	justify-content: center;
	margin-top: 12px;
}

/* Tablet: fold Match/Toss/Accuracy into narrower columns */
@media ( max-width: 1100px ) {
	.cricket-lb-row {
		grid-template-columns: 58px minmax( 170px, 1.6fr ) 78px repeat( 3, minmax( 70px, 1fr ) ) 150px;
		gap: 10px;
		padding: 12px 14px;
	}

	.cricket-lb-row__profile {
		display: none;
	}

	.cricket-leaderboard-page .cricket-lb-you__stats {
		grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
		margin-left: 0;
		width: 100%;
	}
}

/* Phones: every row becomes a predictor card */
@media ( max-width: 760px ) {
	.cricket-lb-row--head {
		display: none;
	}

	.cricket-lb-row {
		/* Six equal tracks so the stat row never widens the name column. */
		grid-template-columns: repeat( 6, minmax( 0, 1fr ) );
		grid-template-areas:
			"rank who who who who pts"
			"match match toss toss acc acc"
			"social social social social social social";
		gap: 12px 10px;
		padding: 14px;
	}

	.cricket-lb-row__rank { grid-area: rank; }
	.cricket-lb-row__who { grid-area: who; min-width: 0; }
	.cricket-lb-row__pts { grid-area: pts; text-align: right; align-items: flex-end; }
	.cricket-lb-row__match { grid-area: match; }
	.cricket-lb-row__toss { grid-area: toss; }
	.cricket-lb-row__acc { grid-area: acc; }
	.cricket-lb-row__social { grid-area: social; justify-content: space-between; }

	.cricket-lb-row__match,
	.cricket-lb-row__toss,
	.cricket-lb-row__acc {
		min-width: 0;
		padding: 8px 10px;
		border-radius: 10px;
		background: rgba( 255, 255, 255, 0.04 );
	}

	.cricket-lb-row__match::before,
	.cricket-lb-row__toss::before,
	.cricket-lb-row__acc::before {
		content: attr( data-label );
		display: block;
		margin-bottom: 2px;
		font-family: var( --psp-c-mono );
		font-size: 9.5px;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var( --psp-c-ice-3 );
	}

	.cricket-lb-row__acc .cricket-acc {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
	}

	.cricket-lb-row__acc .cricket-acc__bar {
		width: 100%;
	}

	.cricket-lb-row__profile {
		display: inline-flex;
		min-height: 40px;
	}

	.cricket-lb-row__social .proace-follow {
		flex: 1;
		min-height: 40px;
	}

	.cricket-lb-row__rank b { font-size: 16px; }
	.cricket-lb-medal { font-size: 18px; }
	.cricket-lb-who .psp-avatar { width: 36px !important; height: 36px !important; font-size: 14px !important; }
	.cricket-lb-row__pts b { font-size: 22px; }
	/* The Match / Toss boxes below already give the split. */
	.cricket-lb-row__pts small { display: none; }
	.cricket-lb-row__pts b::after {
		content: " pts";
		font-family: var( --psp-c-mono );
		font-size: 10px;
		font-weight: 700;
		color: var( --psp-c-ice-3 );
	}

	.cricket-leaderboard-page .cricket-lb-you__stats {
		grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
		gap: 12px 8px;
	}

	.cricket-lb-filters {
		flex-direction: column;
		align-items: stretch;
	}

	.cricket-lb-filters__period {
		justify-content: center;
	}
}

/* -------------------------------------------------------------------------
 * Predictor profile
 * ---------------------------------------------------------------------- */

.cricket-profile .container > * {
	max-width: 1080px;
	margin-left: auto;
	margin-right: auto;
}

.cricket-profile .cricket-leaderboard-page__crumb {
	margin-bottom: 18px;
}

.cricket-profile__missing {
	padding: 60px 0;
	text-align: center;
	color: var( --psp-c-ice-2 );
}

.cricket-profile__hero {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 26px;
	padding: 26px;
	border-radius: 22px;
	border: 1px solid rgba( 255, 176, 32, 0.28 );
	background:
		radial-gradient( 70% 140% at 0% 0%, rgba( 255, 176, 32, 0.16 ), transparent 60% ),
		radial-gradient( 60% 120% at 100% 100%, rgba( 58, 134, 224, 0.2 ), transparent 60% ),
		rgba( 10, 24, 48, 0.88 );
	box-shadow: 0 30px 60px -34px rgba( 0, 0, 0, 0.9 );
}

.cricket-profile__avatar-ring {
	flex: none;
	padding: 5px;
	border-radius: 50%;
	background: conic-gradient( from 200deg, #ffb020, #3a86e0, #4fd1c5, #ffb020 );
}

.cricket-profile__avatar-ring .psp-avatar {
	border: 3px solid #0a1e38;
}

.cricket-profile__id {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	min-width: 0;
	flex: 1 1 260px;
}

.cricket-profile__name {
	margin: 0;
	font-family: var( --psp-c-display );
	font-size: clamp( 28px, 4vw, 42px );
	font-weight: 900;
	line-height: 1.05;
	color: #ffffff;
	overflow-wrap: anywhere;
}

.cricket-profile__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	font-family: var( --psp-c-mono );
	font-size: 12px;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__rank {
	color: #ffd27a;
	font-weight: 700;
}

.cricket-profile__social {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 14px;
	margin-left: auto;
}

.cricket-profile__counts {
	display: flex;
	gap: 22px;
}

.cricket-profile__counts span {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cricket-profile__counts b {
	font-family: var( --psp-c-display );
	font-size: 26px;
	font-weight: 900;
	color: #ffffff;
	line-height: 1.1;
}

.cricket-profile__counts small {
	font-family: var( --psp-c-mono );
	font-size: 10.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__social .proace-follow {
	min-width: 150px;
	min-height: 46px;
	font-size: 15px;
}

.cricket-profile__you {
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px dashed var( --psp-c-line );
	font-size: 12.5px;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__tiles {
	display: grid;
	grid-template-columns: repeat( 6, minmax( 0, 1fr ) );
	gap: 12px;
	margin: 18px auto;
}

.cricket-profile__tile {
	--t: #3a86e0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px 14px;
	border-radius: 16px;
	border: 1px solid color-mix( in srgb, var( --t ) 30%, transparent );
	background:
		radial-gradient( 90% 90% at 0% 0%, color-mix( in srgb, var( --t ) 18%, transparent ), transparent 70% ),
		var( --psp-c-card );
}

.cricket-profile__tile--gold { --t: #ffb020; }
.cricket-profile__tile--green { --t: #4fd18b; }
.cricket-profile__tile--teal { --t: #4fd1c5; }
.cricket-profile__tile--coral { --t: #ff6b6b; }
.cricket-profile__tile--violet { --t: #c77dff; }

.cricket-profile__tile b {
	font-family: var( --psp-c-display );
	font-size: 24px;
	font-weight: 900;
	color: #ffffff;
	line-height: 1.1;
}

.cricket-profile__tile small {
	font-family: var( --psp-c-mono );
	font-size: 10.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__grid {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 16px;
	margin-bottom: 16px;
}

.cricket-profile__panel {
	padding: 20px;
	border-radius: 18px;
	border: 1px solid var( --psp-c-line );
	background: var( --psp-c-card );
	margin-bottom: 16px;
}

.cricket-profile__grid > .cricket-profile__panel {
	margin-bottom: 0;
}

.cricket-profile__h {
	margin: 0 0 14px;
	font-family: var( --psp-c-display );
	font-size: 18px;
	font-weight: 800;
	color: #ffffff;
}

.cricket-profile__split {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 12px;
}

.cricket-profile__part {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 14px;
	border-radius: 14px;
	background: rgba( 255, 255, 255, 0.04 );
	border: 1px solid var( --psp-c-line );
}

.cricket-profile__part--match { border-top: 3px solid #ffb020; }
.cricket-profile__part--toss { border-top: 3px solid #4fd1c5; }

.cricket-profile__part-h {
	font-family: var( --psp-c-mono );
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --psp-c-ice-2 );
}

.cricket-profile__part-big {
	font-family: var( --psp-c-display );
	font-size: 30px;
	font-weight: 900;
	color: #ffffff;
	line-height: 1.05;
}

.cricket-profile__part-big i {
	font-style: normal;
	font-size: 18px;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__part-sub,
.cricket-profile__part-none {
	font-size: 13px;
	color: var( --psp-c-ice-2 );
}

.cricket-profile__part .cricket-acc__bar,
.cricket-profile__req .cricket-acc__bar {
	width: 100%;
}

.cricket-profile__part-pts {
	font-family: var( --psp-c-mono );
	font-size: 12px;
	font-weight: 700;
	color: var( --psp-c-gold );
}

.cricket-profile__formula {
	margin: 14px 0 0;
	padding: 10px 12px;
	border-radius: 10px;
	background: rgba( 255, 176, 32, 0.08 );
	font-family: var( --psp-c-mono );
	font-size: 12px;
	line-height: 1.6;
	color: #ffe2a3;
}

.cricket-profile__level {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.cricket-profile__next {
	margin: 4px 0 0;
	font-size: 14px;
	color: var( --psp-c-ice-2 );
}

.cricket-profile__req {
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 100%;
	font-size: 12.5px;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__empty {
	margin: 0;
	font-size: 14px;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__history {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cricket-profile__match {
	padding: 12px 14px;
	border-radius: 14px;
	background: rgba( 255, 255, 255, 0.04 );
	border: 1px solid var( --psp-c-line );
}

.cricket-profile__match-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 8px;
	font-family: var( --psp-c-display );
	font-size: 15px;
	font-weight: 800;
	color: #ffffff;
}

.cricket-profile__match-head a {
	color: #ffffff !important;
	text-decoration: none !important;
}

.cricket-profile__match-head a:hover,
.cricket-profile__match-head a:focus-visible {
	color: #ffd27a !important;
	text-decoration: underline !important;
}

.cricket-profile__match-total {
	flex: none;
	font-family: var( --psp-c-mono );
	font-size: 13px;
	color: var( --psp-c-gold );
}

.cricket-profile__match-rows {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.cricket-profile__pick {
	display: grid;
	grid-template-columns: 52px 22px minmax( 0, 1fr ) auto;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var( --psp-c-ice-2 );
}

.cricket-profile__pick-type {
	font-family: var( --psp-c-mono );
	font-size: 10.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__pick-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	font-size: 12px;
	font-weight: 900;
}

.cricket-profile__pick.is-hit .cricket-profile__pick-mark {
	background: rgba( 79, 209, 139, 0.18 );
	color: #4fd18b;
}

.cricket-profile__pick.is-miss .cricket-profile__pick-mark {
	background: rgba( 255, 107, 107, 0.16 );
	color: #ff8a8a;
}

.cricket-profile__pick-text {
	min-width: 0;
	overflow-wrap: anywhere;
}

.cricket-profile__pick-text small {
	margin-left: 4px;
	color: var( --psp-c-ice-3 );
}

.cricket-profile__pick-pts {
	font-family: var( --psp-c-mono );
	font-weight: 700;
	color: var( --psp-c-ice-2 );
}

.cricket-profile__pick.is-hit .cricket-profile__pick-pts {
	color: #4fd18b;
}

.cricket-profile__people {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cricket-profile__people li > a,
.cricket-profile__people li > .psp-avatar {
	text-decoration: none !important;
}

.cricket-profile__people li {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 4px 12px 4px 4px;
	border-radius: 999px;
	border: 1px solid var( --psp-c-line );
	background: rgba( 255, 255, 255, 0.03 );
	font-size: 13px;
	font-weight: 600;
	color: var( --psp-c-ice-2 );
}

.cricket-profile__people a {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var( --psp-c-ice ) !important;
}

.cricket-profile__people a:hover span,
.cricket-profile__people a:focus-visible span {
	color: #ffd27a;
	text-decoration: underline;
}

@media ( max-width: 991px ) {
	.cricket-profile__tiles {
		grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	}

	.cricket-profile__grid,
	.cricket-profile__history {
		grid-template-columns: minmax( 0, 1fr );
	}
}

@media ( max-width: 600px ) {
	.cricket-profile__hero {
		flex-direction: column;
		align-items: center;
		padding: 22px 16px;
		text-align: center;
	}

	.cricket-profile__id {
		align-items: center;
		flex-basis: auto;
	}

	.cricket-profile__meta {
		justify-content: center;
	}

	.cricket-profile__social {
		align-items: stretch;
		width: 100%;
		margin-left: 0;
	}

	.cricket-profile__counts {
		justify-content: center;
	}

	.cricket-profile__social .proace-follow {
		width: 100%;
	}

	.cricket-profile__tiles {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
		gap: 10px;
	}

	.cricket-profile__split {
		grid-template-columns: minmax( 0, 1fr );
	}

	.cricket-profile__panel {
		padding: 16px;
	}
}

/* -------------------------------------------------------------------------
 * My Account dashboard additions
 * ---------------------------------------------------------------------- */

.cricket-dash__community {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 20px;
	margin: 0 0 22px;
	padding: 14px 18px;
	border-radius: 16px;
	border: 1px solid rgba( 255, 93, 122, 0.25 );
	background:
		radial-gradient( 60% 140% at 100% 50%, rgba( 255, 93, 122, 0.12 ), transparent 70% ),
		rgba( 10, 24, 48, 0.75 );
}

.cricket-dash__community-stats {
	display: grid;
	grid-template-columns: repeat( 4, minmax( 0, auto ) );
	gap: 8px 28px;
}

.cricket-dash__community-stats span {
	display: flex;
	flex-direction: column;
}

.cricket-dash__community-stats b {
	font-family: var( --psp-c-display );
	font-size: 22px;
	font-weight: 900;
	color: #ffffff;
	line-height: 1.1;
}

.cricket-dash__community-stats b i {
	font-style: normal;
	font-size: 14px;
	color: var( --psp-c-ice-3 );
}

.cricket-dash__community-stats small {
	font-family: var( --psp-c-mono );
	font-size: 10.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

.cricket-dash__profile-link {
	font-weight: 700;
	color: #ffd27a !important;
}

.cricket-dash__following {
	margin-top: 22px;
}

.cricket-dash__people {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 250px, 1fr ) );
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cricket-dash__person {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 10px;
	border-radius: 14px;
	border: 1px solid var( --psp-c-line );
	background: rgba( 255, 255, 255, 0.03 );
}

.cricket-dash__person-link {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	color: inherit !important;
	text-decoration: none !important;
}

.cricket-dash__person-link span {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.cricket-dash__person-link b {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #ffffff;
}

.cricket-dash__person-link small {
	font-family: var( --psp-c-mono );
	font-size: 11px;
	color: var( --psp-c-ice-3 );
}

@media ( max-width: 600px ) {
	.cricket-dash__community-stats {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
		width: 100%;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.proace-follow,
	.proace-follow__heart,
	.cricket-lb-row {
		transition: none;
	}

	.proace-follow.is-bump .proace-follow__heart,
	.proace-follow.is-error {
		animation: none;
	}

	.cricket-lb-row:not( .cricket-lb-row--head ):hover {
		transform: none;
	}
}

/* -------------------------------------------------------------------------
 * Badge levels ladder (Leaderboard page, 2026-09-19)
 * ---------------------------------------------------------------------- */

.cricket-badges {
	max-width: 1080px;
	margin: 44px auto 0;
}

.cricket-badges__head {
	margin-bottom: 20px;
	text-align: center;
}

.cricket-badges__eyebrow {
	font-family: var( --psp-c-mono );
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --psp-c-gold );
}

.cricket-badges__title {
	margin: 6px 0 8px;
	font-family: var( --psp-c-display );
	font-size: clamp( 24px, 3vw, 32px );
	font-weight: 800;
	color: var( --psp-c-ice );
}

.cricket-badges__sub {
	max-width: 620px;
	margin: 0 auto;
	font-size: 14px;
	line-height: 1.6;
	color: var( --psp-c-ice-2 );
}

.cricket-badges__mine {
	--b1: #7f93ad;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px 14px;
	max-width: 760px;
	margin: 0 auto 20px;
	padding: 12px 18px;
	border-radius: 16px;
	border: 1px solid color-mix( in srgb, var( --b1 ) 45%, transparent );
	background: linear-gradient( 135deg, color-mix( in srgb, var( --b1 ) 14%, transparent ), rgba( 13, 30, 57, 0.6 ) );
	box-shadow: none;
}

.cricket-badges__mine-label {
	font-family: var( --psp-c-mono );
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

.cricket-badges__mine-next {
	font-size: 13px;
	color: var( --psp-c-ice-2 );
}

.cricket-badges__mine-next b {
	color: var( --psp-c-ice );
}

.cricket-badges__ladder {
	display: grid;
	grid-template-columns: repeat( 7, minmax( 0, 1fr ) );
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cricket-badges__level {
	--b1: #7f93ad;
	--b2: #52637a;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	min-width: 0;
	padding: 16px 10px 14px;
	border-radius: 16px;
	text-align: center;
	background: linear-gradient( 180deg, color-mix( in srgb, var( --b1 ) 16%, rgba( 13, 30, 57, 0.92 ) ), var( --psp-c-card ) 70% );
	border: 1px solid color-mix( in srgb, var( --b1 ) 30%, transparent );
	box-shadow: none;
	animation: cricket-badge-in 0.5s ease both;
	animation-delay: calc( var( --i, 1 ) * 60ms );
	transition: transform 0.25s ease, border-color 0.25s ease;
}

.cricket-badges__level:hover {
	transform: translateY( -3px );
	border-color: color-mix( in srgb, var( --b1 ) 60%, transparent );
}

.cricket-badges__level.is-mine {
	border-color: var( --b1 );
	box-shadow: 0 0 0 3px color-mix( in srgb, var( --b1 ) 22%, transparent ), 0 14px 30px -14px var( --b1 );
}

.cricket-badges__tier {
	font-family: var( --psp-c-mono );
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --psp-c-ice-3 );
}

.cricket-badges__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin: 2px 0;
	border-radius: 50%;
	font-size: 24px;
	line-height: 1;
	background: radial-gradient( circle at 35% 30%, color-mix( in srgb, var( --b1 ) 55%, transparent ), color-mix( in srgb, var( --b2 ) 35%, transparent ) );
	border: 1px solid color-mix( in srgb, var( --b1 ) 60%, transparent );
}

.cricket-badges__level.proace-badge--tier-5 .cricket-badges__icon,
.cricket-badges__level.proace-badge--tier-6 .cricket-badges__icon,
.cricket-badges__level.proace-badge--tier-7 .cricket-badges__icon {
	box-shadow: 0 0 22px -4px var( --b1 );
}

.cricket-badges__name {
	font-family: var( --psp-c-display );
	font-size: 14px;
	font-weight: 800;
	line-height: 1.25;
	color: var( --psp-c-ice );
}

.cricket-badges__reqs {
	display: grid;
	gap: 2px;
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
	font-size: 11.5px;
	line-height: 1.4;
	color: var( --psp-c-ice-2 );
}

.cricket-badges__reqs b {
	font-family: var( --psp-c-mono );
	color: var( --b1 );
}

.cricket-badges__holders {
	margin-top: auto;
	padding: 3px 9px;
	border-radius: 999px;
	font-family: var( --psp-c-mono );
	font-size: 10px;
	font-weight: 700;
	color: var( --psp-c-ice-2 );
	background: rgba( 255, 255, 255, 0.06 );
}

.cricket-badges__you {
	position: absolute;
	top: -9px;
	right: 10px;
	padding: 2px 8px;
	border-radius: 999px;
	font-family: var( --psp-c-mono );
	font-size: 9.5px;
	font-weight: 800;
	text-transform: uppercase;
	color: #0a1830;
	background: var( --b1 );
}

@keyframes cricket-badge-in {
	from { opacity: 0; transform: translateY( 10px ); }
	to { opacity: 1; transform: none; }
}

@media ( max-width: 1100px ) {
	.cricket-badges__ladder {
		grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
	}
}

@media ( max-width: 767px ) {
	.cricket-badges__ladder {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.cricket-badges__level {
		animation: none;
		transition: none;
	}
}