/*!
 * Pelagos — players group (games, leaderboards, members, staff, vote, punishments, wheel of fortune).
 * Loaded on every page by partials/head.php, so every selector is namespaced .ss-pl-*.
 * Reads band tokens only; tone/brand colours come from pelagos.css.
 */

/* ---------------------------------------------------------------- shared */
.ss-pl-side-title { font-family: var(--ss-display); font-weight: 800; font-size: 1.073rem; line-height: var(--ss-display-lh); letter-spacing: -.02em; margin: 0 0 .85rem; }
.ss-pl-nav .list-group-item { gap: .75rem; padding: .75rem .95rem; font-size: .95rem; }
.ss-pl-nav .list-group-item.active { z-index: 1; }
.ss-pl-nav-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-pl-nav-go { flex: none; color: var(--band-muted); font-size: 1rem; transition: transform .2s var(--ss-ease); }
.ss-pl-nav .list-group-item:hover .ss-pl-nav-go { transform: translateX(3px); color: var(--band-fg); }
.ss-pl-nav .list-group-item.active .ss-pl-nav-go { color: var(--ss-accent); }
.ss-pl-nav-thumb { width: 44px; height: 30px; flex: none; border-radius: var(--ss-r-xs); object-fit: cover; background: var(--tone, var(--band-sunk)); }
.ss-pl-note { display: flex; gap: .8rem; align-items: flex-start; padding: 1rem 1.15rem; border-radius: var(--ss-r); background: var(--band-sunk); color: var(--band-fg); font-size: .92rem; font-weight: 500; line-height: 1.5; }
.ss-pl-note > :is(.ph-bold, .ph-fill) { font-size: 1.35rem; color: var(--ss-accent-ink); flex: none; margin-top: .05rem; }
.ss-pl-note b { display: block; font-weight: 700; margin-bottom: .15rem; }
.ss-pl-note p { margin: 0; color: var(--band-muted); }
.ss-pl-note .btn { margin-top: .8rem; }
.ss-pl-link { font-size: .88rem; font-weight: 700; color: var(--band-fg); border-bottom: 2px solid var(--ss-accent); padding-bottom: .1rem; white-space: nowrap; }
.ss-pl-link:hover { color: var(--band-fg); border-bottom-color: currentColor; }
.ss-pl-head { width: 28px; height: 28px; border-radius: var(--ss-r-xs); flex: none; background: var(--band-sunk); image-rendering: pixelated; }
.ss-pl-who { display: inline-flex; align-items: center; gap: .6rem; font-weight: 700; color: var(--band-fg); white-space: nowrap; }

