/* Tournaments */
.socialShell main:has(> .tourList) > .title {
  margin-block: 0 20px;
  padding: clamp(20px, 4vw, 34px) clamp(18px, 4vw, 32px);
  background: linear-gradient(104deg, #28211c 15%, #28211cf2 62%, #28211cd4), url('/brand/krikumi-ice.webp') center 56% / cover;
  border: 1px solid var(--kk-border);
  border-radius: var(--kk-radius);
}

.socialShell main:has(.tournamentDetail) > .title {
  padding: 0;
  border: 0;
  background: none;
}

.socialShell main:has(.tournamentDetail) > .title p {
  display: none;
}

.socialShell main:has(> .tourList) > .title h1 {
  margin: 6px 0 8px;
  color: var(--kk-text);
  font: inherit;
  font-size: clamp(32px, 4vw, 46px);
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1.1;
}

.socialShell main:has(> .tourList) > .title p {
  max-width: 56ch;
  margin: 0;
  color: var(--kk-muted);
}

.socialShell .tourList {
  container-type: inline-size;
  min-width: 0;
}

.socialShell .tournamentHubTabs,
.socialShell .socialTournamentNav,
.socialShell .socialProfileNav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 20px;
  padding: 0;
  overflow: visible;
}

.socialShell :is(.tournamentHubTabs, .socialTournamentNav, .socialProfileNav) > :is(button, a) {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid var(--kk-border);
  border-radius: 10px;
  background: var(--kk-surface);
  box-shadow: none;
  color: var(--kk-muted);
  font-size: 14px;
  font-weight: 700;
  text-align: left;
  text-decoration: none;
  white-space: normal;
}

