#playlistSurgeRanked{--playlist-accent:#da66ff;border-color:rgba(206,110,255,.3)}
#playlistSurgeRanked.is-highlighted{border-color:#f0abff;box-shadow:0 0 0 1px #d16dfc,0 12px 38px rgba(137,26,255,.38)}
#playlistSurgeRanked .playlist-card-footer{background:linear-gradient(0deg,rgba(45,3,88,.95),rgba(51,16,111,.25));}
#playlistSurgeRanked .playlist-card-footer strong{color:#fff;text-shadow:0 0 18px #9d56ff}
.surge-ranked-panel,.surge-ranked-result{display:flex;align-items:center;gap:11px;border:1px solid rgba(188,135,255,.45);border-radius:12px;background:linear-gradient(120deg,rgba(78,32,139,.45),rgba(12,22,56,.82));padding:9px 12px;color:#f6f4ff;box-shadow:inset 0 0 18px rgba(98,59,155,.18)}
.surge-ranked-panel[hidden],.surge-ranked-result[hidden],.lobby-surge-rank[hidden]{display:none!important}
.surge-rank-badge{width:62px;height:62px;flex:none;image-rendering:auto;filter:drop-shadow(0 0 4px #8955ff);background-color:transparent}
.surge-ranked-progress{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}
.surge-ranked-progress small,.surge-ranked-result small,.lobby-surge-rank small{font-size:10px;letter-spacing:.08em;color:#cbb8ff;font-weight:800}
.surge-ranked-progress strong,.surge-ranked-result strong{font-size:17px;letter-spacing:.05em}
.surge-rank-track{height:5px;border-radius:5px;overflow:hidden;background:#26254c;margin:4px 0}
.surge-rank-track span{display:block;height:100%;background:linear-gradient(90deg,#8ab7ff,#d06dff);width:0%;transition:width .25s}
.surge-ranked-result{margin:12px auto;max-width:440px;justify-content:space-between}
.surge-ranked-result>span{display:flex;flex-direction:column;gap:3px;flex:1}
.surge-ranked-result>b{color:#9af7ff;font-size:25px;white-space:nowrap}
#menu .lobby-surge-rank{position:fixed;left:clamp(18px,3vw,54px);bottom:calc(clamp(145px,17vh,188px) + 156px);z-index:5;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:142px;height:142px;padding:7px;border:1px solid #b89aff70;border-radius:19px;background:linear-gradient(145deg,#342064a8,#111a3cbb);box-shadow:0 8px 28px #06172638,inset 0 1px #e6d7ff29;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:none;text-align:center}
#menu .lobby-surge-rank .surge-rank-badge{width:76px!important;height:76px!important;filter:drop-shadow(0 0 8px #8d74ff66)}
#menu .lobby-surge-rank span{display:flex;flex-direction:column;gap:2px;align-items:center;min-width:0;width:100%}
#menu .lobby-surge-rank small{font-size:10px;line-height:1.05;font-weight:900;letter-spacing:.06em;color:#ceb9ff}
#menu .lobby-surge-rank strong{font-family:'Arial Black',Arial,system-ui,sans-serif;font-size:14px;line-height:1.15;color:#faf5ff;white-space:nowrap;font-weight:1000;text-shadow:0 0 10px #8455ed88}
@media(max-width:760px){#menu .lobby-surge-rank{left:12px;bottom:calc(132px + env(safe-area-inset-bottom) + 120px);width:110px;height:110px;border-radius:15px;gap:0;padding:4px}#menu .lobby-surge-rank .surge-rank-badge{width:59px!important;height:59px!important}#menu .lobby-surge-rank small{font-size:8px}#menu .lobby-surge-rank strong{font-size:11px}}
@media(max-height:590px) and (orientation:landscape){#menu .lobby-surge-rank{bottom:184px;width:98px;height:98px;border-radius:13px;gap:0;padding:3px}#menu .lobby-surge-rank .surge-rank-badge{width:51px!important;height:51px!important}#menu .lobby-surge-rank small{font-size:7px}#menu .lobby-surge-rank strong{font-size:10px}}

/* Restore original rank tile dimensions and blend its preview into the lobby's glass. */
#menu .lobby-surge-rank{--lobby-panel-surface:linear-gradient(110deg,#43417bdc,#303763d9 50%,#192c56dd);--lobby-panel-border:#d4c5ff80;width:142px;height:142px;bottom:calc(clamp(145px,17vh,188px) + 156px);border-radius:19px;pointer-events:auto;background:linear-gradient(145deg,#32346b9c,#17274b9c);border-color:#c4b2f56a}
#menu .lobby-surge-rank .surge-rank-badge{width:76px!important;height:76px!important}
#menu .lobby-surge-rank>span>small{font-size:10px}
#menu .lobby-surge-rank>span>strong{font-size:14px}
#menu .lobby-rank-flyout{border-color:#ccbafc69;border-left:0;background:linear-gradient(110deg,#34336cdb,#232b55dc 70%,#172446dc);box-shadow:8px 12px 30px #12032b66,inset 0 1px #eedbff15}
#menu .lobby-rank-flyout .lobby-progress-flyout-heading{color:#e5c1ff}
#menu .lobby-rank-flyout .lobby-progress-track>span{background:linear-gradient(90deg,#855fff,#bd87ff,#f9dcff);box-shadow:0 0 13px #bf87ff88}
#menu .lobby-rank-flyout .lobby-progress-caption{color:#c0a9de}
#menu .lobby-surge-rank .lobby-progress-track>span{display:block;align-self:stretch;width:0%;flex-direction:initial}
#menu .lobby-surge-rank .lobby-progress-flyout .lobby-progress-next{font-size:17px}
@media(max-width:760px){#menu .lobby-surge-rank{width:110px;height:110px;bottom:calc(132px + env(safe-area-inset-bottom) + 120px);border-radius:15px}#menu .lobby-surge-rank .surge-rank-badge{width:59px!important;height:59px!important}#menu .lobby-surge-rank>span>small{font-size:8px}#menu .lobby-surge-rank>span>strong{font-size:11px}}
@media(max-height:590px) and (orientation:landscape){#menu .lobby-surge-rank{width:98px;height:98px;bottom:184px;border-radius:13px}#menu .lobby-surge-rank .surge-rank-badge{width:51px!important;height:51px!important}#menu .lobby-surge-rank>span>strong{font-size:10px}}