/* ---------------------------------------------------------------- games */
.ss-pl-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.ss-pl-mode { min-height: 420px; }
.ss-pl-mode::before { background: linear-gradient(180deg, rgba(8, 16, 24, .05) 18%, rgba(8, 16, 24, .55) 52%, rgba(8, 16, 24, .94) 100%); }
.ss-pl-mode .ss-mode-body { padding: 1.6rem 1.6rem 1.5rem; }
.ss-pl-mode .ss-mode-name { font-size: clamp(1.776rem, 1.406rem + .888vw, 2.294rem); overflow-wrap: anywhere; }
.ss-pl-mode .ss-mode-text { -webkit-line-clamp: 3; font-size: .95rem; margin-top: .6rem; }
.ss-pl-mode-tag { display: block; font-weight: 700; font-size: .9rem; color: var(--ss-accent); margin-bottom: .4rem; }
.ss-pl-mode-go { display: inline-flex; align-items: center; gap: .45rem; margin-top: 1.1rem; font-weight: 700; font-size: .92rem; color: var(--ss-paper); padding-bottom: .15rem; border-bottom: 3px solid var(--ss-accent); transition: gap .2s var(--ss-ease); }
.ss-pl-mode:hover .ss-pl-mode-go { gap: .8rem; }
@media (max-width: 1199.98px) { .ss-pl-modes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .ss-pl-modes { grid-template-columns: 1fr; gap: 1rem; } .ss-pl-mode { min-height: 290px; aspect-ratio: auto; } .ss-pl-mode .ss-mode-text { -webkit-line-clamp: 2; } }
.ss-pl-article .ss-panel-body { padding: clamp(1.4rem, 1rem + 1.8vw, 2.6rem); }
.ss-pl-article .ck-content > :first-child { margin-top: 0; }
.ss-pl-join p { color: var(--band-muted); font-size: .94rem; margin: 0; }
.ss-pl-join .ss-pl-side-title { margin-bottom: .5rem; }
.ss-pl-join-more { display: inline-flex; align-items: center; gap: .35rem; margin-top: 1rem; }
.ss-pl-article { overflow: hidden; }
.ss-pl-article-cover { aspect-ratio: 21 / 8; background: var(--ss-ink-2); overflow: hidden; }
.ss-pl-article-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------------------------------------------------------------- search box (leaderboards, punishments) */
.ss-pl-search { margin: 0; }
.ss-pl-search-box { position: relative; display: flex; align-items: center; gap: .25rem; padding: .35rem; background: var(--band-input); border: 1px solid var(--band-line); border-radius: var(--ss-r); transition: border-color .15s, box-shadow .15s; }
.ss-pl-search-box:focus-within { border-color: var(--ss-accent); box-shadow: 0 0 0 3px var(--bs-focus-ring-color); }
.ss-pl-search-box > :is(.ph-bold, .ph-fill) { flex: none; font-size: 1.25rem; color: var(--band-muted); padding-left: .5rem; }
.ss-pl-search-box .form-control { flex: 1 1 auto; min-width: 0; border: 0; background: transparent; box-shadow: none; padding: .5rem .5rem; color: var(--band-fg); }
.ss-pl-search-box .form-control:focus { box-shadow: none; background: transparent; }
.ss-pl-search-box .btn { flex: none; }
.ss-pl-search-clear { flex: none; width: 34px; height: 34px; display: grid; place-items: center; border-radius: var(--ss-r-sm); color: var(--band-muted); font-size: 1.1rem; }
.ss-pl-search-clear:hover { background: var(--band-sunk); color: var(--band-fg); }
.ss-pl-search--retry { max-width: 26rem; margin: 1.4rem auto .25rem; }
.ss-empty .ss-pl-search--retry .btn { margin-top: 0; }
.ss-pl-search--retry + .btn { margin-top: .75rem; }

