/* Player competition page (GEEK-50): identity strip, arcade tab strip, dense sortable tables, heat medals. */
.pl { max-width: 1320px; margin: 0 auto; padding: 12px 16px 60px; }
.pl-hero { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin: 0 0 12px; padding: 12px 19px; border: 1px solid #31506a; border-left: 5px solid var(--gc-yellow, #ffce42);
	border-radius: 2px; background: linear-gradient(90deg, #14233b, #0a1220); }
.pl-avatar { display: grid; place-items: center; flex: none; width: 67px; height: 67px; border: 2px solid var(--gc-yellow, #ffce42); border-radius: 2px; background: #0a1627;
	color: var(--gc-yellow, #ffce42); font: 900 27px Consolas, monospace; box-shadow: inset 0 0 0 4px #08101e, 0 0 15px rgba(255, 206, 66, .13); }
.pl-identity { flex: 1; min-width: 180px; }
.pl-identity h2 { margin: 0; font-size: 34px; letter-spacing: 4px; text-shadow: 2px 2px #263f5a; }
.pl-identity p { margin: 4px 0; color: var(--gc-muted); font-size: 12px; }
.pl-stats { display: flex; flex-wrap: wrap; margin: 0 0 0 auto; }
.pl-stats > div { min-width: 100px; padding: 6px 19px; border-left: 1px solid #33495d; text-align: center; }
.pl-stats dt { color: #a1b8c9; font-size: 10px; font-weight: 400; letter-spacing: 1px; white-space: nowrap; }
.pl-stats dd { margin: 0; color: var(--gc-yellow, #ffce42); font: 700 25px Consolas, monospace; }

/* Three flush arcade tabs with circular count buttons */
.pl-tabs { display: flex; gap: 0; border-bottom: 3px solid var(--gc-cyan); background: #0a1424; }
.pl-tab { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: clamp(7px, 1.1vw, 17px); min-width: 0; margin: 0; padding: clamp(13px, 1.5vw, 21px) clamp(9px, 1.6vw, 25px);
	border: 1px solid #47617a; border-bottom: 0; border-radius: 9px 9px 0 0; background: linear-gradient(#1d3046, #101d30); box-shadow: inset 0 3px #32485e; color: #b6cce0;
	font: 400 clamp(12px, 1.1vw, 17px) Consolas, monospace; letter-spacing: 1.1px; white-space: nowrap; cursor: pointer;
	transition: background-color .18s ease, box-shadow .18s ease, color .18s ease, filter .18s ease; }
.pl-tab + .pl-tab { border-left: 1px solid #47617a; }
.pl-tab:not(.active):hover { background: linear-gradient(#29445e, #172b41); box-shadow: inset 0 3px #4c7089; color: #eefaff; }
.pl-tab.active { background: var(--gc-cyan); border-color: var(--gc-cyan); box-shadow: inset 0 4px #a4faff; color: #06101a; font-weight: 900; }
.pl-tab.active:hover { filter: brightness(1.055); }
.pl-tab:focus-visible { outline: 2px solid var(--gc-yellow, #ffce42); outline-offset: -3px; }
.pl-count { display: inline-grid; place-items: center; min-width: 38px; height: 38px; padding: 0 7px; border: 3px solid #49200d; border-radius: 50%;
	background: radial-gradient(circle at 34% 24%, #f9e8a6 0%, #f4a92e 28%, #c96613 68%, #79300b 100%); box-shadow: 0 3px 0 #080d14, 0 4px 0 #627489, inset 0 2px 3px rgba(255, 246, 173, .53);
	color: #231004; font: 900 15px Consolas, monospace; text-shadow: 0 1px #ffe49a; }
.pl-tab.active .pl-count { background: radial-gradient(circle at 35% 24%, #faffff, #55dfea 38%, #128da9 80%); border-color: #075d74; box-shadow: 0 3px 0 #0b3d4c, 0 4px 0 #e3ffff, inset 0 2px 4px rgba(255, 255, 255, .53); color: #041c25; text-shadow: none; }

.pl-mode { display: flex; align-items: center; gap: 12px; padding: 13px 7px; color: #c4d8ea; font-size: 12px; letter-spacing: 1.5px; }
.pl-hint { margin-left: auto; color: #69869c; font-size: 10px; }
.pl-dot { width: 7px; height: 7px; border-radius: 50%; background: #42e7a0; box-shadow: 0 0 10px #42e7a0; }

/* Dense, readable tables: headings 16px, data 18px; marquees keep their proportions */
.pl-tablewrap { overflow-x: auto; border: 1px solid #2c465e; background: #08111e; }
.pl-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.pl-table th { padding: 0; border-bottom: 1px solid #3b627b; background: #112339; color: #a9d8e6; font: 900 16px Consolas, monospace; letter-spacing: .6px; text-align: left; white-space: nowrap; }
.pl-table th .sort { all: unset; display: block; box-sizing: border-box; width: 100%; padding: 16px; cursor: pointer; }
.pl-table th .sort:hover { color: #fff; background: #1d3b53; }
.pl-table th .sort:focus-visible { outline: 2px solid var(--gc-yellow, #ffce42); outline-offset: -3px; }
.pl-table th .sort::after { content: ' \2195'; opacity: .55; }
.pl-table th[aria-sort="ascending"] .sort::after { content: ' \25B2'; opacity: 1; }
.pl-table th[aria-sort="descending"] .sort::after { content: ' \25BC'; opacity: 1; }
.pl-table th[aria-sort="ascending"], .pl-table th[aria-sort="descending"] { background: var(--gc-yellow, #ffce42); color: #071522; }
.pl-table th[aria-sort="ascending"] .sort:hover, .pl-table th[aria-sort="descending"] .sort:hover { background: var(--gc-yellow, #ffce42); color: #071522; }
.pl-table td { padding: 12px 16px; border-top: 1px solid #203448; font-size: 18px; line-height: 1.5; }
.pl-table tbody tr:nth-child(even) { background: #0c1827; }
.pl-table tbody tr:hover td { background: #14253a; }
.pl-table .num { font: 700 19px Consolas, monospace; font-variant-numeric: tabular-nums; }
.pl-table .accent { color: var(--gc-yellow, #ffce42); }
.pl-table .muted, .pl-sub { color: var(--gc-muted); }
.pl-sub { display: block; font-size: 12px; }
.pl-who { color: var(--gc-cyan); font-weight: 700; }
.pl-game { width: 100%; max-width: 185px; min-height: 64px; }
.pl-game a { display: flex; align-items: center; min-height: 64px; border-bottom: 0; }
.pl-marquee { display: block; width: 170px; height: 64px; max-width: 100%; object-fit: contain; object-position: left center; }
.pl-fallback { display: flex; align-items: center; width: 100%; height: 64px; color: var(--gc-yellow, #ffce42); font: 900 clamp(16px, 1.6vw, 24px)/1.05 Georgia, serif; letter-spacing: .5px; overflow-wrap: anywhere; text-shadow: 2px 2px #59280b; text-transform: uppercase; }
.pl-fallback[hidden] { display: none; }
.pl-game a:hover { border-bottom: 0; filter: brightness(1.15); }
.pl-tag { display: inline-block; padding: 6px 10px; border: 1px solid #38576b; border-radius: 2px; background: #132b39; font-size: 15px; font-weight: 700; white-space: nowrap; }
.pl-tag.safe { color: var(--gc-green); } .pl-tag.warn { color: var(--gc-yellow, #ffce42); } .pl-tag.risk { color: var(--gc-pink, #ff668b); }
.pl-empty { padding: 35px; border: 1px solid #2c465e; background: #08111e; color: var(--gc-muted); text-align: center; }
.pl-note { margin-top: 15px; color: var(--gc-muted); font-size: 11px; }

/* Hot Top 10: oversized heat rank, placement medals */
.pl-heat { display: inline-flex; align-items: center; justify-content: center; min-width: 76px; padding: 2px 10px; color: var(--gc-yellow, #ffce42); font: 900 clamp(30px, 3.6vw, 49px)/1 Consolas, monospace; letter-spacing: -3px; text-shadow: 0 3px #593b06, 0 0 18px rgba(255, 195, 43, .22); }
.pl-heat.top-three { color: #ffe68b; text-shadow: 0 2px #86520e, 0 0 16px rgba(255, 201, 64, .5); }
.pl-award { display: inline-flex; align-items: center; gap: 11px; font-weight: 900; white-space: nowrap; }
.pl-medal { position: relative; display: inline-grid; place-items: center; flex: none; width: 45px; height: 45px; border: 4px ridge #e9b840; border-radius: 50%;
	background: radial-gradient(circle at 30% 24%, #fff4bc, #f9c738 43%, #a56a08 80%); box-shadow: 0 2px 0 #49310e, 0 0 14px rgba(255, 211, 70, .27); color: #593607; font: 900 21px Consolas, monospace; }
.pl-medal.silver { border-color: #aabccd; background: radial-gradient(circle at 30% 24%, #fff, #c9d8e7 44%, #687f99 83%); box-shadow: 0 2px 0 #394759, 0 0 12px rgba(211, 233, 255, .27); color: #34475a; }
.pl-medal.bronze { border-color: #c48a57; background: radial-gradient(circle at 30% 24%, #ffe4b5, #cd8650 44%, #79432a 83%); box-shadow: 0 2px 0 #543322, 0 0 12px rgba(233, 156, 86, .27); color: #51270f; }
.pl-medal.participant { border: 2px solid #41647d; background: #152b41; box-shadow: none; color: #7fa9c7; font-size: 18px; }
.pl-award-label { display: flex; flex-direction: column; gap: 2px; }
.pl-award-label strong { color: #f5f8ff; font: 900 18px Consolas, monospace; }
.pl-award-label small { color: #9eb7c9; font-size: 11px; letter-spacing: 1px; }
.pl-unranked { color: #7e97ac; font-size: 15px; }

@media (max-width: 820px) {
	.pl-stats { width: 100%; justify-content: space-between; }
	.pl-stats > div { flex: 1; min-width: 75px; padding: 8px; }
	.pl-hint { display: none; }
}
@media (max-width: 720px) {
	.pl { padding-left: 9px; padding-right: 9px; }
	.pl-tab { gap: 5px; padding: 11px 4px; font-size: clamp(9px, 2.2vw, 13px); letter-spacing: 0; }
	.pl-count { min-width: 26px; height: 26px; border-width: 2px; font-size: 10px; }
	.pl-tablewrap { overflow-x: hidden; }
	.pl-table { min-width: 0; table-layout: fixed; width: 100%; }
	.pl-table th .sort { padding: 12px 7px; font-size: 13px; letter-spacing: 0; white-space: normal; }
	.pl-table td { padding: 12px 7px; font-size: 14px; overflow-wrap: anywhere; }
	.pl-table .num { font-size: 16px; }
	.pl-tag { padding: 5px 6px; font-size: 12px; white-space: normal; }
	.pl-game { max-width: 100%; min-height: 53px; }
	.pl-game a, .pl-marquee, .pl-fallback { min-height: 53px; height: 53px; }
	.pl-marquee { width: 100%; }
	.pl-fallback { font-size: clamp(13px, 3vw, 19px); }
	/* High Scores and Challenges: Game / Score / Margin */
	[data-mode="high"] :is(th, td):is(:nth-child(3), :nth-child(5), :nth-child(6)),
	[data-mode="challenges"] :is(th, td):is(:nth-child(3), :nth-child(5), :nth-child(6)) { display: none; }
	[data-mode="high"] th:nth-child(1), [data-mode="challenges"] th:nth-child(1) { width: 43%; }
	[data-mode="high"] th:nth-child(2), [data-mode="challenges"] th:nth-child(2) { width: 29%; }
	[data-mode="high"] th:nth-child(4), [data-mode="challenges"] th:nth-child(4) { width: 28%; }
	/* Hot Top 10: Heat Rank / Game / Your Rank */
	[data-mode="hot"] :is(th, td):is(:nth-child(4), :nth-child(5)) { display: none; }
	[data-mode="hot"] th:nth-child(1) { width: 17%; } [data-mode="hot"] th:nth-child(2) { width: 45%; } [data-mode="hot"] th:nth-child(3) { width: 38%; }
	.pl-heat { min-width: 0; padding: 0 3px; font-size: 29px; letter-spacing: -2px; }
	.pl-medal { width: 34px; height: 34px; border-width: 3px; font-size: 16px; }
	.pl-award { gap: 5px; }
	.pl-award-label strong { font-size: 14px; }
	.pl-award-label small { font-size: 9px; }
}
@media (max-width: 500px) { .pl-stats dd { font-size: 20px; } .pl-stats dt { font-size: 8px; } .pl-count { display: none; } .pl-tab { letter-spacing: 0; font-size: 10px; padding: 10px 3px; } }
@media (max-width: 390px) { .pl-award-label small { display: none; } .pl-award-label strong { font-size: 12px; } }