.ranking-page{--gold:#ebc45f;--silver:#c9d2df;--bronze:#d7a070}
.ranking-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:28px 0}
.ranking-heading h1{font-size:clamp(30px,4vw,44px);margin-bottom:12px}
.ranking-heading p:not(.eyebrow){color:var(--muted);margin-bottom:0}
.ranking-count{border:1px solid var(--line);border-radius:99px;padding:8px 16px;white-space:nowrap;font-size:12px;color:var(--gold)}
.ranking-filter{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.ranking-filter label{font-size:13px;color:var(--muted)}
.ranking-filter select{min-width:210px}
.ranking-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:12px;padding:24px 20px 0;border-bottom:1px solid #584631;background:radial-gradient(ellipse at 50% 70%,#eac25f0a,transparent 65%);margin:20px 0 40px}
.podium-place{text-align:center;min-width:0}
.podium-player{padding:0 8px 24px}
.podium-crown{display:block;font-size:24px;color:var(--silver);height:40px}
.podium-place-1 .podium-crown{color:var(--gold);font-size:38px;line-height:1}
.podium-place-3 .podium-crown{color:var(--bronze)}
.character-stage{height:210px;display:flex;align-items:center;justify-content:center;position:relative}
.podium-place-1 .character-stage{background:radial-gradient(ellipse,#ebc45f19,transparent 65%)}
.character-full{display:block;width:210px;height:210px;object-fit:contain;image-rendering:pixelated}
.character-full[hidden],.character-head[hidden]{display:none}
.portrait-state{font-size:12px;color:var(--muted);padding:10px}
.podium-name{font-size:22px;margin:16px 0 6px!important;overflow-wrap:anywhere}
.podium-job{font-size:12px;color:var(--muted);margin:0 0 12px}
.podium-level{display:inline-block;border-radius:99px;background:var(--silver);padding:4px 13px;color:#252329;font-size:12px;font-weight:750}
.podium-place-1 .podium-level{background:var(--gold)}
.podium-place-3 .podium-level{background:var(--bronze)}
.podium-step{border-radius:12px 12px 0 0;height:120px;background:linear-gradient(#e5eaf1,#8996a6);color:#2a3440;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #ffffff30;border-bottom:0}
.podium-step>span{font-size:54px;line-height:1;font-weight:850}
.podium-step small{color:inherit;font-size:9px;letter-spacing:.15em;margin-top:12px}
.podium-place-1 .podium-step{height:165px;color:#4a3504;background:linear-gradient(#f6da7d,#bd8e15)}
.podium-place-3 .podium-step{height:88px;color:#4d2c13;background:linear-gradient(#e8bc96,#a26536)}
.ranking-list-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}
.ranking-list-heading h2{margin:0 0 18px}
.ranking-sync{font-size:11px;color:var(--muted);max-width:390px;text-align:right}
.ranking-table-wrap{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:12px}
.wpro .ranking-table{width:100%;font-family:inherit;border-collapse:collapse;min-width:800px}
.wpro .ranking-table th,.wpro .ranking-table td{padding:16px;border:0;border-bottom:1px solid var(--line);vertical-align:middle;font-family:inherit}
.wpro .ranking-table th{font-size:11px;color:var(--muted);font-weight:600;background:#221a24}
.wpro .ranking-table td{font-size:13px}

.rank-cell{display:flex;gap:10px;align-items:center;min-width:95px;min-height:56px}
.rank-cell strong{font-size:15px;color:var(--gold);font-variant-numeric:tabular-nums}
.character-head{width:54px;height:54px;object-fit:contain;image-rendering:pixelated;border-radius:10px;background:#100d12}
.head-placeholder{display:grid;place-items:center;width:54px;height:54px;border-radius:10px;background:#100d12;color:var(--muted)}
.rank-job{display:block;margin-top:3px;font-size:11px}
.wpro .rank-unclaimed td{color:#94818d}
.rank-unclaimed .rank-cell strong{color:#94818d}
.ranking-page .table-scroll{margin:0}
.portrait-partial{outline:none}
@media(max-width:700px){.ranking-heading{align-items:flex-start;flex-direction:column;gap:12px}.ranking-count{font-size:11px}.ranking-podium{padding:10px 0 0;gap:7px}.podium-player{padding:0 2px 16px}.character-stage,.character-full{height:150px}.character-full{width:150px;max-width:100%}.podium-name{font-size:15px}.podium-job{font-size:10px;min-height:30px}.podium-step small{font-size:7px;letter-spacing:.03em}.podium-step>span{font-size:40px}.podium-place-1 .podium-step{height:125px}.podium-place-2 .podium-step{height:92px}.podium-place-3 .podium-step{height:65px}.ranking-list-heading{align-items:flex-start;flex-direction:column;gap:0}.ranking-sync{text-align:left}.ranking-filter select{min-width:0;max-width:100%;flex:1}.ranking-filter label{width:100%}}
@media(max-width:420px){.character-stage,.character-full{height:125px}.podium-name{font-size:13px}.podium-level{font-size:10px;padding:4px 7px}.podium-crown{font-size:18px}.podium-place-1 .podium-crown{font-size:30px}.podium-step small{font-size:6px}}
/* A shared stage that blends into the Well Played artwork and rose palette. */
.ranking-podium{position:relative;isolation:isolate;overflow:hidden;border:1px solid #684051;border-radius:20px;gap:14px;padding:46px 26px 0;background:linear-gradient(180deg,#160f18e8 0%,#19111ce8 44%,#291620f5 78%,#120e15 100%),var(--stage-art) center 35%/cover no-repeat;box-shadow:inset 0 1px 0 #ed8d9f15,inset 0 -50px 85px #100b13a8}
.ranking-podium:before{content:"";position:absolute;z-index:-1;inset:20% -15% -40%;background:radial-gradient(ellipse at 50% 60%,#ef657827 0%,#80354c13 38%,transparent 65%);pointer-events:none}
.ranking-podium:after{content:"";position:absolute;z-index:-1;left:-15%;right:-15%;bottom:-32px;height:130px;transform:perspective(300px) rotateX(52deg);border:1px solid #a6657952;border-radius:50%;background:radial-gradient(ellipse,#5b2b3b30,#130e1600 67%);box-shadow:0 -10px 55px #e6688120;pointer-events:none}
.podium-place{--rank-metal:#bec6d6}
.podium-place-1{--rank-metal:#e2bd71}
.podium-place-3{--rank-metal:#c5947d}
.podium-player{padding-bottom:28px}
.character-stage:after{content:none;position:absolute;bottom:0;left:20%;right:20%;height:12px;border-radius:50%;background:#0008;filter:blur(5px);z-index:-1}
.podium-place-1 .character-stage{background:radial-gradient(ellipse at 50% 65%,#edbc6215,transparent 65%)}
.podium-level,.podium-place-1 .podium-level,.podium-place-3 .podium-level{background:#241922;border:1px solid #6a4856;color:var(--rank-metal);box-shadow:inset 0 1px 0 #ffffff08}
.podium-step,.podium-place-1 .podium-step,.podium-place-3 .podium-step{position:relative;overflow:visible;border:1px solid #674251;border-bottom:0;border-radius:12px 12px 0 0;color:var(--rank-metal);background:linear-gradient(180deg,#3e2634 0%,#261a25 30%,#18121c 100%);box-shadow:inset 0 1px 0 #e99bad26,0 -6px 25px #ec65780b,9px 8px 30px #0005}
.podium-step:before{content:"";position:absolute;top:0;left:8%;right:8%;height:2px;border-radius:100%;background:linear-gradient(90deg,transparent,var(--rank-metal),transparent);box-shadow:0 0 16px #ef769246}
.podium-step:after{content:"";position:absolute;top:15px;left:12px;right:12px;bottom:0;border:1px solid #ba75851c;border-bottom:0;border-radius:6px 6px 0 0;pointer-events:none}
.podium-place-1 .podium-step{background:linear-gradient(180deg,#49303b 0%,#2f1e2c 35%,#1b131f 100%);border-color:#84604f;box-shadow:inset 0 1px 0 #e9ca8536,0 -8px 35px #ec657813,9px 8px 30px #0005}
.podium-step>span{font-size:46px;font-weight:750;text-shadow:0 3px 14px #0008}
.podium-step small{color:#baa5b0;font-size:8px;letter-spacing:.2em}
.podium-crown{color:var(--rank-metal);text-shadow:0 0 22px #eaaa6350}
.podium-name{text-shadow:0 2px 10px #0009}
@media(max-width:700px){.ranking-podium{gap:8px;padding:30px 14px 0;border-radius:14px;background-position:center,center}.podium-player{padding-bottom:20px}.podium-step>span{font-size:36px}.podium-step small{font-size:6px;letter-spacing:.08em}.podium-step:after{left:6px;right:6px;top:10px}}
@media(max-width:420px){.ranking-podium{gap:6px;padding:24px 9px 0}.podium-step small{font-size:5px;letter-spacing:.02em}}

.ranking-page [hidden]{display:none!important}

.podium-player{border:1px solid color-mix(in srgb,var(--rank-metal) 48%,transparent);border-radius:14px;padding:14px 8px 22px;margin-bottom:14px;background:linear-gradient(155deg,#251b26b0,#150f18a6);box-shadow:inset 0 1px 0 #ffffff0a,0 10px 25px #0002}
.podium-place-1 .podium-player{box-shadow:inset 0 1px 0 #e2bd7125,0 0 28px #e2bd710b}
@media(max-width:700px){.podium-player{padding:10px 2px 16px;border-radius:10px;margin-bottom:9px}.podium-name{padding:0 3px}}
.ranking-notice,.guild-notice{padding:14px 18px;border:1px solid var(--line);border-radius:9px;color:var(--muted);background:#211923}.ranking-help{font-size:12px;color:var(--muted);margin:0 0 24px}.guild-ladder{margin-top:36px}.guild-ladder .ranking-list-heading p{font-size:12px;color:var(--muted)}
@media(max-width:700px){.ranking-filter select{flex-basis:100%;width:100%}}
.guild-identity,.rank-identity{display:inline-flex;align-items:center;gap:8px}.guild-emblem{width:24px;height:24px;object-fit:contain;image-rendering:pixelated;flex-shrink:0;vertical-align:middle}.podium-guild{justify-content:center;margin:12px 0 0;font-size:11px;color:var(--muted);overflow-wrap:anywhere;max-width:100%}
@media(max-width:700px){.podium-guild{flex-wrap:wrap;gap:4px;font-size:10px}.ranking-tabs a{padding:8px 12px}.guild-emblem{width:24px;height:24px}}

.podium-detail{font-size:11px;color:var(--muted);margin:10px 0 0}

/* Standing portraits and separate score / guild lines. */
.podium-scores{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px}
.podium-deaths{font-size:12px;border:1px solid var(--line);border-radius:99px;padding:4px 13px;color:var(--muted);background:#19121b}
.podium-guild{display:flex;min-height:24px;gap:8px;margin:12px 0 0}
.podium-name.guild-identity{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
.podium-name .guild-emblem{width:32px;height:32px}
.rank-cell{min-height:84px;min-width:125px;gap:12px}
.character-head,.head-placeholder{width:80px;height:80px;flex-shrink:0;border:1px solid #654453;border-radius:14px;background:radial-gradient(ellipse at center,#2b1d2c,#100d12)}
.rank-identity{font-weight:650}
@media(max-width:700px){.podium-deaths{font-size:10px;padding:4px 7px}.podium-name .guild-emblem{width:24px;height:24px}.podium-guild{min-height:24px}}

/* Portrait bitmaps follow the displayed size; the renderer draws the floor at the feet. */
.character-stage{height:260px}
.character-full{width:260px;height:260px;max-width:100%;object-fit:fill}
@media(max-width:700px){.character-stage,.character-full{height:160px}.character-full{width:160px}}
@media(max-width:420px){.character-stage,.character-full{height:130px}.character-full{width:130px}}
/* zrender clears inline canvas borders; retain the thumbnail frame. */
.character-head{border:1px solid #654453!important}

/* Ranks 4–20: fit the whole character and equipment inside the frame. */
.character-head,.head-placeholder{width:112px;height:136px;border-radius:14px}
.rank-cell{min-height:140px;min-width:159px}