/* ==========================================================================
   Contestants — archive + profile
   ========================================================================== */
.chero--asa,
.cfilter__chip--asa { --tribe: var(--c-asa); }

.chero--ogbon,
.cfilter__chip--ogbon { --tribe: var(--c-ogbon); }

.chero--iwa,
.cfilter__chip--iwa { --tribe: var(--c-iwa); }

/* "To be revealed" ------------------------------------------------------ */
.chub__reveal-head {
	display: grid;
	gap: var(--s-3);
	margin-bottom: var(--s-7);
}

.chub__reveal-title {
	color: var(--c-text-strong);
	font-family: var(--ff-display);
	font-size: var(--fs-h2);
	font-weight: 600;
	line-height: 1.1;
}

.chub__slots {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--s-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 30em) { .chub__slots { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 48em) { .chub__slots { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 80em) { .chub__slots { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--s-3); } }

.chub__slot {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border: 1px solid var(--c-line);
	background: radial-gradient(80% 60% at 50% 30%, rgb(186 138 32 / 0.1), transparent 70%), var(--c-charcoal);
}

.chub__slot:nth-child(3n + 1) { --tribe: var(--c-asa); }
.chub__slot:nth-child(3n + 2) { --tribe: var(--c-ogbon); }
.chub__slot:nth-child(3n) { --tribe: var(--c-iwa); }

.chub__slot::before {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 2px;
	background: var(--tribe, var(--c-gold));
	opacity: 0.6;
}

.chub__slot-glyph {
	position: absolute;
	inset: 22% 20% -8%;
	color: var(--c-bone);
	opacity: 0.12;
	animation: chub-flicker 7s var(--ease-in-out) infinite;
	animation-delay: calc(var(--i) * -0.37s);
}

.chub__slot-glyph .glyph {
	width: 100%;
	height: 100%;
	stroke-width: 1;
}

.chub__slot-num {
	position: absolute;
	top: var(--s-2);
	left: var(--s-3);
	color: var(--c-text-muted);
	font-size: var(--fs-label);
	font-variant-numeric: lining-nums;
	font-weight: 700;
	letter-spacing: var(--ls-label);
}

@keyframes chub-flicker {
	0%, 100% { opacity: 0.1; }
	50% { opacity: 0.26; }
}

/* Filters --------------------------------------------------------------- */
.cfilter {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	gap: var(--s-4) var(--s-6);
	margin-bottom: var(--s-7);
	padding-bottom: var(--s-5);
	border-bottom: 1px solid var(--c-line);
}

.cfilter__group {
	display: grid;
	gap: var(--s-2);
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

.cfilter__legend {
	padding: 0;
	color: var(--c-text-muted);
	font-size: var(--fs-label);
	font-weight: 700;
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
}

.cfilter__chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-2);
}

.cfilter__chip {
	position: relative;
	cursor: pointer;
}

.cfilter__chip input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.cfilter__chip span {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	padding: 0 var(--s-4);
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-pill);
	color: var(--c-text);
	font-size: var(--fs-small);
	font-weight: 600;
	transition: background-color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out);
}

.cfilter__chip:hover span {
	border-color: var(--tribe, var(--c-gold));
}

.cfilter__chip input:checked + span {
	border-color: var(--tribe, var(--c-gold));
	background: color-mix(in srgb, var(--tribe, var(--c-gold)) 22%, transparent);
	color: var(--c-text-strong);
}

.cfilter__chip input:focus-visible + span {
	outline: 2px solid var(--c-focus);
	outline-offset: 2px;
}

.cfilter__select {
	min-height: 2.75rem;
	padding: 0 2.5rem 0 var(--s-4);
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-pill);
	background: var(--c-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23ba8a20' stroke-width='1.5'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 1rem center / 0.75rem;
	color: var(--c-text-strong);
	font: inherit;
	font-size: var(--fs-small);
	appearance: none;
}

.cfilter__select:focus-visible {
	outline: 2px solid var(--c-focus);
	outline-offset: 2px;
}

