
/* Popup Bảng xếp hạng */
#playerTopDialog {
  width:min(1280px,calc(100vw - 24px)); max-width:none;
  height:min(680px,calc(100dvh - 24px)); max-height:calc(100dvh - 24px);
  margin:auto; padding:0; border:0; background:transparent; overflow:visible;
  container-type:size; color:#f4fff9;
}
#playerTopDialog .player-feature-window {
  position:relative; isolation:isolate; display:grid; grid-template-rows:112px minmax(0,1fr);
  gap:18px; width:100%; height:100%; max-height:none!important; padding:18px;
  border:0; border-radius:28px; background:transparent; box-shadow:0 20px 65px #000a;
  overflow:hidden; scrollbar-gutter:auto; font-family:Arial,"DejaVu Sans",sans-serif;
}
#playerTopDialog .player-feature-window::before,
#playerTopDialog .xd68-header::before,
#playerTopDialog .xd68-column::before,
#playerTopDialog .xd68-row::before,
#playerTopDialog .xd68-tab::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  border:var(--slice) solid transparent;
  border-image:var(--surface) var(--source-slice) fill / var(--slice) / 0 stretch;
}
#playerTopDialog .xd68-header {
  position:relative; isolation:isolate; top:auto; display:grid;
  grid-template-columns:205px 110px minmax(0,1fr) 52px; align-items:center;
  gap:16px; min-width:0; margin:0; padding:8px 12px 8px 24px;
  border:0; border-radius:24px; background:transparent; backdrop-filter:none;
}
#playerTopDialog .xd68-logo { display:block; width:100%; height:88px; object-fit:contain; }
#playerTopDialog .xd68-trophy { display:block; width:100%; height:86px; object-fit:contain; }
#playerTopDialog #playerTopTitle { min-width:0; margin:0; padding:0; line-height:1; }
#playerTopDialog #playerTopTitle img { display:block; width:100%; height:auto; max-height:82px; object-fit:contain; }
#playerTopDialog .feature-close {
  align-self:start; width:52px; height:52px; min-width:52px; padding:0;
  border:0; border-radius:15px; box-shadow:none; background:var(--close-normal) center/contain no-repeat;
}
#playerTopDialog .feature-close:focus-visible { background-image:var(--close-active); }
#playerTopDialog .feature-close:active { background-image:var(--close-pressed); }
#playerTopDialog .feature-close:disabled { background-image:var(--close-disabled); cursor:default; }
#playerTopDialog .xd68-board {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:64px minmax(0,1fr); gap:8px; min-width:0; min-height:0;
}
#playerTopDialog .xd68-tabs,#playerTopDialog .xd68-lists { display:contents; }
#playerTopDialog .xd68-tab {
  position:relative; isolation:isolate; display:flex; align-items:center; justify-content:flex-start;
  grid-row:1; min-width:0; width:100%; height:64px; margin:0; padding:10px 14px; gap:10px;
  border:0; border-radius:17px; background:transparent; box-shadow:none;
  font:800 clamp(12px,1.48cqw,19px)/1.25 Arial,sans-serif; color:#ffe18b; white-space:nowrap;
}
#playerTopDialog .xd68-tab img { flex:0 0 34px; width:34px; height:34px; object-fit:contain; }
#playerTopDialog .xd68-tab.is-active { --surface:var(--tab-active); }
#playerTopDialog .xd68-tab:active:not(:disabled) { --surface:var(--tab-pressed); }
#playerTopDialog .xd68-tab:disabled { --surface:var(--tab-disabled); cursor:default; }
#playerTopDialog .xd68-column {
  position:relative; isolation:isolate; grid-row:2; min-width:0; min-height:0;
  padding:0; overflow:hidden;
  scrollbar-width:thin; scrollbar-color:#168776 #00362f; border-radius:20px;
}
#playerTopDialog .xd68-scroll { height:100%; min-height:0; padding:8px; overflow:auto; overscroll-behavior:contain; touch-action:pan-y; scrollbar-width:thin; scrollbar-color:#168776 #00362f; }
#playerTopDialog .xd68-column[hidden] { display:none; }
#playerTopDialog .xd68-row {
  position:relative; isolation:isolate; display:grid; grid-template-columns:36px minmax(0,1fr) fit-content(52%);
  align-items:center; gap:8px; height:62px; min-height:62px; padding:8px 10px; margin-bottom:6px;
  font-size:14px; border:0; border-radius:10px; color:#f4fff9;
}
#playerTopDialog .xd68-rank { display:grid; place-items:center; width:36px; height:36px; background:center/contain no-repeat; font:24px/1 Georgia,serif; color:#003e35; }
#playerTopDialog .rank-plain { color:#e4fff8; }
#playerTopDialog .xd68-row b { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:700; }
#playerTopDialog .xd68-row em { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:right; color:#b5e9df; font-style:normal; font-variant-numeric:tabular-nums; }
#playerTopDialog .rank-empty { grid-column:1/-1; margin:0; padding:16px; font-size:14px; color:#b5e9df; }
#playerTopDialog .feature-close:focus-visible,#playerTopDialog .xd68-tab:focus-visible,#playerTopDialog .xd68-scroll:focus-visible { outline:2px solid #ffe18b; outline-offset:-3px; }
#playerTopDialog.xd68-compact { width:min(560px,calc(100vw - 16px)); height:min(700px,calc(100dvh - 16px)); }
#playerTopDialog.xd68-compact .player-feature-window { grid-template-rows:96px minmax(0,1fr); gap:12px; padding:14px; }
#playerTopDialog.xd68-compact .xd68-header { grid-template-columns:52px minmax(0,1fr) 48px; grid-template-rows:44px 36px; gap:0 4px; padding:4px 0; --surface:none; }
#playerTopDialog.xd68-compact .xd68-logo { grid-column:2; grid-row:1; height:48px; }
#playerTopDialog.xd68-compact .xd68-trophy { grid-column:1; grid-row:2; width:48px; height:42px; }
#playerTopDialog.xd68-compact #playerTopTitle { grid-column:2/4; grid-row:2; padding-right:8px; }
#playerTopDialog.xd68-compact .feature-close { grid-column:3; grid-row:1; width:48px; min-width:48px; height:48px; }
#playerTopDialog.xd68-compact .xd68-board { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); gap:16px; }
#playerTopDialog.xd68-compact .xd68-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
#playerTopDialog.xd68-compact .xd68-tab { grid-row:auto; height:50px; padding:7px 8px; gap:6px; font-size:clamp(10.5px,2.9cqw,12px); color:#f4fff9; }
#playerTopDialog.xd68-compact .xd68-tab.is-active { color:#ffe18b; }
#playerTopDialog.xd68-compact .xd68-tab img { flex-basis:24px; width:24px; height:24px; }
#playerTopDialog.xd68-compact .xd68-column { grid-column:1; grid-row:2; }
#playerTopDialog.xd68-compact .xd68-row { height:54px; min-height:54px; margin-bottom:3px; }
#playerTopDialog.xd68-compact .xd68-row em { max-width:47cqw; }
#playerTopDialog.xd68-rail { width:calc(100vw - 16px); height:calc(100dvh - 16px); }
#playerTopDialog.xd68-rail .player-feature-window { grid-template-rows:52px minmax(0,1fr); padding:10px; gap:8px; }
#playerTopDialog.xd68-rail .xd68-header { grid-template-columns:112px 48px minmax(0,1fr) 48px; grid-template-rows:48px; gap:8px; padding:0; }
#playerTopDialog.xd68-rail .xd68-logo { grid-column:1; grid-row:1; height:48px; }
#playerTopDialog.xd68-rail .xd68-trophy { grid-column:2; grid-row:1; height:42px; }
#playerTopDialog.xd68-rail #playerTopTitle { grid-column:3; grid-row:1; padding:0 12px 0 0; }
#playerTopDialog.xd68-rail .feature-close { grid-column:4; grid-row:1; }
#playerTopDialog.xd68-rail .xd68-board { grid-template-columns:210px minmax(0,1fr); grid-template-rows:minmax(0,1fr); gap:10px; }
#playerTopDialog.xd68-rail .xd68-tabs { align-content:start; }
#playerTopDialog.xd68-rail .xd68-tab { min-height:72px; height:72px; flex-direction:column; justify-content:center; gap:3px; padding:6px 5px; font-size:11px; }
#playerTopDialog.xd68-rail .xd68-tab img { flex-basis:26px; }
#playerTopDialog.xd68-rail .xd68-tab span { width:100%; min-width:0; white-space:normal; text-align:center; }
#playerTopDialog.xd68-rail .xd68-column { grid-column:2; grid-row:1; }
#playerTopDialog.xd68-rail .xd68-row { height:48px; min-height:48px; font-size:13px; }
@media(hover:hover) and (pointer:fine) {
  #playerTopDialog .feature-close:hover:not(:disabled) { background-image:var(--close-hover); }
  #playerTopDialog .xd68-tab:hover:not(:disabled):not(:active):not(.is-active) { --surface:var(--tab-hover); }
  #playerTopDialog .xd68-row:hover { --surface:var(--row-hover); }
}
@supports(padding:env(safe-area-inset-top)) {
  #playerTopDialog { max-width:calc(100vw - 16px - env(safe-area-inset-left) - env(safe-area-inset-right)); max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
}

