.leaderboard-page {min-height:100vh;background:var(--ps-bg-primary,#0a0a0a);color:white;}.leaderboard-page [hidden]{display:none!important;}.leaderboard-header {position:sticky;top:0;z-index:40;backdrop-filter:blur(4px);border-bottom:1px solid var(--ps-border,#27272a);background:var(--ps-bg-surface,#111827);}.leaderboard-heading {display:flex;align-items:center;justify-content:space-between;padding:16px;gap:12px;}.leaderboard-title {display:flex;align-items:center;gap:12px;}.leaderboard-title h1 {font-size:20px;font-weight:700;display:flex;align-items:center;gap:8px;}.leaderboard-title h1 .ps-icon{color:#facc15;width:24px;height:24px;}.leaderboard-title p{font-size:12px;color:#9ca3af;}.leaderboard-circle {display:flex;align-items:center;justify-content:center;padding:8px;border-radius:50%;background:#1f2937;color:#9ca3af;}.leaderboard-circle:hover {color:white;}.leaderboard-circle.is-active {background:#10b98133;color:#34d399;}.leaderboard-podium {display:flex;align-items:center;gap:8px;}.leaderboard-podium>span:nth-of-type(1){font-size:24px;}.leaderboard-podium>span:nth-of-type(2){font-size:20px;}.leaderboard-podium>span:nth-of-type(3){font-size:18px;}.leaderboard-filters {padding:12px 16px;border-top:1px solid #1f2937;background:#11182780;display:grid;gap:12px;}.leaderboard-filters-header {display:flex;align-items:center;justify-content:space-between;color:#9ca3af;font-size:14px;font-weight:500;}.leaderboard-clear {font-size:12px;color:#34d399;display:flex;align-items:center;gap:4px;}.leaderboard-clear .ps-icon{width:12px;height:12px;}.leaderboard-filters label {display:flex;align-items:center;gap:4px;font-size:12px;color:#6b7280;margin-bottom:4px;}.leaderboard-filters select {width:100%;background:#1f2937;border:1px solid #374151;border-radius:8px;padding:8px 12px;font-size:14px;color:white;cursor:pointer;}.leaderboard-tabs {display:flex;gap:8px;padding:0 16px 12px;}.leaderboard-tabs button {flex:1;padding:10px 12px;border-radius:12px;font-size:14px;font-weight:600;background:#1f2937;color:#9ca3af;transition:.2s;}.leaderboard-tabs button[aria-selected=true] {background:linear-gradient(90deg,#eab308,#f59e0b);color:#111827;}.leaderboard-banner{padding:12px 16px;background:linear-gradient(90deg,#713f122f,#78350f2f);border-bottom:1px solid #eab3081a;font-size:14px;text-align:center;color:#facc15cc;font-weight:500;}.leaderboard-list{padding:16px 16px 96px;display:grid;gap:8px;}.leaderboard-row {display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;cursor:pointer;transition:.2s;background:#1f293766;color:inherit;text-decoration:none;}.leaderboard-row:hover {transform:scale(1.01);background:#1f293799;}.leaderboard-row[data-rank="1"]{background:#eab30833;border:1px solid #37415180;}.leaderboard-row[data-rank="2"]{background:#6b728033;border:1px solid #37415180;}.leaderboard-row[data-rank="3"]{background:#f59e0b33;border:1px solid #37415180;}.leaderboard-row.is-current {background:linear-gradient(90deg,#eab30833,#f59e0b33);border:2px solid #eab308;box-shadow:0 0 0 2px #eab3084d,0 10px 15px #eab30833;}.leaderboard-rank{width:44px;height:44px;display:flex;align-items:center;justify-content:center;flex:none;border-radius:50%;background:#374151;color:#d1d5db;font-size:12px;font-weight:700;}.leaderboard-row[data-rank="1"] .leaderboard-rank,.leaderboard-row[data-rank="2"] .leaderboard-rank,.leaderboard-row[data-rank="3"] .leaderboard-rank {font-size:24px;background:none;}.leaderboard-avatar{width:48px;height:48px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg,#374151,#1f2937);border:2px solid #4b5563;color:#9ca3af;font-weight:700;}.leaderboard-avatar img{width:100%;height:100%;object-fit:cover;}.is-current .leaderboard-avatar{background:#eab3084d;border-color:#eab308;color:#facc15;}.leaderboard-player {min-width:0;flex:1;}.leaderboard-player strong {display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;}.is-current .leaderboard-player strong{color:#facc15;}.leaderboard-player small {font-size:12px;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}.leaderboard-player .leaderboard-you {font-size:12px;color:#fde047;margin-left:4px;}.leaderboard-value {text-align:right;flex:none;}.leaderboard-value strong {display:block;font-size:20px;font-weight:700;color:#34d399;}.leaderboard-value small{font-size:12px;color:#6b7280;}.leaderboard-value.no-value strong{font-size:12px;color:#4b5563;max-width:96px;white-space:normal;}.leaderboard-value.coins strong{color:#fbbf24;}.leaderboard-footer{position:fixed;bottom:0;left:0;right:0;padding:16px;background:linear-gradient(transparent,var(--ps-bg-primary,#0a0a0a));text-align:center;color:#6b7280;font-size:14px;pointer-events:none;}.leaderboard-empty{text-align:center;padding:64px 0;}.leaderboard-empty h2{font-size:18px;font-weight:500;color:#9ca3af;margin-bottom:8px;}.leaderboard-empty p{font-size:14px;color:#6b7280;max-width:320px;margin:0 auto;}.leaderboard-empty .leaderboard-clear{margin:16px auto 0;padding:8px 16px;border-radius:8px;background:#10b98133;}.leaderboard-loading {display:flex;align-items:center;justify-content:center;min-height:100vh;}.leaderboard-spinner{width:32px;height:32px;border:2px solid #eab308;border-top-color:transparent;border-radius:50%;animation:leaderboard-spin 1s linear infinite;}@keyframes leaderboard-spin{to{transform:rotate(360deg)}}

/* Native selectors corresponding to source page-themes and Tailwind text boxes. */
.leaderboard-page .leaderboard-loading { min-height:180px; gap:12px; color:var(--ps-text-secondary); font-size:14px; }
.leaderboard-page .leaderboard-load-error { margin:20px 16px; padding:20px; border:1px solid var(--ps-border); border-radius:14px; color:var(--ps-text-secondary); }
.leaderboard-load-error p { margin:0 0 12px; }
.leaderboard-load-error .leaderboard-clear { min-height:44px; }
.leaderboard-page [hidden] { display:none!important; }
@media(prefers-reduced-motion:reduce) { .leaderboard-spinner { animation:none; } }
.leaderboard-page{background:var(--ps-bg-base,#0a0a0a);color:var(--ps-text-primary,#fff);}
.leaderboard-footer{background:linear-gradient(transparent,var(--ps-bg-base,#0a0a0a));}
.leaderboard-title h1{line-height:28px;}.leaderboard-title p,.leaderboard-clear,.leaderboard-filters label,.leaderboard-player small,.leaderboard-player .leaderboard-you,.leaderboard-value small,.leaderboard-value.no-value strong{line-height:16px;}
.leaderboard-tabs button,.leaderboard-banner,.leaderboard-filters-header,.leaderboard-filters select,.leaderboard-footer,.leaderboard-empty p{line-height:20px;}
.leaderboard-circle{border:0;min-width:36px;min-height:36px;flex-shrink:0;}.leaderboard-circle .ps-icon{width:20px;height:20px;}
.theme-light .leaderboard-header{background:var(--ps-glass-bg);}
.theme-light .leaderboard-page :is(.leaderboard-circle,.leaderboard-filters,.leaderboard-filters select,.leaderboard-tabs button,.leaderboard-rank){background:var(--ps-bg-elevated);border-color:var(--ps-border-light);}
.theme-light .leaderboard-page .leaderboard-row:not([data-rank="1"]):not([data-rank="2"]):not([data-rank="3"]):not(.is-current){background:var(--ps-bg-elevated);}
.theme-light .leaderboard-page :is(.leaderboard-title p,.leaderboard-circle,.leaderboard-filters-header,.leaderboard-filters label,.leaderboard-tabs button,.leaderboard-rank,.leaderboard-player small,.leaderboard-value small,.leaderboard-value.no-value strong,.leaderboard-footer,.leaderboard-empty h2,.leaderboard-empty p){color:var(--ps-text-secondary);}
.theme-light .leaderboard-page :is(.leaderboard-title h1 .ps-icon,.leaderboard-value.coins strong,.leaderboard-row.is-current .leaderboard-player strong){color:#92400e;}
.theme-light .leaderboard-page :is(.leaderboard-clear,.leaderboard-value strong,.leaderboard-circle.is-active){color:#047857;}
.theme-light .leaderboard-tabs button[aria-selected=true]{background:linear-gradient(90deg,#eab308,#f59e0b);color:#111827;}
.theme-light .leaderboard-filters select{color:var(--ps-text-primary);}

/* Grid tracks and flex children must shrink before long content can truncate. */
.leaderboard-page { width: 100%; max-width: 100%; }
.leaderboard-heading { flex-wrap: wrap; }
.leaderboard-title { flex: 1 1 13rem; min-width: 0; }
.leaderboard-title > div { min-width: 0; }
.leaderboard-page .leaderboard-title h1 {
  font-size: calc(1.25rem * var(--ps-font-scale, 1));
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.leaderboard-title h1 .ps-icon { flex-shrink: 0; }
.leaderboard-podium { flex: none; margin-left: auto; }
.leaderboard-filters { grid-template-columns: minmax(0, 1fr); }
.leaderboard-filters > div { min-width: 0; }
.leaderboard-filters-header { flex-wrap: wrap; gap: 8px; }
.leaderboard-filters select { min-width: 0; max-width: 100%; }
.leaderboard-tabs button { min-width: 0; overflow-wrap: anywhere; }
.leaderboard-list { grid-template-columns: minmax(0, 1fr); }
.leaderboard-row { min-width: 0; max-width: 100%; }
.leaderboard-player strong { display: flex; align-items: center; gap: 4px; }
.leaderboard-player [data-name] {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.leaderboard-player .leaderboard-you { flex: none; margin-left: 0; }
.theme-light .leaderboard-player .leaderboard-you { color: #92400e; }
.leaderboard-value { min-width: 0; max-width: 40%; }
.leaderboard-value strong { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.leaderboard-footer { padding-bottom: max(16px, env(safe-area-inset-bottom)); }
.leaderboard-empty { padding-inline: 16px; overflow-wrap: anywhere; }

.leaderboard-row:hover { transform: none; }

@media (max-width: 480px) {
  .leaderboard-heading { padding: 12px; gap: 8px; }
  .leaderboard-title { flex-basis: 100%; gap: 8px; }
  .leaderboard-circle { min-width: 44px; min-height: 44px; }
  .leaderboard-filters { padding-inline: 12px; }
  .leaderboard-filters select { min-height: 44px; font-size: calc(1rem * var(--ps-font-scale, 1)); }
  .leaderboard-tabs { padding-inline: 12px; }
  .leaderboard-tabs button { min-height: 44px; }
  .leaderboard-list { padding-inline: 12px; }
  .leaderboard-row {
    display: grid;
    grid-template-columns: 32px 36px minmax(0, 1fr);
    gap: 4px 8px;
    padding: 10px;
  }
  .leaderboard-rank, .leaderboard-avatar { grid-row: 1 / span 2; }
  .leaderboard-rank { width: 32px; height: 32px; }
  .leaderboard-avatar { width: 36px; height: 36px; }
  .leaderboard-player, .leaderboard-value { grid-column: 3; }
  .leaderboard-value {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px;
    max-width: 100%;
    text-align: left;
  }
  .leaderboard-value strong { max-width: 100%; font-size: 16px; }
  .leaderboard-value.no-value strong { max-width: 100%; }
}