.cfilter.is-enhanced .cfilter__submit {
	display: none;
}

.cfilter__count {
	margin-left: auto;
	color: var(--c-text-muted);
	font-size: var(--fs-small);
	font-variant-numeric: lining-nums;
}

.cgrid__empty {
	padding: var(--s-7) 0;
	color: var(--c-text-muted);
	font-size: var(--fs-lead);
}

.cgrid__empty a {
	margin-left: var(--s-2);
	color: var(--c-gold);
}

/* Profile hero ---------------------------------------------------------- */
.chero {
	background:
		radial-gradient(60% 90% at 15% 30%, color-mix(in srgb, var(--tribe, var(--c-gold)) 26%, transparent), transparent 70%),
		var(--c-bg);
}

.chero__grid {
	display: grid;
	gap: var(--s-7);
	align-items: center;
}

@media (min-width: 64em) {
	.chero__grid {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: var(--s-9);
	}
}

.chero__media {
	position: relative;
	width: min(100%, 30rem);
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--tribe, var(--c-gold)) 45%, transparent);
	background:
		radial-gradient(80% 60% at 50% 30%, color-mix(in srgb, var(--tribe, var(--c-gold)) 34%, transparent), transparent 70%),
		var(--c-charcoal);
}

@media (max-width: 63.99em) {
	.chero__media {
		order: 2;
		width: min(100%, 22rem);
	}
}

.chero__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.chero__silhouette {
	position: absolute;
	inset: 22% 16% -6%;
	color: color-mix(in srgb, var(--tribe, var(--c-gold)) 55%, var(--c-bone));
	opacity: 0.5;
}

.chero__silhouette .glyph {
	width: 100%;
	height: 100%;
	stroke-width: 0.8;
}

.chero__num {
	position: absolute;
	right: var(--s-4);
	bottom: var(--s-2);
	color: var(--c-text-strong);
	font-family: var(--ff-display);
	font-size: clamp(4rem, 2rem + 6vw, 8rem);
	font-variant-numeric: lining-nums;
	font-weight: 600;
	line-height: 1;
	opacity: 0.9;
}

.chero__name {
	max-width: 14ch;
}

.chero__badges {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--s-2);
	margin: var(--s-5) 0 0;
	padding: 0;
	list-style: none;
}

.chero__badge {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	min-height: 2.75rem;
	padding: 0 var(--s-4);
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-pill);
	color: var(--c-text-strong);
	font-size: var(--fs-small);
	font-weight: 600;
	text-decoration: none;
	transition: border-color var(--dur-1) var(--ease-out);
}

.chero__badge:hover {
	border-color: var(--c-gold);
}

.chero__badge--tribe {
	border-color: var(--tribe, var(--c-gold));
	background: color-mix(in srgb, var(--tribe, var(--c-gold)) 18%, transparent);
}

.chero__badge-label {
	color: var(--c-text-muted);
	font-size: var(--fs-label);
	font-weight: 700;
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
}

.chero__quote {
	max-width: 30ch;
	margin: var(--s-6) 0 0;
	padding-left: var(--s-5);
	border-left: 2px solid var(--tribe, var(--c-gold));
	color: var(--c-gold-soft);
	font-family: var(--ff-display);
	font-size: var(--fs-h3);
	font-style: italic;
	line-height: 1.2;
}

/* Profile body ---------------------------------------------------------- */
.cprofile__grid {
	display: grid;
	gap: var(--s-8);
	align-items: start;
}

@media (min-width: 64em) {
	.cprofile__grid {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: var(--s-9);
	}
}

.cprofile__title {
	margin-bottom: var(--s-6);
	font-size: var(--fs-h2);
	text-transform: uppercase;
}

.cprofile__bio {
	margin-bottom: var(--s-6);
}

.cprofile__list {
	display: grid;
	margin: 0;
	border-top: 1px solid var(--c-line);
}