/* ---------------------------------------------------------------- leaderboards */
.ss-pl-nav-ico { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: var(--ss-r-xs); background: var(--band-sunk); color: var(--band-muted); font-size: 1.05rem; }
.ss-pl-nav .list-group-item.active .ss-pl-nav-ico { background: var(--ss-accent); color: var(--ss-on-accent); }
.ss-pl-stage { overflow: hidden; isolation: isolate; --ss-accent-ink: color-mix(in oklab, var(--ss-accent) 82%, white); }
.ss-pl-stage::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(55% 70% at 50% 100%, color-mix(in oklab, var(--ss-tone-navy) 70%, transparent), transparent 70%); pointer-events: none; }
.ss-pl-stage .ss-panel-head { border-bottom-color: transparent; }
.ss-pl-stage .ss-panel-body { padding-bottom: 0; }
.ss-pl-podium { max-width: 640px; margin: .5rem auto 0; gap: .9rem; }
.ss-pl-podium .head { width: 80px; height: 80px; margin-bottom: .7rem; }
.ss-pl-podium .p1 .head { width: 104px; height: 104px; }
.ss-pl-podium .name { font-size: 1.02rem; }
.ss-pl-podium .amt { font-size: 1.9rem; margin: .1rem 0 .7rem; }
.ss-pl-podium .p1 .block { height: 150px; font-size: 3.2rem; }
.ss-pl-podium .p2 .block { height: 108px; font-size: 2.6rem; }
.ss-pl-podium .p3 .block { height: 78px; font-size: 2.3rem; }
.ss-pl-stage + .ss-panel, .ss-pl-stage + .ss-pl-me { margin-top: 1.25rem; }
.ss-pl-me { display: flex; align-items: center; gap: .85rem; margin-top: 1.25rem; padding: .8rem 1.1rem; border-radius: var(--ss-r); background: var(--ss-accent); color: var(--ss-on-accent); font-weight: 600; box-shadow: var(--ss-shadow-card); }
.ss-pl-me:hover { color: var(--ss-on-accent); background: var(--ss-accent-hover); }
.ss-pl-me .ss-pl-head { width: 34px; height: 34px; background: rgba(0, 0, 0, .15); }
.ss-pl-me-text { flex: 1 1 auto; min-width: 0; }
.ss-pl-me-text b { font-family: var(--ss-display); font-weight: 800; font-size: 1.073rem; line-height: 1; vertical-align: -.1em; }
.ss-pl-me-go { flex: none; display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; font-size: .9rem; }
.ss-pl-me + .ss-panel { margin-top: 1.25rem; }
.ss-pl-table-panel > .ss-panel-body { padding: 0; }
.ss-pl-table-panel .ss-pl-search { padding: 1rem 1.35rem; border-bottom: 1px solid var(--band-card-line); }
.ss-pl-board td { white-space: nowrap; }
.ss-pl-board th :is(.ph-bold, .ph-fill) { margin-left: .3rem; font-size: .95rem; vertical-align: -.1em; color: var(--band-fg); }
.ss-pl-board th.is-sort { color: var(--band-fg); }
.ss-pl-board td.is-sort { font-weight: 800; }
.ss-pl-board tbody tr.active > * { background: var(--ss-accent-soft); }
.ss-pl-board tbody tr.active > :first-child { box-shadow: inset 4px 0 0 var(--ss-accent); }
.ss-pl-board tbody tr[id] { scroll-margin-top: calc(var(--ss-nav-h) + 1.5rem); }
.ss-pl-rank-col { width: 72px; }
.ss-pl-rank { display: inline-grid; place-items: center; min-width: 2.1rem; height: 2.1rem; padding: 0 .35rem; font-family: var(--ss-display); font-weight: 800; font-size: .962rem; line-height: 1; color: var(--band-muted); }
.ss-pl-rank.is-1, .ss-pl-rank.is-2, .ss-pl-rank.is-3 { color: var(--ss-bone); background: var(--ss-tone-slate); border-radius: 999px; }
.ss-pl-rank.is-1 { background: var(--ss-accent); color: var(--ss-on-accent); }
.ss-pl-rank.is-3 { background: var(--ss-tone-teal); }
.ss-pl-who .ss-chip { margin-left: .15rem; }
@media (max-width: 575.98px) {
	.ss-pl-podium { gap: .5rem; }
	.ss-pl-podium .head { width: 56px; height: 56px; }
	.ss-pl-podium .p1 .head { width: 72px; height: 72px; }
	.ss-pl-podium .name { font-size: .88rem; }
	.ss-pl-podium .amt { font-size: 1.35rem; }
	.ss-pl-podium .p1 .block { height: 110px; }
	.ss-pl-podium .p2 .block { height: 80px; }
	.ss-pl-podium .p3 .block { height: 58px; }
	.ss-pl-table-panel .ss-pl-search { padding: .85rem 1rem; }
	.ss-pl-me-go { display: none; }
}

