.match-loading{position:fixed;inset:0;z-index:150;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:4vh 5vw 5vh;color:#fff;background:linear-gradient(180deg,rgba(2,13,37,.65),rgba(2,13,37,.2) 45%,rgba(2,13,37,.85));text-shadow:0 3px 5px #000;box-sizing:border-box;pointer-events:all}
.match-loading h1{font-size:clamp(30px,5vw,72px);margin:0;text-align:center;line-height:1.15}
.loading-matchup{display:flex;justify-content:center;align-items:center;gap:clamp(22px,5vw,90px);width:100%;flex-wrap:wrap}
.loading-contender{margin:0;display:flex;align-items:center;flex-direction:column;gap:24px;--disc:#0b0e13;--edge:#697487}
.loading-contender.white{--disc:#f8f9ff;--edge:#becbd8}
.trivert-portrait{width:clamp(90px,15vw,215px);height:clamp(90px,15vw,215px);border-radius:50%;padding:7px;background:var(--disc);box-shadow:0 0 0 2px var(--edge),0 0 0 8px var(--disc),0 0 0 10px var(--edge),0 0 0 16px var(--disc),0 0 0 18px var(--edge),0 9px 20px #0008;overflow:hidden}
.trivert-portrait .player-mugshot{position:static;width:100%;height:100%;object-fit:cover;border-radius:50%;border:0;margin:0;box-shadow:none;box-sizing:border-box}
.loading-contender figcaption{font-size:clamp(20px,2.8vw,38px);line-height:1.1;text-align:center}
.loading-vs{font-size:clamp(32px,5vw,68px)}
.loading-bottom{display:flex;align-items:center;flex-direction:column;width:min(100%,1100px);gap:12px}
.loading-bottom img{width:clamp(120px,14vw,205px);max-height:16vh;object-fit:contain}
.loading-bottom strong{font-size:clamp(21px,2vw,32px);letter-spacing:.12em}
.loading-bottom progress{appearance:none;width:100%;height:17px;border:2px solid #cceaff;border-radius:20px;overflow:hidden;background:#071a34}
.loading-bottom progress::-webkit-progress-bar{background:#071a34}
.loading-bottom progress::-webkit-progress-value{background:linear-gradient(90deg,#368bdf,#a5edff)}
@media(max-height:600px){.trivert-portrait{width:100px;height:100px}.loading-contender{gap:20px}.loading-bottom{gap:5px}.loading-bottom img{max-height:12vh}}
.loading-matchup:has(figure:nth-of-type(4)){gap:40px}.loading-matchup:has(figure:nth-of-type(4)) .trivert-portrait{width:clamp(70px,10vw,145px);height:clamp(70px,10vw,145px)}
@media(max-width:800px){.loading-matchup:has(figure:nth-of-type(4)){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 38px;align-items:center;justify-items:center}.loading-matchup:has(figure:nth-of-type(4)) .trivert-portrait{width:60px;height:60px}.loading-matchup:has(figure:nth-of-type(4)) figcaption{font-size:18px}.loading-matchup:has(figure:nth-of-type(4)) .loading-contender{gap:22px}}

.loading-bottom img{filter:drop-shadow(0 0 2px #fffffff0) drop-shadow(0 0 11px #e9f2ffc4)}