#playerTopDialog {
  --popup-panel:url("/assets/images/xd68-leaderboard-v1/popup_panel.png");
  --header-panel:url("/assets/images/xd68-leaderboard-v1/header_panel.png");
  --column-panel:url("/assets/images/xd68-leaderboard-v1/column_panel.png");
  --row-normal:url("/assets/images/xd68-leaderboard-v1/row_normal.png");
  --row-hover:url("/assets/images/xd68-leaderboard-v1/row_hover.png");
  --row-pressed:url("/assets/images/xd68-leaderboard-v1/row_pressed.png");
  --tab-normal:url("/assets/images/xd68-leaderboard-v1/tab_normal.png");
  --tab-hover:url("/assets/images/xd68-leaderboard-v1/tab_hover.png");
  --tab-pressed:url("/assets/images/xd68-leaderboard-v1/tab_pressed.png");
  --tab-active:url("/assets/images/xd68-leaderboard-v1/tab_active.png");
  --tab-disabled:url("/assets/images/xd68-leaderboard-v1/tab_disabled.png");
  --close-normal:url("/assets/images/xd68-leaderboard-v1/close_normal.png");
  --close-hover:url("/assets/images/xd68-leaderboard-v1/close_hover.png");
  --close-pressed:url("/assets/images/xd68-leaderboard-v1/close_pressed.png");
  --close-active:url("/assets/images/xd68-leaderboard-v1/close_active.png");
  --close-disabled:url("/assets/images/xd68-leaderboard-v1/close_disabled.png");
  --rank-gold:url("/assets/images/xd68-leaderboard-v1/rank_gold.png");
  --rank-silver:url("/assets/images/xd68-leaderboard-v1/rank_silver.png");
  --rank-bronze:url("/assets/images/xd68-leaderboard-v1/rank_bronze.png");
  --rank-plain:url("/assets/images/xd68-leaderboard-v1/rank_plain.png");
  --icon-trophy:url("/assets/images/xd68-leaderboard-v1/icon_trophy.png");
  --icon-users:url("/assets/images/xd68-leaderboard-v1/icon_users.png");
  --icon-coins:url("/assets/images/xd68-leaderboard-v1/icon_coins.png");
  --icon-arrow-up:url("/assets/images/xd68-leaderboard-v1/icon_arrow_up.png");
  --icon-crown:url("/assets/images/xd68-leaderboard-v1/icon_crown.png");
  --logo-xd68:url("/assets/images/xd68-leaderboard-v1/logo_xd68.png");
  --title-leaderboard:url("/assets/images/xd68-leaderboard-v1/title_leaderboard.png");
}
#playerTopDialog .player-feature-window { --surface:url("/assets/images/xd68-leaderboard-v1/popup_panel.png"); --slice:28px; --source-slice:56; }
#playerTopDialog .xd68-header { --surface:url("/assets/images/xd68-leaderboard-v1/header_panel.png"); --slice:24px; --source-slice:48; }
#playerTopDialog .xd68-column { --surface:url("/assets/images/xd68-leaderboard-v1/column_panel.png"); --slice:20px; --source-slice:40; }
#playerTopDialog .xd68-row { --surface:url("/assets/images/xd68-leaderboard-v1/row_normal.png"); --slice:10px; --source-slice:20; }
#playerTopDialog .xd68-tab { --surface:url("/assets/images/xd68-leaderboard-v1/tab_normal.png"); --slice:17px; --source-slice:34; }
#playerTopDialog .rank-gold { background-image:url("/assets/images/xd68-leaderboard-v1/rank_gold.png"); }
#playerTopDialog .rank-silver { background-image:url("/assets/images/xd68-leaderboard-v1/rank_silver.png"); }
#playerTopDialog .rank-bronze { background-image:url("/assets/images/xd68-leaderboard-v1/rank_bronze.png"); }
#playerTopDialog .rank-plain { background-image:url("/assets/images/xd68-leaderboard-v1/rank_plain.png"); }