/* ---------------------------------------------------------------- member profile */
.ss-pl-member .ss-page-head { padding-bottom: clamp(1.75rem, 1.3rem + 1.6vw, 2.75rem); }
.ss-pl-member .ss-page-title { display: flex; align-items: center; gap: clamp(1rem, .6rem + 1.4vw, 1.75rem); }
.ss-pl-member-name { min-width: 0; overflow-wrap: anywhere; text-transform: none; }
.ss-pl-portrait { flex: none; display: block; padding: 6px; background: var(--ss-accent); border-radius: 14px; box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .16), inset 0 2px 0 rgba(255, 255, 255, .22); }
.ss-pl-portrait img { display: block; width: clamp(76px, 52px + 5vw, 120px); height: clamp(76px, 52px + 5vw, 120px); object-fit: cover; image-rendering: pixelated; background: var(--ss-ink-2); }
.ss-pl-member .ss-lead { max-width: none; }
.ss-pl-member-roles { display: flex; flex-wrap: wrap; gap: .4rem; }
.ss-pl-member-roles [class*="role__"] { font-size: .8rem; padding: .3rem .6rem; }
.ss-pl-member-rail .ss-rail-grid { grid-template-columns: repeat(var(--rail-cols, 3), minmax(0, 1fr)); }
.ss-pl-member-rail .ss-rail-stat:last-child { border-right: 0; }
.ss-pl-member-rail .ss-stat-value { font-size: 1.628rem; }
.ss-pl-ico { width: 38px; height: 38px; flex: none; display: grid; place-items: center; border-radius: var(--ss-r-sm); background: var(--band-sunk); color: var(--band-fg); font-size: 1.15rem; }
.ss-pl-ico--danger { background: color-mix(in oklab, var(--ss-danger) 14%, var(--band-card)); color: var(--ss-danger); }
.ss-pl-bans { box-shadow: var(--ss-shadow-card), inset 0 3px 0 var(--ss-danger); }
.ss-pl-stats { overflow: hidden; }
.ss-pl-stats-tabs { padding: 0 1.35rem; border-bottom: 1px solid var(--band-card-line); }
.ss-pl-stats-tabs .nav-tabs { border-bottom: 0; }
.ss-pl-stats-who { margin: 0 0 1rem; color: var(--band-muted); font-weight: 500; }
.ss-pl-stats-who b { color: var(--band-fg); }
.ss-pl-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75rem; }
.ss-pl-stat { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; gap: 1.4rem; min-height: 132px; padding: 1rem 1.1rem 1.05rem; border-radius: var(--ss-r); background: var(--tone, var(--ss-tone-navy)); color: var(--ss-paper); }
.ss-pl-stat::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 80% at 85% 90%, rgba(255, 255, 255, .14), transparent 70%), repeating-linear-gradient(135deg, rgba(255, 255, 255, .03) 0 2px, transparent 2px 14px); }
.ss-pl-stat-label { font-size: .8rem; font-weight: 700; color: rgba(244, 240, 232, .82); line-height: 1.3; }
.ss-pl-stat-value { font-family: var(--ss-display); font-weight: 800; font-size: clamp(1.628rem, 1.332rem + .74vw, 2.146rem); line-height: .95; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ss-pl-stats-empty { display: flex; align-items: center; gap: .9rem; padding: 1.6rem 1.35rem; }
.ss-pl-stats-empty > :is(.ph-bold, .ph-fill) { width: 46px; height: 46px; flex: none; display: grid; place-items: center; border-radius: var(--ss-r-sm); background: var(--band-sunk); color: var(--band-muted); font-size: 1.35rem; }
.ss-pl-stats-empty b { display: block; font-weight: 700; }
.ss-pl-stats-empty span { color: var(--band-muted); font-size: .92rem; }
@media (max-width: 991.98px) {
	.ss-pl-member-rail .ss-rail-grid { grid-template-columns: 1fr 1fr; }
	.ss-pl-member-rail .ss-rail-stat:last-child { grid-column: 1 / -1; border-bottom: 0; }
}
@media (max-width: 575.98px) {
	.ss-pl-member .ss-page-title { font-size: clamp(1.776rem, 8.14vw, 2.516rem); }
	.ss-pl-member-rail .ss-stat-value { font-size: 1.258rem; }
	.ss-pl-stats-tabs { padding: 0 .6rem; }
}

/* ---------------------------------------------------------------- staff */
.ss-pl-crew { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 1.25rem 2.5rem; padding-block: 2.25rem; border-top: 1px solid var(--band-line); }
.ss-pl-crew:first-child { padding-top: 0; border-top: 0; }
.ss-pl-crew:last-child { padding-bottom: 0; }
.ss-pl-crew-head { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; }
.ss-pl-crew-head .ss-title-sm { overflow-wrap: anywhere; }
.ss-pl-crew-count { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; font-size: .9rem; color: var(--band-muted); }
.ss-pl-crew-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; }
.ss-pl-card { display: flex; flex-direction: column; overflow: hidden; color: var(--band-fg); }
.ss-pl-crew-grid > .ss-pl-card { margin-top: 0; }
.ss-pl-crew-count :is(.ph-bold, .ph-fill) { font-size: 1.05rem; color: var(--band-fg); }
.ss-pl-card:hover { color: var(--band-fg); }
.ss-pl-card-media { position: relative; display: grid; place-items: center; aspect-ratio: 4 / 3; background: var(--tone, var(--ss-tone-navy)); overflow: hidden; isolation: isolate; }
.ss-pl-card-media::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 55% at 50% 55%, rgba(255, 255, 255, .2), transparent 70%), repeating-linear-gradient(135deg, rgba(255, 255, 255, .035) 0 2px, transparent 2px 14px); }
.ss-pl-card-head { width: 46%; max-width: 104px; aspect-ratio: 1; height: auto; object-fit: cover; image-rendering: pixelated; border-radius: var(--ss-r-xs); box-shadow: 0 16px 22px -12px rgba(0, 0, 0, .65); transition: transform .3s var(--ss-ease); }
.ss-pl-card:hover .ss-pl-card-head { transform: translateY(-5px) scale(1.04); }
.ss-pl-card-body { display: flex; flex-direction: column; gap: .15rem; padding: .9rem 1.05rem 1rem; min-width: 0; }
.ss-pl-card-name { font-weight: 800; font-size: 1.05rem; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-pl-card-role { font-size: .84rem; font-weight: 600; color: var(--band-muted); }
.ss-pl-card-go { position: absolute; top: .7rem; right: .7rem; width: 30px; height: 30px; display: grid; place-items: center; border-radius: var(--ss-r-sm); background: rgba(0, 0, 0, .25); color: var(--ss-paper); font-size: 1rem; transition: background-color .2s, color .2s; }
.ss-pl-card:hover .ss-pl-card-go { background: var(--ss-accent); color: var(--ss-on-accent); }
@media (max-width: 991.98px) { .ss-pl-crew { grid-template-columns: 1fr; } .ss-pl-crew-head { flex-direction: row; align-items: baseline; justify-content: space-between; flex-wrap: wrap; } }
@media (max-width: 575.98px) { .ss-pl-crew-grid { grid-template-columns: 1fr 1fr; gap: .75rem; } .ss-pl-card-body { padding: .75rem .8rem .85rem; } .ss-pl-card-name { font-size: .95rem; } }

/* ---------------------------------------------------------------- vote */
.ss-pl-vote-head { margin-bottom: 1.25rem; align-items: center; }
.ss-pl-vote-sub { margin: .45rem 0 0; color: var(--band-muted); font-weight: 500; font-size: .95rem; }
.ss-pl-votes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ss-pl-votes.is-wide { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ss-pl-vote { position: relative; display: flex; flex-direction: column; min-height: 176px; padding: 1.3rem 1.4rem 1.25rem; border-radius: var(--ss-r); background: var(--tone, var(--ss-tone-navy)); color: var(--ss-paper); overflow: hidden; isolation: isolate; box-shadow: var(--ss-shadow-card); transition: transform .25s var(--ss-ease), box-shadow .25s var(--ss-ease); }
.ss-pl-vote::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(55% 75% at 88% 85%, rgba(255, 255, 255, .15), transparent 70%), repeating-linear-gradient(135deg, rgba(255, 255, 255, .03) 0 2px, transparent 2px 16px); }
.ss-pl-vote::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--ss-accent); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ss-ease); }
.ss-pl-vote:hover { transform: scale(1.015); box-shadow: var(--ss-shadow-lift); color: var(--ss-paper); }
.ss-pl-vote:hover::after, .ss-pl-vote:focus-visible::after { transform: scaleX(1); }
/* vote site names are domains/brands in their own case (Minecraft-MP, TopG), so they use Onest, not the uppercase-only display face */
.ss-pl-vote-name { font-family: var(--ss-font); font-weight: 800; font-size: 1.35rem; letter-spacing: -.01em; line-height: 1.2; overflow-wrap: anywhere; }
.ss-pl-vote-host { margin-top: .4rem; font-size: .85rem; font-weight: 600; color: rgba(244, 240, 232, .72); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-pl-vote-go { margin-top: auto; padding-top: 1.1rem; align-self: flex-start; display: inline-flex; align-items: center; gap: .45rem; font-weight: 700; font-size: .9rem; padding: .45rem .8rem; background: var(--ss-paper); color: var(--ss-ink); border-radius: 14px; box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .16), inset 0 2px 0 rgba(255, 255, 255, .22); transition: background-color .2s, color .2s; }
.ss-pl-vote-name + .ss-pl-vote-go, .ss-pl-vote-host + .ss-pl-vote-go { margin-top: auto; }
.ss-pl-vote:hover .ss-pl-vote-go { background: var(--ss-accent); color: var(--ss-on-accent); }
.ss-pl-vote-note { margin-top: 1.25rem; }
.ss-pl-vote-info .ck-content { font-size: 1rem; }
.ss-pl-vote-info .ck-content > :first-child { margin-top: 0; }
@media (max-width: 1199.98px) { .ss-pl-votes.is-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .ss-pl-votes, .ss-pl-votes.is-wide { grid-template-columns: 1fr; } .ss-pl-vote { min-height: 140px; } }

