.global-button { color: #ffda62; border-color: rgba(255,207,84,.42); background: radial-gradient(circle,rgba(255,207,84,.12),transparent 68%); font-size: 1.25rem; }
.global-button:hover { color: #fff0a8; border-color: #ffcf54; }

.leaderboard-dialog { width: min(520px,calc(100% - 24px)); max-height: min(760px,calc(100dvh - 24px)); margin: auto; padding: 0; overflow: auto; color: #f7fbfc; border: 1px solid #2a566e; border-radius: 12px; background: radial-gradient(circle at 75% 5%,rgba(28,109,132,.25),transparent 37%),linear-gradient(150deg,#0b293d,#061623 70%); box-shadow: 0 30px 90px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.04); }
.leaderboard-dialog::backdrop { background: rgba(2,9,15,.8); backdrop-filter: blur(7px); }
.leaderboard-dialog-glow { position: absolute; width: 280px; height: 280px; right: -130px; top: -150px; border: 28px solid rgba(99,230,237,.06); border-radius: 50%; pointer-events: none; }
.username-dialog { text-align: center; padding: 28px clamp(22px,6vw,42px) 24px; }
.leaderboard-dialog-logo { width: 82px; height: 68px; object-fit: contain; filter: drop-shadow(0 12px 20px rgba(0,0,0,.38)); }
.leaderboard-dialog h2 { margin: 7px 0 9px; font-size: clamp(1.75rem,7vw,2.5rem); line-height: .96; letter-spacing: -.05em; }
.leaderboard-intro { max-width: 390px; margin: 0 auto 21px; color: #afc6d0; font-size: .86rem; line-height: 1.48; }
.username-dialog form,.recovery-login-dialog form { position: relative; display: grid; text-align: left; }
.username-dialog label,.recovery-login-dialog label,.leaderboard-level-label { margin-bottom: 7px; color: #77dfe7; font-size: .62rem; font-weight: 950; letter-spacing: .18em; }
.username-input-wrap { position: relative; }
.username-input-wrap input { width: 100%; height: 58px; padding: 0 65px 0 16px; color: #fff; border: 1px solid #32657c; border-radius: 7px; outline: 0; background: rgba(3,18,29,.72); font: 900 1.35rem/1 "Card Block",system-ui,sans-serif; letter-spacing: .08em; text-transform: uppercase; box-shadow: inset 0 0 20px rgba(99,230,237,.035); }
.username-input-wrap input:focus { border-color: #63e6ed; box-shadow: 0 0 0 3px rgba(99,230,237,.11),inset 0 0 20px rgba(99,230,237,.05); }
.username-input-wrap span { position: absolute; right: 14px; top: 50%; color: #7898a6; font-size: .68rem; font-weight: 900; transform: translateY(-50%); }
.username-rules { margin: 8px 0 0; color: #7898a6; font-size: .67rem; line-height: 1.4; }
.leaderboard-status { min-height: 18px; margin: 10px 0; color: #91abb7; font-size: .72rem; line-height: 1.35; text-align: center; }
.leaderboard-status[data-kind="error"] { color: #ffac9e; }
.leaderboard-status[data-kind="success"] { color: #8ceeb3; }
.leaderboard-status[data-kind="loading"] { color: #7fe5ec; }
.leaderboard-join { width: 100%; margin-top: 1px; }
.leaderboard-join:disabled { opacity: .55; cursor: wait; }
.leaderboard-existing,.leaderboard-offline { justify-self: center; padding: 5px 8px; border: 0; background: transparent; font-size: .72rem; font-weight: 800; cursor: pointer; }
.leaderboard-existing { margin-top: 13px; color: #75e1e9; }
.leaderboard-offline { margin-top: 4px; color: #8da9b5; }
.leaderboard-existing:hover,.leaderboard-offline:hover { color: #f2fbfd; }
.turnstile-mount { position: relative; z-index: 1; display: grid; place-items: center; width: 100%; overflow: visible; }
.turnstile-mount:not(:empty) { min-height: 68px; margin-top: 10px; }
.turnstile-mount iframe { max-width: 100%; }

.recovery-login-dialog,.recovery-code-dialog { padding: 27px clamp(22px,6vw,42px) 24px; text-align: center; }
.recovery-login-dialog .dialog-close { position: absolute; right: 12px; top: 12px; }
.recovery-login-dialog form { gap: 0; }
.recovery-login-dialog label:not(:first-child) { margin-top: 14px; }
.recovery-login-dialog input { width: 100%; height: 52px; padding: 0 14px; color: #fff; border: 1px solid #32657c; border-radius: 7px; outline: 0; background: rgba(3,18,29,.72); font: 900 1.08rem/1 "Card Block",system-ui,sans-serif; letter-spacing: .07em; text-transform: uppercase; }
.recovery-login-dialog input:focus { border-color: #63e6ed; box-shadow: 0 0 0 3px rgba(99,230,237,.11); }
.recovery-login-dialog .recovery-code-input { font-family: "Card Mono",ui-monospace,monospace; font-size: 1rem; letter-spacing: .055em; }
.recovery-code-card { position: relative; display: grid; gap: 8px; margin: 17px 0 15px; padding: 18px 12px 15px; overflow: hidden; border: 1px solid rgba(255,207,84,.55); border-radius: 9px; background: radial-gradient(circle at 20% 20%,rgba(99,230,237,.14),transparent 34%),linear-gradient(145deg,#133d54,#071a29); box-shadow: 0 16px 35px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.06); }
.recovery-code-card::after { content: ''; position: absolute; width: 105px; height: 105px; right: -45px; top: -54px; border: 15px solid rgba(255,207,84,.08); border-radius: 50%; }
.recovery-code-card small { color: #8fb3c1; font-size: .54rem; font-weight: 950; letter-spacing: .18em; }
.recovery-code-card strong { position: relative; z-index: 1; color: #ffdb67; font: 900 clamp(.88rem,4.2vw,1.18rem)/1.2 "Card Mono",ui-monospace,monospace; letter-spacing: .045em; text-shadow: 0 0 18px rgba(255,207,84,.2); }
.recovery-code-card span { color: #7795a2; font-size: .59rem; font-weight: 750; }
.recovery-code-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.recovery-code-actions button { min-height: 42px; padding: 7px 5px; color: #c7dce3; border: 1px solid #31576c; border-radius: 5px; background: #0b2639; font-size: .64rem; font-weight: 900; cursor: pointer; }
.recovery-code-actions button:hover { color: #fff; border-color: #63e6ed; }
.recovery-saved-button { width: 100%; }

.global-leaderboard-dialog { padding: 25px clamp(18px,4vw,30px) 22px; }
.global-leaderboard-dialog .dialog-close { position: absolute; right: 12px; top: 12px; }
.global-leaderboard-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding-right: 34px; }
.global-leaderboard-heading h2 { margin-top: 5px; }
.global-player-tools { flex: 0 0 auto; display: grid; gap: 4px; }
.global-player-tag { min-width: 86px; padding: 8px 10px; text-align: center; border: 1px solid rgba(255,207,84,.36); border-radius: 6px; background: rgba(255,207,84,.06); }
.global-player-tag small { display: block; margin-bottom: 3px; color: #91aeb9; font-size: .48rem; font-weight: 900; letter-spacing: .14em; }
.global-player-tag strong { color: #ffdc6a; font-size: .78rem; letter-spacing: .04em; }
.global-player-tools > button { padding: 3px 4px; color: #78b7c5; border: 0; background: transparent; font-size: .48rem; font-weight: 850; cursor: pointer; }
.global-player-tools > button:hover { color: #63e6ed; }
.global-player-tools > .switch-player-button { color: #d39a83; }
.global-player-tools > .switch-player-button:hover { color: #ff9b70; }
.leaderboard-level-label { display: block; margin-top: 13px; }
.leaderboard-level-select { width: 100%; height: 44px; padding: 0 38px 0 12px; color: #f5fbfc; border: 1px solid #315b72; border-radius: 6px; background: #0a2233; font-weight: 850; }
.leaderboard-table-heading { display: grid; grid-template-columns: 54px minmax(0,1fr) 88px; margin: 15px 0 5px; padding: 0 9px; color: #688895; font-size: .49rem; font-weight: 950; letter-spacing: .16em; }
.leaderboard-table-heading span:last-child { text-align: right; }
.leaderboard-list,.finish-leaderboard-list { margin: 0; padding: 0; list-style: none; }
.leaderboard-list li { min-height: 44px; display: grid; grid-template-columns: 54px minmax(0,1fr) 88px; align-items: center; padding: 0 9px; border-top: 1px solid rgba(61,103,123,.31); color: #dce9ed; background: rgba(4,20,31,.28); }
.leaderboard-list li:first-child { border-top-color: rgba(99,230,237,.38); }
.leaderboard-list li.is-player { position: relative; color: #fff; background: linear-gradient(90deg,rgba(99,230,237,.12),rgba(99,230,237,.035)); box-shadow: inset 3px 0 #63e6ed; }
.leaderboard-list li > strong { display: flex; align-items: center; gap: 7px; min-width: 0; overflow: hidden; font-size: .82rem; letter-spacing: .025em; text-overflow: ellipsis; }
.leaderboard-list li > strong small { padding: 2px 4px; color: #07202e; border-radius: 3px; background: #63e6ed; font-size: .42rem; }
.leaderboard-rank { display: flex; align-items: center; gap: 7px; color: #8faab5; font-variant-numeric: tabular-nums; }
.leaderboard-rank b { font-size: .75rem; }
.leaderboard-medal { width: 7px; height: 7px; border-radius: 50%; box-shadow: 0 0 8px currentColor; }
.medal-1 { color: #ffd45e; background: currentColor; }
.medal-2 { color: #c7d6dc; background: currentColor; }
.medal-3 { color: #d6935f; background: currentColor; }
.leaderboard-score { color: #fff; font-size: .85rem; font-weight: 950; font-variant-numeric: tabular-nums; text-align: right; }
.leaderboard-empty { display: block !important; padding: 17px 10px !important; color: #819eaa !important; font-size: .72rem !important; text-align: center !important; }
.leaderboard-loading { animation: leaderboard-pulse 1.1s ease-in-out infinite alternate; }
@keyframes leaderboard-pulse { to { opacity: .55; } }
.global-rank-card { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; align-items: center; margin-top: 13px; padding: 10px 12px; border: 1px solid rgba(99,230,237,.28); border-radius: 7px; background: rgba(99,230,237,.06); }
.global-rank-card span { color: #71ced8; font-size: .53rem; font-weight: 950; letter-spacing: .15em; }
.global-rank-card strong { grid-row: 1/3; grid-column: 2; color: #ffda62; font-size: 1.35rem; }
.global-rank-card small { color: #9bb5c0; font-size: .67rem; }

.finish-leaderboard { grid-column: 1/-1; min-width: 0; padding: 7px 9px 6px; border-top: 1px solid rgba(99,230,237,.26); border-bottom: 1px solid rgba(99,230,237,.14); background: linear-gradient(90deg,rgba(4,20,32,.8),rgba(13,51,68,.5),rgba(4,20,32,.8)); }
.finish-leaderboard-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.finish-leaderboard-header > span { color: #b7d0d8; font-size: .5rem; font-weight: 950; letter-spacing: .16em; }
.finish-leaderboard-header i { color: #ffda62; font-size: .82rem; font-style: normal; }
.finish-leaderboard-header button { padding: 3px 5px; color: #70dce4; border: 0; background: transparent; font-size: .48rem; font-weight: 950; letter-spacing: .08em; cursor: pointer; }
.finish-leaderboard-level { margin-top: 1px; color: #668a99; font-size: .48rem; font-weight: 800; }
.finish-leaderboard-list { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 3px; margin-top: 5px; }
.finish-leaderboard-list li { min-width: 0; display: grid; grid-template-columns: auto minmax(0,1fr); grid-template-rows: auto auto; gap: 0 4px; padding: 4px 5px; border: 1px solid rgba(72,114,133,.26); border-radius: 4px; background: rgba(5,23,35,.62); }
.finish-leaderboard-list li.is-player { border-color: rgba(99,230,237,.52); background: rgba(99,230,237,.09); }
.finish-leaderboard-list .leaderboard-rank { grid-row: 1/3; align-self: center; }
.finish-leaderboard-list .leaderboard-medal { display: none; }
.finish-leaderboard-list li > strong { min-width: 0; overflow: hidden; color: #dce8ec; font-size: .49rem; line-height: 1.1; text-overflow: ellipsis; }
.finish-leaderboard-list li > strong small { margin-left: 2px; color: #63e6ed; font-size: .35rem; }
.finish-leaderboard-list .leaderboard-score { color: #fff; font-size: .59rem; line-height: 1.1; text-align: left; }
.finish-leaderboard-list .leaderboard-empty { grid-column: 1/-1; padding: 8px !important; }
.finish-leaderboard-note { min-height: 11px; margin: 4px 0 0; color: #708f9d; font-size: .47rem; line-height: 1.25; text-align: center; }
.finish-leaderboard-note button { padding: 0; color: #76e3eb; border: 0; border-bottom: 1px solid currentColor; background: transparent; font: inherit; cursor: pointer; }
.finish-layout:has(.finish-leaderboard) { grid-template-rows: minmax(0,1fr) auto auto auto; }
.finish-layout.no-card .finish-leaderboard { text-align: left; }
.finish-unsuccessful .finish-result { text-align: center; }

@media (max-width:700px) {
  .global-button { width: 36px; min-height: 36px; }
  .leaderboard-dialog { width: min(480px,calc(100% - 16px)); max-height: calc(100dvh - 16px); }
  .username-dialog { padding: 22px 18px 19px; }
  .recovery-login-dialog,.recovery-code-dialog { padding: 22px 17px 19px; }
  .leaderboard-dialog-logo { width: 68px; height: 56px; }
  .recovery-code-actions { grid-template-columns: 1fr; }
  .recovery-code-actions button { min-height: 38px; }
  .global-leaderboard-dialog { padding: 20px 13px 16px; }
  .global-leaderboard-heading { padding-right: 30px; }
  .global-player-tag { min-width: 75px; padding: 7px; }
  .finish-leaderboard { padding: 5px 6px 4px; }
  .finish-leaderboard-list { gap: 2px; margin-top: 4px; }
  .finish-leaderboard-list li { grid-template-columns: auto minmax(0,1fr); gap: 0 2px; padding: 3px; }
  .finish-leaderboard-list .leaderboard-rank b { font-size: .45rem; }
  .finish-leaderboard-list li > strong { font-size: .42rem; }
  .finish-leaderboard-list .leaderboard-score { font-size: .51rem; }
  .finish-leaderboard-note { margin-top: 3px; font-size: .42rem; }
  .finish-layout:has(.finish-leaderboard) { grid-template-rows: minmax(0,1fr) auto auto auto; }
}

@media (max-width:390px) {
  .top-actions { gap: 6px; }
  .finish-leaderboard-list li { padding-inline: 2px; }
  .finish-leaderboard-list .leaderboard-rank { display: none; }
}

@media (prefers-reduced-motion:reduce) {
  .leaderboard-loading { animation: none; }
}