.cprofile__row {
	display: grid;
	gap: var(--s-1) var(--s-5);
	padding-block: var(--s-4);
	border-bottom: 1px solid var(--c-line);
}

@media (min-width: 40em) {
	.cprofile__row {
		grid-template-columns: 13rem minmax(0, 1fr);
	}
}

.cprofile__row dt {
	color: var(--c-text-muted);
	font-size: var(--fs-label);
	font-weight: 700;
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
}

.cprofile__row dd {
	margin: 0;
	color: var(--c-text-strong);
}

.cprofile__tension {
	display: grid;
	border: 1px solid var(--c-line-strong);
	background: var(--c-charcoal);
}

@media (min-width: 64em) {
	.cprofile__tension {
		position: sticky;
		top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--header-h) + var(--announce-h, 0px) + var(--s-6));
	}
}

.cprofile__side {
	display: grid;
	gap: var(--s-2);
	padding: var(--s-6);
}

.cprofile__side--strength {
	background: radial-gradient(90% 100% at 0% 0%, rgb(186 138 32 / 0.16), transparent 70%);
}

.cprofile__side--weakness {
	background: radial-gradient(90% 100% at 100% 100%, rgb(194 80 46 / 0.16), transparent 70%);
}

.cprofile__side-label {
	color: var(--c-gold);
	font-size: var(--fs-label);
	font-weight: 700;
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
}

.cprofile__side--weakness .cprofile__side-label {
	color: color-mix(in srgb, var(--c-asa) 60%, var(--c-bone));
}

.cprofile__side-value {
	color: var(--c-text-strong);
	font-family: var(--ff-display);
	font-size: var(--fs-h3);
	font-weight: 600;
	line-height: 1.15;
}

.cprofile__vs {
	position: relative;
	height: 1px;
	background: linear-gradient(90deg, var(--c-gold), var(--c-asa));
}

.cprofile__vs::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0.75rem;
	height: 0.75rem;
	border: 1px solid var(--c-gold);
	background: var(--c-charcoal);
	transform: translate(-50%, -50%) rotate(45deg);
}

.cquestion {
	display: grid;
	gap: var(--s-4);
	margin-top: var(--s-9);
	padding-top: var(--s-8);
	border-top: 1px solid var(--c-line);
	text-align: center;
}

.cquestion__text {
	max-width: 22ch;
	margin-inline: auto;
	color: var(--c-text-strong);
	font-family: var(--ff-display);
	font-size: var(--fs-h2);
	font-weight: 600;
	line-height: 1.1;
}

/* More + pager ---------------------------------------------------------- */
.cmore {
	border-top: 1px solid var(--c-line);
}

.cpager {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: var(--s-4);
	margin-top: var(--s-8);
	padding-top: var(--s-6);
	border-top: 1px solid var(--c-line);
}

.cmore--compact {
	padding-block: var(--s-6) var(--s-8);
}

.cmore--compact .cpager {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.cpager__link {
	display: grid;
	gap: var(--s-1);
	min-height: 2.75rem;
	color: var(--c-text-strong);
	text-decoration: none;
}

.cpager__link--prev { grid-column: 1; }

.cpager__link--next {
	grid-column: 3;
	text-align: right;
}

.cpager__dir {
	color: var(--c-gold);
	font-size: var(--fs-label);
	font-weight: 700;
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
}

.cpager__name {
	font-family: var(--ff-display);
	font-size: var(--fs-h4);
	line-height: 1.2;
}

.cpager__link:hover .cpager__name {
	color: var(--c-gold-soft);
}

.cpager__all {
	grid-column: 2;
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	color: var(--c-text-muted);
	font-size: var(--fs-small);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.cpager__all:hover {
	color: var(--c-gold);
}

@media (max-width: 39.99em) {
	.cpager {
		grid-template-columns: 1fr 1fr;
	}

	.cpager__all {
		grid-column: 1 / -1;
		grid-row: 2;
		justify-content: center;
	}

	.cpager__link--next { grid-column: 2; }
}