/* ---------------------------------------------------------------- punishments */
.ss-pl-pun-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(300px, auto); gap: 1rem; }
.ss-pl-pun-grid > .ss-tile { grid-column: auto; }
.ss-pl-pun-tile .ss-tile-name { font-size: clamp(1.702rem, 1.184rem + .814vw, 2.146rem); max-width: none; overflow-wrap: normal; word-break: normal; }
.ss-pl-pun-tile .ss-tile-desc { max-width: 14rem; }
.ss-pl-pun-ico { position: absolute; right: -.6rem; bottom: -1.4rem; z-index: -1; font-size: 9.5rem; line-height: 1; color: rgba(244, 240, 232, .16); transition: transform .35s var(--ss-ease), color .35s var(--ss-ease); }
.ss-pl-pun-tile:hover .ss-pl-pun-ico { transform: translateY(-6px) rotate(-6deg); color: rgba(244, 240, 232, .24); }
.ss-pl-appeal { display: flex; align-items: center; gap: 1.1rem 1.5rem; flex-wrap: wrap; margin-top: 2.5rem; padding: 1.4rem 1.6rem; border-radius: var(--ss-r); background: var(--band-card); border: 1px solid var(--band-card-line); box-shadow: var(--ss-shadow-card); }
.ss-pl-appeal-ico { width: 52px; height: 52px; flex: none; display: grid; place-items: center; background: var(--ss-accent); color: var(--ss-on-accent); font-size: 1.5rem; border-radius: 14px; box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .16), inset 0 2px 0 rgba(255, 255, 255, .22); }
.ss-pl-appeal-text { flex: 1 1 18rem; min-width: 0; }
.ss-pl-appeal-title { font-size: 1.15rem; font-weight: 800; margin: 0 0 .2rem; }
.ss-pl-appeal-text p { margin: 0; color: var(--band-muted); }
.ss-pl-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.ss-pl-toolbar .ss-filter { flex: 0 1 auto; min-width: 0; }
.ss-pl-toolbar .ss-filter a :is(.ph-bold, .ph-fill) { font-size: 1.05rem; }
.ss-pl-toolbar .ss-pl-search { flex: 0 1 420px; min-width: min(100%, 280px); }
.ss-pl-pun-table td { white-space: nowrap; }
.ss-pl-pun-table .ss-pl-reason { white-space: normal; min-width: 220px; max-width: 340px; overflow-wrap: anywhere; }
.ss-pl-pun-table td.ss-pl-reason { color: var(--band-fg); font-weight: 500; }
.ss-pl-pun-table .ss-pl-by .ss-pl-who { font-weight: 600; color: var(--band-muted); }
.ss-pl-when { color: var(--band-muted); font-weight: 500; }
.ss-pl-until { display: table-cell; }
.ss-pl-until .ss-chip { margin: .1rem .25rem .1rem 0; }
.ss-pl-until .ss-pl-when { margin-right: .35rem; }
/* phones: each record becomes a small card (player | issuer, reason, dates) instead of a table cut at the edge */
@media (max-width: 575.98px) {
	.ss-pl-pun-table thead { display: none; }
	.ss-pl-pun-table, .ss-pl-pun-table tbody { display: block; }
	.ss-pl-pun-table tr { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .75rem; padding: .85rem 1rem; border-bottom: 1px solid var(--band-line); }
	.ss-pl-pun-table td { display: block; flex: 0 1 auto; min-width: 0; padding: 0; border: 0; white-space: normal; }
	.ss-pl-pun-table td:first-child, .ss-pl-pun-table td.ss-pl-when { flex: 1 1 auto; }
	.ss-pl-pun-table .ss-pl-reason { flex-basis: 100%; min-width: 0; max-width: none; }
	.ss-pl-pun-table td.ss-pl-when, .ss-pl-pun-table td.ss-pl-until { font-size: .85rem; }
}
.ss-pl-head--console { display: grid; place-items: center; background: var(--ss-ink); color: var(--ss-accent); font-size: .95rem; }
[data-bs-theme="dark"] .ss-pl-head--console { background: var(--band-sunk); }
@media (max-width: 1199.98px) { .ss-pl-pun-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(240px, auto); } }
@media (max-width: 767.98px) { .ss-pl-toolbar .ss-pl-search { flex: 1 1 100%; } }
@media (max-width: 575.98px) { .ss-pl-pun-grid { grid-template-columns: 1fr; grid-auto-rows: minmax(190px, auto); } .ss-pl-pun-tile .ss-tile-desc { display: block; } .ss-pl-pun-tile .ss-tile-go { display: grid; } .ss-pl-pun-ico { font-size: 7.5rem; } }

