/* Generated art is decorative. Names, positions, scores and controls remain live text. */
.dialog[data-view=leaderboard]{width:min(790px,95vw);padding:22px 26px;background-color:#fff8e7}
.dialog[data-view=leaderboard]>.dialog-art{display:none}
.rank-banner{background:url('assets/ui/leaderboard/header-v1.webp') center/contain no-repeat;width:100%;height:175px;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 12% 0 30%;margin:0 0 5px}
.rank-banner .eyebrow{font-size:11px;letter-spacing:3px;margin:0 0 5px;color:#82633e}
.dialog[data-view=leaderboard] .rank-banner h2{font-size:34px;line-height:1.15;letter-spacing:7px;margin:0;color:#68502e;text-shadow:0 2px #fff6d6}
.dialog[data-view=leaderboard]>.sub{font-size:12px;margin:8px 0 18px}
.dialog[data-view=leaderboard] .rank-filter{background:#ecebd7;border-color:#b9b492;box-shadow:inset 0 0 0 3px #f6f2df;border-radius:12px;text-align:center}
.dialog[data-view=leaderboard] .rank-count{display:flex;align-items:center;justify-content:center;gap:12px;letter-spacing:2px;margin:17px 0 7px}
.rank-count:before,.rank-count:after{content:'';width:45px;height:1px;background:#c8ae73}
.dialog[data-view=leaderboard] .rank-list{gap:9px;margin:7px 0 15px}
.dialog[data-view=leaderboard] .rank-row{position:relative;isolation:isolate;background:transparent;border:0;border-radius:0;box-shadow:none;min-height:89px;padding:12px 40px;gap:16px}
.rank-row:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border:solid transparent;border-width:18px 40px 17px;border-image:url('assets/ui/leaderboard/row-v1.webp') 60 110 50 120 fill / 18px 40px 17px / 0 stretch}
.dialog[data-view=leaderboard] .rank-row[data-medal=gold],.dialog[data-view=leaderboard] .rank-row[data-medal=silver],.dialog[data-view=leaderboard] .rank-row[data-medal=bronze]{min-height:105px}
.dialog[data-view=leaderboard] .rank-number{display:grid;place-items:center;flex:none;width:42px;height:48px;border:1px solid #b7aa80;clip-path:none;border-radius:10px;background:#eeecd8;box-shadow:inset 0 0 0 3px #fbf4df;color:#716342;font-size:20px;font-family:Georgia,serif}
.dialog[data-view=leaderboard] .rank-row[data-medal]:not([data-medal=ordinary]) .rank-number{width:78px;height:76px;border:0;clip-path:none;border-radius:0;box-shadow:none;background:center/contain no-repeat;color:#785224;font-size:25px}
.rank-row[data-medal=gold] .rank-number{background-image:url('assets/ui/leaderboard/gold-v1.webp')!important}
.rank-row[data-medal=silver] .rank-number{background-image:url('assets/ui/leaderboard/silver-v1.webp')!important;color:#5a705e!important}
.rank-row[data-medal=bronze] .rank-number{background-image:url('assets/ui/leaderboard/bronze-v1.webp')!important;color:#8d5734!important}
.dialog[data-view=leaderboard] .rank-number span{transform:translateY(-1px)}
.dialog[data-view=leaderboard] .rank-player strong{font-size:15px;line-height:1.5;color:#675032}
.dialog[data-view=leaderboard] .rank-player small{font-size:11px;line-height:1.65}
.dialog[data-view=leaderboard] .rank-score{font-size:26px;color:#916723;line-height:1.2}
.dialog[data-view=leaderboard] .rank-self .rank-player strong{color:#3f6b59}
.dialog[data-view=leaderboard] .rank-self:after{content:'我的最佳';position:absolute;right:34px;top:3px;padding:2px 8px;background:#dce8d2;border:1px solid #90a589;border-radius:5px;color:#45634c;font-size:9px;line-height:1.4}
.dialog[data-view=leaderboard] .rank-personal{border:0;padding-bottom:12px;border-bottom:1px dashed #c1ac79;margin-top:15px}
.dialog[data-view=leaderboard] .rank-empty{background:#f6efdb;border:1px dashed #c2b185;line-height:1.8}
.dialog[data-view=leaderboard] .rank-login{background:#f4ebcf;border:1px solid #c4b085;border-radius:12px}
.dialog[data-view=leaderboard] .dialog-actions{gap:14px;margin-top:18px;padding-top:18px;border-top:1px dashed #bfa673}
.dialog[data-view=leaderboard] .dialog-actions button{min-height:48px;min-width:126px;border-radius:12px}
.dialog[data-view=leaderboard] #rankRefresh{background:#edf0dd;border-color:#9ca982;color:#5c7053;box-shadow:0 3px #b7bea0,inset 0 0 0 3px #f8f8e9}
.dialog[data-view=leaderboard] #rankBack{min-width:174px;background:#ecc768;border-color:#9f7831;box-shadow:0 3px #ac8d49,inset 0 0 0 3px #fff0b4;color:#654a26}
.dialog[data-view=leaderboard] #rankRefresh:before{content:'↻';font-size:20px;vertical-align:-1px;margin-right:7px}
.dialog[data-view=leaderboard] #rankBack:before{content:'↶';display:inline-block;width:auto;height:auto;clip-path:none;background:none;font-size:20px;vertical-align:-1px;margin-right:7px}
.dialog[data-view=leaderboard]>.footnote{font-size:10px;line-height:1.85;margin-top:20px}
@media(max-width:760px){
 .dialog[data-view=leaderboard]{padding:14px 10px}
 .rank-banner{margin:0;height:91px;padding-left:28%;padding-right:10%}
 .rank-banner .eyebrow{display:none}
 .dialog[data-view=leaderboard] .rank-banner h2{font-size:26px;letter-spacing:4px}
 .dialog[data-view=leaderboard]>.sub{font-size:10px;line-height:1.6;margin:0 5px 13px}
 .dialog[data-view=leaderboard] .rank-row{padding:12px 20px;gap:9px;min-height:81px}
 .rank-row:before{border-image-width:15px 22px 15px;border-width:15px 22px}
 .dialog[data-view=leaderboard] .rank-row[data-medal]:not([data-medal=ordinary]){min-height:91px}
 .dialog[data-view=leaderboard] .rank-row[data-medal]:not([data-medal=ordinary]) .rank-number{width:55px;height:54px;font-size:20px}
 .dialog[data-view=leaderboard] .rank-number{width:32px;height:39px;font-size:17px}
 .dialog[data-view=leaderboard] .rank-player strong{font-size:12px}
 .dialog[data-view=leaderboard] .rank-player small{font-size:10px;line-height:1.6}
 .dialog[data-view=leaderboard] .rank-score{font-size:20px}
 .dialog[data-view=leaderboard] .rank-self:after{right:20px;font-size:8px;top:1px}
 .dialog[data-view=leaderboard] .dialog-actions{gap:10px}
 .dialog[data-view=leaderboard] .dialog-actions button{min-width:105px;font-size:12px}
 .dialog[data-view=leaderboard] #rankBack{min-width:130px}
 .dialog[data-view=leaderboard]>.footnote{font-size:9px;line-height:1.8}
}
@media(max-width:350px){.dialog[data-view=leaderboard] .rank-row{padding-inline:17px;gap:6px}.dialog[data-view=leaderboard] .rank-row[data-medal]:not([data-medal=ordinary]) .rank-number{width:46px;height:47px;font-size:18px}.dialog[data-view=leaderboard] .rank-score{font-size:18px}.dialog[data-view=leaderboard] .rank-player small{font-size:9px}}
@media(max-height:500px) and (min-width:761px){.rank-banner{max-width:470px;margin-inline:auto;min-height:95px}.dialog[data-view=leaderboard] .rank-banner h2{font-size:28px}}