.socialShell :is(.tournamentHubTabs, .socialTournamentNav, .socialProfileNav) > :is(button, a):hover {
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

.socialShell :is(.tournamentHubTabs [aria-pressed="true"], .socialProfileNav [aria-current="location"]) {
  border-color: var(--kk-accent);
  background: #423024;
  color: var(--kk-accent);
}

.socialShell .tournamentHubGrid {
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

.socialShell .tournamentHubCard {
  position: relative;
  min-width: 0;
  padding: clamp(18px, 3vw, 25px);
  gap: 14px;
  border: 1px solid var(--kk-border);
  border-radius: var(--kk-radius);
  background: var(--kk-surface);
  color: var(--kk-text);
  cursor: pointer;
  overflow-wrap: anywhere;
}

.socialShell .tournamentHubCard:focus-within,
.socialShell .tournamentHubCard:hover {
  transform: none;
  border-color: #a08060;
  background: var(--kk-surface-raised);
}

.socialShell .tournamentHubCardTop {
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: var(--kk-muted);
  font-size: 13px;
}

.socialShell .tournamentHubCard h2 {
  margin: 0;
  font-size: clamp(20px, 2.5vw, 26px);
  letter-spacing: -.027em;
  line-height: 1.2;
}

.socialShell :is(.tournamentHubCard p, .tournamentHubCardStats, .tournamentSeason > p) {
  color: var(--kk-muted);
}

.socialShell .tournamentHubCardStats {
  flex-wrap: wrap;
  gap: 6px 15px;
  margin-top: auto;
  padding-block: 12px 0;
  border-top: 1px solid var(--kk-border);
  font-size: 14px;
}

.socialShell .tournamentHubCardStats b {
  color: var(--kk-text);
  font-variant-numeric: tabular-nums;
}

.socialShell .tournamentHubCard button {
  align-self: flex-start;
  min-height: 44px;
  color: var(--kk-accent);
}

.socialShell .tournamentStatus {
  max-width: 100%;
  min-height: 26px;
  padding: 3px 9px;
  border-radius: 6px;
  background: #483628;
  color: #e8d3bf;
  font-size: 11px;
  letter-spacing: .055em;
  line-height: 1.4;
}

.socialShell .tournamentStatus.planned,
.socialShell .tournamentStatus.done {
  background: #423024;
  color: var(--kk-accent);
}

.socialShell .tournamentStatus.live {
  background: #1b3b35;
  color: #a9e1bd;
}

.socialShell .tournamentStatus.review {
  background: #3b3226;
  color: #f1d39e;
}

.socialShell .tournamentStatus.danger {
  background: #40272d;
  color: #ffb7b3;
}

.socialShell :is(.tournamentHubEmpty, .tournamentHubSubEmpty) {
  padding: clamp(22px, 4vw, 44px);
  border: 1px solid var(--kk-border);
  border-radius: var(--kk-radius);
  background: var(--kk-surface);
  color: var(--kk-muted);
}

.socialShell .tournamentHubEmpty h2 {
  margin: 0 0 8px;
  color: var(--kk-text);
  font-size: clamp(20px, 3vw, 25px);
  line-height: 1.25;
}

.socialShell .tournamentHubEmpty p {
  max-width: 53ch;
  margin-inline: auto;
}

.socialShell .tournamentHubEmpty button {
  margin: 14px 3px 0;
}

.socialShell .tournamentHubEmpty > span {
  background: #423024;
  color: var(--kk-accent);
}

.socialShell .tournamentDetail {
  gap: 16px;
}

.socialShell .tournamentBack {
  min-height: 44px;
  padding-inline: 4px;
  color: var(--kk-accent);
  font-size: 14px;
}

.socialShell .tournamentDetailHero {
  min-height: auto !important;
  padding: clamp(22px, 4vw, 36px) !important;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  border: 1px solid var(--kk-border);
  border-radius: var(--kk-radius);
  background: #28211c linear-gradient(97deg, #28211c 0%, #28211cf2 60%, #43302473);
  color: var(--kk-text);
  box-shadow: none;
}

.socialShell .tournamentDetailHero h2 {
  margin: 12px 0 8px;
  color: var(--kk-text);
  font-size: clamp(26px, 4vw, 42px);
  letter-spacing: -.04em;
  line-height: 1.14;
}

.socialShell :is(.tournamentDetailHero p, .tournamentDetailHero .tournamentDetailFacts span) {
  color: var(--kk-muted);
}

.socialShell .tournamentDetailFacts {
  min-width: 0;
  gap: 0;
}

.socialShell .tournamentDetailFacts > div {
  align-items: baseline;
  gap: 8px 14px;
  padding-block: 9px;
  border-color: var(--kk-border);
}

.socialShell .tournamentDetailFacts strong {
  overflow-wrap: anywhere;
}

.socialShell .socialTournamentNav {
  margin: 0;
}

.socialShell .tournamentDetailGrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

.socialShell .tournamentDetailPanel {
  min-width: 0;
  border-color: var(--kk-border) !important;
  background: var(--kk-surface);
}

.socialShell .tournamentDetailHeading > span {
  color: var(--kk-accent);
}

.socialShell .tournamentDetailHeading h3 {
  font-size: clamp(19px, 2.5vw, 24px);
  line-height: 1.25;
}

.socialShell :is(.tournamentParticipants > div, .socialTournamentTeams, .tournamentCalculationState) {
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

.socialShell :is(.tournamentParticipants span, .tournamentEvidenceDetails, .tournamentScoreNote, .tournamentSourceNote) {
  color: var(--kk-muted);
  font-size: 13px;
  line-height: 1.55;
}

.socialShell .tournamentSourceConflict {
  border-color: #a48153;
  background: #3b3226;
  color: #f1d39e;
}

.socialShell .tournamentResultTable,
.socialShell .tournamentResults {
  border-color: var(--kk-border);
}

.socialShell :is(.tournamentResultTable table, .tournamentPointsTable table) {
  background: var(--kk-surface);
  color: var(--kk-text);
}

.socialShell :is(.tournamentResultTable thead, .tournamentPointsTable thead, .tournamentResultsHead) {
  background: var(--kk-surface-raised);
  color: var(--kk-muted);
}

.socialShell :is(.tournamentResultTable tbody tr:nth-child(even), .tournamentResultsRow:nth-child(even)) {
  background: #332820;
}

.socialShell :is(.tournamentResultTable th, .tournamentResultTable td, .tournamentPointsTable th, .tournamentPointsTable td, .tournamentResultsRow) {
  border-color: var(--kk-border);
}

.socialShell :is(.tournamentRowState, .tournamentResultsRow > span) {
  color: var(--kk-muted);
  font-size: 13px;
}

.socialShell .tournamentDisqualified .tournamentRowState {
  color: #ffb7b3;
}

.socialShell .tournamentPlace {
  background: #564338;
  color: var(--kk-text);
}

.socialShell .tournamentPlace1 { background: #433624; color: #ffe0a1; }
.socialShell .tournamentPlace2 { background: #4b372a; color: #f1e1d0; }
.socialShell .tournamentPlace3 { background: #433129; color: #facbb5; }

.socialShell .tournamentSeason {
  padding: clamp(16px, 3vw, 24px);
  border-color: var(--kk-border);
  border-radius: var(--kk-radius);
  background: var(--kk-surface);
}

.socialShell :is(.tournamentSeasonSearch label, .tournamentSeasonGrid span, .tournamentSeasonGrid small) {
  color: var(--kk-muted);
}

.socialShell .tournamentSeasonSearch input {
  border-color: var(--kk-border);
  background: var(--kk-bg);
  color: var(--kk-text);
}

.socialShell .socialTournamentTimeline {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin: 16px 0 0;
  padding: 0;
}

.socialShell .socialTournamentTimeline li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: start;
  justify-items: start;
  gap: 4px 13px;
  padding-bottom: 12px;
  text-align: left;
}

.socialShell .socialTournamentTimeline li:not(:last-child)::before {
  top: 38px;
  right: auto;
  bottom: 0;
  left: 19px;
  width: 2px;
  height: auto;
  background: var(--kk-border);
}

.socialShell .socialStageNumber {
  grid-row: 1 / span 2;
  border-radius: 10px;
  background: var(--kk-surface-raised);
  color: var(--kk-muted);
}

.socialShell .socialTournamentTimeline li[aria-current] .socialStageNumber {
  background: #423024;
  box-shadow: inset 0 0 0 1px var(--kk-accent);
  color: var(--kk-accent);
}

.socialShell .socialTournamentTimeline button {
  min-height: 40px;
  padding: 4px 0;
  background: transparent;
  color: var(--kk-text);
  text-align: left;
}

.socialShell .socialTournamentTimeline p {
  grid-column: 2;
}

.socialShell :is(.socialTournamentTimeline p, .socialTournamentFeed p, .socialTournamentFeed article > span) {
  color: var(--kk-muted);
}

.socialContext .socialTournamentContext {
  background: var(--kk-surface);
  color: var(--kk-text);
}

.socialTournamentContext > p {
  color: var(--kk-muted);
}

.socialTournamentContext .socialTournamentTop {
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

.socialTournamentContext .socialTournamentTop > div {
  border-color: var(--kk-border);
}

.socialTournamentContext .socialTournamentTop b {
  color: #f1d39e;
}

.socialTournamentContext button {
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
  color: var(--kk-accent);
}

@container (min-width: 660px) {
  .socialShell .tournamentHubGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .socialShell .tournamentDetailHero {
    grid-template-columns: minmax(0, 1.3fr) minmax(180px, .7fr);
    align-items: center;
  }
}

@media (max-width: 767px) {
  .socialShell .tournamentPointsTable tbody tr,
  .socialShell .tournamentResultTable tbody tr {
    border-color: var(--kk-border);
  }

  .socialShell .tournamentPointsTable tbody tr {
    padding-inline: 10px;
  }

  .socialShell .tournamentPointsTable td[data-label]::before {
    color: var(--kk-muted);
  }
}

/* Profiles and verified progress */
.socialShell .profileHero {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  min-height: clamp(190px, 25vw, 260px) !important;
  gap: 14px 20px;
  padding: clamp(20px, 4vw, 34px) !important;
  border: 1px solid var(--kk-border) !important;
  border-radius: var(--kk-radius) !important;
  background-color: var(--kk-surface);
  background-position: center !important;
  background-size: cover;
  box-shadow: none;
  color: var(--kk-text);
}

.socialShell .profileHero:not([style*="background-image"]) {
  background-image: linear-gradient(92deg, #2c221bf5, #30251dde 62%, #30251d75), url('/brand/krikumi-ice.webp') !important;
}

.socialShell .profileHero::before {
  content: none;
}

.socialShell .profileHero[style*="background-image"]::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(0deg, #1b1714e6 0%, #1b171454 63%);
  content: "";
}

.socialShell .profileHero > :is(.avatar, .socialProfileAvatar) {
  width: clamp(58px, 8vw, 90px);
  height: clamp(58px, 8vw, 90px);
  flex: 0 0 auto;
  border: 2px solid #e1b388;
  background: #5b402e;
  box-shadow: 0 0 0 4px #362a22a0;
  color: #fff2e3;
  font-size: clamp(21px, 4vw, 32px);
}

.socialShell .profileHero > .avatar {
  display: grid;
  place-items: center;
}

.socialShell .profileHero[data-has-avatar="true"] > .avatar {
  display: none;
}

.socialShell .profileHero > div:not(.socialProfileHeroProgress) {
  min-width: 0;
}

.socialShell .profileHero h1 {
  margin: 3px 0 6px;
  color: var(--kk-text);
  font-family: inherit !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.socialShell .profileHero :is(.eyebrow, p) {
  margin: 0;
  color: #f2e3d3;
}

/* Custom covers can have pale lettering directly behind the profile description. */
.socialShell .profileHero > div:not(.socialProfileHeroProgress) > p {
  display: inline-block;
  max-width: 100%;
  margin-top: 7px;
  padding: 4px 8px;
  border-radius: 8px;
  background: #1b1714d9;
  color: #fff2e3;
  line-height: 1.4;
  text-shadow: 0 1px 2px #0009;
}

.socialShell .profileHero .socialProfilePresence {
  flex-basis: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  color: #ecdbc9;
  font-size: 13px;
}

.socialShell .profileHero .socialProfilePresence[data-state="online"] {
  color: #a9e1bd;
}

.socialShell .socialProfileHeroEdit {
  max-width: 100%;
  min-height: 44px;
  padding: 8px 14px;
  border-color: #c29c7a;
  background: #28211ce8;
  color: var(--kk-text);
}

.socialShell .socialProfileHeroEdit:hover {
  background: var(--kk-surface-raised);
  color: var(--kk-accent);
}

.socialShell .profileLevel {
  margin-left: auto;
  padding: 8px 13px;
  border: 1px solid #e1b38880;
  border-radius: 10px;
  background: #362a22c9;
  color: var(--kk-text);
}

.socialShell .profileLevel small {
  color: #ecdbc9;
}

.socialShell .socialProfileNav {
  margin-block: 16px 20px;
}

.socialShell main:has(> .personalProfileHero):has(> .accountProfilePanel > .primary[data-account-open]) :is(.socialProfileNav,
  .profilePersonal,
  .socialProfilePreferences,
  .socialProfilePresence,
  .socialProfileNotice),
.socialShell:has(.personalProfileHero):has(.accountProfilePanel > .primary[data-account-open]) [data-profile-context] {
  display: none;
}

.socialShell :is(.profilePersonal > .forYouCard, .accountProfilePanel, .socialProfilePhotos, .socialProfilePreferences .panel) {
  min-width: 0;
  border-color: var(--kk-border);
  background: var(--kk-surface);
}

.socialShell .profilePersonal > .forYouCard {
  min-height: 0;
}

.socialShell .profilePersonal .forYouCard :is(h2, p) {
  font-family: inherit;
}

.socialShell .profilePersonal .forYouCard h2 {
  color: var(--kk-text);
  font-size: clamp(21px, 3vw, 27px);
  line-height: 1.25;
}

.socialShell .profilePersonal .forYouCard p {
  color: var(--kk-muted);
  font-size: 15px;
}

.socialShell .profilePersonal :is(.forYouNext, .forYouMetrics > div, .forYouGuestPoints > span),
.socialShell .accountProfilePanel .gameProfileBox {
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
}

.socialShell .profilePersonal :is(.forYouMetrics span, .forYouNext small, .forYouHint) {
  color: var(--kk-muted);
}

.socialShell .profilePersonal :is(.forYouMetrics b, .forYouNext strong, .forYouTop > strong) {
  color: var(--kk-text);
}

.socialShell .profilePersonal :is(.forYouTop > strong small, .forYouHint span, .forYouXp > div:first-child, .forYouGoal > b) {
  color: var(--kk-muted);
}

.socialShell .profilePersonal :is(.forYouXp > div:first-child b, .forYouNext > div:first-child > span) {
  color: var(--kk-accent);
}

.socialShell .profilePersonal :is(.forYouTrack, .forYouMiniTrack) {
  background: var(--kk-border);
}

.socialShell .profilePersonal :is(.forYouTrack, .forYouMiniTrack) i {
  background: var(--kk-accent);
}

.socialShell .socialProfilePreferences {
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 14px;
  margin-top: 20px;
}

.socialShell .socialProfileEditingGrid {
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 14px;
}

.socialShell .socialProfileEditing > summary {
  display: list-item;
  padding: 12px 14px;
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
  color: var(--kk-accent);
}

.socialShell .socialProfilePreferences :is(p, .socialProfileBioTitle, .socialProfileCounters span) {
  color: var(--kk-muted);
}

.socialShell .socialProfileCounters strong {
  color: var(--kk-text);
}

.socialShell .socialProfilePreferences :is(fieldset, .socialProfileFriends li, .socialProfileCounters) {
  border-color: var(--kk-border);
}

.socialShell .socialProfilePreferences :is(input, textarea, select) {
  border-color: var(--kk-border);
  background: var(--kk-bg);
  color: var(--kk-text);
}

.socialShell .socialProfilePreferences input[type="checkbox"] {
  accent-color: var(--kk-accent);
}

.socialShell :is(.socialProfilePreferences, .socialProfilePhotos) button:not(.primary, .secondary) {
  min-height: 44px;
  padding: 8px 13px;
  border: 1px solid var(--kk-border);
  border-radius: 10px;
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

.socialShell :is(.socialProfilePreferences, .socialProfilePhotos) button:not(.primary, .secondary, :disabled):hover {
  border-color: #a08060;
  color: var(--kk-accent);
}

.socialShell .socialProfilePreferences [data-profile-edit] button[type="submit"] {
  border-color: var(--kk-accent);
  background: var(--kk-accent);
  color: var(--kk-accent-ink);
}

.socialShell .socialProfilePreferences > a {
  color: var(--kk-accent);
}

.socialShell :is(.socialProfileFriendContext, .socialProfileLakeContext) h2 small {
  margin-left: 4px;
  color: var(--kk-muted);
  font-size: 13px;
}

.socialShell :is(.socialProfileFriendContext button, .socialProfileLakeContext button) {
  color: var(--kk-accent);
}

.socialShell .socialProfileFriendContext [data-state="online"] {
  color: #a9e1bd;
}

.socialShell .socialContextAvatar,
.socialShell .socialFavoriteLakeGrid > div {
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

.socialShell .socialFavoriteLakeGrid span {
  color: var(--kk-accent);
}

.socialShell .profileStats {
  grid-template-columns: repeat(auto-fit, minmax(min(112px, 100%), 1fr));
  gap: 10px;
}

.socialShell .profileStats .stat {
  min-width: 0;
  border-color: var(--kk-border);
  background: var(--kk-surface);
}

.socialShell .profileStats .stat strong {
  color: var(--kk-text);
}

.socialShell .profileStats .stat span {
  color: var(--kk-muted);
}

:is(.socialShell,
  .accountDialog) :is(.verifiedGameProfileHead,
  .verifiedXpCard,
  .verifiedProgressGrid,
  .verifiedAchievement,
  .verifiedAchievementProgress,
  .accountLinkedLevel,
  .accountLinkedOfficial > div,
  .accountLinkedArchive > div,
  .accountLinkedAchievement,
  .accountLinkedGame,
  .playerLakeFacts,
  .playerLakeFactsGrid article) {
  border-color: var(--kk-border);
  background: var(--kk-surface);
  color: var(--kk-text);
}

:is(.socialShell,
  .accountDialog) :is(.verifiedGameProfileHead p,
  .verifiedXpCard small,
  .verifiedXpTop span,
  .verifiedProgressGrid :is(span, small),
  .verifiedAchievement small,
  .verifiedAchievementHead strong,
  .verifiedAchievementProgress p,
  .accountLinkedHead p,
  .accountLinkedLevel :is(span, small),
  .accountLinkedOfficial :is(span, small),
  .accountLinkedArchive :is(span, small),
  .accountLinkedAchievement small,
  .accountLinkedAchievementsHead small,
  .accountLinkedGame :is(span, small),
  .playerBestCard :is(span, small),
  .playerProgressHead > span,
  .playerLakeFacts :is(span, small)) {
  color: var(--kk-muted);
  font-size: 13px;
  line-height: 1.5;
}

:is(.socialShell, .accountDialog) :is(.verifiedAchievementGrid, .verifiedAchievementProgressGrid, .accountLinkedAchievementList, .playerBestGrid) {
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
  gap: 10px;
}

:is(.socialShell, .accountDialog) :is(.verifiedAchievement, .verifiedAchievementProgress, .accountLinkedAchievement) {
  padding: 13px 14px;
  border-radius: 12px;
}

:is(.socialShell,
  .accountDialog) :is(.verifiedAchievement strong,
  .verifiedAchievementProgress strong,
  .accountLinkedAchievement strong,
  .accountLinkedGame strong) {
  color: var(--kk-text);
  font-size: 15px;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
}

.accountDialog :is(.accountLinkedAchievement small, .accountLinkedOfficial small, .accountLinkedArchive small) {
  white-space: normal;
}

:is(.socialShell, .accountDialog) :is(.verifiedAchievementHead span, .accountLinkedAchievementsHead span) {
  color: var(--kk-text);
  font-size: 16px;
}

:is(.socialShell,
  .accountDialog) :is(.verifiedAchievementProgress span,
  .accountLinkedAchievement > b,
  .accountLinkedGame b,
  .accountLinkedLevelValue b,
  .verifiedXpTop > b) {
  color: var(--kk-accent);
  font-size: 13px;
}

:is(.socialShell, .accountDialog) :is(.verifiedXpTrack, .verifiedMiniTrack, .accountLinkedLevelBar, .accountLinkedAchievementBar) {
  height: 6px;
  background: var(--kk-border);
}

:is(.socialShell, .accountDialog) :is(.verifiedXpTrack, .verifiedMiniTrack, .accountLinkedLevelBar, .accountLinkedAchievementBar) i {
  background: var(--kk-accent);
}

.socialShell .verifiedAchievement > span,
.accountDialog .accountLinkedAchievement.unlocked > div:first-child > span,
.accountDialog .accountLinkedAchievement.unlocked > b {
  color: #a9e1bd;
}

.accountDialog .accountLinkedAchievement.unlocked .accountLinkedAchievementBar i {
  background: #a9e1bd;
}

.accountDialog .accountLinkedAchievement > div:first-child > span {
  color: var(--kk-accent);
}

:is(.socialShell, .accountDialog) :is(.accountLinkedUnavailable, .accountLinkedEmpty, .accountLinkedLoading, .verifiedAchievementEmpty) {
  border-color: var(--kk-border);
  background: var(--kk-surface);
  color: var(--kk-muted);
  font-size: 14px;
}

:is(.socialShell, .accountDialog) :is(.accountLinkedConflict, .playerAchievementGuard) {
  border-color: #6f5740;
  background: #332a24;
  color: #f1d39e;
}

.socialShell .playerAchievementGuard :is(span, strong) {
  color: #f1d39e;
  font-size: 13px;
}

@media (max-width: 767px) {
  .socialShell .profileHero:not([style*="background-image"]) {
    background-image: linear-gradient(92deg, #2c221bf5, #30251dd9), url('/brand/krikumi-ice.webp') !important;
  }

  .socialShell .socialProfileNav {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding: 3px 3px 8px;
  }

  .socialShell .socialProfileNav > :is(button, a) {
    flex: 0 0 auto;
  }

  .socialShell .socialProfileHeroEdit {
    margin-left: 0;
  }
}

/* Staff workspace */
.socialShell .adminWorkspaceMain {
  width: 100%;
  padding-top: 0;
}

.adminToday {
  gap: 16px;
  color: var(--kk-text);
  overflow-wrap: anywhere;
}

.adminTodayHero {
  align-items: start;
  padding: clamp(20px, 4vw, 32px);
  border-color: var(--kk-border);
  border-radius: var(--kk-radius);
  background: var(--kk-surface);
  box-shadow: inset 3px 0 0 #876247;
  color: var(--kk-text);
}

.adminTodayHero h1 {
  margin: 7px 0 9px;
  color: var(--kk-text);
  font-family: inherit;
  font-size: clamp(30px, 4vw, 43px);
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1.1;
}

.adminTodayHero > div:first-child {
  min-width: 0;
}

.adminHeroActions {
  justify-content: flex-start;
}

.adminOverall {
  min-height: 36px;
  font-size: 13px;
}

.adminOverall.good,
.adminCalm {
  border-color: #355b4b;
  background: #1b3b35;
  color: #a9e1bd;
}

.adminOverall.warn,
.adminRoleNotice {
  border-color: #625140;
  background: #3b3226;
  color: #f1d39e;
}

.adminTodayStatus,
.adminTodayGrid {
  grid-template-columns: repeat(auto-fit, minmax(min(290px, 100%), 1fr));
  gap: 16px;
}

.adminToday :is(.adminStatusCard, .adminPanel) {
  min-width: 0;
  padding: clamp(17px, 3vw, 24px);
  border-color: var(--kk-border);
  border-radius: var(--kk-radius);
  background: var(--kk-surface);
  box-shadow: none;
  color: var(--kk-text);
}

.adminToday .adminStatusCard {
  min-height: 0;
}

.adminStatusCard.good {
  border-color: #355b4b;
}

.adminStatusCard.warn {
  border-color: #625140;
}

.adminToday :is(.adminCardHead, .adminSectionHead) h2 {
  color: var(--kk-text);
  font-size: clamp(20px, 2.8vw, 24px);
  letter-spacing: -.025em;
  line-height: 1.24;
}

.adminToday .adminSectionHead {
  flex-wrap: wrap;
  align-items: center;
}

.adminToday .adminKicker {
  color: var(--kk-accent);
  letter-spacing: .08em;
}

.adminToday :is(.adminTodayHero p,
  .adminStatusCard > p,
  .adminPublicationSummary,
  .adminEmptyState p,
  .adminQuickNote,
  .adminAttentionList small,
  .adminTournamentList small,
  .adminTournamentList em,
  .adminServerNumbers span,
  .adminQuickGrid small,
  .adminTodayFooter) {
  color: var(--kk-muted);
  font-size: 14px;
  line-height: 1.55;
}

.adminToday :is(.adminTextAction, .adminSectionHead > button, .adminTourDate) {
  color: var(--kk-accent);
  font-size: 14px;
}

.adminToday :is(.adminTextAction, .adminSectionHead > button) {
  max-width: 100%;
  min-height: 44px;
  padding: 6px 0;
  text-align: left;
}

.adminToday .adminTextAction:hover,
.adminToday .adminSectionHead > button:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.adminToday .adminServerNumbers {
  margin-top: 16px;
  grid-template-columns: repeat(auto-fit, minmax(min(86px, 100%), 1fr));
}

.adminToday :is(.adminServerNumbers > div, .adminAttentionList > div, .adminTournamentList > div, .adminQuickGrid button) {
  min-width: 0;
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

.adminToday .adminServerNumbers strong {
  color: var(--kk-text);
  font-size: clamp(17px, 2.5vw, 22px);
  font-variant-numeric: tabular-nums;
}

.adminToday .adminEmptyState {
  border-color: var(--kk-border);
}

.adminToday .adminEmptyState > span,
.adminToday .adminQuickGrid button > span {
  flex-shrink: 0;
  background: #423024;
  color: var(--kk-accent);
}

.adminToday .adminQuickPanel {
  grid-column: 1 / -1;
}

.adminToday .adminQuickGrid {
  grid-template-columns: repeat(auto-fit, minmax(min(225px, 100%), 1fr));
  gap: 9px;
}

.adminToday .adminQuickGrid button {
  min-height: 66px;
}

.adminToday .adminQuickGrid button:hover {
  border-color: #a08060;
  background: #423124;
}

.adminToday .adminQuickGrid b {
  color: var(--kk-accent);
}

.adminToday :is(.adminCommandGuide, .adminControlReadiness) {
  color: var(--kk-muted);
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
}

.adminToday .adminCommandGuide summary {
  min-height: 38px;
  padding-block: 7px;
  color: var(--kk-accent);
}

/* Account and staff dialogs */
:is(.accountModal,
  .adminTeamBackdrop,
  .gameControlBackdrop,
  .modWarningBackdrop,
  .webSuspensionBackdrop,
  .mediaBackdrop,
  .notificationBackdrop,
  .reportBackdrop,
  .paeBackdrop,
  .taeBackdrop) {
  background: #15110ebd;
  backdrop-filter: blur(5px);
}

:is(.accountDialog,
  .adminTeamDialog,
  .gameControlDialog,
  .modWarningDialog,
  .webSuspensionDialog,
  .mediaDialog,
  .notificationDialog,
  .reportDialog,
  .paeModal,
  .taeModal) {
  min-width: 0;
  border-color: var(--kk-border);
  background: var(--kk-surface);
  box-shadow: 0 18px 52px #15110e73;
  color: var(--kk-text);
  color-scheme: dark;
  overflow-wrap: anywhere;
}

:is(.accountDialog,
  .adminTeamDialog,
  .gameControlDialog,
  .modWarningDialog,
  .webSuspensionDialog,
  .mediaDialog,
  .notificationDialog,
  .reportDialog,
  .paeModal,
  .taeModal) :is(h1, h2, h3, h4, legend) {
  color: var(--kk-text);
  font-family: inherit;
}

:is(.accountDialog,
  .adminTeamDialog,
  .gameControlDialog,
  .modWarningDialog,
  .webSuspensionDialog,
  .mediaDialog,
  .notificationDialog,
  .reportDialog,
  .paeModal,
  .taeModal) :is(label, small,
  .accountEmail,
  .accountHint,
  .mediaTop p,
  .reportTop p,
  .reportList > p,
  .reportReference,
  .paeHint,
  .taeReviewCaution) {
  color: var(--kk-muted);
}

:is(.accountDialog,
  .adminTeamDialog,
  .gameControlDialog,
  .modWarningDialog,
  .webSuspensionDialog,
  .mediaDialog,
  .notificationDialog,
  .reportDialog,
  .paeModal,
  .taeModal) :is(input:not([type="checkbox"], [type="radio"]), select, textarea) {
  max-width: 100%;
  min-height: 44px;
  border-color: #71543e;
  background: var(--kk-bg);
  color: var(--kk-text);
  font: inherit;
}

:is(.accountDialog,
  .adminTeamDialog,
  .gameControlDialog,
  .modWarningDialog,
  .webSuspensionDialog,
  .mediaDialog,
  .notificationDialog,
  .reportDialog,
  .paeModal,
  .taeModal) :is(input, textarea)::placeholder {
  color: var(--kk-muted);
}

:is(.accountDialog,
  .adminTeamDialog,
  .gameControlDialog,
  .modWarningDialog,
  .webSuspensionDialog,
  .mediaDialog,
  .notificationDialog,
  .reportDialog,
  .paeModal,
  .taeModal) :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--kk-accent) !important;
  outline-offset: 2px;
}

:is(.accountClose,
  .gameControlClose,
  .adminTeamDialog header button,
  .modWarningDialog header button,
  .webSuspensionDialog header button,
  .mediaTop > button,
  .notificationDialog header button,
  .reportTop > button,
  .paeHeader > button,
  .taeHeader > button) {
  flex: 0 0 auto;
  min-width: 44px;
  min-height: 44px;
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

:is(.gameProfileBox,
  .gameControlPreview,
  .adminTeamRow,
  .modWarningRow,
  .webSuspensionItem,
  .mediaItem,
  .notificationItem,
  .reportCreate,
  .reportItem,
  .paeItem,
  .paeGameItem,
  .paePreviewBody,
  .taeItem,
  .taePreviewHero,
  .taePreview section,
  .taeResultEvidence,
  .taeReviewHistory) {
  min-width: 0;
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

:is(.accountDialog .gameProfileBox p,
  .accountDialog .gameProfileClaimForm label,
  .gameControlDialog p,
  .adminTeamDialog header p,
  .adminTeamRow small,
  .adminTeamRow > span,
  .adminTeamHistory p,
  .adminTeamReason label,
  .modWarningDialog header p,
  .modWarningRow small,
  .webSuspensionDialog header p,
  .webSuspensionItem small,
  .mediaItem small,
  .mediaItem label,
  .mediaHistory p,
  .notificationDialog header p,
  .notificationItem small,
  .reportItem > p,
  .reportItem > small,
  .reportItem .reportReference,
  .reportHistory p,
  .paeItem p,
  .paeItem em,
  .paeGameItem small,
  .paeGameItem span,
  .paePreviewBody p,
  .taeForm label > span,
  .taeItem small,
  .taeItem em,
  .taePreviewHero p,
  .taePreviewHero div,
  .taePreview section p,
  .taeResultEvidence p,
  .taeResultEvidence small,
  .taeResultEvidence th) {
  color: var(--kk-muted);
}

:is(.accountTabs, .adminTeamReason, .modWarningDialog form, .webSuspensionDialog form, .mediaUpload, .reportHistory, .paePublishNote, .taePublishNote) {
  border-color: var(--kk-border);
  background: var(--kk-bg);
}

:is(.accountTabs button,
  .reportQueueFilters button,
  .adminTeamRow button,
  .modWarningRow button,
  .paeGameActions .secondary,
  .paeFormActions .secondary,
  .paePreviewActions .secondary) {
  min-height: 44px;
  border-color: var(--kk-border);
  background: var(--kk-surface-raised);
  color: var(--kk-muted);
}

:is(.accountTabs button.active, .reportQueueFilters button[aria-pressed="true"]) {
  border-color: var(--kk-accent);
  background: #423024;
  color: var(--kk-accent);
}

:is(.adminTeamMessage, .modWarningMessage, .webSuspensionMessage, .mediaNotice, .notificationNotice, .reportNotice, .paeNotice, .taeNotice) {
  background: #423024;
  color: var(--kk-text);
}

:is(.paeHeader, .taeHeader) {
  border-color: var(--kk-border);
  background: var(--kk-surface);
}

:is(.paeHeader span,
  .paePreviewBody > span,
  .paeBack,
  .taeHeader span,
  .taeEditorTop span,
  .taePreviewHero > span,
  .taePreview section > span,
  .taeItem div > span,
  .taeItem b,
  .taeBack,
  .gameControlKicker) {
  color: var(--kk-accent);
}

:is(.taeModal, .paeModal, .accountDialog) .primary,
:is(.adminCreateTournamentButton, .adminPublicationButton, .gameControlActions button[type="submit"]) {
  min-height: 46px;
  border-color: var(--kk-accent) !important;
  background: var(--kk-accent) !important;
  box-shadow: none;
  color: var(--kk-accent-ink) !important;
}

:is(.taeModal, .paeModal, .accountDialog) .primary:not(:disabled):hover,
:is(.adminCreateTournamentButton, .adminPublicationButton, .gameControlActions button[type="submit"]):not(:disabled):hover {
  background: #ffcc9d !important;
}

:is(.taePublishNote strong, .gameProfileStatus.verified) {
  color: #a9e1bd;
}

:is(.taeResultEvidence th, .taeResultEvidence td, .taeReviewHistory li, .adminTeamHistory, .adminTeamHistory p, .modWarningHistory, .modWarningHistory p) {
  border-color: var(--kk-border);
}

:is(.notificationItem:hover, .paeItem:hover, .taeItem:hover, .paeGameItem:hover, .paeGameItem:focus-visible) {
  border-color: #a08060;
  background: #423124;
}

@media (max-width: 700px) {
  .adminTodayHero {
    gap: 16px;
  }

  .adminToday .adminHeroActions {
    justify-content: flex-start;
  }

  .adminHeroActions .adminOverall {
    flex-basis: 100%;
  }

  :is(.paeModal, .taeModal) {
    max-height: 100dvh;
    height: 100dvh;
  }

  :is(.accountDialog, .adminTeamDialog, .gameControlDialog, .modWarningDialog, .webSuspensionDialog, .mediaDialog, .notificationDialog, .reportDialog) {
    max-height: calc(100dvh - 22px);
  }
}


/* News reader: keep comments legible in KRIKUMI's warm dark palette.
   The legacy comments component still ships light-blue defaults. */
.kpfReader .publicationComments {
  border-top: 1px solid var(--kk-border);
  color: var(--kk-text);
}

.kpfReader .publicationComments h2,
.kpfReader .publicationComments :is(.pcComment header strong, .pcText) {
  color: var(--kk-text);
}

.kpfReader .publicationComments :is([role="status"], [data-pc-list] > p, [data-pc-auth], .pcComment small, .pcReplyLabel, .pcReplyLabel p, form label) {
  color: var(--kk-muted);
}

.kpfReader .publicationComments .pcComment {
  border: 1px solid var(--kk-border);
  background: var(--kk-surface);
  color: var(--kk-text);
}

.kpfReader .publicationComments .pcAvatar {
  background: var(--kk-accent-wash);
  color: var(--kk-accent);
}

.kpfReader .publicationComments .pcReplyLabel {
  border-left-color: var(--kk-accent);
  background: var(--kk-accent-wash);
}

.kpfReader .publicationComments :is(form, [data-pc-context]) {
  border-color: var(--kk-border);
  background: var(--kk-surface);
  color: var(--kk-text);
}

.kpfReader .publicationComments textarea {
  border-color: var(--kk-control-line);
  background: var(--kk-bg);
  color: var(--kk-text);
}

.kpfReader .publicationComments textarea::placeholder {
  color: var(--kk-muted);
}

.kpfReader .publicationComments button {
  border-color: var(--kk-control-line);
  background: var(--kk-surface-raised);
  color: var(--kk-text);
}

.kpfReader .publicationComments button:not(:disabled):hover {
  border-color: var(--kk-accent);
  background: var(--kk-accent-wash);
  color: var(--kk-accent);
}

.kpfReader .publicationComments button:disabled {
  border-color: var(--kk-border);
  color: var(--kk-muted);
  opacity: .72;
}

.kpfReader .publicationComments .pcReplyLabel button {
  border-color: transparent;
  background: transparent;
  color: var(--kk-accent);
}

.kpfReader .publicationComments button.primary,
.kpfReader .publicationComments button.primary:not(:disabled):hover {
  border-color: var(--kk-accent);
  background: var(--kk-accent);
  color: var(--kk-accent-ink);
}

.kpfReader .publicationComments :is(button, textarea):focus-visible {
  outline: 2px solid var(--kk-focus);
  outline-offset: 3px;
}


/* Verified PP2 presence: one avatar and one small status indicator. */
.socialShell .profileHero > .avatar[hidden] {
  display: none !important;
}
.socialShell .profileHero .socialProfilePresence {
  position: absolute;
  z-index: 5;
  top: 24px;
  right: 24px;
  left: auto;
  display: block;
  flex: none;
  box-sizing: border-box;
  width: 15px;
  height: 15px;
  min-width: 15px;
  margin: 0;
  padding: 0 !important;
  border: 2px solid #2b211b;
  border-radius: 50%;
  background: #97938f;
  box-shadow: 0 0 0 2px #32261d90;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0;
  overflow: hidden;
}
.socialShell .profileHero .socialProfilePresence[data-state="online"] {
  background: #44c877;
  box-shadow: 0 0 0 2px #32261d90, 0 0 8px #44c8776e;
}
.socialShell .profileHero .socialProfilePresence[data-state="not-listed"],
.socialShell .profileHero .socialProfilePresence[data-state="unknown"] {
  background: #97938f;
}

/* Only one SVG for the mobile messages control; old themes added an envelope glyph. */
.top .tools button[data-private-messages-open]::before,
.top .tools button[data-private-messages-open]::after {
  display: none !important;
  content: none !important;
}
.top .tools button[data-private-messages-open] {
  width: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  background-image: none !important;
  font-size: inherit !important;
}
.top .tools button[data-private-messages-open] svg {
  display: block;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  color: var(--kk-muted);
}

/* Real in-game mini maps and depth maps on the social profile. */
.socialShell .socialFavoriteLakeGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
  gap: 12px;
}
.socialShell .socialFavoriteLakeCard,
.socialShell .socialFavoriteLakeUnavailable {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--kk-border);
  border-radius: 13px;
  background: #302720;
  color: var(--kk-text);
}
.socialShell .socialFavoriteLakeCard > summary {
  display: grid;
  grid-template-columns: minmax(84px, 42%) minmax(0, 1fr) 11px;
  align-items: center;
  gap: 10px;
  min-height: 105px;
  padding: 9px;
  list-style: none;
  cursor: pointer;
}
.socialShell .socialFavoriteLakeCard > summary::-webkit-details-marker,
.socialShell .socialFavoriteLakeOriginal > summary::-webkit-details-marker {
  display: none;
}
.socialShell .socialFavoriteLakeCard > summary > img {
  width: 100%;
  height: 96px;
  display: block;
  object-fit: contain;
  border-radius: 9px;
  background: #dedbd2;
}
.socialShell .socialFavoriteLakeText { min-width: 0; display: grid; gap: 6px; }
.socialShell .socialFavoriteLakeText strong {
  font-size: 14px;
  line-height: 1.25;
  color: var(--kk-text);
  overflow-wrap: anywhere;
}
.socialShell .socialFavoriteLakeText small {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  font-size: 11px;
  line-height: 1.45;
  color: var(--kk-muted);
}
.socialShell .socialFavoriteLakeChevron {
  align-self: start;
  padding-top: 4px;
  font-size: 18px;
  color: var(--kk-accent);
  transition: transform .18s ease;
}
.socialShell .socialFavoriteLakeCard[open] .socialFavoriteLakeChevron { transform: rotate(180deg); }
.socialShell .socialFavoriteLakeCard[open] {
  border-color: #c09a79;
  background: #382d25;
}
.socialShell .socialFavoriteLakeDetails {
  padding: 0 12px 14px;
  color: var(--kk-muted);
  font-size: 12px;
  line-height: 1.6;
}
.socialShell .socialFavoriteLakeDetails p { margin: 8px 0; }
.socialShell .socialFavoriteLakeDetails figure { margin: 12px 0; }
.socialShell .socialFavoriteLakeDetails figure img {
  display: block;
  width: min(100%, 416px);
  height: auto;
  border-radius: 9px;
  background: #dedbd2;
}
.socialShell .socialFavoriteLakeDetails figcaption {
  margin-top: 5px;
  font-size: 11px;
  color: var(--kk-muted);
}
.socialShell .socialFavoriteLakeOriginal {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--kk-border);
}
.socialShell .socialFavoriteLakeOriginal summary {
  font-size: 12px;
  color: var(--kk-accent);
  cursor: pointer;
}
.socialShell .socialFavoriteLakeUnavailable { display: grid; gap: 6px; padding: 14px; }
.socialShell .socialFavoriteLakeUnavailable small { color: var(--kk-muted); }
.socialShell .socialLakeAttribution {
  margin: 12px 0 4px;
  font-size: 11px;
  line-height: 1.5;
  color: var(--kk-muted);
}
.socialShell .socialLakeAttribution a { color: var(--kk-accent); }
@media (max-width: 640px) {
  .socialShell .socialFavoriteLakeGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .socialShell .socialFavoriteLakeCard > summary {
    grid-template-columns: minmax(0, 1fr) 12px;
    gap: 6px;
    padding: 8px;
  }
  .socialShell .socialFavoriteLakeCard > summary > img {
    grid-column: 1 / -1;
    height: auto;
    aspect-ratio: 416 / 329;
  }
  .socialShell .socialFavoriteLakeText small { -webkit-line-clamp: 3; font-size: 11px; }
  .socialShell .socialFavoriteLakeText strong { font-size: 13px; }
  .socialShell .socialFavoriteLakeDetails { font-size: 11px; padding: 0 8px 12px; }
}
@media (max-width: 340px) {
  .socialShell .socialFavoriteLakeGrid { grid-template-columns: minmax(0, 1fr); }
}

/* Server administration: clear, compact controls on desktop, tablet and phone. */
.socialShell .socialContext .socialServerControlContext {
  border-color: #705443;
  background: linear-gradient(135deg, #30261f, #251e19);
  padding: clamp(17px, 2.4vw, 26px);
}
.socialShell .socialServerControlContext .socialServerControlHead {
  margin-bottom: 15px;
}
.socialShell .socialServerControlContext .socialAdminActionGrid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction {
  position: relative;
  display: grid;
  grid-template-columns: 35px minmax(0, 1fr) 13px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 94px;
  padding: 13px 12px;
  border: 1px solid #715444;
  border-radius: 14px;
  background: linear-gradient(145deg, #423328, #352a23);
  color: #fff1e3;
  box-shadow: none;
  text-align: left;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction[data-social-admin-action="game"] {
  border-color: #aa7b58;
  background: linear-gradient(135deg, #59402f, #3b2d23);
}
.socialShell .socialServerControlContext .socialAdminActionIcon {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border: 1px solid #785a46;
  border-radius: 11px;
  background: #503b2e;
  color: #f6be8e;
  font-family: system-ui, sans-serif;
  font-size: 22px;
  font-weight: 650;
  line-height: 1;
}
.socialShell .socialServerControlContext .socialAdminActionCopy strong {
  color: #fff3e8;
  font-size: 15px;
  line-height: 1.25;
}
.socialShell .socialServerControlContext .socialAdminActionCopy small {
  color: #e1c6b3;
  font-size: 12px;
  line-height: 1.38;
}
.socialShell .socialServerControlContext .socialAdminActionArrow {
  justify-self: end;
  width: 8px;
  height: 8px;
  border-top: 2px solid #f3b783;
  border-right: 2px solid #f3b783;
  transform: rotate(45deg);
  font-size: 0;
  line-height: 0;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:hover:not(:disabled) {
  background: #59402e;
  border-color: #e6ae7c;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:disabled {
  background: #2d2621;
  opacity: .64;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:focus-visible {
  outline: 2px solid #f5be89;
  outline-offset: 3px;
}
.socialShell .socialServerControlContext .socialAdminQuickHint {
  margin-top: 12px;
  color: #d6bfad;
  font-size: 12px;
  line-height: 1.5;
}
.socialShell .socialServerControlContext > button.socialAdminShortcut {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  min-width: 208px;
  min-height: 43px;
  margin: 10px 0 0 auto;
  padding: 10px 19px;
  border: 1px solid #966e52;
  border-radius: 11px;
  background: #4c3629;
  color: #ffead8;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  box-shadow: none;
}
.socialShell .socialServerControlContext > button.socialAdminShortcut:hover:not(:disabled) {
  border-color: #e2ae7d;
  background: #63442f;
  color: #fff7e9;
}
.socialShell .socialServerControlContext > button.socialAdminShortcut:focus-visible {
  outline: 2px solid #f4bc89;
  outline-offset: 3px;
}

@media (max-width: 1279px) {
  .socialShell .socialServerControlContext .socialAdminActionGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 759px) {
  .socialShell .socialServerControlContext .socialAdminActionGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }
  .socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction {
    grid-template-columns: minmax(0, 1fr) 16px;
    grid-template-rows: 34px auto;
    align-content: start;
    align-items: start;
    gap: 8px;
    min-height: 108px;
    padding: 13px;
  }
  .socialShell .socialServerControlContext .socialAdminActionIcon {
    grid-column: 1;
    grid-row: 1;
  }
  .socialShell .socialServerControlContext .socialAdminActionCopy {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .socialShell .socialServerControlContext .socialAdminActionArrow {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }
  .socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction[data-social-admin-action="game"] {
    grid-column: 1 / -1;
    grid-template-columns: 35px minmax(0, 1fr) 16px;
    grid-template-rows: auto;
    align-items: center;
    min-height: 74px;
  }
  .socialShell .socialServerControlContext button.socialAdminAction[data-social-admin-action="game"] .socialAdminActionCopy {
    grid-column: 2;
    grid-row: 1;
  }
  .socialShell .socialServerControlContext button.socialAdminAction[data-social-admin-action="game"] .socialAdminActionArrow {
    grid-column: 3;
    grid-row: 1;
  }
}
@media (max-width: 390px) {
  .socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction {
    min-height: 104px;
    padding: 11px;
  }
  .socialShell .socialServerControlContext .socialAdminActionCopy strong {
    font-size: 14px;
  }
  .socialShell .socialServerControlContext .socialAdminActionCopy small {
    font-size: 11px;
  }
}

/* Admin color repair: legacy light/blue buttons must remain readable on dark surfaces. */
.adminTopButton {
  border-color: #755542 !important;
  background: #382a22 !important;
  color: #f4c194 !important;
}
.adminTopButton:hover,
.adminTopButton.active {
  border-color: #cb9264 !important;
  background: #503829 !important;
  color: #ffe3c8 !important;
}
.adminToday .adminHeroActions :is(button.secondary, button.ghost) {
  min-height: 46px;
  padding: 10px 16px;
  border: 1px solid #86634d !important;
  border-radius: 12px;
  background: #3d2d23 !important;
  color: #ffe0c4 !important;
  box-shadow: none !important;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.35;
  text-align: center;
  text-wrap: balance;
}
.adminToday .adminHeroActions button.secondary {
  border-color: #dda574 !important;
  background: #eab584 !important;
  color: #2d2119 !important;
}
.adminToday .adminHeroActions :is(button.secondary, button.ghost):hover:not(:disabled) {
  border-color: #f3bd8e !important;
  background: #63442f !important;
  color: #fff3e7 !important;
}
.adminToday .adminControlReadiness {
  border-color: #785946 !important;
  background: #372a21 !important;
  color: #ead3bf !important;
}
.adminToday .adminControlReadiness strong {
  color: #f5c697 !important;
}
.adminToday .adminControlReadiness span {
  color: #f5e4d3 !important;
}
.adminToday .adminControlReadiness small {
  color: #dec7b6 !important;
}
.adminToday .adminTournamentList > div > button {
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid #765743 !important;
  border-radius: 11px;
  background: #3d2d24 !important;
  color: #f4bc8c !important;
  font-size: 13px;
  font-weight: 750;
}
.adminToday .adminTournamentList > div > button:hover:not(:disabled) {
  background: #51392b !important;
  border-color: #c58e60 !important;
  color: #ffe5cc !important;
}
.adminToday .adminQuickGrid button.adminPublicationButton {
  border: 1px solid #ac7c56 !important;
  background: #59402d !important;
  color: #fff0dd !important;
}
.adminToday .adminQuickGrid button.adminPublicationButton:hover:not(:disabled) {
  background: #6b4b32 !important;
  border-color: #e6ae7c !important;
}
.adminToday .adminQuickGrid button :is(strong, b) {
  color: #fff0df !important;
}
.adminToday .adminQuickGrid button small {
  color: #e6cdb8 !important;
}
.adminToday .adminQuickGrid button > span,
.adminToday .adminQuickGrid button b {
  color: #f4bc8c !important;
}
.adminToday :is(a, .adminTextAction, .adminSectionHead > button) {
  color: #efb786 !important;
}
/* Admin tournament actions use a warm orange fill. The generic admin link
   selector above must not paint their captions orange on orange. */
.adminToday .adminSectionHead > button.adminCreateTournamentButton {
  color: var(--kk-accent-ink, #2b1a13) !important;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
}
.adminToday :is(a, button):focus-visible {
  outline: 2px solid #f3b981;
  outline-offset: 3px;
}
@media (max-width: 700px) {
  .adminToday .adminHeroActions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .adminToday .adminHeroActions .adminOverall {
    grid-column: 1 / -1;
  }
  .adminToday .adminHeroActions :is(button.secondary, button.ghost) {
    width: 100%;
    min-width: 0;
  }
}

/* Keep player requests legible when the admin dashboard uses two narrow columns. */
.adminToday .adminTournamentList > div > div {
  min-width: 0;
  overflow-wrap: anywhere;
}
@media (min-width: 651px) and (max-width: 1100px) {
  .adminToday .adminTournamentList > div {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 9px;
    padding: 12px;
  }
  .adminToday .adminTournamentList .adminTourDate {
    grid-column: 1 / -1;
  }
}

/* Archive lakes: verified Pro Pilkki 2 map artwork and readable descriptions. */
.lakeGrid > .lakeCard {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  padding: 0;
  gap: 0;
  overflow: hidden;
  border-color: rgba(163, 135, 99, .24);
  background: linear-gradient(155deg, #292824, #211f1c);
}
.lakeGrid > .lakeCard:hover,
.lakeGrid > .lakeCard:focus-visible {
  border-color: rgba(220, 169, 102, .6);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .24);
}
.lakeMediaFrame {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  overflow: hidden;
  background: #1d2527;
}
.lakeCardMedia {
  width: 100%;
  aspect-ratio: 416 / 260;
  border-bottom: 1px solid rgba(236, 202, 147, .13);
}
.lakeMediaFrame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.lakeMediaFrame img[hidden] { display: none; }
.lakeMediaFallback {
  display: none;
  max-width: 24em;
  padding: 18px;
  color: #ded4c4;
  font-size: .9rem;
  line-height: 1.5;
  text-align: center;
}
.lakeMediaFrame.lakeMediaUnavailable .lakeMediaFallback { display: block; }
.lakeCardBody {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  gap: 14px;
  padding: 19px 19px 16px;
}
.lakeCardBody .lakeCardTop { margin: 0; align-items: flex-start; }
.lakeCardBody .lakeCardTop h2 {
  color: #f6eee0;
  overflow-wrap: anywhere;
  line-height: 1.25;
}
.lakeCardBody .lakeCardTop > b { color: #dcb27b; }
.lakeCardBody .lakeCardDescription {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  min-width: 0;
  flex: 1;
  margin: 0;
  color: #d9d0c2;
  font-size: .93rem;
  line-height: 1.55;
}
.lakeCardBody .lakeCardStats {
  min-width: 0;
  padding-top: 12px;
  border-top: 1px solid rgba(235, 208, 170, .12);
}
.lakeCardBody .lakeCardStats > div { min-width: 0; }
.lakeCardBody .lakeCardLastGame {
  margin: 0;
  color: #bfb5a7;
  font-size: .79rem;
}
.lakeVisualDetail {
  display: grid;
  gap: 20px;
  min-width: 0;
  padding: clamp(16px, 2.4vw, 27px);
  margin-bottom: 22px;
  border-color: rgba(191, 149, 94, .25);
}
.lakeVisualIntro h2 {
  margin: 6px 0 0;
  color: #f6eee0;
  font-size: clamp(1.2rem, 2.2vw, 1.7rem);
}
.lakeMapPair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 20px;
  min-width: 0;
}
.lakeMapPair figure { min-width: 0; margin: 0; }
.lakeMapFrame {
  width: 100%;
  aspect-ratio: 416 / 329;
  border: 1px solid rgba(223, 188, 132, .25);
  border-radius: 11px;
}
.lakeMapPair figcaption {
  padding: 9px 2px 0;
  color: #d5c8b5;
  font-size: .88rem;
  text-align: center;
}
.lakeRealDescription {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.lakeRealDescription > div {
  min-width: 0;
  padding: 16px 18px;
  border-radius: 10px;
  background: rgba(236, 201, 150, .055);
}
.lakeRealDescription h3 {
  margin: 0 0 9px;
  color: #f2ddbd;
  font-size: 1.03rem;
}
.lakeRealDescription p,
.lakeOriginalDescription p,
.lakeVisualMissing p {
  margin: 0;
  color: #ddd4c7;
  line-height: 1.65;
  overflow-wrap: break-word;
}
.lakeOriginalDescription {
  min-width: 0;
  padding: 12px 15px;
  border: 1px solid rgba(226, 189, 134, .18);
  border-radius: 10px;
}
.lakeOriginalDescription summary {
  color: #e5c394;
  cursor: pointer;
}
.lakeOriginalDescription p { margin-top: 12px; }
.lakeGameSource {
  justify-self: start;
  color: #f0c68e;
  text-decoration: underline;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}
.lakeGameSource:hover,
.lakeGameSource:focus-visible { color: #fff0cd; }
@media (max-width: 700px) {
  .lakeMapPair,
  .lakeRealDescription { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .lakeVisualDetail { margin-bottom: 16px; }
  .lakeCardBody { padding: 17px 16px; }
  .lakeCardMedia { aspect-ratio: 416 / 240; }
}

/* Prevent legacy blue archive accents from reducing contrast in the warm theme. */
.lakesScopeNote { color: #c9bcaa; }
.lakesTitle > p { color: #d4c8b8; }
.lakeCardBody .lakeCardStats span { color: #d3b995; }
.lakeCardBody .lakeCardStats strong { color: #f8ecdb; }
.lakeVisualDetail {
  background: linear-gradient(145deg, #2b2722 0%, #231f1c 100%);
}

.lakesTitle .eyebrow,
.lakesTools label > span,
.lakeCardBody .eyebrow,
.lakeVisualIntro .eyebrow { color: #efc68e; }
.lakesTools {
  background: linear-gradient(125deg, #302922, #25211d);
  border-color: rgba(215, 172, 115, .22);
}
.lakesTools input {
  border-color: rgba(219, 183, 128, .25);
  color: #f8eddc;
  background: #1d1c1a;
}
.lakesTools input::placeholder { color: #b9aa96; }
.lakesTools [data-lake-count] { color: #ebcfaa; }
.lakeCardMedia { background: #242824; }
.lakesTitle + .dataSectionTabs [data-lakes-tab].active {
  color: #f9e5c6;
  background: #423226;
}



/* Final UX pass: use the whole workspace and keep verified PP2 history legible. */
@media (min-width: 861px) {
  body.adminWorkspaceOpen .socialShell[data-kr-context] {
    grid-template-columns: var(--kk-side) minmax(0, 1fr);
  }
  body.adminWorkspaceOpen .socialShell > main.adminWorkspaceMain {
    grid-column: 2;
    grid-row: 1;
  }
}
body.adminWorkspaceOpen .socialShell > .socialContext {
  display: none !important;
}
body.adminWorkspaceOpen .socialShell main.adminWorkspaceMain {
  width: 100%;
  min-width: 0;
}

.adminToday .adminAttentionList > div > span,
.adminToday .adminTournamentList > div > div {
  min-width: 0;
  flex: 1 1 auto;
}
.adminToday .adminTournamentList > div > div :is(strong, small),
.adminToday .adminAttentionList > div > span :is(strong, small) {
  word-break: normal;
  overflow-wrap: break-word;
  line-height: 1.45;
}
.adminToday .adminTournamentList > div > button {
  min-width: 78px;
  white-space: normal;
  overflow-wrap: break-word;
}
@media (max-width: 1150px) {
  .adminToday .adminTodayStatus,
  .adminToday .adminTodayGrid {
    grid-template-columns: minmax(0, 1fr);
  }
  .adminToday .adminTournamentList > div {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px;
  }
  .adminToday .adminTournamentList .adminTourDate {
    grid-column: 1 / -1;
  }
}
@media (max-width: 520px) {
  .adminToday .adminTournamentList > div {
    grid-template-columns: minmax(0, 1fr);
  }
  .adminToday .adminTournamentList > div > button {
    justify-self: start;
  }
}

/* Archived round cards stay compact without forcing 10px metadata on desktop. */
.socialShell .gameEvent {
  min-height: 92px;
  padding: 15px;
  gap: 12px;
}
.socialShell .gameEvent > div {
  min-width: 0;
  gap: 4px;
  overflow-wrap: break-word;
}
.socialShell .gameEvent small {
  color: #d6b992;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: .015em;
}
.socialShell .gameEvent strong {
  color: var(--kk-text);
  font-size: 16px;
  line-height: 1.35;
  overflow-wrap: break-word;
}
.socialShell .gameEvent p {
  color: #d2c1ad;
  font-size: 13px;
  line-height: 1.5;
  overflow-wrap: break-word;
}
.socialShell .gameEvent:focus-visible {
  outline: 2px solid #ffcc9d;
  outline-offset: 3px;
}
@media (max-width: 390px) {
  .socialShell .gameEvent {
    grid-template-columns: 36px minmax(0, 1fr) 12px;
    gap: 9px;
    padding: 12px;
  }
  .socialShell .gameEvent > span {
    width: 36px;
    height: 36px;
    font-size: 13px;
  }
  .socialShell .gameEvent strong { font-size: 15px; }
}

/* Unconfirmed host actions must not look like enabled controls. */
.socialShell [data-social-admin-state] {
  max-width: 100%;
  white-space: normal;
  line-height: 1.4;
  overflow-wrap: break-word;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:disabled {
  opacity: 1;
  cursor: not-allowed;
  border: 1px dashed #625349;
  background: #2d2925;
  box-shadow: none;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:disabled .socialAdminActionIcon {
  color: #b8a391;
  border-color: #66564a;
  background: #39302a;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:disabled .socialAdminActionCopy strong {
  color: #cbbbae;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:disabled .socialAdminActionCopy small {
  color: #b7a596;
}
.socialShell .socialServerControlContext .socialAdminQuick button.socialAdminAction:disabled .socialAdminActionArrow {
  display: none;
}


/* Profile tabs remain swipeable on phones without a distracting scrollbar. */
.socialShell .socialProfileNav {
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}
.socialShell .socialProfileNav::-webkit-scrollbar {
  display: none;
}
.socialShell .socialProfileNav > :is(button, a) {
  min-height: 44px;
}