/* ---------------------------------------------------------------- wheel of fortune */
.ss-pl-wheels { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.ss-pl-wheel-tile { position: relative; display: flex; flex-direction: column; align-items: flex-start; min-height: 340px; padding: 1.5rem 1.5rem 1.4rem; border-radius: var(--ss-r); background: var(--tone, var(--ss-tone-navy)); color: var(--ss-paper); overflow: hidden; isolation: isolate; box-shadow: var(--ss-shadow-card); transition: transform .25s var(--ss-ease), box-shadow .25s var(--ss-ease); }
.ss-pl-wheel-tile::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(160deg, rgba(255, 255, 255, .06), transparent 45%), repeating-linear-gradient(135deg, rgba(255, 255, 255, .03) 0 2px, transparent 2px 16px); }
.ss-pl-wheel-tile::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--ss-accent); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ss-ease); }
.ss-pl-wheel-tile:hover { transform: scale(1.015); box-shadow: var(--ss-shadow-lift); }
.ss-pl-wheel-tile:hover::after, .ss-pl-wheel-tile:focus-within::after { transform: scaleX(1); }
.ss-pl-wheel-art { position: absolute; right: -78px; bottom: -78px; z-index: -1; width: 250px; height: 250px; border-radius: 50%; background: repeating-conic-gradient(rgba(255, 255, 255, .2) 0 22.5deg, rgba(0, 0, 0, .2) 22.5deg 45deg); box-shadow: inset 0 0 0 10px rgba(255, 255, 255, .12), 0 0 0 6px rgba(0, 0, 0, .12); transition: transform 1.4s var(--ss-ease); }
.ss-pl-wheel-art span { position: absolute; inset: 40%; border-radius: 50%; background: var(--ss-ink); box-shadow: 0 0 0 6px var(--ss-accent), 0 0 0 11px rgba(0, 0, 0, .18); }
.ss-pl-wheel-tile:hover .ss-pl-wheel-art { transform: rotate(135deg); }
.ss-pl-wheel-top { display: flex; gap: .4rem; margin-bottom: 1rem; }
.ss-pl-wheel-name { font-family: var(--ss-display); font-weight: 800; font-size: 1.85rem; line-height: var(--ss-display-lh); margin: 0; max-width: 11ch; overflow-wrap: anywhere; }
.ss-pl-wheel-rule { display: flex; align-items: center; gap: .45rem; margin: .7rem 0 0; font-weight: 600; font-size: .9rem; color: rgba(244, 240, 232, .82); }
.ss-pl-wheel-rule :is(.ph-bold, .ph-fill) { font-size: 1.05rem; color: var(--ss-accent); }
.ss-pl-wheel-tile .btn { margin-top: auto; }
.ss-pl-wheel-tile .stretched-link::after { z-index: 1; }
@media (max-width: 1199.98px) { .ss-pl-wheels { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .ss-pl-wheels { grid-template-columns: 1fr; } .ss-pl-wheel-tile { min-height: 250px; } .ss-pl-wheel-art { width: 200px; height: 200px; } }
.ss-pl-spin { overflow: hidden; isolation: isolate; }
.ss-pl-spin::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(48% 70% at 30% 50%, color-mix(in oklab, var(--ss-tone-plum) 60%, transparent), transparent 72%), repeating-linear-gradient(135deg, rgba(255, 255, 255, .02) 0 2px, transparent 2px 18px); pointer-events: none; }
.ss-pl-spin-stage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 300px); align-items: center; gap: 2rem; padding: clamp(1.5rem, 1rem + 2vw, 2.75rem); }
.ss-pl-spin-wheel { display: flex; justify-content: center; min-width: 0; }
.ss-pl-spin-wheel .superWheel { margin: 2.5em auto .5em; }
.ss-pl-spin-side { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.ss-pl-spin-rule { margin: .9rem 0 1.25rem; color: var(--band-muted); font-size: .98rem; line-height: 1.5; }
.ss-pl-spin-rule strong { color: var(--band-fg); }
.ss-pl-spin #playGame { min-width: 11rem; }
.ss-pl-prizes { width: 100%; margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1px solid var(--band-card-line); }
.ss-pl-prizes-title { font-size: .92rem; font-weight: 700; margin: 0 0 .65rem; color: var(--band-fg); }
.ss-pl-prizes-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.ss-pl-prizes-list li { display: flex; align-items: center; gap: .6rem; font-size: .9rem; font-weight: 600; color: var(--band-fg); }
.ss-pl-prizes-list li.is-pass { color: var(--band-muted); font-weight: 500; }
.ss-pl-prizes-list :is(.ph-bold, .ph-fill) { margin-left: auto; color: var(--band-muted); font-size: 1rem; }
.ss-pl-prize-dot { width: 12px; height: 12px; flex: none; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); }
.ss-pl-prize-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-pl-ico--accent { background: var(--ss-accent-soft); color: var(--ss-accent-ink); }
.ss-pl-spin-log .ss-list-item { padding: .8rem 1.25rem; }
.ss-pl-log-empty { display: flex; align-items: center; gap: .6rem; margin: 0; color: var(--band-muted); font-weight: 600; }
@media (max-width: 1199.98px) { .ss-pl-spin-stage { grid-template-columns: 1fr; } .ss-pl-spin-side { align-items: center; text-align: center; } .ss-pl-spin-side > .ss-chip { align-self: center; } .ss-pl-spin-rule { max-width: 30rem; } .ss-pl-prizes { text-align: left; } .ss-pl-prizes-list { grid-template-columns: 1fr 1fr; column-gap: 2rem; } }
@media (max-width: 575.98px) { .ss-pl-prizes-list { grid-template-columns: 1fr; } }
/* superwheel is drawn by lottery.js with fixed colours: bring the rim and marker onto the theme */
.ss-pl-spin .superWheel .sWheel-bg-layer line, .ss-pl-spin .superWheel circle.outerLine, .ss-pl-spin .superWheel circle.innerLine { stroke: var(--ss-accent); }
.ss-pl-spin .superWheel circle.innerLine { fill: var(--band-sunk); fill-opacity: 1; }
.ss-pl-spin .superWheel .sWheel-marker path { fill: var(--ss-paper); }
.ss-pl-spin .superWheel .sWheel-marker svg { filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .55)); }
@media (max-width: 575.98px) { .ss-pl-spin-stage { padding: 1.25rem 1rem 1.5rem; gap: 1.25rem; } }
@media (max-width: 479.98px) { .ss-pl-spin-wheel .superWheel { zoom: .82; } }
@media (max-width: 399.98px) { .ss-pl-spin-wheel .superWheel { zoom: .72; } }
.ss-pl-log-table td { white-space: nowrap; }
.ss-pl-log-id { font-family: var(--ss-display); font-weight: 800; font-size: .777rem; color: var(--band-muted); }
.ss-pl-log-wheel { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; color: var(--band-muted); }
.ss-pl-log-wheel :is(.ph-bold, .ph-fill) { color: var(--band-fg); }
.ss-pl-log-prize { display: inline-flex; align-items: center; gap: .7rem; font-weight: 700; }
.ss-pl-log-prize .ss-pl-ico { width: 32px; height: 32px; font-size: 1rem; }
[data-bs-theme="dark"] .ss-pl-board tbody tr.active > * { background: color-mix(in oklab, var(--ss-accent) 11%, transparent); }
@media (max-width: 575.98px) {
	.ss-pl-member-rail .ss-stat-value { white-space: normal; overflow: visible; font-size: 1.147rem; line-height: 1.05; }
	.ss-pl-stat-grid { grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: .6rem; }
	.ss-pl-stat { min-height: 108px; gap: 1rem; padding: .85rem .9rem .9rem; }
	.ss-pl-stat-value { font-size: 1.48rem; }
}
.ss-pl-nav-art { object-fit: cover; padding: 0; image-rendering: auto; }